diff --git a/app/components/CopyToClipboard/CopyToClipboard.js b/app/components/CopyToClipboard/CopyToClipboard.js index a1deca607..cf762a048 100644 --- a/app/components/CopyToClipboard/CopyToClipboard.js +++ b/app/components/CopyToClipboard/CopyToClipboard.js @@ -5,8 +5,8 @@ import copy from 'copy-to-clipboard'; type Props = { text: string, children?: React.Node, - onClick?: () => void, - onCopy: () => void, + onClick?: () => *, + onCopy: () => *, }; class CopyToClipboard extends React.PureComponent { diff --git a/app/components/Modals/Modals.js b/app/components/Modals/Modals.js index 81506c74d..d9a2c23c2 100644 --- a/app/components/Modals/Modals.js +++ b/app/components/Modals/Modals.js @@ -7,6 +7,7 @@ import CollectionNew from 'scenes/CollectionNew'; import CollectionEdit from 'scenes/CollectionEdit'; import CollectionDelete from 'scenes/CollectionDelete'; import DocumentDelete from 'scenes/DocumentDelete'; +import DocumentShare from 'scenes/DocumentShare'; import KeyboardShortcuts from 'scenes/KeyboardShortcuts'; type Props = { @@ -44,6 +45,9 @@ class Modals extends React.Component { + + + diff --git a/app/components/Sidebar/Main.js b/app/components/Sidebar/Main.js index 8c6db43da..16fe19602 100644 --- a/app/components/Sidebar/Main.js +++ b/app/components/Sidebar/Main.js @@ -31,10 +31,6 @@ class MainSidebar extends React.Component { this.props.ui.setActiveModal('collection-new'); }; - handleEditCollection = () => { - this.props.ui.setActiveModal('collection-edit'); - }; - render() { const { auth, documents } = this.props; const { user, team } = auth; diff --git a/app/menus/DocumentMenu.js b/app/menus/DocumentMenu.js index 6e06365d1..88c13fcbb 100644 --- a/app/menus/DocumentMenu.js +++ b/app/menus/DocumentMenu.js @@ -56,6 +56,13 @@ class DocumentMenu extends React.Component { this.props.document.download(); }; + handleShareLink = async (ev: SyntheticEvent<*>) => { + const { document } = this.props; + if (!document.shareUrl) await document.share(); + + this.props.ui.setActiveModal('document-share', { document }); + }; + render() { const { document, label, className, showPrint } = this.props; const isDraft = !document.publishedAt; @@ -80,6 +87,12 @@ class DocumentMenu extends React.Component { Star )} + + Share link +
{ + try { + const res = await client.post('/shares.create', { id: this.id }); + invariant(res && res.data, 'Document API response should be available'); + + this.shareUrl = res.data.url; + } catch (e) { + this.errors.add('Document failed to share'); + } + }; + @action pin = async () => { this.pinned = true; diff --git a/app/scenes/DocumentShare/DocumentShare.js b/app/scenes/DocumentShare/DocumentShare.js new file mode 100644 index 000000000..a0ecaf3fb --- /dev/null +++ b/app/scenes/DocumentShare/DocumentShare.js @@ -0,0 +1,58 @@ +// @flow +import * as React from 'react'; +import { observable } from 'mobx'; +import { observer } from 'mobx-react'; +import Input from 'components/Input'; +import Button from 'components/Button'; +import CopyToClipboard from 'components/CopyToClipboard'; +import HelpText from 'components/HelpText'; +import Document from 'models/Document'; + +type Props = { + document: Document, +}; + +@observer +class DocumentShare extends React.Component { + @observable isCopied: boolean; + timeout: TimeoutID; + + componentWillUnmount() { + clearTimeout(this.timeout); + } + + handleCopied = () => { + this.isCopied = true; + this.timeout = setTimeout(() => (this.isCopied = false), 3000); + }; + + render() { + const { document } = this.props; + + return ( +
+ + The link below allows anyone to access a read-only version of the + document {document.title}. You can revoke this link + at any point in the future. + + + + + +
+ ); + } +} + +export default DocumentShare; diff --git a/app/scenes/DocumentShare/index.js b/app/scenes/DocumentShare/index.js new file mode 100644 index 000000000..c480add32 --- /dev/null +++ b/app/scenes/DocumentShare/index.js @@ -0,0 +1,3 @@ +// @flow +import DocumentShare from './DocumentShare'; +export default DocumentShare; diff --git a/server/presenters/share.js b/server/presenters/share.js index c6d87d935..30977cde1 100644 --- a/server/presenters/share.js +++ b/server/presenters/share.js @@ -7,6 +7,7 @@ function present(ctx: Object, share: Share) { id: share.id, user: presentUser(ctx, share.user), documentTitle: share.document.title, + url: `${process.env.URL}/share/${share.id}`, createdAt: share.createdAt, updatedAt: share.updatedAt, };