➕ WorkplaceShareButton

Author: Bunlong

README.md

@@ -24,6 +24,7 @@ Social media share buttons for your next React apps.
   * Linkedin
   * VKShare
   * Livejournal
+  * Workplace
 
 ## 🔧 Install
 
@@ -252,6 +253,22 @@ import {
 </LivejournalShareButton>
 ```
 
+### 🎀 Workplace
+
+```js
+import {
+  WorkplaceShareButton,
+  WorkplaceIcon,
+} from 'next-share'
+
+<WorkplaceShareButton
+  url={'https://github.com/next-share'}
+  quote={'Next Share'}
+>
+  <WorkplaceIcon size={32} round />
+</WorkplaceShareButton>
+```
+
 ## 📚 Icons Documentation
 
 ### 📖 Icons Props
@@ -1033,6 +1050,60 @@ import {
   </tr>
 </table>
 
+### 📖 LivejournalShareButton Props
+
+<table>
+  <tr>
+    <th>Props</th>
+    <th>Type</th>
+    <th>Default</th>
+    <th>Description</th>
+    <th>Required</th>
+  </tr>
+  <tr>
+    <td>children</td>
+    <td>React node</td>
+    <td></td>
+    <td>React component, HTML element or string.</td>
+    <td>✅</td>
+  </tr>
+  <tr>
+    <td>url</td>
+    <td>string</td>
+    <td></td>
+    <td>The URL of the shared page.</td>
+    <td>✅</td>
+  </tr>
+  <tr>
+    <td>quote</td>
+    <td>string</td>
+    <td></td>
+    <td>A quote to be shared along with the link.</td>
+    <td>❌</td>
+  </tr>
+  <tr>
+    <td>hashtag</td>
+    <td>string</td>
+    <td></td>
+    <td> A hashtag specified by the developer to be added to the shared content. People will still have the opportunity to remove this hashtag in the dialog. The hashtag should include the hash symbol.</td>
+    <td>❌</td>
+  </tr>
+  <tr>
+    <td>windowWidth</td>
+    <td>number</td>
+    <td>550</td>
+    <td>Opened window width.</td>
+    <td>❌</td>
+  </tr>
+  <tr>
+    <td>windowHeight</td>
+    <td>number</td>
+    <td>400</td>
+    <td>Opened window height.</td>
+    <td>❌</td>
+  </tr>
+</table>
+
 ## 💖 Wrap Up
 
 If you think any of the `next-share` can be improved, please do open a PR with any updates and submit any issues. Also, I will continue to improve this, so you might want to watch/star this repository to revisit.

examples/javascript/src/App.js

@@ -28,6 +28,8 @@ import {
   MailruIcon,
   LivejournalShareButton,
   LivejournalIcon,
+  WorkplaceShareButton,
+  WorkplaceIcon
 } from 'next-share'
 
 function App() {
@@ -153,6 +155,12 @@ function App() {
           <LivejournalIcon size={32} round />
         </div>
       </LivejournalShareButton>
+      <WorkplaceShareButton
+        url={'https://github.com/next-share'}
+        quote={'Next Share'}
+      >
+        <WorkplaceIcon size={32} round />
+      </WorkplaceShareButton>
     </div>
   )
 };

src/components/buttons/WorkplaceShareButton.ts

@@ -0,0 +1,34 @@
+import transformObjectToParams from '../../utils';
+import createShareButton from '../../hocs/createShareButton';
+
+function workplaceLink(
+  url: string,
+  { quote, hashtag }: { quote?: string; hashtag?: string },
+) {
+  return (
+    'https://work.facebook.com/sharer.php' +
+    transformObjectToParams({
+      u: url,
+      quote,
+      hashtag,
+    })
+  );
+}
+
+const WorkplaceShareButton = createShareButton<{
+  quote?: string;
+  hashtag?: string;
+}>(
+  'workplace',
+  workplaceLink,
+  (props) => ({
+    quote: props.quote,
+    hashtag: props.hashtag,
+  }),
+  {
+    windowWidth: 550,
+    windowHeight: 400,
+  },
+);
+
+export default WorkplaceShareButton;

src/next-share.ts

@@ -30,3 +30,4 @@ export { default as LinkedinShareButton } from './components/buttons/LinkedinSha
 export { default as VKShareButton } from './components/buttons/VKShareButton';
 export { default as MailruShareButton } from './components/buttons/MailruShareButton';
 export { default as LivejournalShareButton } from './components/buttons/LivejournalShareButton';
+export { default as WorkplaceShareButton } from './components/buttons/WorkplaceShareButton';