fix: Do not copy edit path from headers

chore: Rename url -> path in routeHelpers closes #5229
2023-04-22 10:00:09 -04:00
parent 4b5680a16e
commit e2c5fda610
19 changed files with 91 additions and 80 deletions
--- a/app/actions/definitions/documents.tsx
+++ b/app/actions/definitions/documents.tsx
@@ -37,8 +37,8 @@ import { DocumentSection } from "~/actions/sections";
 import env from "~/env";
 import history from "~/utils/history";
 import {
-  documentInsightsUrl,
-  documentHistoryUrl,
+  documentInsightsPath,
+  documentHistoryPath,
  homePath,
  newDocumentPath,
  searchPath,
@@ -749,7 +749,7 @@ export const openDocumentHistory = createAction({
    if (!document) {
      return;
    }
-    history.push(documentHistoryUrl(document));
+    history.push(documentHistoryPath(document));
  },
 });

@@ -770,7 +770,7 @@ export const openDocumentInsights = createAction({
    if (!document) {
      return;
    }
-    history.push(documentInsightsUrl(document));
+    history.push(documentInsightsPath(document));
  },
 });

--- a/app/actions/definitions/revisions.tsx
+++ b/app/actions/definitions/revisions.tsx
@@ -6,7 +6,10 @@ import stores from "~/stores";
 import { createAction } from "~/actions";
 import { RevisionSection } from "~/actions/sections";
 import history from "~/utils/history";
