feat: Add 'share' option for documents on mobile

app/actions/definitions/documents.tsx

@@ -23,11 +23,13 @@ import {
   UnpublishIcon,
   PublishIcon,
   CommentIcon,
+  GlobeIcon,
 } from "outline-icons";
 import * as React from "react";
 import { toast } from "sonner";
 import { ExportContentType, TeamPreference } from "@shared/types";
 import { getEventFiles } from "@shared/utils/files";
+import SharePopover from "~/scenes/Document/components/SharePopover";
 import DocumentDelete from "~/scenes/DocumentDelete";
 import DocumentMove from "~/scenes/DocumentMove";
 import DocumentPermanentDelete from "~/scenes/DocumentPermanentDelete";
@@ -320,6 +322,40 @@ export const unsubscribeDocument = createAction({
   },
 });
 
+export const shareDocument = createAction({
+  name: ({ t }) => t("Share"),
+  analyticsName: "Share document",
+  section: DocumentSection,
+  icon: <GlobeIcon />,
+  perform: async ({ activeDocumentId, stores, currentUserId, t }) => {
+    if (!activeDocumentId || !currentUserId) {
+      return;
+    }
+
+    const document = stores.documents.get(activeDocumentId);
+    const share = stores.shares.getByDocumentId(activeDocumentId);
+    const sharedParent = stores.shares.getByDocumentParents(activeDocumentId);
+    if (!document) {
+      return;
+    }
+
+    stores.dialogs.openModal({
+      title: t("Share this document"),
+      isCentered: true,
+      content: (
+        <SharePopover
+          document={document}
+          share={share}
+          sharedParent={sharedParent}
+          onRequestClose={stores.dialogs.closeAllModals}
+          hideTitle
+          visible
+        />
+      ),
+    });
+  },
+});
+
 export const downloadDocumentAsHTML = createAction({
   name: ({ t }) => t("HTML"),
   analyticsName: "Download document as HTML",

app/menus/DocumentMenu.tsx

@@ -42,6 +42,7 @@ import {
   openDocumentComments,
   createDocumentFromTemplate,
   createNestedDocument,
+  shareDocument,
 } from "~/actions/definitions/documents";
 import useActionContext from "~/hooks/useActionContext";
 import useCurrentUser from "~/hooks/useCurrentUser";
@@ -256,6 +257,7 @@ function DocumentMenu({
             actionToMenuItem(unstarDocument, context),
             actionToMenuItem(subscribeDocument, context),
             actionToMenuItem(unsubscribeDocument, context),
+            ...(isMobile ? [actionToMenuItem(shareDocument, context)] : []),
             {
               type: "separator",
             },

app/scenes/Document/components/SharePopover.tsx

@@ -27,10 +27,17 @@ import useStores from "~/hooks/useStores";
 import useUserLocale from "~/hooks/useUserLocale";
 
 type Props = {
+  /** The document to share. */
   document: Document;
+  /** The existing share model, if any. */
   share: Share | null | undefined;
+  /** The existing share parent model, if any. */
   sharedParent: Share | null | undefined;
+  /** Whether to hide the title. */
+  hideTitle?: boolean;
+  /** Callback fired when the popover requests to be closed. */
   onRequestClose: () => void;
+  /** Whether the popover is visible. */
   visible: boolean;
 };
 
@@ -38,6 +45,7 @@ function SharePopover({
   document,
   share,
   sharedParent,
+  hideTitle,
   onRequestClose,
   visible,
 }: Props) {
@@ -213,10 +221,16 @@ function SharePopover({
 
   return (
     <>
-      <Heading>
+      {!hideTitle && (
-        {isPubliclyShared ? <GlobeIcon size={28} /> : <PadlockIcon size={28} />}
+        <Heading>
-        <span>{t("Share this document")}</span>
+          {isPubliclyShared ? (
-      </Heading>
+            <GlobeIcon size={28} />
+          ) : (
+            <PadlockIcon size={28} />
+          )}
+          <span>{t("Share this document")}</span>
+        </Heading>
+      )}
 
       {sharedParent && !document.isDraft && (
         <NoticeWrapper>

shared/i18n/locales/en_US/translation.json

@@ -29,6 +29,8 @@
   "Subscribed to document notifications": "Subscribed to document notifications",
   "Unsubscribe": "Unsubscribe",
   "Unsubscribed from document notifications": "Unsubscribed from document notifications",
+  "Share": "Share",
+  "Share this document": "Share this document",
   "HTML": "HTML",
   "PDF": "PDF",
   "Exporting": "Exporting",
@@ -555,14 +557,12 @@
   "Observing {{ userName }}": "Observing {{ userName }}",
   "Backlinks": "Backlinks",
   "Anyone with the link <1></1>can view this document": "Anyone with the link <1></1>can view this document",
-  "Share": "Share",
   "Only lowercase letters, digits and dashes allowed": "Only lowercase letters, digits and dashes allowed",
   "Sorry, this link has already been used": "Sorry, this link has already been used",
   "Only members with permission can view": "Only members with permission can view",
   "Publish to internet": "Publish to internet",
   "Anyone with the link can view this document": "Anyone with the link can view this document",
   "The shared link was last accessed {{ timeAgo }}.": "The shared link was last accessed {{ timeAgo }}.",
-  "Share this document": "Share this document",
   "This document is shared because the parent <2>{documentTitle}</2> is publicly shared.": "This document is shared because the parent <2>{documentTitle}</2> is publicly shared.",
   "Share nested documents": "Share nested documents",
   "Nested documents are publicly available": "Nested documents are publicly available",