Permanently redirect to /s/... for share links (#4067)

app/components/Editor.tsx

@@ -25,6 +25,7 @@ import { NotFoundError } from "~/utils/errors";
 import { uploadFile } from "~/utils/files";
 import history from "~/utils/history";
 import { isModKey } from "~/utils/keyboard";
+import { sharedDocumentPath } from "~/utils/routeHelpers";
 import { isHash } from "~/utils/urls";
 import DocumentBreadcrumb from "./DocumentBreadcrumb";
 
@@ -160,7 +161,7 @@ function Editor(props: Props, ref: React.RefObject<SharedEditor> | null) {
         }
 
         if (shareId) {
-          navigateTo = `/share/${shareId}${navigateTo}`;
+          navigateTo = sharedDocumentPath(shareId, navigateTo);
         }
 
         history.push(navigateTo);

app/components/SearchListItem.tsx

@@ -7,6 +7,7 @@ import breakpoint from "styled-components-breakpoint";
 import Document from "~/models/Document";
 import Highlight, { Mark } from "~/components/Highlight";
 import { hover } from "~/styles";
+import { sharedDocumentPath } from "~/utils/routeHelpers";
 
 type Props = {
   document: Document;
@@ -38,7 +39,9 @@ function DocumentListItem(
       ref={ref}
       dir={document.dir}
       to={{
-        pathname: shareId ? `/share/${shareId}${document.url}` : document.url,
+        pathname: shareId
+          ? sharedDocumentPath(shareId, document.url)
+          : document.url,
         state: {
           title: document.titleWithDefault,
         },

app/components/Sidebar/components/SharedDocumentLink.tsx

@@ -5,6 +5,7 @@ import Collection from "~/models/Collection";
 import Document from "~/models/Document";
 import useStores from "~/hooks/useStores";
 import { NavigationNode } from "~/types";
+import { sharedDocumentPath } from "~/utils/routeHelpers";
 import Disclosure from "./Disclosure";
 import SidebarLink from "./SidebarLink";
 
@@ -92,7 +93,7 @@ function DocumentLink(
     <>
       <SidebarLink
         to={{
-          pathname: `/share/${shareId}${node.url}`,
+          pathname: sharedDocumentPath(shareId, node.url),
           state: {
             title: node.title,
           },

app/routes/index.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Switch } from "react-router-dom";
+import { Switch, Redirect } from "react-router-dom";
 import DelayedMount from "~/components/DelayedMount";
 import FullscreenLoading from "~/components/FullscreenLoading";
 import Route from "~/components/ProfiledRoute";
@@ -55,10 +55,17 @@ export default function Routes() {
         <Route exact path="/create" component={Login} />
         <Route exact path="/logout" component={Logout} />
 
-        <Route exact path="/share/:shareId" component={SharedDocument} />
+        <Redirect exact from="/share/:shareId" to="/s/:shareId" />
+        <Route exact path="/s/:shareId" component={SharedDocument} />
+
+        <Redirect
+          exact
+          from={`/share/:shareId/doc/${slug}`}
+          to={`/s/:shareId/doc/${slug}`}
+        />
         <Route
           exact
-          path={`/share/:shareId/doc/${slug}`}
+          path={`/s/:shareId/doc/${slug}`}
           component={SharedDocument}
         />
 

app/scenes/Document/components/PublicBreadcrumb.tsx

@@ -1,6 +1,7 @@
 import * as React from "react";
 import Breadcrumb from "~/components/Breadcrumb";
 import { MenuInternalLink, NavigationNode } from "~/types";
+import { sharedDocumentPath } from "~/utils/routeHelpers";
 
 type Props = {
   documentId: string;
@@ -48,7 +49,11 @@ const PublicBreadcrumb: React.FC<Props> = ({
       pathToDocument(sharedTree, documentId)
         .slice(0, -1)
         .map((item) => {
-          return { ...item, type: "route", to: `/share/${shareId}${item.url}` };
+          return {
+            ...item,
+            type: "route",
+            to: sharedDocumentPath(shareId, item.url),
+          };
         }),
     [sharedTree, shareId, documentId]
   );

app/scenes/Document/components/ReferenceListItem.tsx

@@ -9,6 +9,7 @@ import EmojiIcon from "~/components/EmojiIcon";
 import Flex from "~/components/Flex";
 import { hover } from "~/styles";
 import { NavigationNode } from "~/types";
+import { sharedDocumentPath } from "~/utils/routeHelpers";
 
 type Props = {
   shareId?: string;
@@ -64,7 +65,9 @@ function ReferenceListItem({
   return (
     <DocumentLink
       to={{
-        pathname: shareId ? `/share/${shareId}${document.url}` : document.url,
+        pathname: shareId
+          ? sharedDocumentPath(shareId, document.url)
+          : document.url,
         hash: anchor ? `d-${anchor}` : undefined,
         state: {
           title: document.title,

app/utils/routeHelpers.test.ts

@@ -0,0 +1,14 @@
+import { sharedDocumentPath } from "./routeHelpers";
+
+describe("#sharedDocumentPath", () => {
+  test("should return share path for a document", () => {
+    const shareId = "1c922644-40d8-41fe-98f9-df2b67239d45";
+    const docPath = "/doc/test-DjDlkBi77t";
+    expect(sharedDocumentPath(shareId)).toBe(
+      "/s/1c922644-40d8-41fe-98f9-df2b67239d45"
+    );
+    expect(sharedDocumentPath(shareId, docPath)).toBe(
+      "/s/1c922644-40d8-41fe-98f9-df2b67239d45/doc/test-DjDlkBi77t"
+    );
+  });
+});

app/utils/routeHelpers.ts

@@ -117,6 +117,10 @@ export function searchPath(
   return `${route}${search}`;
 }
 
+export function sharedDocumentPath(shareId: string, docPath?: string) {
+  return docPath ? `/s/${shareId}${docPath}` : `/s/${shareId}`;
+}
+
 export function notFoundUrl(): string {
   return "/404";
 }