-import { documentHistoryUrl, matchDocumentHistory } from "~/utils/routeHelpers";
+import {
+  documentHistoryPath,
+  matchDocumentHistory,
+} from "~/utils/routeHelpers";

 export const restoreRevision = createAction({
  name: ({ t }) => t("Restore revision"),
@@ -57,7 +60,7 @@ export const copyLinkToRevision = createAction({
      return;
    }

-    const url = `${window.location.origin}${documentHistoryUrl(
+    const url = `${window.location.origin}${documentHistoryPath(
      document,
      revisionId
    )}`;
--- a/app/components/DocumentBreadcrumb.tsx
+++ b/app/components/DocumentBreadcrumb.tsx
@@ -9,7 +9,12 @@ import Breadcrumb from "~/components/Breadcrumb";
 import CollectionIcon from "~/components/Icons/CollectionIcon";
 import useStores from "~/hooks/useStores";
 import { MenuInternalLink } from "~/types";
-import { collectionUrl } from "~/utils/routeHelpers";
+import {
+  archivePath,
+  collectionPath,
+  templatesPath,
+  trashPath,
+} from "~/utils/routeHelpers";

 type Props = {
  document: Document;
@@ -24,7 +29,7 @@ function useCategory(document: Document): MenuInternalLink | null {
      type: "route",
      icon: <TrashIcon />,
      title: t("Trash"),
-      to: "/trash",
+      to: trashPath(),
    };
  }

@@ -33,7 +38,7 @@ function useCategory(document: Document): MenuInternalLink | null {
      type: "route",
      icon: <ArchiveIcon />,
      title: t("Archive"),
-      to: "/archive",
+      to: archivePath(),
    };
  }

@@ -42,7 +47,7 @@ function useCategory(document: Document): MenuInternalLink | null {
      type: "route",
      icon: <ShapesIcon />,
      title: t("Templates"),
-      to: "/templates",
+      to: templatesPath(),
    };
  }

@@ -66,14 +71,14 @@ const DocumentBreadcrumb: React.FC<Props> = ({
      type: "route",
      title: collection.name,
      icon: <CollectionIcon collection={collection} expanded />,
-      to: collectionUrl(collection.url),
+      to: collectionPath(collection.url),
    };
  } else if (document.collectionId && !collection) {
    collectionNode = {
      type: "route",
      title: t("Deleted Collection"),
      icon: undefined,
-      to: collectionUrl("deleted-collection"),
+      to: collectionPath("deleted-collection"),
    };
  }

--- a/app/components/DocumentTemplatizeDialog.tsx
+++ b/app/components/DocumentTemplatizeDialog.tsx
@@ -6,7 +6,7 @@ import { useHistory } from "react-router-dom";
 import ConfirmationDialog from "~/components/ConfirmationDialog";
 import useStores from "~/hooks/useStores";
 import useToasts from "~/hooks/useToasts";
-import { documentUrl } from "~/utils/routeHelpers";
+import { documentPath } from "~/utils/routeHelpers";

 type Props = {
  documentId: string;
@@ -23,7 +23,7 @@ function DocumentTemplatizeDialog({ documentId }: Props) {
  const handleSubmit = React.useCallback(async () => {
    const template = await document?.templatize();
    if (template) {
-      history.push(documentUrl(template));
+      history.push(documentPath(template));
      showToast(t("Template created, go ahead and customize it"), {
        type: "info",
      });
--- a/app/components/EventListItem.tsx
+++ b/app/components/EventListItem.tsx
@@ -26,7 +26,7 @@ import Time from "~/components/Time";
 import useStores from "~/hooks/useStores";
 import RevisionMenu from "~/menus/RevisionMenu";
 import Logger from "~/utils/Logger";
-import { documentHistoryUrl } from "~/utils/routeHelpers";
+import { documentHistoryPath } from "~/utils/routeHelpers";

 type Props = {
  document: Document;
@@ -62,7 +62,7 @@ const EventListItem = ({ event, latest, document, ...rest }: Props) => {
      icon = <EditIcon size={16} />;
      meta = t("{{userName}} edited", opts);
      to = {
-        pathname: documentHistoryUrl(document, event.modelId || ""),
+        pathname: documentHistoryPath(document, event.modelId || ""),
        state: { retainScrollPosition: true },
      };
      break;
@@ -71,7 +71,7 @@ const EventListItem = ({ event, latest, document, ...rest }: Props) => {
      icon = <LightningIcon size={16} />;
      meta = t("Latest");
      to = {
-        pathname: documentHistoryUrl(document),
+        pathname: documentHistoryPath(document),
        state: { retainScrollPosition: true },
      };
      break;
--- a/app/menus/DocumentMenu.tsx
+++ b/app/menus/DocumentMenu.tsx
@@ -47,7 +47,7 @@ import useRequest from "~/hooks/useRequest";
 import useStores from "~/hooks/useStores";
 import useToasts from "~/hooks/useToasts";
 import { MenuItem } from "~/types";
-import { editDocumentUrl, newDocumentPath } from "~/utils/routeHelpers";
+import { documentEditPath, newDocumentPath } from "~/utils/routeHelpers";

 type Props = {
  document: Document;
@@ -260,7 +260,7 @@ function DocumentMenu({
            {
              type: "route",
              title: t("Edit"),
-              to: editDocumentUrl(document),
+              to: documentEditPath(document),
              visible: !!can.update && !team.seamlessEditing,
              icon: <EditIcon />,
            },
--- a/app/scenes/Collection.tsx
+++ b/app/scenes/Collection.tsx
@@ -34,7 +34,7 @@ import useCommandBarActions from "~/hooks/useCommandBarActions";
 import useLastVisitedPath from "~/hooks/useLastVisitedPath";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
-import { collectionUrl, updateCollectionUrl } from "~/utils/routeHelpers";
+import { collectionPath, updateCollectionPath } from "~/utils/routeHelpers";
 import Actions from "./Collection/Actions";
 import DropToImport from "./Collection/DropToImport";
 import Empty from "./Collection/Empty";
@@ -63,7 +63,7 @@ function CollectionScene() {

  React.useEffect(() => {
    if (collection?.name) {
-      const canonicalUrl = updateCollectionUrl(match.url, collection);
+      const canonicalUrl = updateCollectionPath(match.url, collection);

      if (match.url !== canonicalUrl) {
        history.replace(canonicalUrl, history.location.state);
@@ -179,24 +179,24 @@ function CollectionScene() {
              />

              <Tabs>
-                <Tab to={collectionUrl(collection.url)} exact>
+                <Tab to={collectionPath(collection.url)} exact>
                  {t("Documents")}
                </Tab>
-                <Tab to={collectionUrl(collection.url, "updated")} exact>
+                <Tab to={collectionPath(collection.url, "updated")} exact>
                  {t("Recently updated")}
                </Tab>
-                <Tab to={collectionUrl(collection.url, "published")} exact>
+                <Tab to={collectionPath(collection.url, "published")} exact>
                  {t("Recently published")}
                </Tab>
-                <Tab to={collectionUrl(collection.url, "old")} exact>
+                <Tab to={collectionPath(collection.url, "old")} exact>
                  {t("Least recently updated")}
                </Tab>
-                <Tab to={collectionUrl(collection.url, "alphabetical")} exact>
+                <Tab to={collectionPath(collection.url, "alphabetical")} exact>
                  {t("A–Z")}
                </Tab>
              </Tabs>
              <Switch>
-                <Route path={collectionUrl(collection.url, "alphabetical")}>
+                <Route path={collectionPath(collection.url, "alphabetical")}>
                  <PaginatedDocumentList
                    key="alphabetical"
                    documents={documents.alphabeticalInCollection(
@@ -208,7 +208,7 @@ function CollectionScene() {
                    }}
                  />
                </Route>
-                <Route path={collectionUrl(collection.url, "old")}>
+                <Route path={collectionPath(collection.url, "old")}>
                  <PaginatedDocumentList
                    key="old"
                    documents={documents.leastRecentlyUpdatedInCollection(
@@ -220,10 +220,10 @@ function CollectionScene() {
                    }}
                  />
                </Route>
-                <Route path={collectionUrl(collection.url, "recent")}>
-                  <Redirect to={collectionUrl(collection.url, "published")} />
+                <Route path={collectionPath(collection.url, "recent")}>
+                  <Redirect to={collectionPath(collection.url, "published")} />
                </Route>
-                <Route path={collectionUrl(collection.url, "published")}>
+                <Route path={collectionPath(collection.url, "published")}>
                  <PaginatedDocumentList
                    key="published"
                    documents={documents.recentlyPublishedInCollection(
@@ -236,7 +236,7 @@ function CollectionScene() {
                    showPublished
                  />
                </Route>
-                <Route path={collectionUrl(collection.url, "updated")}>
+                <Route path={collectionPath(collection.url, "updated")}>
                  <PaginatedDocumentList
                    key="updated"
                    documents={documents.recentlyUpdatedInCollection(
@@ -248,7 +248,7 @@ function CollectionScene() {
                    }}
                  />
                </Route>
-                <Route path={collectionUrl(collection.url)} exact>
+                <Route path={collectionPath(collection.url)} exact>
                  <PaginatedDocumentList
                    documents={documents.rootInCollection(collection.id)}
                    fetch={documents.fetchPage}
--- a/app/scenes/Document/components/Document.tsx
+++ b/app/scenes/Document/components/Document.tsx
@@ -39,9 +39,9 @@ import { emojiToUrl } from "~/utils/emoji";
 import { isModKey } from "~/utils/keyboard";

 import {
-  documentHistoryUrl,
-  editDocumentUrl,
-  updateDocumentUrl,
+  documentHistoryPath,
+  documentEditPath,
+  updateDocumentPath,
 } from "~/utils/routeHelpers";
 import Container from "./Container";
 import Contents from "./Contents";
@@ -211,7 +211,7 @@ class DocumentScene extends React.Component<Props> {
    const { document, abilities } = this.props;

    if (abilities.update) {
-      this.props.history.push(editDocumentUrl(document));
+      this.props.history.push(documentEditPath(document));
    }
  };

@@ -228,7 +228,7 @@ class DocumentScene extends React.Component<Props> {
    if (location.pathname.endsWith("history")) {
      this.props.history.push(document.url);
    } else {
-      this.props.history.push(documentHistoryUrl(document));
+      this.props.history.push(documentHistoryPath(document));
    }
  };

@@ -307,7 +307,7 @@ class DocumentScene extends React.Component<Props> {
        this.props.history.push(savedDocument.url);
        this.props.ui.setActiveDocument(savedDocument);
      } else if (document.isNew) {
-        this.props.history.push(editDocumentUrl(savedDocument));
+        this.props.history.push(documentEditPath(savedDocument));
        this.props.ui.setActiveDocument(savedDocument);
      }
    } catch (err) {
@@ -399,7 +399,7 @@ class DocumentScene extends React.Component<Props> {

    const canonicalUrl = shareId
      ? this.props.match.url
-      : updateDocumentUrl(this.props.match.url, document);
+      : updateDocumentPath(this.props.match.url, document);

    return (
      <ErrorBoundary showTitle>
--- a/app/scenes/Document/components/DocumentMeta.tsx
+++ b/app/scenes/Document/components/DocumentMeta.tsx
@@ -10,7 +10,7 @@ import Document from "~/models/Document";
 import DocumentMeta from "~/components/DocumentMeta";
 import Fade from "~/components/Fade";
 import useStores from "~/hooks/useStores";
-import { documentUrl, documentInsightsUrl } from "~/utils/routeHelpers";
+import { documentPath, documentInsightsPath } from "~/utils/routeHelpers";

 type Props = {
  /* The document to display meta data for */
@@ -32,7 +32,7 @@ function TitleDocumentMeta({ to, isDraft, document, ...rest }: Props) {

  const Wrapper = viewsLoadedOnMount.current ? React.Fragment : Fade;

-  const insightsUrl = documentInsightsUrl(document);
+  const insightsPath = documentInsightsPath(document);
  const commentsCount = comments.inDocument(document.id).length;

  return (
@@ -41,7 +41,9 @@ function TitleDocumentMeta({ to, isDraft, document, ...rest }: Props) {
        <Wrapper>
          &nbsp;•&nbsp;
          <Link
-            to={match.url === insightsUrl ? documentUrl(document) : insightsUrl}
+            to={
+              match.url === insightsPath ? documentPath(document) : insightsPath
+            }
          >
            {t("Viewed by")}{" "}
            {onlyYou
@@ -56,7 +58,7 @@ function TitleDocumentMeta({ to, isDraft, document, ...rest }: Props) {
        <>
          &nbsp;•&nbsp;
          <CommentLink
-            to={documentUrl(document)}
+            to={documentPath(document)}
            onClick={() => ui.toggleComments(document.id)}
          >
            <CommentIcon size={18} />
--- a/app/scenes/Document/components/Editor.tsx
+++ b/app/scenes/Document/components/Editor.tsx
@@ -15,8 +15,8 @@ import useMobile from "~/hooks/useMobile";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
 import {
-  documentHistoryUrl,
-  documentUrl,
+  documentHistoryPath,
+  documentPath,
  matchDocumentHistory,
 } from "~/utils/routeHelpers";
 import { useDocumentContext } from "../../../components/DocumentContext";
@@ -167,8 +167,8 @@ function DocumentEditor(props: Props, ref: React.RefObject<any>) {
          document={document}
          to={
            match.path === matchDocumentHistory
-              ? documentUrl(document)
-              : documentHistoryUrl(document)
+              ? documentPath(document)
+              : documentHistoryPath(document)
          }
          rtl={
            titleRef.current?.getComputedDirection() === "rtl" ? true : false
--- a/app/scenes/Document/components/Header.tsx
+++ b/app/scenes/Document/components/Header.tsx
@@ -32,7 +32,7 @@ import NewChildDocumentMenu from "~/menus/NewChildDocumentMenu";
 import TableOfContentsMenu from "~/menus/TableOfContentsMenu";
 import TemplatesMenu from "~/menus/TemplatesMenu";
 import { metaDisplay } from "~/utils/keyboard";
-import { newDocumentPath, editDocumentUrl } from "~/utils/routeHelpers";
+import { newDocumentPath, documentEditPath } from "~/utils/routeHelpers";
 import ObservingBanner from "./ObservingBanner";
 import PublicBreadcrumb from "./PublicBreadcrumb";
 import ShareButton from "./ShareButton";
@@ -133,7 +133,7 @@ function DocumentHeader({
        <Button
          as={Link}
          icon={<EditIcon />}
-          to={editDocumentUrl(document)}
+          to={documentEditPath(document)}
          neutral
        >
          {t("Edit")}
--- a/app/scenes/Document/components/History.tsx
+++ b/app/scenes/Document/components/History.tsx
@@ -8,7 +8,7 @@ import Empty from "~/components/Empty";
 import PaginatedEventList from "~/components/PaginatedEventList";
 import useKeyDown from "~/hooks/useKeyDown";
 import useStores from "~/hooks/useStores";
-import { documentUrl } from "~/utils/routeHelpers";
+import { documentPath } from "~/utils/routeHelpers";
 import Sidebar from "./SidebarLayout";

 const EMPTY_ARRAY: Event[] = [];
@@ -26,7 +26,7 @@ function History() {

  const onCloseHistory = () => {
    if (document) {
-      history.push(documentUrl(document));
+      history.push(documentPath(document));
    } else {
      history.goBack();
    }
--- a/app/scenes/Document/components/Insights.tsx
+++ b/app/scenes/Document/components/Insights.tsx
@@ -17,7 +17,7 @@ import Time from "~/components/Time";
 import useKeyDown from "~/hooks/useKeyDown";
 import useStores from "~/hooks/useStores";
 import useTextSelection from "~/hooks/useTextSelection";
-import { documentUrl } from "~/utils/routeHelpers";
+import { documentPath } from "~/utils/routeHelpers";
 import Sidebar from "./SidebarLayout";

 function Insights() {
@@ -34,7 +34,7 @@ function Insights() {

  const onCloseInsights = () => {
    if (document) {
-      history.push(documentUrl(document));
+      history.push(documentPath(document));
    }
  };

--- a/app/scenes/Document/components/RevisionViewer.tsx
+++ b/app/scenes/Document/components/RevisionViewer.tsx
@@ -5,7 +5,7 @@ import Document from "~/models/Document";
 import Revision from "~/models/Revision";
 import { Props as EditorProps } from "~/components/Editor";
 import Flex from "~/components/Flex";
-import { documentUrl } from "~/utils/routeHelpers";
+import { documentPath } from "~/utils/routeHelpers";
 import { Meta as DocumentMeta } from "./DocumentMeta";

 type Props = Omit<EditorProps, "extensions"> & {
@@ -28,7 +28,7 @@ function RevisionViewer(props: Props) {
      {!shareId && (
        <DocumentMeta
          document={document}
-          to={documentUrl(document)}
+          to={documentPath(document)}
          rtl={revision.rtl}
        />
      )}
--- a/app/scenes/DocumentDelete.tsx
+++ b/app/scenes/DocumentDelete.tsx
@@ -8,7 +8,7 @@ import Flex from "~/components/Flex";
 import Text from "~/components/Text";
 import useStores from "~/hooks/useStores";
 import useToasts from "~/hooks/useToasts";
-import { collectionUrl, documentUrl } from "~/utils/routeHelpers";
+import { collectionPath, documentPath } from "~/utils/routeHelpers";

 type Props = {
  document: Document;
@@ -43,14 +43,14 @@ function DocumentDelete({ document, onSubmit }: Props) {
            const parent = documents.get(document.parentDocumentId);

            if (parent) {
-              history.push(documentUrl(parent));
+              history.push(documentPath(parent));
              onSubmit();
              return;
            }
          }

          // otherwise, redirect to the collection home
-          history.push(collectionUrl(collection?.url || "/"));
+          history.push(collectionPath(collection?.url || "/"));
        }

        onSubmit();
--- a/app/scenes/DocumentNew.tsx
+++ b/app/scenes/DocumentNew.tsx
@@ -9,7 +9,7 @@ import Flex from "~/components/Flex";
 import PlaceholderDocument from "~/components/PlaceholderDocument";
 import useStores from "~/hooks/useStores";
 import useToasts from "~/hooks/useToasts";
-import { editDocumentUrl } from "~/utils/routeHelpers";
+import { documentEditPath } from "~/utils/routeHelpers";

 function DocumentNew() {
  const history = useHistory();
@@ -37,7 +37,7 @@ function DocumentNew() {
          title: "",
          text: "",
        });
-        history.replace(editDocumentUrl(document), location.state);
+        history.replace(documentEditPath(document), location.state);
      } catch (err) {
        showToast(t("Couldn’t create the document, try again?"), {
          type: "error",
--- a/app/stores/CollectionsStore.ts
+++ b/app/stores/CollectionsStore.ts
@@ -199,8 +199,10 @@ export default class CollectionsStore extends BaseStore<Collection> {
    return this.pathsToDocuments.find((path) => path.id === documentId);
  }

-  titleForDocument(documentUrl: string): string | undefined {
-    const path = this.pathsToDocuments.find((path) => path.url === documentUrl);
+  titleForDocument(documentPath: string): string | undefined {
+    const path = this.pathsToDocuments.find(
+      (path) => path.url === documentPath
+    );
    if (path) {
      return path.title;
    }
--- a/app/utils/routeHelpers.ts
+++ b/app/utils/routeHelpers.ts
@@ -44,17 +44,17 @@ export function groupSettingsPath(): string {
 }

 export function commentPath(document: Document, comment: Comment): string {
-  return `${documentUrl(document)}?commentId=${comment.id}`;
+  return `${documentPath(document)}?commentId=${comment.id}`;
 }

-export function collectionUrl(url: string, section?: string): string {
+export function collectionPath(url: string, section?: string): string {
  if (section) {
    return `${url}/${section}`;
  }
  return url;
 }

-export function updateCollectionUrl(
+export function updateCollectionPath(
  oldUrl: string,
  collection: Collection
 ): string {
@@ -65,19 +65,22 @@ export function updateCollectionUrl(
  );
 }

-export function documentUrl(doc: Document): string {
+export function documentPath(doc: Document): string {
  return doc.url;
 }

-export function editDocumentUrl(doc: Document): string {
+export function documentEditPath(doc: Document): string {
  return `${doc.url}/edit`;
 }

-export function documentInsightsUrl(doc: Document): string {
+export function documentInsightsPath(doc: Document): string {
  return `${doc.url}/insights`;
 }

-export function documentHistoryUrl(doc: Document, revisionId?: string): string {
+export function documentHistoryPath(
+  doc: Document,
+  revisionId?: string
+): string {
  let base = `${doc.url}/history`;
  if (revisionId) {
    base += `/${revisionId}`;
@@ -89,7 +92,7 @@ export function documentHistoryUrl(doc: Document, revisionId?: string): string {
 * Replace full url's document part with the new one in case
 * the document slug has been updated
 */
-export function updateDocumentUrl(oldUrl: string, document: Document): string {
+export function updateDocumentPath(oldUrl: string, document: Document): string {
  // Update url to match the current one
  return oldUrl.replace(
    new RegExp("/doc/([0-9a-zA-Z-_~]*-[a-zA-z0-9]{10,15})"),
@@ -132,10 +135,6 @@ export function sharedDocumentPath(shareId: string, docPath?: string) {
  return docPath ? `/s/${shareId}${docPath}` : `/s/${shareId}`;
 }

-export function notFoundUrl(): string {
-  return "/404";
-}
-
 export function urlify(path: string): string {
  return `${window.location.host}${path}`;
 }
--- a/shared/editor/nodes/Heading.ts
+++ b/shared/editor/nodes/Heading.ts
@@ -58,9 +58,7 @@ export default class Heading extends Node {
          anchor.innerText = "#";
          anchor.type = "button";
          anchor.className = "heading-anchor";
-          anchor.addEventListener("click", (event) =>
-            this.handleCopyLink(event)
-          );
+          anchor.addEventListener("click", this.handleCopyLink);

          fold = document.createElement("button");
          fold.innerText = "";
@@ -181,8 +179,10 @@ export default class Heading extends Node {

    // the existing url might contain a hash already, lets make sure to remove
    // that rather than appending another one.
-    const urlWithoutHash = window.location.href.split("#")[0];
-    copy(urlWithoutHash + hash);
+    const normalizedUrl = window.location.href
+      .split("#")[0]
+      .replace("/edit", "");
+    copy(normalizedUrl + hash);

    this.options.onShowToast(this.options.dictionary.linkCopied);
  };