Add share option to properties and storagelist

app/lib/sharing.js

@@ -0,0 +1,58 @@
+import Settings from 'electron-settings'
+import { shell, remote } from 'electron'
+
+/**
+ * Open hashes in a browser
+ * @param {string[]} hashes
+ */
+export function openInBrowser (hashes) {
+  hashes.forEach(hash => {
+    shell.openExternal(getURLFromHash(hash))
+  })
+  return Promise.resolve(hashes)
+}
+
+/**
+ * Constructs a shareable url with the gateway from settings or the default one
+ *
+ * @param {string} hash
+ * @returns {string}
+ */
+export function getURLFromHash (hash) {
+  const gatewayURL = Settings.get('gatewayURL') || 'https://siderus.io'
+  return `${gatewayURL}/ipfs/${hash}`
+}
+
+export function shareViaFacebook (hash) {
+  return shell.openExternal(`https://www.facebook.com/sharer.php?u=${getURLFromHash(hash)}`)
+}
+
+export function shareViaTwitter (hash) {
+  return shell.openExternal(`https://twitter.com/intent/tweet?text=${getURLFromHash(hash)}`)
+}
+
+export function shareViaEmail (hash) {
+  return shell.openExternal(`mailto:?body=${getURLFromHash(hash)}`)
+}
+
+export const shareMenuTemplate = (hash) => ([{
+  label: 'Copy URL',
+  click: () => {
+    remote.clipboard.writeText(getURLFromHash(hash))
+  }
+}, {
+  label: 'via Email',
+  click: () => {
+    shareViaEmail(hash)
+  }
+}, {
+  label: 'via Facebook',
+  click: () => {
+    shareViaFacebook(hash)
+  }
+}, {
+  label: 'via Twitter',
+  click: () => {
+    shareViaTwitter(hash)
+  }
+}])

app/windows/Details/renderer.jsx

@@ -11,13 +11,13 @@ import {
   promiseIPFSReady,
   unpinObject
 } from '../../api'
-import { openInBrowser } from '../Storage/fileIntegration'
 import { remote } from 'electron'
 import queryString from 'query-string'
 import cx from 'classnames'
 import { Window, Toolbar, Actionbar, ButtonGroup } from 'react-photonkit'
 import Button from '../../components/Button'
 import { trackEvent } from '../../stats'
+import { shareMenuTemplate, openInBrowser } from '../../lib/sharing'
 
 // Load Components
 import InformationTab from './Components/InformationTab'
@@ -37,6 +37,8 @@ class DetailsWindow extends React.Component {
   componentDidMount () {
     trackEvent('DetailsWindowOpen', {})
     promiseIPFSReady().then(this.fetchData)
+
+    this.shareMenu = remote.Menu.buildFromTemplate(shareMenuTemplate(hash))
   }
 
   fetchData = () => {
@@ -78,6 +80,10 @@ class DetailsWindow extends React.Component {
     openInBrowser([hash])
   }
 
+  handleShare = () => {
+    this.shareMenu.popup({})
+  }
+
   handlePin = () => {
     this.setState({ isUpdatingPin: true })
     pinObject(hash)
@@ -137,6 +143,12 @@ class DetailsWindow extends React.Component {
               onClick={this.handleOpenInBrowser}
               pullRight
             />
+            <Button
+              text="Share"
+              glyph='share'
+              onClick={this.handleShare}
+              pullRight
+            />
           </Actionbar>
         </Toolbar>
 

app/windows/Storage/Components/StorageElement.jsx

@@ -5,9 +5,8 @@ import { Icon } from 'react-photonkit'
 
 import { saveFileToPath, publishToIPNS } from '../../../api'
 
-import {
-  proptAndRemoveObjects, openInBrowser
-} from '../fileIntegration'
+import { proptAndRemoveObjects } from '../fileIntegration'
+import { shareMenuTemplate, openInBrowser } from '../../../lib/sharing'
 
 import DetailsWindow from '../../Details/window'
 import formatElement from '../../../util/format-element'
@@ -25,6 +24,10 @@ class StorageElement extends React.Component {
           openInBrowser([this.props.element.hash])
         }
       },
+      {
+        label: 'Share',
+        submenu: shareMenuTemplate(this.props.element.hash)
+      },
       {
         type: 'separator'
       },
@@ -145,20 +148,20 @@ class StorageElement extends React.Component {
 
     return (
       <tr
-        className={ selected ? 'active' : ''}
+        className={selected ? 'active' : ''}
         onClick={(event) => { this._handleRowSelection(event, el) }}
         key={el.hash}
         onContextMenu={this._handleContextMenu.bind(this)}
       >
 
-        { this.props.storageStore
+        {this.props.storageStore
           ? <td>
             <input
               checked={selected}
               type='checkbox'
             />
           </td>
-          : <td></td> }
+          : <td></td>}
 
         <td>
           {

app/windows/Storage/fileIntegration.js

@@ -1,10 +1,9 @@
-import Settings from 'electron-settings'
 import { addFilesFromFSPath, unpinObject, getObjectStat, getObjectDag } from '../../api'
 import DetailsWindow from '../Details/window'
 import formatElement from '../../util/format-element'
+import { openInBrowser } from '../../lib/sharing'
 
 const electron = require('electron')
-const { shell } = electron
 const dialog = electron.dialog || electron.remote.dialog
 const app = electron.app || electron.remote.app
 
@@ -163,14 +162,3 @@ export function proptAndRemoveObjects (elements) {
   }
   return Promise.resolve()
 }
-
-/**
- * Open hashes in a browser
- */
-export function openInBrowser (hashes) {
-  const gatewayURL = Settings.get('gatewayURL') || 'https://siderus.io'
-  hashes.forEach(hash => {
-    shell.openExternal(`${gatewayURL}/ipfs/${hash}`)
-  })
-  return Promise.resolve(hashes)
-}