chore: Missing react key in SuggestionMenu

.eslintrc

@@ -65,7 +65,7 @@
     ],
     "padding-line-between-statements": ["error", { "blankLine": "always", "prev": "*", "next": "export" }],
     "lines-between-class-members": ["error", "always", { "exceptAfterSingleLine": true }],
-    "lodash/import-scope": ["error", "method"],
+    "lodash/import-scope": ["warn", "method"],
     "import/no-named-as-default": "off",
     "import/no-named-as-default-member": "off",
     "import/newline-after-import": 2,

.github/workflows/ci.yml

@@ -11,7 +11,7 @@ env:
   DATABASE_URL: postgres://postgres:password@localhost:5432/outline_test
   REDIS_URL: redis://127.0.0.1:6379
   URL: http://localhost:3000
-  NODE_OPTIONS: --max-old-space-size=8192
+  NODE_OPTIONS: --max-old-space-size=8000
   SECRET_KEY: F0E5AD933D7F6FD8F4DBB3E038C501C052DC0593C686D21ACB30AE205D2F634B
   UTILS_SECRET: 123456
   SLACK_VERIFICATION_TOKEN: 123456
@@ -63,7 +63,6 @@ jobs:
     runs-on: ubuntu-latest
     outputs:
       server: ${{ steps.filter.outputs.server }}
-      app: ${{ steps.filter.outputs.app }}
     steps:
       - uses: actions/checkout@v4
       - uses: dorny/paths-filter@v2
@@ -82,7 +81,7 @@ jobs:
               - 'yarn.lock'
 
   test:
-    needs: [build, changes]
+    needs: build
     if: ${{ needs.changes.outputs.app == 'true' }}
     runs-on: ubuntu-latest
     strategy:
@@ -144,7 +143,7 @@ jobs:
         yarn test --maxWorkers=2 $TESTFILES
 
   bundle-size:
-    needs: [build, types, changes]
+    needs: [build, types]
     if: ${{ needs.changes.outputs.app == 'true' }}
     runs-on: ubuntu-latest
     steps:
@@ -162,4 +161,3 @@ jobs:
       with:
         key: ${{ secrets.RELATIVE_CI_KEY }}
         token: ${{ secrets.GITHUB_TOKEN }}
-        webpackStatsFile: ./build/app/webpack-stats.json

.github/workflows/docker.yml

@@ -3,32 +3,25 @@ name: Docker
 on:
   push:
     tags:
-      - "v*"
+      - 'v*'
 
 env:
   IMAGE_NAME: outlinewiki/outline
   BASE_IMAGE_NAME: outlinewiki/outline-base
 
 jobs:
-  build-arm:
-    runs-on: ubicloud-standard-8-arm
+  build-and-push:
+    runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@v4
 
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+
       - name: Set up Docker Buildx
         uses: docker/setup-buildx-action@v3
 
-      - name: Docker base meta
-        id: base_meta
-        uses: docker/metadata-action@v5
-        with:
-          images: |
-            ${{ env.BASE_IMAGE_NAME }}
-          tags: |
-            type=semver,pattern={{version}}
-            type=semver,pattern={{major}}.{{minor}}
-
       - name: Login to Docker Hub
         uses: docker/login-action@v3
         with:
@@ -36,177 +29,24 @@ jobs:
           password: ${{ secrets.DOCKERHUB_TOKEN }}
 
       - name: Build and push base image
-        id: base_build
-        uses: docker/build-push-action@v6
+        uses: docker/build-push-action@v5
         with:
           context: .
           file: Dockerfile.base
-          labels: ${{ steps.base_meta.outputs.labels }}
-          tags: ${{ env.BASE_IMAGE_NAME }}
-          outputs: type=image,push-by-digest=true,name-canonical=true,push=true
-          platforms: linux/arm64
-          cache-from: type=gha
-          cache-to: type=gha,mode=max
-          pull: false
+          push: true
+          tags: ${{ env.BASE_IMAGE_NAME }}:latest
+          platforms: linux/amd64,linux/arm/v7,linux/arm64/v8,linux/ppc64le,linux/s390x
 
-      - name: Docker meta
-        id: meta
-        uses: docker/metadata-action@v5
-        with:
-          images: |
-            ${{ env.IMAGE_NAME }}
-          tags: |
-            type=semver,pattern={{version}}
-            type=semver,pattern={{major}}.{{minor}}
+      - name: Extract version
+        id: version
+        run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_OUTPUT
 
-      - name: Build and push
-        id: build
-        uses: docker/build-push-action@v6
+      - name: Build and push main image
+        uses: docker/build-push-action@v5
         with:
           context: .
-          file: Dockerfile
-          labels: ${{ steps.meta.outputs.labels }}
-          tags: ${{ env.IMAGE_NAME }}
-          outputs: type=image,push-by-digest=true,name-canonical=true,push=true
-          platforms: linux/arm64
-          cache-from: type=gha
-          cache-to: type=gha,mode=max
-          pull: false
-          build-args: |
-            BASE_IMAGE=${{ env.BASE_IMAGE_NAME }}@${{ steps.base_build.outputs.digest }}
-
-      - name: Export digest
-        run: |
-          mkdir -p ${{ runner.temp }}/digests
-          digest="${{ steps.build.outputs.digest }}"
-          touch "${{ runner.temp }}/digests/${digest#sha256:}"
-
-      - name: Upload digest
-        uses: actions/upload-artifact@v4
-        with:
-          name: digests-linux-arm64
-          path: ${{ runner.temp }}/digests/*
-          if-no-files-found: error
-          retention-days: 1
-
-  build-amd:
-    runs-on: ubicloud-standard-8
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Docker base meta
-        id: base_meta
-        uses: docker/metadata-action@v5
-        with:
-          images: |
-            ${{ env.BASE_IMAGE_NAME }}
+          push: true
+          platforms: linux/amd64,linux/arm/v7,linux/arm64/v8,linux/ppc64le,linux/s390x
           tags: |
-            type=semver,pattern={{version}}
-            type=semver,pattern={{major}}.{{minor}}
-
-      - name: Login to Docker Hub
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      - name: Build and push base image
-        id: base_build
-        uses: docker/build-push-action@v6
-        with:
-          context: .
-          file: Dockerfile.base
-          labels: ${{ steps.base_meta.outputs.labels }}
-          tags: ${{ env.BASE_IMAGE_NAME }}
-          outputs: type=image,push-by-digest=true,name-canonical=true,push=true
-          platforms: linux/amd64
-          cache-from: type=gha
-          cache-to: type=gha,mode=max
-          pull: false
-
-      - name: Docker meta
-        id: meta
-        uses: docker/metadata-action@v5
-        with:
-          images: |
-            ${{ env.IMAGE_NAME }}
-          tags: |
-            type=semver,pattern={{version}}
-            type=semver,pattern={{major}}.{{minor}}
-
-      - name: Build and push
-        id: build
-        uses: docker/build-push-action@v6
-        with:
-          context: .
-          file: Dockerfile
-          labels: ${{ steps.meta.outputs.labels }}
-          tags: ${{ env.IMAGE_NAME }}
-          outputs: type=image,push-by-digest=true,name-canonical=true,push=true
-          platforms: linux/amd64
-          cache-from: type=gha
-          cache-to: type=gha,mode=max
-          pull: false
-          build-args: |
-            BASE_IMAGE=${{ env.BASE_IMAGE_NAME }}@${{ steps.base_build.outputs.digest }}
-
-      - name: Export digest
-        run: |
-          mkdir -p ${{ runner.temp }}/digests
-          digest="${{ steps.build.outputs.digest }}"
-          touch "${{ runner.temp }}/digests/${digest#sha256:}"
-
-      - name: Upload digest
-        uses: actions/upload-artifact@v4
-        with:
-          name: digests-linux-amd64
-          path: ${{ runner.temp }}/digests/*
-          if-no-files-found: error
-          retention-days: 1
-
-  merge:
-    runs-on: ubicloud-standard-8
-    needs:
-      - build-amd
-      - build-arm
-    steps:
-      - name: Download digests
-        uses: actions/download-artifact@v4
-        with:
-          path: ${{ runner.temp }}/digests
-          pattern: digests-*
-          merge-multiple: true
-
-      - name: Login to Docker Hub
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Docker meta
-        id: meta
-        uses: docker/metadata-action@v5
-        with:
-          images: ${{ env.IMAGE_NAME }}
-          tags: |
-            type=ref,event=branch
-            type=ref,event=pr
-            type=semver,pattern={{version}}
-            type=semver,pattern={{major}}.{{minor}}
-
-      - name: Create manifest list and push
-        working-directory: ${{ runner.temp }}/digests
-        run: |
-          docker buildx imagetools create $(jq -cr '.tags | map("-t " + .) | join(" ")' <<< "$DOCKER_METADATA_OUTPUT_JSON") \
-            $(printf '${{ env.IMAGE_NAME }}@sha256:%s ' *)
-
-      - name: Inspect image
-        run: |
-          docker buildx imagetools inspect ${{ env.IMAGE_NAME }}:${{ steps.meta.outputs.version }}
+            ${{ env.IMAGE_NAME }}:latest
+            ${{ env.IMAGE_NAME }}:${{ steps.version.outputs.VERSION }}

Dockerfile

@@ -1,6 +1,5 @@
 ARG APP_PATH=/opt/outline
-ARG BASE_IMAGE=outlinewiki/outline-base
-FROM ${BASE_IMAGE} AS base
+FROM outlinewiki/outline-base AS base
 
 ARG APP_PATH
 WORKDIR $APP_PATH
@@ -31,7 +30,7 @@ RUN addgroup --gid 1001 nodejs && \
   adduser --uid 1001 --ingroup nodejs nodejs && \
   chown -R nodejs:nodejs $APP_PATH/build && \
   mkdir -p /var/lib/outline && \
-  chown -R nodejs:nodejs /var/lib/outline
+	chown -R nodejs:nodejs /var/lib/outline
 
 ENV FILE_STORAGE_LOCAL_ROOT_DIR=/var/lib/outline/data
 RUN mkdir -p "$FILE_STORAGE_LOCAL_ROOT_DIR" && \

Dockerfile.base

@@ -1,14 +1,11 @@
 ARG APP_PATH=/opt/outline
-FROM node:20 AS deps
+FROM node:20-slim AS deps
 
 ARG APP_PATH
 WORKDIR $APP_PATH
 COPY ./package.json ./yarn.lock ./
 COPY ./patches ./patches
 
-RUN apt-get update && apt-get install -y cmake
-ENV NODE_OPTIONS="--max-old-space-size=24000"
-
 RUN yarn install --no-optional --frozen-lockfile --network-timeout 1000000 && \
   yarn cache clean
 

LICENSE

@@ -3,7 +3,7 @@ Business Source License 1.1
 Parameters
 
 Licensor:             General Outline, Inc.
-Licensed Work:        Outline 0.83.0
+Licensed Work:        Outline 0.82.0
                       The Licensed Work is (c) 2025 General Outline, Inc.
 Additional Use Grant: You may make use of the Licensed Work, provided that
                       you may not use the Licensed Work for a Document
@@ -15,7 +15,7 @@ Additional Use Grant: You may make use of the Licensed Work, provided that
                       Licensed Work by creating teams and documents
                       controlled by such third parties.
 
-Change Date:          2029-04-11
+Change Date:          2029-02-15
 
 Change License:       Apache License, Version 2.0
 

app/actions/definitions/documents.tsx

@@ -29,7 +29,6 @@ import {
   PadlockIcon,
   GlobeIcon,
   LogoutIcon,
-  CaseSensitiveIcon,
 } from "outline-icons";
 import * as React from "react";
 import { toast } from "sonner";
@@ -511,25 +510,6 @@ export const copyDocumentAsMarkdown = createAction({
   },
 });
 
-export const copyDocumentAsPlainText = createAction({
-  name: ({ t }) => t("Copy as text"),
-  section: ActiveDocumentSection,
-  keywords: "clipboard",
-  icon: <CaseSensitiveIcon />,
-  iconInContextMenu: false,
-  visible: ({ activeDocumentId, stores }) =>
-    !!activeDocumentId && stores.policies.abilities(activeDocumentId).download,
-  perform: ({ stores, activeDocumentId, t }) => {
-    const document = activeDocumentId
-      ? stores.documents.get(activeDocumentId)
-      : undefined;
-    if (document) {
-      copy(document.toPlainText());
-      toast.success(t("Text copied to clipboard"));
-    }
-  },
-});
-
 export const copyDocumentShareLink = createAction({
   name: ({ t }) => t("Copy public link"),
   section: ActiveDocumentSection,
@@ -575,12 +555,7 @@ export const copyDocument = createAction({
   section: ActiveDocumentSection,
   icon: <CopyIcon />,
   keywords: "clipboard",
-  children: [
-    copyDocumentLink,
-    copyDocumentShareLink,
-    copyDocumentAsMarkdown,
-    copyDocumentAsPlainText,
-  ],
+  children: [copyDocumentLink, copyDocumentShareLink, copyDocumentAsMarkdown],
 });
 
 export const duplicateDocument = createAction({
@@ -1230,7 +1205,6 @@ export const rootDocumentActions = [
   copyDocumentLink,
   copyDocumentShareLink,
   copyDocumentAsMarkdown,
-  copyDocumentAsPlainText,
   starDocument,
   unstarDocument,
   publishDocument,

app/components/Authenticated.tsx

@@ -5,6 +5,7 @@ import { Redirect } from "react-router-dom";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import useStores from "~/hooks/useStores";
 import { changeLanguage } from "~/utils/language";
+import { logoutPath } from "~/utils/routeHelpers";
 import LoadingIndicator from "./LoadingIndicator";
 
 type Props = {
@@ -32,7 +33,7 @@ const Authenticated = ({ children }: Props) => {
   }
 
   void auth.logout(true);
-  return <Redirect to="/" />;
+  return <Redirect to={logoutPath()} />;
 };
 
 export default observer(Authenticated);

app/components/AuthenticatedLayout.tsx

@@ -1,13 +1,7 @@
 import { AnimatePresence } from "framer-motion";
 import { observer } from "mobx-react";
 import * as React from "react";
-import {
-  Switch,
-  Route,
-  useLocation,
-  matchPath,
-  Redirect,
-} from "react-router-dom";
+import { Switch, Route, useLocation, matchPath } from "react-router-dom";
 import { TeamPreference } from "@shared/types";
 import ErrorSuspended from "~/scenes/Errors/ErrorSuspended";
 import Layout from "~/components/Layout";
@@ -16,7 +10,6 @@ import Sidebar from "~/components/Sidebar";
 import SidebarRight from "~/components/Sidebar/Right";
 import SettingsSidebar from "~/components/Sidebar/Settings";
 import useCurrentTeam from "~/hooks/useCurrentTeam";
-import { usePostLoginPath } from "~/hooks/useLastVisitedPath";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
 import history from "~/utils/history";
@@ -55,7 +48,6 @@ const AuthenticatedLayout: React.FC = ({ children }: Props) => {
   const can = usePolicy(ui.activeDocumentId);
   const canCollection = usePolicy(ui.activeCollectionId);
   const team = useCurrentTeam();
-  const [spendPostLoginPath] = usePostLoginPath();
 
   const goToSearch = (ev: KeyboardEvent) => {
     if (!ev.metaKey && !ev.ctrlKey) {
@@ -80,11 +72,6 @@ const AuthenticatedLayout: React.FC = ({ children }: Props) => {
     return <ErrorSuspended />;
   }
 
-  const postLoginPath = spendPostLoginPath();
-  if (postLoginPath) {
-    return <Redirect to={postLoginPath} />;
-  }
-
   const sidebar = (
     <Fade>
       <Switch>

app/components/Fade.tsx

@@ -2,11 +2,6 @@ import React from "react";
 import styled from "styled-components";
 import { fadeIn } from "~/styles/animations";
 
-/**
- * Fade in animation for a component.
- *
- * @param timing - The duration of the fade in animation, default is 250ms.
- */
 const Fade = styled.span<{ timing?: number | string }>`
   animation: ${fadeIn} ${(props) => props.timing || "250ms"} ease-in-out;
 `;
@@ -22,6 +17,7 @@ type Props = {
  */
 export const ConditionalFade = ({ animate, children }: Props) => {
   const [isAnimated] = React.useState(animate);
+
   return isAnimated ? <Fade>{children}</Fade> : <>{children}</>;
 };
 

app/components/HoverPreview/HoverPreview.tsx

@@ -1,5 +1,4 @@
 import { m } from "framer-motion";
-import { observer } from "mobx-react";
 import * as React from "react";
 import { Portal } from "react-portal";
 import styled from "styled-components";
@@ -9,7 +8,6 @@ import useEventListener from "~/hooks/useEventListener";
 import useKeyDown from "~/hooks/useKeyDown";
 import useMobile from "~/hooks/useMobile";
 import useOnClickOutside from "~/hooks/useOnClickOutside";
-import useStores from "~/hooks/useStores";
 import LoadingIndicator from "../LoadingIndicator";
 import { CARD_MARGIN } from "./Components";
 import HoverPreviewDocument from "./HoverPreviewDocument";
@@ -25,9 +23,9 @@ const POINTER_WIDTH = 22;
 type Props = {
   /** The HTML element that is being hovered over, or null if none. */
   element: HTMLElement | null;
-  /** ID of the unfurl that will be shown in the hover preview. */
-  unfurlId: string | null;
-  /** Whether the preview data is being loaded. */
+  /** Data to be previewed */
+  data: Record<string, any> | null;
+  /** Whether the preview data is being loaded */
   dataLoading: boolean;
   /** A callback on close of the hover preview. */
   onClose: () => void;
@@ -38,155 +36,151 @@ enum Direction {
   DOWN,
 }
 
-const HoverPreviewDesktop = observer(
-  ({ element, unfurlId, dataLoading, onClose }: Props) => {
-    const { unfurls } = useStores();
-    const [isVisible, setVisible] = React.useState(false);
-    const timerClose = React.useRef<ReturnType<typeof setTimeout>>();
-    const cardRef = React.useRef<HTMLDivElement | null>(null);
-    const { cardLeft, cardTop, pointerLeft, pointerTop, pointerDir } =
-      useHoverPosition({
-        cardRef,
-        element,
-        isVisible,
-      });
-    const data = unfurlId ? unfurls.get(unfurlId)?.data : undefined;
+function HoverPreviewDesktop({ element, data, dataLoading, onClose }: Props) {
+  const [isVisible, setVisible] = React.useState(false);
+  const timerClose = React.useRef<ReturnType<typeof setTimeout>>();
+  const cardRef = React.useRef<HTMLDivElement | null>(null);
+  const { cardLeft, cardTop, pointerLeft, pointerTop, pointerDir } =
+    useHoverPosition({
+      cardRef,
+      element,
+      isVisible,
+    });
 
-    const closePreview = React.useCallback(() => {
-      setVisible(false);
-      onClose();
-    }, [onClose]);
+  const closePreview = React.useCallback(() => {
+    setVisible(false);
+    onClose();
+  }, [onClose]);
 
-    const stopCloseTimer = React.useCallback(() => {
-      if (timerClose.current) {
-        clearTimeout(timerClose.current);
-        timerClose.current = undefined;
+  const stopCloseTimer = React.useCallback(() => {
+    if (timerClose.current) {
+      clearTimeout(timerClose.current);
+      timerClose.current = undefined;
+    }
+  }, []);
+
+  const startCloseTimer = React.useCallback(() => {
+    timerClose.current = setTimeout(closePreview, DELAY_CLOSE);
+  }, [closePreview]);
+
+  // Open and close the preview when the element changes.
+  React.useEffect(() => {
+    if (element && data && !dataLoading) {
+      setVisible(true);
+    } else {
+      startCloseTimer();
+    }
+  }, [startCloseTimer, element, data, dataLoading]);
+
+  // Close the preview on Escape, scroll, or click outside.
+  useOnClickOutside(cardRef, closePreview);
+  useKeyDown("Escape", closePreview);
+  useEventListener("scroll", closePreview, window, { capture: true });
+
+  // Ensure that the preview stays open while the user is hovering over the card.
+  React.useEffect(() => {
+    const card = cardRef.current;
+
+    if (isVisible) {
+      if (card) {
+        card.addEventListener("mouseenter", stopCloseTimer);
+        card.addEventListener("mouseleave", startCloseTimer);
       }
-    }, []);
-
-    const startCloseTimer = React.useCallback(() => {
-      timerClose.current = setTimeout(closePreview, DELAY_CLOSE);
-    }, [closePreview]);
-
-    // Open and close the preview when the element changes.
-    React.useEffect(() => {
-      if (element && data && !dataLoading) {
-        setVisible(true);
-      } else {
-        startCloseTimer();
-      }
-    }, [startCloseTimer, element, data, dataLoading]);
-
-    // Close the preview on Escape, scroll, or click outside.
-    useOnClickOutside(cardRef, closePreview);
-    useKeyDown("Escape", closePreview);
-    useEventListener("scroll", closePreview, window, { capture: true });
-
-    // Ensure that the preview stays open while the user is hovering over the card.
-    React.useEffect(() => {
-      const card = cardRef.current;
-
-      if (isVisible) {
-        if (card) {
-          card.addEventListener("mouseenter", stopCloseTimer);
-          card.addEventListener("mouseleave", startCloseTimer);
-        }
-      }
-
-      return () => {
-        if (card) {
-          card.removeEventListener("mouseenter", stopCloseTimer);
-          card.removeEventListener("mouseleave", startCloseTimer);
-        }
-
-        stopCloseTimer();
-      };
-    }, [element, startCloseTimer, isVisible, stopCloseTimer]);
-
-    if (dataLoading) {
-      return <LoadingIndicator />;
     }
 
-    if (!data) {
-      return null;
-    }
+    return () => {
+      if (card) {
+        card.removeEventListener("mouseenter", stopCloseTimer);
+        card.removeEventListener("mouseleave", startCloseTimer);
+      }
 
-    return (
-      <Portal>
-        <Position top={cardTop} left={cardLeft} aria-hidden>
-          {isVisible ? (
-            <Animate
-              initial={{ opacity: 0, y: -20, pointerEvents: "none" }}
-              animate={{
-                opacity: 1,
-                y: 0,
-                transitionEnd: { pointerEvents: "auto" },
-              }}
-            >
-              {data.type === UnfurlResourceType.Mention ? (
-                <HoverPreviewMention
-                  ref={cardRef}
-                  name={data.name}
-                  avatarUrl={data.avatarUrl}
-                  color={data.color}
-                  lastActive={data.lastActive}
-                  email={data.email}
-                />
-              ) : data.type === UnfurlResourceType.Document ? (
-                <HoverPreviewDocument
-                  ref={cardRef}
-                  url={data.url}
-                  id={data.id}
-                  title={data.title}
-                  summary={data.summary}
-                  lastActivityByViewer={data.lastActivityByViewer}
-                />
-              ) : data.type === UnfurlResourceType.Issue ? (
-                <HoverPreviewIssue
-                  ref={cardRef}
-                  url={data.url}
-                  id={data.id}
-                  title={data.title}
-                  description={data.description}
-                  author={data.author}
-                  labels={data.labels}
-                  state={data.state}
-                  createdAt={data.createdAt}
-                />
-              ) : data.type === UnfurlResourceType.PR ? (
-                <HoverPreviewPullRequest
-                  ref={cardRef}
-                  url={data.url}
-                  id={data.id}
-                  title={data.title}
-                  description={data.description}
-                  author={data.author}
-                  createdAt={data.createdAt}
-                  state={data.state}
-                />
-              ) : (
-                <HoverPreviewLink
-                  ref={cardRef}
-                  url={data.url}
-                  thumbnailUrl={data.thumbnailUrl}
-                  title={data.title}
-                  description={data.description}
-                />
-              )}
-              <Pointer
-                top={pointerTop}
-                left={pointerLeft}
-                direction={pointerDir}
-              />
-            </Animate>
-          ) : null}
-        </Position>
-      </Portal>
-    );
+      stopCloseTimer();
+    };
+  }, [element, startCloseTimer, isVisible, stopCloseTimer]);
+
+  if (dataLoading) {
+    return <LoadingIndicator />;
   }
-);
 
-function HoverPreview({ element, unfurlId, dataLoading, ...rest }: Props) {
+  if (!data) {
+    return null;
+  }
+
+  return (
+    <Portal>
+      <Position top={cardTop} left={cardLeft} aria-hidden>
+        {isVisible ? (
+          <Animate
+            initial={{ opacity: 0, y: -20, pointerEvents: "none" }}
+            animate={{
+              opacity: 1,
+              y: 0,
+              transitionEnd: { pointerEvents: "auto" },
+            }}
+          >
+            {data.type === UnfurlResourceType.Mention ? (
+              <HoverPreviewMention
+                ref={cardRef}
+                name={data.name}
+                avatarUrl={data.avatarUrl}
+                color={data.color}
+                lastActive={data.lastActive}
+                email={data.email}
+              />
+            ) : data.type === UnfurlResourceType.Document ? (
+              <HoverPreviewDocument
+                ref={cardRef}
+                url={data.url}
+                id={data.id}
+                title={data.title}
+                summary={data.summary}
+                lastActivityByViewer={data.lastActivityByViewer}
+              />
+            ) : data.type === UnfurlResourceType.Issue ? (
+              <HoverPreviewIssue
+                ref={cardRef}
+                url={data.url}
+                id={data.id}
+                title={data.title}
+                description={data.description}
+                author={data.author}
+                labels={data.labels}
+                state={data.state}
+                createdAt={data.createdAt}
+              />
+            ) : data.type === UnfurlResourceType.PR ? (
+              <HoverPreviewPullRequest
+                ref={cardRef}
+                url={data.url}
+                id={data.id}
+                title={data.title}
+                description={data.description}
+                author={data.author}
+                createdAt={data.createdAt}
+                state={data.state}
+              />
+            ) : (
+              <HoverPreviewLink
+                ref={cardRef}
+                url={data.url}
+                thumbnailUrl={data.thumbnailUrl}
+                title={data.title}
+                description={data.description}
+              />
+            )}
+            <Pointer
+              top={pointerTop}
+              left={pointerLeft}
+              direction={pointerDir}
+            />
+          </Animate>
+        ) : null}
+      </Position>
+    </Portal>
+  );
+}
+
+function HoverPreview({ element, data, dataLoading, ...rest }: Props) {
   const isMobile = useMobile();
   if (isMobile) {
     return null;
@@ -196,7 +190,7 @@ function HoverPreview({ element, unfurlId, dataLoading, ...rest }: Props) {
     <HoverPreviewDesktop
       {...rest}
       element={element}
-      unfurlId={unfurlId}
+      data={data}
       dataLoading={dataLoading}
     />
   );

app/components/HoverPreview/HoverPreviewIssue.tsx

@@ -1,9 +1,9 @@
 import * as React from "react";
 import { Trans } from "react-i18next";
-import { IssueStatusIcon } from "@shared/components/IssueStatusIcon";
 import { UnfurlResourceType, UnfurlResponse } from "@shared/types";
 import { Avatar } from "~/components/Avatar";
 import Flex from "~/components/Flex";
+import { IssueStatusIcon } from "../Icons/IssueStatusIcon";
 import Text from "../Text";
 import Time from "../Time";
 import {

app/components/HoverPreview/HoverPreviewPullRequest.tsx

@@ -1,9 +1,9 @@
 import * as React from "react";
 import { Trans } from "react-i18next";
-import { PullRequestIcon } from "@shared/components/PullRequestIcon";
 import { UnfurlResourceType, UnfurlResponse } from "@shared/types";
 import { Avatar } from "~/components/Avatar";
 import Flex from "~/components/Flex";
+import { PullRequestIcon } from "../Icons/PullRequestIcon";
 import Text from "../Text";
 import Time from "../Time";
 import {

app/components/Input.tsx

@@ -45,10 +45,6 @@ export const NativeInput = styled.input<{
   ${ellipsis()}
   ${undraggableOnDesktop()}
 
-  &[readOnly] {
-    color: ${s("textSecondary")};
-  }
-
   &:disabled,
   &::placeholder {
     color: ${s("placeholder")};
@@ -130,14 +126,13 @@ export interface Props
     React.InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElement>,
     "prefix"
   > {
-  type?: "text" | "email" | "checkbox" | "search" | "textarea" | "password";
+  type?: "text" | "email" | "checkbox" | "search" | "textarea";
   labelHidden?: boolean;
   label?: string;
   flex?: boolean;
   short?: boolean;
   margin?: string | number;
   error?: string;
-  rows?: number;
   /** Optional component that appears inside the input before the textarea and any icon */
   prefix?: React.ReactNode;
   /** Optional icon that appears inside the input before the textarea */

app/components/Labeled.tsx

@@ -0,0 +1,26 @@
+import { observer } from "mobx-react";
+import * as React from "react";
+import styled from "styled-components";
+import { s } from "@shared/styles";
+import Flex from "~/components/Flex";
+
+type Props = {
+  children?: React.ReactNode;
+  label: React.ReactNode | string;
+};
+
+const Labeled: React.FC<Props> = ({ label, children, ...props }: Props) => (
+  <Flex column {...props}>
+    <Label>{label}</Label>
+    {children}
+  </Flex>
+);
+
+export const Label = styled(Flex)`
+  font-weight: 500;
+  padding-bottom: 4px;
+  display: inline-block;
+  color: ${s("text")};
+`;
+
+export default observer(Labeled);

app/components/Sidebar/Sidebar.tsx

@@ -54,8 +54,6 @@ const Sidebar = React.forwardRef<HTMLDivElement, Props>(function _Sidebar(
   const [hasPointerMoved, setPointerMoved] = React.useState(false);
   const isSmallerThanMinimum = width < minWidth;
 
-  const hoverTimeoutRef = React.useRef<NodeJS.Timeout | null>(null);
-
   const handleDrag = React.useCallback(
     (event: MouseEvent) => {
       // suppresses text selection
@@ -116,10 +114,6 @@ const Sidebar = React.forwardRef<HTMLDivElement, Props>(function _Sidebar(
 
   const handlePointerActivity = React.useCallback(() => {
     if (ui.sidebarIsClosed) {
-      // clear the timeout when mouse exits
-      if (hoverTimeoutRef.current) {
-        clearTimeout(hoverTimeoutRef.current);
-      }
       setHovering(document.hasFocus());
       setPointerMoved(true);
     }
@@ -128,20 +122,12 @@ const Sidebar = React.forwardRef<HTMLDivElement, Props>(function _Sidebar(
   const handlePointerLeave = React.useCallback(
     (ev) => {
       if (hasPointerMoved) {
-        // clear any previous timeout
-        if (hoverTimeoutRef.current) {
-          clearTimeout(hoverTimeoutRef.current);
-        }
-
-        // add a short delay when mouse exits the sidebar before closing
-        hoverTimeoutRef.current = setTimeout(() => {
-          setHovering(
-            document.hasFocus() &&
-              ev.pageX < width &&
-              ev.pageY < window.innerHeight &&
-              ev.pageY > 0
-          );
-        }, 500);
+        setHovering(
+          document.hasFocus() &&
+            ev.pageX < width &&
+            ev.pageY < window.innerHeight &&
+            ev.pageY > 0
+        );
       }
     },
     [width, hasPointerMoved]

app/components/Text.ts

@@ -1,3 +1,73 @@
-import Text from "@shared/components/Text";
+import styled, { css } from "styled-components";
+import { ellipsis } from "@shared/styles";
+
+type Props = {
+  /** The type of text to render */
+  type?: "secondary" | "tertiary" | "danger";
+  /** The size of the text */
+  size?: "xlarge" | "large" | "medium" | "small" | "xsmall";
+  /** The direction of the text (defaults to ltr) */
+  dir?: "ltr" | "rtl" | "auto";
+  /** Whether the text should be selectable (defaults to false) */
+  selectable?: boolean;
+  /** The font weight of the text */
+  weight?: "xbold" | "bold" | "normal";
+  /** Whether the text should be italic */
+  italic?: boolean;
+  /** Whether the text should be truncated with an ellipsis */
+  ellipsis?: boolean;
+  /** Whether the text should be monospaced */
+  monospace?: boolean;
+};
+
+/**
+ * Use this component for all interface text that should not be selectable
+ * by the user, this is the majority of UI text explainers, notes, headings.
+ */
+const Text = styled.span<Props>`
+  margin-top: 0;
+  text-align: ${(props) => (props.dir ? props.dir : "inherit")};
+  color: ${(props) =>
+    props.type === "secondary"
+      ? props.theme.textSecondary
+      : props.type === "tertiary"
+      ? props.theme.textTertiary
+      : props.type === "danger"
+      ? props.theme.brand.red
+      : props.theme.text};
+  font-size: ${(props) =>
+    props.size === "xlarge"
+      ? "26px"
+      : props.size === "large"
+      ? "18px"
+      : props.size === "medium"
+      ? "16px"
+      : props.size === "small"
+      ? "14px"
+      : props.size === "xsmall"
+      ? "13px"
+      : "inherit"};
+
+  ${(props) =>
+    props.weight &&
+    css`
+      font-weight: ${props.weight === "xbold"
+        ? 600
+        : props.weight === "bold"
+        ? 500
+        : props.weight === "normal"
+        ? 400
+        : "inherit"};
+    `}
+
+  font-style: ${(props) => (props.italic ? "italic" : "normal")};
+  font-family: ${(props) =>
+    props.monospace ? props.theme.fontFamilyMono : "inherit"};
+
+  white-space: normal;
+  user-select: ${(props) => (props.selectable ? "text" : "none")};
+
+  ${(props) => props.ellipsis && ellipsis()}
+`;
 
 export default Text;

app/editor/components/CreateIssueDialog.tsx

@@ -1,192 +0,0 @@
-import { IssueSource } from "@shared/schema";
-import { ellipsis } from "@shared/styles";
-import { observer } from "mobx-react";
-import React from "react";
-import { Trans, useTranslation } from "react-i18next";
-import { toast } from "sonner";
-import styled from "styled-components";
-import breakpoint from "styled-components-breakpoint";
-import Button from "~/components/Button";
-import Flex from "~/components/Flex";
-import Modal from "~/components/Modal";
-import PluginIcon from "~/components/PluginIcon";
-import Text from "~/components/Text";
-import useBoolean from "~/hooks/useBoolean";
-import useRequest from "~/hooks/useRequest";
-import { client } from "~/utils/ApiClient";
-
-type Props = {
-  issueTitle: string;
-  open: boolean;
-  onCreate: (source: IssueSource) => Promise<void>;
-  onClose: () => void;
-};
-
-export const CreateIssueDialog = observer(
-  ({ issueTitle, open, onCreate, onClose }: Props) => {
-    const { t } = useTranslation();
-    const [isCreating, setCreating, unsetCreating] = useBoolean();
-    const [selectedSource, selectSource] = React.useState<IssueSource>();
-
-    const {
-      data: sources,
-      loading,
-      request,
-    } = useRequest<IssueSource[]>(
-      React.useCallback(async () => {
-        try {
-          const res = await client.post("/issues.list_sources");
-          return res.data;
-        } catch (err) {
-          toast.error(t("Couldn't load issue sources, try again?"));
-          throw err;
-        }
-      }, [t])
-    );
-
-    const handleCreateIssue = React.useCallback(async () => {
-      setCreating();
-      await onCreate(selectedSource!);
-      unsetCreating();
-    }, [selectedSource, onCreate, setCreating, unsetCreating]);
-
-    React.useEffect(() => {
-      if (open) {
-        void request();
-      } else {
-        selectSource(undefined);
-      }
-    }, [open, request]);
-
-    return (
-      <Modal
-        title={t("Create issue")}
-        isOpen={open}
-        onRequestClose={onClose}
-        fullscreen={false}
-      >
-        <FlexContainer column>
-          <ListContainer>
-            {loading ? (
-              "Loading..."
-            ) : !sources?.length ? (
-              "No source available"
-            ) : (
-              <Flex column gap={6}>
-                {sources.map((source) => (
-                  <SourceItem
-                    key={source.id}
-                    source={source}
-                    selected={source === selectedSource}
-                    onSelect={selectSource}
-                  />
-                ))}
-              </Flex>
-            )}
-          </ListContainer>
-          <Footer justify="space-between" align="center" gap={8}>
-            <StyledText type="secondary">
-              {selectedSource ? (
-                <Trans
-                  defaults="Create issue in <em>{{ location }}</em>"
-                  values={{
-                    location: `${selectedSource.owner.name}/${selectedSource.name} `,
-                  }}
-                  components={{
-                    em: <strong />,
-                  }}
-                />
-              ) : (
-                t("Select a source to create issue")
-              )}
-            </StyledText>
-            <Button
-              disabled={!selectedSource || isCreating}
-              onClick={handleCreateIssue}
-            >
-              {isCreating ? `${t("Creating")}…` : t("Create")}
-            </Button>
-          </Footer>
-        </FlexContainer>
-      </Modal>
-    );
-  }
-);
-
-const SourceItem = ({
-  source,
-  selected,
-  onSelect,
-}: {
-  source: IssueSource;
-  selected: boolean;
-  onSelect: (source: IssueSource) => void;
-}) => (
-  <SourceItemWrapper
-    justify="space-between"
-    onClick={() => onSelect(source)}
-    $selected={selected}
-  >
-    <Text>{source.name}</Text>
-    <Flex align="center" gap={2}>
-      <PluginIcon id={source.service} size={20} />
-      <SourceAccount type="tertiary" size="xsmall">
-        {source.owner.name}
-      </SourceAccount>
-    </Flex>
-  </SourceItemWrapper>
-);
-
-export const FlexContainer = styled(Flex)`
-  margin-left: -24px;
-  margin-right: -24px;
-  margin-bottom: -24px;
-  outline: none;
-`;
-
-const ListContainer = styled.div`
-  height: 65vh;
-  padding: 0 24px 12px;
-  overflow: scroll;
-
-  ${breakpoint("tablet")`
-    height: 40vh;
-  `}
-`;
-
-const SourceAccount = styled(Text)``;
-
-const SourceItemWrapper = styled(Flex)<{ $selected: boolean }>`
-  font-size: 16px;
-  cursor: var(--pointer);
-  padding: 12px;
-  border-radius: 6px;
-
-  ${(props) =>
-    props.$selected &&
-    `
-		background: ${props.theme.accent};
-		color: ${props.theme.white};
-
-		${SourceAccount} {
-			color: ${props.theme.white};
-		}
-
-	`}
-
-  ${breakpoint("tablet")`
-		padding: 4px 6px;
-		font-size: 15px;
-	`}
-`;
-
-const Footer = styled(Flex)`
-  height: 64px;
-  border-top: 1px solid ${(props) => props.theme.horizontalRule};
-  padding: 0 24px;
-`;
-
-const StyledText = styled(Text)`
-  ${ellipsis()}
-  margin-bottom: 0;
-`;

app/editor/components/PasteMenu.tsx

@@ -1,15 +1,7 @@
-import { observer } from "mobx-react";
-import { EmailIcon, LinkIcon } from "outline-icons";
+import { LinkIcon } from "outline-icons";
 import React from "react";
 import { useTranslation } from "react-i18next";
-import { v4 } from "uuid";
 import { EmbedDescriptor } from "@shared/editor/embeds";
-import { MenuItem } from "@shared/editor/types";
-import { MentionType } from "@shared/types";
-import Integration from "~/models/Integration";
-import useCurrentUser from "~/hooks/useCurrentUser";
-import useStores from "~/hooks/useStores";
-import { determineMentionType, isURLMentionable } from "~/utils/mention";
 import SuggestionsMenu, {
   Props as SuggestionsMenuProps,
 } from "./SuggestionsMenu";
@@ -23,65 +15,34 @@ type Props = Omit<
   embeds: EmbedDescriptor[];
 };
 
-export const PasteMenu = observer(({ pastedText, embeds, ...props }: Props) => {
+const PasteMenu = ({ embeds, ...props }: Props) => {
   const { t } = useTranslation();
-  const { integrations } = useStores();
-  const user = useCurrentUser();
-
-  let mentionType: MentionType | undefined;
-  const url = pastedText ? new URL(pastedText) : undefined;
-
-  if (url) {
-    const integration = integrations.find((intg: Integration) =>
-      isURLMentionable({ url, integration: intg })
-    );
-
-    mentionType = integration
-      ? determineMentionType({ url, integration })
-      : undefined;
-  }
 
   const embed = React.useMemo(() => {
     for (const e of embeds) {
-      const matches = e.matcher(pastedText);
+      const matches = e.matcher(props.pastedText);
       if (matches) {
         return e;
       }
     }
     return;
-  }, [embeds, pastedText]);
+  }, [embeds, props.pastedText]);
 
   const items = React.useMemo(
-    () =>
-      [
-        {
-          name: "noop",
-          title: t("Keep as link"),
-          icon: <LinkIcon />,
-        },
-        {
-          name: "mention",
-          title: t("Mention"),
-          icon: <EmailIcon />,
-          visible: !!mentionType,
-          attrs: {
-            id: v4(),
-            type: mentionType,
-            label: pastedText,
-            href: pastedText,
-            modelId: v4(),
-            actorId: user.id,
-          },
-          appendSpace: true,
-        },
-        {
-          name: "embed",
-          title: t("Embed"),
-          icon: embed?.icon,
-          keywords: embed?.keywords,
-        },
-      ] satisfies MenuItem[],
-    [t, embed, mentionType, pastedText, user]
+    () => [
+      {
+        name: "noop",
+        title: t("Keep as link"),
+        icon: <LinkIcon />,
+      },
+      {
+        name: "embed",
+        title: t("Embed"),
+        icon: embed?.icon,
+        keywords: embed?.keywords,
+      },
+    ],
+    [embed, t]
   );
 
   return (
@@ -91,7 +52,9 @@ export const PasteMenu = observer(({ pastedText, embeds, ...props }: Props) => {
       filterable={false}
       renderMenuItem={(item, _index, options) => (
         <SuggestionsMenuItem
-          onClick={options.onClick}
+          onClick={() => {
+            props.onSelect?.(item);
+          }}
           selected={options.selected}
           title={item.title}
           icon={item.icon}
@@ -100,4 +63,6 @@ export const PasteMenu = observer(({ pastedText, embeds, ...props }: Props) => {
       items={items}
     />
   );
-});
+};
+
+export default PasteMenu;

app/editor/components/SelectionToolbar.tsx

@@ -9,7 +9,6 @@ import { isMarkActive } from "@shared/editor/queries/isMarkActive";
 import { isNodeActive } from "@shared/editor/queries/isNodeActive";
 import { getColumnIndex, getRowIndex } from "@shared/editor/queries/table";
 import { MenuItem } from "@shared/editor/types";
-import { useRecentIssueSources } from "~/editor/hooks/useRecentIssueSources";
 import useBoolean from "~/hooks/useBoolean";
 import useDictionary from "~/hooks/useDictionary";
 import useEventListener from "~/hooks/useEventListener";
@@ -107,7 +106,6 @@ export default function SelectionToolbar(props: Props) {
   const isActive = useIsActive(view.state) || isMobile;
   const isDragging = useIsDragging();
   const previousIsActive = usePrevious(isActive);
-  const { issueSources: recentIssueSources } = useRecentIssueSources();
 
   React.useEffect(() => {
     // Trigger callbacks when the toolbar is opened or closed
@@ -215,13 +213,7 @@ export default function SelectionToolbar(props: Props) {
   } else if (isNoticeSelection && selection.empty) {
     items = getNoticeMenuItems(state, readOnly, dictionary);
   } else {
-    items = getFormattingMenuItems(
-      state,
-      isTemplate,
-      isMobile,
-      recentIssueSources,
-      dictionary
-    );
+    items = getFormattingMenuItems(state, isTemplate, isMobile, dictionary);
   }
 
   // Some extensions may be disabled, remove corresponding items

app/editor/extensions/ClipboardTextSerializer.ts

@@ -1,6 +1,5 @@
 import { Plugin, PluginKey } from "prosemirror-state";
 import Extension from "@shared/editor/lib/Extension";
-import { isList } from "@shared/editor/queries/isList";
 import { ProsemirrorHelper } from "@shared/utils/ProsemirrorHelper";
 
 /**
@@ -19,25 +18,17 @@ export default class ClipboardTextSerializer extends Extension {
       new Plugin({
         key: new PluginKey("clipboardTextSerializer"),
         props: {
-          clipboardTextSerializer: (slice, view) => {
+          clipboardTextSerializer: (slice) => {
             const isMultiline = slice.content.childCount > 1;
 
             // This is a cheap way to determine if the content is "complex",
             // aka it has multiple marks or formatting. In which case we'll use
             // markdown formatting
-            const hasMultipleListItems = slice.content.content
-              .filter((node) => node.content.content.length > 1)
-              .some((node) => isList(node, view.state.schema));
-            const hasMultipleBlockTypes =
-              [
-                ...new Set(
-                  slice.content.content
-                    .filter((node) => node.content.content.length > 1)
-                    .map((node) => node.type.name)
-                ),
-              ].length > 1;
             const copyAsMarkdown =
-              isMultiline || hasMultipleBlockTypes || hasMultipleListItems;
+              isMultiline ||
+              slice.content.content.some(
+                (node) => node.content.content.length > 1
+              );
 
             return copyAsMarkdown
               ? mdSerializer.serialize(slice.content, {

app/editor/extensions/CreateIssue.tsx

@@ -1,303 +0,0 @@
-import Extension from "@shared/editor/lib/Extension";
-import { isRemoteTransaction } from "@shared/editor/lib/multiplayer";
-import { recreateTransform } from "@shared/editor/lib/prosemirror-recreate-transform";
-import { isInCode } from "@shared/editor/queries/isInCode";
-import { IssueSource } from "@shared/schema";
-import {
-  MentionPlaceholder,
-  MentionType,
-  UnfurlResourceType,
-  UnfurlResponse,
-} from "@shared/types";
-import { t } from "i18next";
-import { action, observable } from "mobx";
-import {
-  Command,
-  EditorState,
-  Plugin,
-  PluginKey,
-  TextSelection,
-} from "prosemirror-state";
-import { Decoration, DecorationSet } from "prosemirror-view";
-import React from "react";
-import { toast } from "sonner";
-import { Primitive } from "utility-types";
-import { v4 } from "uuid";
-import stores from "~/stores";
-import { client } from "~/utils/ApiClient";
-import { CreateIssueDialog } from "../components/CreateIssueDialog";
-import { addRecentIssueSource } from "../hooks/useRecentIssueSources";
-
-export default class CreateIssue extends Extension {
-  private state: {
-    open: boolean;
-    title: string;
-  } = observable({
-    open: false,
-    title: "",
-  });
-
-  private key = new PluginKey(this.name);
-
-  get name() {
-    return "issue";
-  }
-
-  get plugins() {
-    return [
-      new Plugin({
-        key: this.key,
-        state: {
-          init: () => DecorationSet.empty,
-          apply: (tr, set) => {
-            // See if the transaction adds, replaces, or removes any placeholders.
-            const meta = tr.getMeta(this.key);
-
-            // We only want a single paste placeholder at a time, so if we're adding a new
-            // placeholder we can just return a new DecorationSet and avoid mapping logic.
-            if (meta?.add) {
-              const { from, to, id } = meta.add;
-              const decorations = [
-                Decoration.inline(
-                  from,
-                  to,
-                  {},
-                  {
-                    id,
-                  }
-                ),
-              ];
-              return DecorationSet.create(tr.doc, decorations);
-            }
-
-            let mapping = tr.mapping;
-            const hasDecorations = set.find().length;
-
-            if (hasDecorations && (isRemoteTransaction(tr) || meta)) {
-              try {
-                mapping = recreateTransform(tr.before, tr.doc, {
-                  complexSteps: true,
-                  wordDiffs: false,
-                  simplifyDiff: true,
-                }).mapping;
-              } catch (err) {
-                // eslint-disable-next-line no-console
-                console.warn("Failed to recreate transform: ", err);
-              }
-            }
-
-            set = set.map(mapping, tr.doc);
-
-            if (meta?.replace) {
-              const { id } = meta.replace;
-              const decorations = set.find(
-                undefined,
-                undefined,
-                (spec) => spec.id === id
-              );
-              return DecorationSet.create(tr.doc, decorations);
-            }
-
-            if (meta?.remove) {
-              const { id } = meta.remove;
-              const decorations = set.find(
-                undefined,
-                undefined,
-                (spec) => spec.id === id
-              );
-              return set.remove(decorations);
-            }
-
-            return set;
-          },
-        },
-      }),
-    ];
-  }
-
-  keys(): Record<string, Command> {
-    return {
-      "Mod-Alt-i": (state, dispatch) => {
-        const isCode = isInCode(state);
-        const isEmpty = state.selection.empty;
-
-        if (isCode || isEmpty) {
-          return false;
-        }
-
-        const title = state.doc.cut(
-          state.selection.from,
-          state.selection.to
-        ).textContent;
-        const { from } = state.selection;
-        const to = from + title.length;
-
-        const tr = state.tr
-          .setSelection(TextSelection.near(state.doc.resolve(from)))
-          .setMeta(this.key, { add: { from, to, id: title } });
-        dispatch?.(tr);
-
-        this.openDialog(title);
-
-        return true;
-      },
-    };
-  }
-
-  commands() {
-    return (attrs: Record<string, Primitive>): Command =>
-      action((state, dispatch) => {
-        const title = attrs.title as string;
-        const source = attrs.source
-          ? (JSON.parse(attrs.source as string) as IssueSource)
-          : undefined;
-
-        this.state.title = title;
-
-        const { from } = state.selection;
-        const to = from + title.length;
-
-        const tr = state.tr
-          .setSelection(TextSelection.near(state.doc.resolve(to)))
-          .setMeta(this.key, { add: { from, to, id: title } });
-
-        dispatch?.(tr);
-
-        if (source) {
-          tr.replaceWith(
-            from,
-            to,
-            state.schema.nodes.mention.create({
-              id: v4(),
-              type: MentionPlaceholder,
-              label: title,
-              href: title,
-              modelId: v4(),
-              actorId: stores.auth.currentUserId,
-            })
-          ).setMeta(this.key, { replace: { id: title } });
-        }
-
-        dispatch?.(tr);
-
-        if (source) {
-          void this.createIssue(source);
-        } else {
-          this.openDialog(title);
-        }
-
-        return true;
-      });
-  }
-
-  widget = () => (
-    <CreateIssueDialog
-      issueTitle={this.state.title}
-      open={this.state.open}
-      onCreate={this.createIssue}
-      onClose={this.closeDialog}
-    />
-  );
-
-  private createIssue = async (source: IssueSource) => {
-    try {
-      addRecentIssueSource(source);
-      const res = await client.post("/issues.create", {
-        title: this.state.title,
-        source,
-      });
-      this.addMentionNode(res.data);
-      toast.success(t("Issue created"));
-    } catch (err) {
-      this.removeDecorations(source);
-      toast.error(t("Couldn’t create the issue, try again?"));
-    }
-  };
-
-  private addMentionNode = (
-    issue: UnfurlResponse[UnfurlResourceType.Issue]
-  ) => {
-    const { view } = this.editor;
-    const { state } = view;
-
-    const result = this.findPlaceholder(state, this.state.title);
-
-    if (result) {
-      const tr = state.tr.deleteRange(result[0], result[1]);
-      view.dispatch(
-        tr
-          .setSelection(TextSelection.near(tr.doc.resolve(result[0])))
-          .setMeta(this.key, {
-            remove: { id: this.state.title },
-          })
-      );
-    }
-
-    this.editor.commands.mention({
-      id: v4(),
-      type: MentionType.Issue,
-      label: this.state.title,
-      href: issue.url,
-      modelId: v4(),
-      actorId: stores.auth.currentUserId,
-    });
-  };
-
-  private removeDecorations = action((source: IssueSource) => {
-    const { view } = this.editor;
-    const { state } = view;
-
-    const tr = state.tr.setMeta(this.key, {
-      remove: { id: this.state.title },
-    });
-
-    const result = this.findPlaceholder(state, this.state.title);
-
-    // Placeholder node would have been inserted in recent issue menu flow only.
-    // We want to reset it with the selected text.
-    if (source && result) {
-      tr.replaceWith(
-        result[0],
-        result[1],
-        state.schema.nodeFromJSON({ type: "text", text: this.state.title })
-      );
-    }
-
-    view.dispatch(tr);
-
-    this.state.title = "";
-  });
-
-  private openDialog = action((title: string) => {
-    this.state.title = title;
-    this.state.open = true;
-  });
-
-  private closeDialog = action(() => {
-    const { view } = this.editor;
-    const { state } = view;
-
-    const result = this.findPlaceholder(state, this.state.title);
-
-    if (result) {
-      const tr = state.tr
-        .setSelection(TextSelection.near(state.doc.resolve(result[0])))
-        .setMeta(this.key, {
-          remove: { id: this.state.title },
-        });
-      view.dispatch(tr);
-    }
-
-    this.state.title = "";
-    this.state.open = false;
-  });
-
-  private findPlaceholder = (
-    state: EditorState,
-    id: string
-  ): [number, number] | null => {
-    const decos = this.key.getState(state) as DecorationSet;
-    const found = decos?.find(undefined, undefined, (spec) => spec.id === id);
-    return found?.length ? [found[0].from, found[0].to] : null;
-  };
-}

app/editor/extensions/HoverPreviews.tsx

@@ -4,9 +4,9 @@ import { EditorView } from "prosemirror-view";
 import * as React from "react";
 import Extension from "@shared/editor/lib/Extension";
 import parseDocumentSlug from "@shared/utils/parseDocumentSlug";
-import stores from "~/stores";
 import HoverPreview from "~/components/HoverPreview";
 import env from "~/env";
+import { client } from "~/utils/ApiClient";
 
 interface HoverPreviewsOptions {
   /** Delay before the target is considered "hovered" and callback is triggered. */
@@ -16,11 +16,11 @@ interface HoverPreviewsOptions {
 export default class HoverPreviews extends Extension {
   state: {
     activeLinkElement: HTMLElement | null;
-    unfurlId: string | null;
+    data: Record<string, any> | null;
     dataLoading: boolean;
   } = observable({
     activeLinkElement: null,
-    unfurlId: null,
+    data: null,
     dataLoading: false,
   });
 
@@ -62,25 +62,19 @@ export default class HoverPreviews extends Extension {
                     );
 
                     if (url) {
-                      const transformedUrl = url.startsWith("/")
-                        ? env.URL + url
-                        : url;
-
                       this.state.dataLoading = true;
-
-                      const unfurl = await stores.unfurls.fetchUnfurl({
-                        url: transformedUrl,
-                        documentId,
-                      });
-
-                      if (unfurl) {
+                      try {
+                        const data = await client.post("/urls.unfurl", {
+                          url: url.startsWith("/") ? env.URL + url : url,
+                          documentId,
+                        });
                         this.state.activeLinkElement = element;
-                        this.state.unfurlId = transformedUrl;
-                      } else {
+                        this.state.data = data;
+                      } catch (err) {
                         this.state.activeLinkElement = null;
+                      } finally {
+                        this.state.dataLoading = false;
                       }
-
-                      this.state.dataLoading = false;
                     }
                   }),
                   this.options.delay
@@ -107,11 +101,10 @@ export default class HoverPreviews extends Extension {
   widget = () => (
     <HoverPreview
       element={this.state.activeLinkElement}
-      unfurlId={this.state.unfurlId}
+      data={this.state.data}
       dataLoading={this.state.dataLoading}
       onClose={action(() => {
         this.state.activeLinkElement = null;
-        this.state.unfurlId = null;
       })}
     />
   );

app/editor/extensions/PasteHandler.tsx

@@ -24,7 +24,7 @@ import parseCollectionSlug from "@shared/utils/parseCollectionSlug";
 import parseDocumentSlug from "@shared/utils/parseDocumentSlug";
 import { isCollectionUrl, isDocumentUrl, isUrl } from "@shared/utils/urls";
 import stores from "~/stores";
-import { PasteMenu } from "../components/PasteMenu";
+import PasteMenu from "../components/PasteMenu";
 
 export default class PasteHandler extends Extension {
   state: {
@@ -88,7 +88,7 @@ export default class PasteHandler extends Extension {
 
             // If the users selection is currently in a code block then paste
             // as plain text, ignore all formatting and HTML content.
-            if (isInCode(state, { inclusive: true })) {
+            if (isInCode(state)) {
               event.preventDefault();
               view.dispatch(state.tr.insertText(text));
               return true;
@@ -415,21 +415,6 @@ export default class PasteHandler extends Extension {
     });
   };
 
-  private insertMention = () => {
-    const { view } = this.editor;
-    const { state } = view;
-    const result = this.findPlaceholder(state, this.state.pastedText);
-
-    // Remove just the placeholder here.
-    // Mention node will be created by SuggestionsMenu.
-    if (result) {
-      const tr = state.tr.deleteRange(result[0], result[1]);
-      view.dispatch(
-        tr.setSelection(TextSelection.near(tr.doc.resolve(result[0])))
-      );
-    }
-  };
-
   private removePlaceholder = () => {
     const { view } = this.editor;
     const { state } = view;
@@ -465,11 +450,6 @@ export default class PasteHandler extends Extension {
         this.insertEmbed();
         break;
       }
-      case "mention": {
-        this.hidePasteMenu();
-        this.insertMention();
-        break;
-      }
       default:
         break;
     }

app/editor/extensions/index.ts

@@ -3,7 +3,6 @@ import Mark from "@shared/editor/marks/Mark";
 import Node from "@shared/editor/nodes/Node";
 import BlockMenuExtension from "~/editor/extensions/BlockMenu";
 import ClipboardTextSerializer from "~/editor/extensions/ClipboardTextSerializer";
-import CreateIssueExtension from "~/editor/extensions/CreateIssue";
 import EmojiMenuExtension from "~/editor/extensions/EmojiMenu";
 import FindAndReplaceExtension from "~/editor/extensions/FindAndReplace";
 import HoverPreviewsExtension from "~/editor/extensions/HoverPreviews";
@@ -25,7 +24,6 @@ export const withUIExtensions = (nodes: Nodes) => [
   MentionMenuExtension,
   FindAndReplaceExtension,
   HoverPreviewsExtension,
-  CreateIssueExtension,
   // Order these default key handlers last
   PreventTab,
   Keys,

app/editor/hooks/useRecentIssueSources.ts

@@ -1,47 +0,0 @@
-import { IssueSource } from "@shared/schema";
-import Storage from "@shared/utils/Storage";
-import React from "react";
-import usePersistedState, {
-  setPersistedState,
-} from "~/hooks/usePersistedState";
-
-const StorageKey = "recent-issue-sources";
-const MaxCount = 5;
-
-export function useRecentIssueSources() {
-  const [issueSources, setIssueSources] = usePersistedState<IssueSource[]>(
-    StorageKey,
-    [] as IssueSource[]
-  );
-
-  const addIssueSource = React.useCallback(
-    (source: IssueSource) => {
-      const newIssueSources = insertAndTrim(issueSources, source);
-      setIssueSources(newIssueSources);
-    },
-    [issueSources, setIssueSources]
-  );
-
-  return { issueSources, addIssueSource };
-}
-
-export function addRecentIssueSource(source: IssueSource) {
-  const issueSources: IssueSource[] = Storage.get(StorageKey) ?? [];
-  const newIssueSources = insertAndTrim(issueSources, source);
-  setPersistedState(StorageKey, newIssueSources);
-}
-
-function insertAndTrim(issueSources: IssueSource[], source: IssueSource) {
-  const newIssueSources = issueSources.filter((s) => s.id !== source.id);
-  newIssueSources.unshift(source);
-
-  if (newIssueSources.length > MaxCount) {
-    newIssueSources.pop();
-  }
-
-  return newIssueSources;
-}
-
-export type RecentIssueSourcesResponse = ReturnType<
-  typeof useRecentIssueSources
->;

app/editor/menus/formatting.tsx

@@ -1,4 +1,3 @@
-import { t } from "i18next";
 import {
   BoldIcon,
   CodeIcon,
@@ -18,9 +17,8 @@ import {
   IndentIcon,
   CopyIcon,
   Heading3Icon,
-  PlusIcon,
 } from "outline-icons";
-import { EditorState, TextSelection } from "prosemirror-state";
+import { EditorState } from "prosemirror-state";
 import * as React from "react";
 import styled from "styled-components";
 import Highlight from "@shared/editor/marks/Highlight";
@@ -30,17 +28,14 @@ import { isInList } from "@shared/editor/queries/isInList";
 import { isMarkActive } from "@shared/editor/queries/isMarkActive";
 import { isNodeActive } from "@shared/editor/queries/isNodeActive";
 import { MenuItem } from "@shared/editor/types";
-import { IssueSource } from "@shared/schema";
 import { metaDisplay } from "@shared/utils/keyboard";
 import CircleIcon from "~/components/Icons/CircleIcon";
-import PluginIcon from "~/components/PluginIcon";
 import { Dictionary } from "~/hooks/useDictionary";
 
 export default function formattingMenuItems(
   state: EditorState,
   isTemplate: boolean,
   isMobile: boolean,
-  recentIssueSources: IssueSource[],
   dictionary: Dictionary
 ): MenuItem[] {
   const { schema } = state;
@@ -48,39 +43,12 @@ export default function formattingMenuItems(
   const isCodeBlock = isInCode(state, { onlyBlock: true });
   const isEmpty = state.selection.empty;
 
-  const selectedText =
-    !isEmpty && state.selection instanceof TextSelection
-      ? state.doc.cut(state.selection.from, state.selection.to).textContent
-      : undefined;
-
   const highlight = getMarksBetween(
     state.selection.from,
     state.selection.to,
     state
   ).find(({ mark }) => mark.type.name === "highlight");
 
-  const issueSourcesChildren = recentIssueSources.length
-    ? recentIssueSources.map<MenuItem>((source) => ({
-        name: "issue",
-        label: `${source.owner.name}/${source.name}`,
-        icon: <PluginIcon id={source.service} />,
-        attrs: {
-          title: selectedText,
-          source: JSON.stringify(source),
-        },
-      }))
-    : undefined;
-
-  if (issueSourcesChildren) {
-    issueSourcesChildren.push({
-      name: "issue",
-      label: `${t("Other")}…`,
-      attrs: {
-        title: selectedText,
-      },
-    });
-  }
-
   return [
     {
       name: "placeholder",
@@ -291,21 +259,6 @@ export default function formattingMenuItems(
       shortcut: `${metaDisplay}+C`,
       visible: isCode && !isCodeBlock && (!isMobile || !isEmpty),
     },
-    {
-      name: "separator",
-      visible: !isCode && !isEmpty,
-    },
-    {
-      name: "issue",
-      tooltip: dictionary.createIssue,
-      shortcut: `${metaDisplay}+⌥+I`,
-      icon: <PlusIcon />,
-      attrs: {
-        title: selectedText,
-      },
-      visible: !isCode && !!selectedText,
-      children: issueSourcesChildren,
-    },
   ];
 }
 

app/hooks/useDictionary.ts

@@ -27,7 +27,6 @@ export default function useDictionary() {
       codeInline: t("Code"),
       comment: t("Comment"),
       copy: t("Copy"),
-      createIssue: t("Create issue from selection"),
       createLink: t("Create link"),
       createLinkError: t("Sorry, an error occurred creating the link"),
       createNewDoc: t("Create a new doc"),

app/hooks/useIsMounted.ts

@@ -1,3 +1,19 @@
-import useIsMounted from "@shared/hooks/useIsMounted";
+import * as React from "react";
 
-export default useIsMounted;
+/**
+ * Hook to check if component is still mounted
+ *
+ * @returns {boolean} true if the component is mounted, false otherwise
+ */
+export default function useIsMounted() {
+  const isMounted = React.useRef(false);
+
+  React.useEffect(() => {
+    isMounted.current = true;
+    return () => {
+      isMounted.current = false;
+    };
+  }, []);
+
+  return React.useCallback(() => isMounted.current, []);
+}

app/models/Document.ts

@@ -17,7 +17,6 @@ import {
   NavigationNodeType,
   NotificationEventType,
 } from "@shared/types";
-import { ProsemirrorHelper } from "@shared/utils/ProsemirrorHelper";
 import Storage from "@shared/utils/Storage";
 import { isRTL } from "@shared/utils/rtl";
 import slugify from "@shared/utils/slugify";
@@ -664,24 +663,6 @@ export default class Document extends ArchivableModel implements Searchable {
     return markdown;
   };
 
-  /**
-   * Returns the plain text representation of the document derived from the ProseMirror data.
-   *
-   * @returns The plain text representation of the document as a string.
-   */
-  toPlainText = () => {
-    const extensionManager = new ExtensionManager(withComments(richExtensions));
-    const schema = new Schema({
-      nodes: extensionManager.nodes,
-      marks: extensionManager.marks,
-    });
-    const text = ProsemirrorHelper.toPlainText(
-      Node.fromJSON(schema, this.data),
-      schema
-    );
-    return text;
-  };
-
   download = (contentType: ExportContentType) =>
     client.post(
       `/documents.export`,

app/models/Integration.ts

@@ -1,8 +1,8 @@
 import { observable } from "mobx";
-import {
+import type {
   IntegrationService,
-  type IntegrationSettings,
-  type IntegrationType,
+  IntegrationSettings,
+  IntegrationType,
 } from "@shared/types";
 import User from "~/models/User";
 import Model from "~/models/base/Model";

app/models/Unfurl.ts

@@ -1,18 +0,0 @@
-import { observable } from "mobx";
-import { UnfurlResourceType, UnfurlResponse } from "@shared/types";
-import Model from "./base/Model";
-
-class Unfurl<UnfurlType extends UnfurlResourceType> extends Model {
-  static modelName = "Unfurl";
-
-  @observable
-  type: UnfurlType;
-
-  @observable
-  data: UnfurlResponse[UnfurlType];
-
-  @observable
-  fetchedAt: string;
-}
-
-export default Unfurl;

app/scenes/Document/components/CommentThread.tsx

@@ -16,7 +16,6 @@ import { useDocumentContext } from "~/components/DocumentContext";
 import Facepile from "~/components/Facepile";
 import Fade from "~/components/Fade";
 import { ResizingHeightContainer } from "~/components/ResizingHeightContainer";
-import useBoolean from "~/hooks/useBoolean";
 import { useLocationSidebarContext } from "~/hooks/useLocationSidebarContext";
 import useOnClickOutside from "~/hooks/useOnClickOutside";
 import usePersistedState from "~/hooks/usePersistedState";
@@ -64,7 +63,7 @@ function CommentThread({
   const history = useHistory();
   const location = useLocation();
   const sidebarContext = useLocationSidebarContext();
-  const [autoFocus, setAutoFocusOn, setAutoFocusOff] = useBoolean(thread.isNew);
+  const [autoFocus, setAutoFocus] = React.useState(thread.isNew);
 
   const can = usePolicy(document);
 
@@ -157,9 +156,9 @@ function CommentThread({
 
   React.useEffect(() => {
     if (!focused && autoFocus) {
-      setAutoFocusOff();
+      setAutoFocus(false);
     }
-  }, [focused, autoFocus, setAutoFocusOff]);
+  }, [focused, autoFocus]);
 
   React.useEffect(() => {
     if (focused) {
@@ -274,7 +273,7 @@ function CommentThread({
         )}
       </ResizingHeightContainer>
       {!focused && !recessed && !draft && canReply && (
-        <Reply onClick={setAutoFocusOn}>{t("Reply")}…</Reply>
+        <Reply onClick={() => setAutoFocus(true)}>{t("Reply")}…</Reply>
       )}
     </Thread>
   );

app/scenes/Home.tsx

@@ -2,7 +2,7 @@ import { observer } from "mobx-react";
 import { HomeIcon } from "outline-icons";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
-import { Switch, Route } from "react-router-dom";
+import { Switch, Route, Redirect } from "react-router-dom";
 import styled from "styled-components";
 import { s } from "@shared/styles";
 import { Action } from "~/components/Actions";
@@ -18,6 +18,7 @@ import Tab from "~/components/Tab";
 import Tabs from "~/components/Tabs";
 import useCurrentTeam from "~/hooks/useCurrentTeam";
 import useCurrentUser from "~/hooks/useCurrentUser";
+import { usePostLoginPath } from "~/hooks/useLastVisitedPath";
 import { usePinnedDocuments } from "~/hooks/usePinnedDocuments";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
@@ -28,10 +29,16 @@ function Home() {
   const team = useCurrentTeam();
   const user = useCurrentUser();
   const { t } = useTranslation();
+  const [spendPostLoginPath] = usePostLoginPath();
   const userId = user?.id;
   const { pins, count } = usePinnedDocuments("home");
   const can = usePolicy(team);
 
+  const postLoginPath = spendPostLoginPath();
+  if (postLoginPath) {
+    return <Redirect to={postLoginPath} />;
+  }
+
   return (
     <Scene
       icon={<HomeIcon />}

app/scenes/Settings/components/FileOperationListItem.tsx

@@ -4,7 +4,6 @@ import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import { useTheme } from "styled-components";
-import Spinner from "@shared/components/Spinner";
 import {
   FileOperationFormat,
   FileOperationState,
@@ -14,6 +13,7 @@ import FileOperation from "~/models/FileOperation";
 import { Action } from "~/components/Actions";
 import ConfirmationDialog from "~/components/ConfirmationDialog";
 import ListItem from "~/components/List/Item";
+import Spinner from "~/components/Spinner";
 import Time from "~/components/Time";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import useStores from "~/hooks/useStores";

app/scenes/Settings/components/ImageUpload.tsx

@@ -1,19 +1,19 @@
 import invariant from "invariant";
+import { observable } from "mobx";
 import { observer } from "mobx-react";
 import * as React from "react";
-import { useState, useRef } from "react";
 import AvatarEditor from "react-avatar-editor";
 import Dropzone from "react-dropzone";
-import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import { s } from "@shared/styles";
 import { AttachmentPreset } from "@shared/types";
 import { AttachmentValidation } from "@shared/validations";
-import ButtonLarge from "~/components/ButtonLarge";
+import RootStore from "~/stores/RootStore";
+import Button from "~/components/Button";
 import Flex from "~/components/Flex";
 import LoadingIndicator from "~/components/LoadingIndicator";
 import Modal from "~/components/Modal";
-import useStores from "~/hooks/useStores";
+import withStores from "~/components/withStores";
 import { compressImage } from "~/utils/compressImage";
 import { uploadFile, dataUrlToBlob } from "~/utils/files";
 
@@ -24,38 +24,41 @@ export type Props = {
   borderRadius?: number;
 };
 
-const ImageUpload: React.FC<Props> = ({
-  onSuccess,
-  onError,
-  submitText,
-  borderRadius = 150,
-  children,
-}) => {
-  const { ui } = useStores();
-  const { t } = useTranslation();
-  submitText || t("Crop image");
+@observer
+class ImageUpload extends React.Component<RootStore & Props> {
+  @observable
+  isUploading = false;
 
-  const [isUploading, setIsUploading] = useState(false);
-  const [isCropping, setIsCropping] = useState(false);
-  const [zoom, setZoom] = useState(1);
-  const [file, setFile] = useState<File | null>(null);
+  @observable
+  isCropping = false;
 
-  const avatarEditorRef = useRef<AvatarEditor>(null);
+  @observable
+  zoom = 1;
 
-  const onDropAccepted = async (files: File[]) => {
-    setIsCropping(true);
-    setFile(files[0]);
+  @observable
+  file: File;
+
+  avatarEditorRef = React.createRef<AvatarEditor>();
+
+  static defaultProps = {
+    submitText: "Crop Image",
+    borderRadius: 150,
   };
 
-  const handleCrop = () => {
-    setIsUploading(true);
+  onDropAccepted = async (files: File[]) => {
+    this.isCropping = true;
+    this.file = files[0];
+  };
+
+  handleCrop = () => {
+    this.isUploading = true;
     // allow the UI to update before converting the canvas to a Blob
     // for large images this can cause the page rendering to hang.
-    setTimeout(uploadImage, 0);
+    setTimeout(this.uploadImage, 0);
   };
 
-  const uploadImage = async () => {
-    const canvas = avatarEditorRef.current?.getImage();
+  uploadImage = async () => {
+    const canvas = this.avatarEditorRef.current?.getImage();
     invariant(canvas, "canvas is not defined");
     const imageBlob = dataUrlToBlob(canvas.toDataURL());
 
@@ -65,87 +68,88 @@ const ImageUpload: React.FC<Props> = ({
         maxWidth: 512,
       });
       const attachment = await uploadFile(compressed, {
-        name: file!.name,
+        name: this.file.name,
         preset: AttachmentPreset.Avatar,
       });
-      void onSuccess(attachment.url);
+      void this.props.onSuccess(attachment.url);
     } catch (err) {
-      onError(err.message);
+      this.props.onError(err.message);
     } finally {
-      setIsUploading(false);
-      setIsCropping(false);
+      this.isUploading = false;
+      this.isCropping = false;
     }
   };
 
-  const handleClose = () => {
-    setIsUploading(false);
-    setIsCropping(false);
+  handleClose = () => {
+    this.isUploading = false;
+    this.isCropping = false;
   };
 
-  const handleZoom = (event: React.ChangeEvent<HTMLInputElement>) => {
+  handleZoom = (event: React.ChangeEvent<HTMLInputElement>) => {
     const target = event.target;
 
     if (target instanceof HTMLInputElement) {
-      setZoom(parseFloat(target.value));
+      this.zoom = parseFloat(target.value);
     }
   };
 
-  const renderCropping = () => (
-    <Modal
-      onRequestClose={handleClose}
-      fullscreen={false}
-      title={<>&nbsp;</>}
-      isOpen
-    >
-      <Flex auto column align="center" justify="center">
-        {isUploading && <LoadingIndicator />}
-        <AvatarEditorContainer>
-          <AvatarEditor
-            ref={avatarEditorRef}
-            image={file!}
-            width={250}
-            height={250}
-            border={25}
-            borderRadius={borderRadius}
-            color={ui.theme === "light" ? [255, 255, 255, 0.6] : [0, 0, 0, 0.6]} // RGBA
-            scale={zoom}
-            rotate={0}
+  renderCropping() {
+    const { ui, submitText } = this.props;
+    return (
+      <Modal isOpen onRequestClose={this.handleClose} title="">
+        <Flex auto column align="center" justify="center">
+          {this.isUploading && <LoadingIndicator />}
+          <AvatarEditorContainer>
+            <AvatarEditor
+              ref={this.avatarEditorRef}
+              image={this.file}
+              width={250}
+              height={250}
+              border={25}
+              borderRadius={this.props.borderRadius}
+              color={
+                ui.theme === "light" ? [255, 255, 255, 0.6] : [0, 0, 0, 0.6]
+              } // RGBA
+              scale={this.zoom}
+              rotate={0}
+            />
+          </AvatarEditorContainer>
+          <RangeInput
+            type="range"
+            min="0.1"
+            max="2"
+            step="0.01"
+            defaultValue="1"
+            onChange={this.handleZoom}
           />
-        </AvatarEditorContainer>
-        <RangeInput
-          type="range"
-          min="0.1"
-          max="2"
-          step="0.01"
-          defaultValue="1"
-          onChange={handleZoom}
-        />
-        <br />
-        <ButtonLarge fullwidth onClick={handleCrop} disabled={isUploading}>
-          {isUploading ? `${t(`Uploading`)}…` : submitText}
-        </ButtonLarge>
-      </Flex>
-    </Modal>
-  );
-
-  if (isCropping && file) {
-    return renderCropping();
+          <CropButton onClick={this.handleCrop} disabled={this.isUploading}>
+            {this.isUploading ? "Uploading…" : submitText}
+          </CropButton>
+        </Flex>
+      </Modal>
+    );
   }
 
-  return (
-    <Dropzone
-      accept={AttachmentValidation.avatarContentTypes.join(", ")}
-      onDropAccepted={onDropAccepted}
-    >
-      {({ getRootProps, getInputProps }) => (
-        <div {...getRootProps()}>
-          <input {...getInputProps()} />
-          {children}
-        </div>
-      )}
-    </Dropzone>
-  );
-};
+  render() {
+    if (this.isCropping) {
+      return this.renderCropping();
+    }
+
+    return (
+      <Dropzone
+        accept={AttachmentValidation.avatarContentTypes.join(", ")}
+        onDropAccepted={this.onDropAccepted}
+      >
+        {({ getRootProps, getInputProps }) => (
+          <div {...getRootProps()}>
+            <input {...getInputProps()} />
+            {this.props.children}
+          </div>
+        )}
+      </Dropzone>
+    );
+  }
+}
 
 const AvatarEditorContainer = styled(Flex)`
   margin-bottom: 30px;
@@ -176,4 +180,8 @@ const RangeInput = styled.input`
   }
 `;
 
-export default observer(ImageUpload);
+const CropButton = styled(Button)`
+  width: 300px;
+`;
+
+export default withStores(ImageUpload);

app/scenes/Settings/components/ImportListItem.tsx

@@ -5,12 +5,12 @@ import React from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import { useTheme } from "styled-components";
-import Spinner from "@shared/components/Spinner";
 import { ImportState } from "@shared/types";
 import Import from "~/models/Import";
 import { Action } from "~/components/Actions";
 import ConfirmationDialog from "~/components/ConfirmationDialog";
 import ListItem from "~/components/List/Item";
+import Spinner from "~/components/Spinner";
 import Time from "~/components/Time";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import useStores from "~/hooks/useStores";

app/scenes/Settings/components/ImportNotionDialog.tsx

@@ -0,0 +1,36 @@
+import * as React from "react";
+import { Trans, useTranslation } from "react-i18next";
+import { FileOperationFormat } from "@shared/types";
+import useStores from "~/hooks/useStores";
+import DropToImport from "./DropToImport";
+import HelpDisclosure from "./HelpDisclosure";
+
+function ImportNotionDialog() {
+  const { t } = useTranslation();
+  const { dialogs } = useStores();
+
+  return (
+    <>
+      <HelpDisclosure title={<Trans>Where do I find the file?</Trans>}>
+        <Trans
+          defaults="In Notion, click <em>Settings & Members</em> in the left sidebar and open Settings. Look for the Export section, and click <em>Export all workspace content</em>. Choose <em>HTML</em> as the format for the best data compatability."
+          components={{
+            em: <strong />,
+          }}
+        />
+      </HelpDisclosure>
+      <DropToImport
+        onSubmit={dialogs.closeAllModals}
+        format={FileOperationFormat.Notion}
+      >
+        <>
+          {t(
+            `Drag and drop the zip file from Notion's HTML export option, or click to upload`
+          )}
+        </>
+      </DropToImport>
+    </>
+  );
+}
+
+export default ImportNotionDialog;

app/stores/AuthStore.ts

@@ -306,7 +306,7 @@ export default class AuthStore extends Store<Team> {
     // if this logout was forced from an authenticated route then
     // save the current path so we can go back there once signed in
     if (savePath) {
-      setPostLoginPath(window.location.pathname + window.location.search);
+      setPostLoginPath(window.location.pathname);
     }
 
     if (tryRevokingToken) {

app/stores/RootStore.ts

@@ -26,7 +26,6 @@ import SharesStore from "./SharesStore";
 import StarsStore from "./StarsStore";
 import SubscriptionsStore from "./SubscriptionsStore";
 import UiStore from "./UiStore";
-import UnfurlsStore from "./UnfurlsStore";
 import UserMembershipsStore from "./UserMembershipsStore";
 import UsersStore from "./UsersStore";
 import ViewsStore from "./ViewsStore";
@@ -56,7 +55,6 @@ export default class RootStore {
   searches: SearchesStore;
   shares: SharesStore;
   ui: UiStore;
-  unfurls: UnfurlsStore;
   stars: StarsStore;
   subscriptions: SubscriptionsStore;
   users: UsersStore;
@@ -87,7 +85,6 @@ export default class RootStore {
     this.registerStore(SharesStore);
     this.registerStore(StarsStore);
     this.registerStore(SubscriptionsStore);
-    this.registerStore(UnfurlsStore);
     this.registerStore(UsersStore);
     this.registerStore(ViewsStore);
     this.registerStore(FileOperationsStore);

app/stores/UnfurlsStore.ts

@@ -1,85 +0,0 @@
-import { subMinutes } from "date-fns";
-import { action } from "mobx";
-import { UnfurlResourceType } from "@shared/types";
-import Unfurl from "~/models/Unfurl";
-import { client } from "~/utils/ApiClient";
-import Logger from "~/utils/Logger";
-import RootStore from "./RootStore";
-import Store from "./base/Store";
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-class UnfurlsStore extends Store<Unfurl<any>> {
-  actions = []; // no default actions allowed for unfurls.
-
-  constructor(rootStore: RootStore) {
-    super(rootStore, Unfurl);
-  }
-
-  fetchUnfurl = async <UnfurlType extends UnfurlResourceType>({
-    url,
-    documentId,
-  }: {
-    url: string;
-    documentId?: string;
-  }): Promise<Unfurl<UnfurlType> | undefined> => {
-    const unfurl = this.get(url);
-
-    if (unfurl) {
-      this.refetch({ unfurl: unfurl as Unfurl<UnfurlType>, documentId });
-      return unfurl;
-    }
-
-    return this.unfurl<UnfurlType>({ url, documentId });
-  };
-
-  private refetch = <UnfurlType extends UnfurlResourceType>({
-    unfurl,
-    documentId,
-  }: {
-    unfurl: Unfurl<UnfurlType>;
-    documentId?: string;
-  }) => {
-    const fiveMinutesAgo = subMinutes(new Date(), 5);
-
-    if (new Date(unfurl.fetchedAt) < fiveMinutesAgo) {
-      void this.unfurl({ url: unfurl.id, documentId });
-    }
-  };
-
-  @action
-  private unfurl = async <UnfurlType extends UnfurlResourceType>({
-    url,
-    documentId,
-  }: {
-    url: string;
-    documentId?: string;
-  }): Promise<Unfurl<UnfurlType> | undefined> => {
-    try {
-      this.isFetching = true;
-
-      const data = await client.post("/urls.unfurl", {
-        url,
-        documentId,
-      });
-
-      // unfurls can succeed with no data.
-      if (!data) {
-        return;
-      }
-
-      return this.add({
-        id: url,
-        type: data.type,
-        fetchedAt: new Date().toISOString(),
-        data,
-      } as Unfurl<UnfurlType>);
-    } catch (err) {
-      Logger.error(`Failed to unfurl url ${url}`, err);
-      return;
-    } finally {
-      this.isFetching = false;
-    }
-  };
-}
-
-export default UnfurlsStore;

app/stores/base/Store.ts

@@ -1,6 +1,5 @@
 import commandScore from "command-score";
 import invariant from "invariant";
-// eslint-disable-next-line lodash/import-scope
 import type { ObjectIterateeCustom } from "lodash";
 import deburr from "lodash/deburr";
 import filter from "lodash/filter";

app/utils/mention.ts

@@ -1,58 +0,0 @@
-import {
-  IntegrationService,
-  IntegrationSettings,
-  IntegrationType,
-  MentionType,
-} from "@shared/types";
-import Integration from "~/models/Integration";
-
-export const isURLMentionable = ({
-  url,
-  integration,
-}: {
-  url: URL;
-  integration: Integration;
-}): boolean => {
-  const { hostname, pathname } = url;
-  const pathParts = pathname.split("/");
-
-  switch (integration.service) {
-    case IntegrationService.GitHub: {
-      const settings =
-        integration.settings as IntegrationSettings<IntegrationType.Embed>;
-
-      return (
-        hostname === "github.com" &&
-        settings.github?.installation.account.name === pathParts[1] // ensure installed org/account name matches with the provided url.
-      );
-    }
-
-    default:
-      return false;
-  }
-};
-
-export const determineMentionType = ({
-  url,
-  integration,
-}: {
-  url: URL;
-  integration: Integration;
-}): MentionType | undefined => {
-  const { pathname } = url;
-  const pathParts = pathname.split("/");
-
-  switch (integration.service) {
-    case IntegrationService.GitHub: {
-      const type = pathParts[3];
-      return type === "pull"
-        ? MentionType.PullRequest
-        : type === "issues"
-        ? MentionType.Issue
-        : undefined;
-    }
-
-    default:
-      return;
-  }
-};

app/utils/urls.ts

@@ -49,10 +49,8 @@ export function redirectTo(url: string) {
 /**
  * Check if the path is a valid path for redirect after login.
  *
- * @param input A path potentially including query string
+ * @param path
  * @returns boolean indicating if the path is a valid redirect
  */
-export const isAllowedLoginRedirect = (input: string) => {
-  const path = input.split("?")[0];
-  return !["/", "/create", "/home", "/logout", "/auth/"].includes(path);
-};
+export const isAllowedLoginRedirect = (path: string) =>
+  !["/", "/create", "/home", "/logout", "/auth/"].includes(path);

package.json

@@ -48,11 +48,11 @@
     "> 0.25%, not dead"
   ],
   "dependencies": {
-    "@aws-sdk/client-s3": "3.782.0",
-    "@aws-sdk/lib-storage": "3.782.0",
-    "@aws-sdk/s3-presigned-post": "3.782.0",
-    "@aws-sdk/s3-request-presigner": "3.782.0",
-    "@aws-sdk/signature-v4-crt": "^3.782.0",
+    "@aws-sdk/client-s3": "3.774.0",
+    "@aws-sdk/lib-storage": "3.774.0",
+    "@aws-sdk/s3-presigned-post": "3.774.0",
+    "@aws-sdk/s3-request-presigner": "3.774.0",
+    "@aws-sdk/signature-v4-crt": "^3.774.0",
     "@babel/core": "^7.26.10",
     "@babel/plugin-proposal-decorators": "^7.25.9",
     "@babel/plugin-transform-class-properties": "^7.25.9",
@@ -89,7 +89,7 @@
     "@sentry/node": "^7.120.3",
     "@sentry/react": "^7.120.3",
     "@tanstack/react-table": "^8.20.6",
-    "@tanstack/react-virtual": "^3.13.6",
+    "@tanstack/react-virtual": "^3.11.3",
     "@tippyjs/react": "^4.2.6",
     "@types/form-data": "^2.5.2",
     "@types/mailparser": "^3.4.5",
@@ -141,7 +141,7 @@
     "jszip": "^3.10.1",
     "katex": "^0.16.21",
     "kbar": "0.1.0-beta.41",
-    "koa": "^2.16.1",
+    "koa": "^2.15.4",
     "koa-body": "^6.0.1",
     "koa-compress": "^5.1.1",
     "koa-helmet": "^6.1.0",
@@ -153,7 +153,7 @@
     "koa-useragent": "^4.1.0",
     "lodash": "^4.17.21",
     "mailparser": "^3.7.2",
-    "mammoth": "^1.9.0",
+    "mammoth": "^1.8.0",
     "markdown-it": "^13.0.2",
     "markdown-it-container": "^3.0.0",
     "markdown-it-emoji": "^2.0.0",
@@ -183,10 +183,10 @@
     "prosemirror-dropcursor": "^1.8.1",
     "prosemirror-gapcursor": "^1.3.2",
     "prosemirror-history": "^1.4.1",
-    "prosemirror-inputrules": "^1.5.0",
+    "prosemirror-inputrules": "^1.4.0",
     "prosemirror-keymap": "^1.2.2",
-    "prosemirror-markdown": "^1.13.2",
-    "prosemirror-model": "^1.25.0",
+    "prosemirror-markdown": "^1.13.1",
+    "prosemirror-model": "^1.24.0",
     "prosemirror-schema-list": "^1.4.1",
     "prosemirror-state": "^1.4.3",
     "prosemirror-tables": "^1.6.4",
@@ -232,7 +232,7 @@
     "socket.io": "^4.8.1",
     "socket.io-client": "^4.8.1",
     "socket.io-redis": "^6.1.1",
-    "sonner": "^1.7.4",
+    "sonner": "^1.7.1",
     "stoppable": "^1.1.0",
     "string-replace-to-array": "^2.1.1",
     "styled-components": "^5.3.11",
@@ -248,7 +248,7 @@
     "uuid": "^8.3.2",
     "validator": "13.12.0",
     "vaul": "^1.1.2",
-    "vite": "^5.4.18",
+    "vite": "^5.4.15",
     "vite-plugin-pwa": "^0.20.3",
     "winston": "^3.17.0",
     "ws": "^7.5.10",
@@ -263,7 +263,7 @@
     "@babel/cli": "^7.27.0",
     "@babel/preset-typescript": "^7.27.0",
     "@faker-js/faker": "^8.4.1",
-    "@relative-ci/agent": "^4.3.0",
+    "@relative-ci/agent": "^4.2.14",
     "@testing-library/react": "^12.0.0",
     "@types/addressparser": "^1.0.3",
     "@types/body-scroll-lock": "^3.1.2",
@@ -296,7 +296,7 @@
     "@types/markdown-it-emoji": "^2.0.4",
     "@types/mime-types": "^2.1.4",
     "@types/natural-sort": "^0.0.24",
-    "@types/node": "20.17.30",
+    "@types/node": "20.17.27",
     "@types/node-fetch": "^2.6.9",
     "@types/nodemailer": "^6.4.17",
     "@types/passport-oauth2": "^1.4.17",
@@ -377,5 +377,5 @@
     "rollup": "^4.5.1",
     "prismjs": "1.30.0"
   },
-  "version": "0.83.0"
-}
+  "version": "0.82.0"
+}

plugins/discord/server/auth/discord.ts

@@ -94,7 +94,7 @@ if (env.DISCORD_CLIENT_ID && env.DISCORD_CLIENT_SECRET) {
 
           /** Default user and team names metadata */
           let userName = profile.username;
-          let teamName;
+          let teamName = "Wiki";
           let userAvatarUrl: string = `https://cdn.discordapp.com/avatars/${profile.id}/${profile.avatar}.png`;
           let teamAvatarUrl: string | undefined = undefined;
           let subdomain = slugifyDomain(domain);

plugins/github/client/index.tsx

@@ -13,9 +13,4 @@ PluginManager.add([
       component: React.lazy(() => import("./Settings")),
     },
   },
-  {
-    ...config,
-    type: Hook.Icon,
-    value: Icon,
-  },
 ]);

plugins/github/server/GitHubIssueProvider.ts

@@ -1,81 +0,0 @@
-import { Endpoints } from "@octokit/types";
-import Logger from "@server/logging/Logger";
-import { Integration, User } from "@server/models";
-import { CreateIssueResponse } from "@server/types";
-import { BaseIssueProvider } from "@server/utils/IssueProvider";
-import { IssueSource } from "@shared/schema";
-import {
-  IntegrationService,
-  IntegrationType,
-  UnfurlResourceType,
-} from "@shared/types";
-import { GitHub } from "./github";
-
-// This is needed to account for Octokit paginate response type mismatch.
-type ReposForInstallation =
-  Endpoints["GET /installation/repositories"]["response"]["data"]["repositories"];
-
-export class GitHubIssueProvider extends BaseIssueProvider {
-  constructor() {
-    super(IntegrationService.GitHub);
-  }
-
-  async fetchSources(
-    integration: Integration<IntegrationType.Embed>
-  ): Promise<IssueSource[]> {
-    const client = await GitHub.authenticateAsInstallation(
-      integration.settings.github!.installation.id
-    );
-
-    const repos =
-      (await client.requestRepos()) as unknown as ReposForInstallation;
-
-    const sources = repos.map<IssueSource>((repo) => ({
-      id: String(repo.id),
-      name: repo.name,
-      owner: { id: String(repo.owner.id), name: repo.owner.login },
-      service: IntegrationService.GitHub,
-    }));
-
-    return sources;
-  }
-
-  async createIssue(
-    title: string,
-    source: IssueSource,
-    actor: User
-  ): Promise<CreateIssueResponse | undefined> {
-    const integration = (await Integration.findOne({
-      where: {
-        service: IntegrationService.GitHub,
-        teamId: actor.teamId,
-        "settings.github.installation.account.name": source.owner.name,
-      },
-    })) as Integration<IntegrationType.Embed> | undefined;
-
-    if (!integration) {
-      return;
-    }
-
-    try {
-      const client = await GitHub.authenticateAsInstallation(
-        integration.settings.github!.installation.id
-      );
-
-      const { data } = await client.createIssue({
-        owner: source.owner.name,
-        repo: source.name,
-        title,
-      });
-
-      return {
-        ...data,
-        type: UnfurlResourceType.Issue,
-        cacheKey: data.html_url,
-      };
-    } catch (err) {
-      Logger.warn("Failed to create issue in GitHub", err);
-      return;
-    }
-  }
-}

plugins/github/server/api/github.ts

@@ -2,7 +2,6 @@ import Router from "koa-router";
 import find from "lodash/find";
 import { IntegrationService, IntegrationType } from "@shared/types";
 import { parseDomain } from "@shared/utils/domains";
-import { createContext } from "@server/context";
 import Logger from "@server/logging/Logger";
 import auth from "@server/middlewares/authentication";
 import { transaction } from "@server/middlewares/transaction";
@@ -89,27 +88,30 @@ router.get(
       },
       { transaction }
     );
-    await Integration.createWithCtx(createContext({ user, transaction }), {
-      service: IntegrationService.GitHub,
-      type: IntegrationType.Embed,
-      userId: user.id,
-      teamId: user.teamId,
-      authenticationId: authentication.id,
-      settings: {
-        github: {
-          installation: {
-            id: installationId!,
-            account: {
-              id: installation.account?.id,
-              name:
-                // @ts-expect-error Property 'login' does not exist on type
-                installation.account?.login,
-              avatarUrl: installation.account?.avatar_url,
+    await Integration.create(
+      {
+        service: IntegrationService.GitHub,
+        type: IntegrationType.Embed,
+        userId: user.id,
+        teamId: user.teamId,
+        authenticationId: authentication.id,
+        settings: {
+          github: {
+            installation: {
+              id: installationId!,
+              account: {
+                id: installation.account?.id,
+                name:
+                  // @ts-expect-error Property 'login' does not exist on type
+                  installation.account?.login,
+                avatarUrl: installation.account?.avatar_url,
+              },
             },
           },
         },
       },
-    });
+      { transaction }
+    );
     ctx.redirect(GitHubUtils.url);
   }
 );

plugins/github/server/github.ts

@@ -40,32 +40,6 @@ const requestPlugin = (octokit: Octokit) => ({
       },
     }),
 
-  requestRepos: () =>
-    octokit.paginate(octokit.rest.apps.listReposAccessibleToInstallation, {
-      headers: {
-        Accept: "application/vnd.github+json",
-        "X-GitHub-Api-Version": "2022-11-28",
-      },
-    }),
-
-  createIssue: async ({
-    owner,
-    repo,
-    title,
-  }: {
-    owner: string;
-    repo: string;
-    title: string;
-  }) =>
-    octokit.request(`POST /repos/{owner}/{repo}/issues`, {
-      owner,
-      repo,
-      title,
-      headers: {
-        Accept: "application/vnd.github.text+json",
-        "X-GitHub-Api-Version": "2022-11-28",
-      },
-    }),
   /**
    * Fetches app installations accessible to the user
    *

plugins/github/server/index.ts

@@ -1,8 +1,6 @@
-import { IntegrationService } from "@shared/types";
 import { Minute } from "@shared/utils/time";
 import { PluginManager, Hook } from "@server/utils/PluginManager";
 import config from "../plugin.json";
-import { GitHubIssueProvider } from "./GitHubIssueProvider";
 import router from "./api/github";
 import env from "./env";
 import { GitHub } from "./github";
@@ -26,10 +24,6 @@ if (enabled) {
       type: Hook.UnfurlProvider,
       value: { unfurl: GitHub.unfurl, cacheExpiry: Minute.seconds },
     },
-    {
-      type: Hook.IssueProvider,
-      value: new GitHubIssueProvider(),
-    },
     {
       type: Hook.Uninstall,
       value: uninstall,

plugins/notion/server/tasks/NotionAPIImportTask.ts

@@ -1,8 +1,6 @@
-import { APIResponseError, APIErrorCode } from "@notionhq/client";
 import { ImportTaskInput, ImportTaskOutput } from "@shared/schema";
 import { IntegrationService, ProsemirrorDoc } from "@shared/types";
 import { ProsemirrorHelper } from "@shared/utils/ProsemirrorHelper";
-import Logger from "@server/logging/Logger";
 import { Integration } from "@server/models";
 import ImportTask from "@server/models/ImportTask";
 import APIImportTask, {
@@ -41,10 +39,7 @@ export default class NotionAPIImportTask extends APIImportTask<IntegrationServic
       importTask.input.map(async (item) => this.processPage({ item, client }))
     );
 
-    // Filter out any null results (from pages/databases that couldn't be accessed)
-    const validParsedPages = parsedPages.filter(Boolean) as ParsePageOutput[];
-
-    const taskOutput: ImportTaskOutput = validParsedPages.map((parsedPage) => ({
+    const taskOutput: ImportTaskOutput = parsedPages.map((parsedPage) => ({
       externalId: parsedPage.externalId,
       title: parsedPage.title,
       emoji: parsedPage.emoji,
@@ -55,7 +50,7 @@ export default class NotionAPIImportTask extends APIImportTask<IntegrationServic
     }));
 
     const childTasksInput: ImportTaskInput<IntegrationService.Notion> =
-      validParsedPages.flatMap((parsedPage) =>
+      parsedPages.flatMap((parsedPage) =>
         parsedPage.children.map((childPage) => ({
           type: childPage.type,
           externalId: childPage.externalId,
@@ -93,55 +88,36 @@ export default class NotionAPIImportTask extends APIImportTask<IntegrationServic
   }: {
     item: ImportTaskInput<IntegrationService.Notion>[number];
     client: NotionClient;
-  }): Promise<ParsePageOutput | null> {
+  }): Promise<ParsePageOutput> {
     const collectionExternalId = item.collectionExternalId ?? item.externalId;
 
-    try {
-      // Convert Notion database to an empty page with "pages in database" as its children.
-      if (item.type === PageType.Database) {
-        const { pages, ...databaseInfo } = await client.fetchDatabase(
-          item.externalId
-        );
-
-        return {
-          ...databaseInfo,
-          externalId: item.externalId,
-          content: ProsemirrorHelper.getEmptyDocument() as ProsemirrorDoc,
-          collectionExternalId,
-          children: pages.map((page) => ({
-            type: page.type,
-            externalId: page.id,
-          })),
-        };
-      }
-
-      const { blocks, ...pageInfo } = await client.fetchPage(item.externalId);
+    // Convert Notion database to an empty page with "pages in database" as its children.
+    if (item.type === PageType.Database) {
+      const { pages, ...databaseInfo } = await client.fetchDatabase(
+        item.externalId
+      );
 
       return {
-        ...pageInfo,
+        ...databaseInfo,
         externalId: item.externalId,
-        content: NotionConverter.page({ children: blocks } as NotionPage),
+        content: ProsemirrorHelper.getEmptyDocument() as ProsemirrorDoc,
         collectionExternalId,
-        children: this.parseChildPages(blocks),
+        children: pages.map((page) => ({
+          type: page.type,
+          externalId: page.id,
+        })),
       };
-    } catch (error) {
-      if (error instanceof APIResponseError) {
-        // Skip this page/database if it's not found or not accessible
-        if (
-          error.code === APIErrorCode.ObjectNotFound ||
-          error.code === APIErrorCode.Unauthorized
-        ) {
-          Logger.warn(
-            `Skipping Notion ${
-              item.type === PageType.Database ? "database" : "page"
-            } ${item.externalId} - Error code: ${error.code} - ${error.message}`
-          );
-          return null;
-        }
-      }
-      // Re-throw other errors to be handled by the parent try/catch
-      throw error;
     }
+
+    const { blocks, ...pageInfo } = await client.fetchPage(item.externalId);
+
+    return {
+      ...pageInfo,
+      externalId: item.externalId,
+      content: NotionConverter.page({ children: blocks } as NotionPage),
+      collectionExternalId,
+      children: this.parseChildPages(blocks),
+    };
   }
 
   /**

server/collaboration/ConnectionLimitExtension.test.ts

@@ -1,109 +0,0 @@
-import { Server } from "@hocuspocus/server";
-import WebSocket from "ws";
-import EDITOR_VERSION from "@shared/editor/version";
-import { sleep } from "@server/utils/timers";
-import { ConnectionLimitExtension } from "./ConnectionLimitExtension";
-import { EditorVersionExtension } from "./EditorVersionExtension";
-
-jest.mock("@server/env", () => ({
-  COLLABORATION_MAX_CLIENTS_PER_DOCUMENT: 2,
-}));
-
-describe("ConnectionLimitExtension", () => {
-  let server: typeof Server;
-  let extension: ConnectionLimitExtension;
-  const port = 12345;
-  const url = `ws://localhost:${port}`;
-  const documentName = "test";
-
-  beforeEach(async () => {
-    extension = new ConnectionLimitExtension();
-    server = Server.configure({
-      port,
-      extensions: [extension, new EditorVersionExtension()],
-    });
-    await server.listen();
-  });
-
-  afterEach(async () => {
-    await server.destroy();
-  });
-
-  const getConnections = () =>
-    extension.connectionsByDocument.get(documentName)?.size ?? 0;
-
-  const createWebSocket = (editorVersion = EDITOR_VERSION) =>
-    new Promise<WebSocket>((resolve, reject) => {
-      const ws = new WebSocket(
-        `${url}/${documentName}?editorVersion=${editorVersion}`
-      );
-      ws.on("open", () => resolve(ws));
-      ws.on("error", reject);
-    });
-
-  it("should allow connections within limit", async () => {
-    const ws1 = await createWebSocket();
-    const ws2 = await createWebSocket();
-
-    expect(ws1.readyState).toBe(WebSocket.OPEN);
-    expect(ws2.readyState).toBe(WebSocket.OPEN);
-    expect(getConnections()).toBe(2);
-
-    ws1.close();
-    ws2.close();
-
-    await sleep(250);
-    expect(getConnections()).toBe(0);
-  });
-
-  it("should close connections exceeding limit", async () => {
-    const ws1 = await createWebSocket();
-    const ws2 = await createWebSocket();
-
-    const ws3 = await createWebSocket();
-    await sleep(250);
-
-    expect(ws3.readyState).toBe(WebSocket.CLOSED);
-    expect(ws2.readyState).toBe(WebSocket.OPEN);
-    expect(ws1.readyState).toBe(WebSocket.OPEN);
-    expect(getConnections()).toBe(2);
-
-    ws1.close();
-    ws2.close();
-
-    await sleep(250);
-    expect(getConnections()).toBe(0);
-  });
-
-  it("should handle connections closed by other extensions", async () => {
-    const ws1 = await createWebSocket();
-
-    // Create a connection that will be closed by the EditorVersionExtension
-    const ws2 = await createWebSocket("1.0.0");
-
-    ws1.close();
-    ws2.close();
-
-    await sleep(250);
-    expect(getConnections()).toBe(0);
-  });
-
-  it("should allow new connection after disconnect", async () => {
-    const ws1 = await createWebSocket();
-    const ws2 = await createWebSocket();
-
-    ws1.close();
-    await sleep(250);
-    expect(getConnections()).toBe(1);
-
-    const ws3 = await createWebSocket();
-    expect(ws3.readyState).toBe(WebSocket.OPEN);
-    expect(getConnections()).toBe(2);
-
-    ws2.close();
-    ws3.close();
-
-    await sleep(250);
-    expect(getConnections()).toBe(0);
-  });
-});

server/collaboration/ConnectionLimitExtension.ts

@@ -1,10 +1,8 @@
 import {
   Extension,
-  connectedPayload,
   onConnectPayload,
   onDisconnectPayload,
 } from "@hocuspocus/server";
-import pluralize from "pluralize";
 import { TooManyConnections } from "@shared/collaboration/CloseEvents";
 import env from "@server/env";
 import Logger from "@server/logging/Logger";
@@ -16,7 +14,7 @@ export class ConnectionLimitExtension implements Extension {
   /**
    * Map of documentId -> connection count
    */
-  public connectionsByDocument: Map<string, Set<string>> = new Map();
+  connectionsByDocument: Map<string, Set<string>> = new Map();
 
   /**
    * On disconnect hook
@@ -36,30 +34,23 @@ export class ConnectionLimitExtension implements Extension {
       }
     }
 
-    const connectionCount = connections?.size ?? 0;
     Logger.debug(
       "multiplayer",
-      `${connectionCount} ${pluralize(
-        "connection",
-        connectionCount
-      )} to "${documentName}"`
+      `${connections?.size} connections to "${documentName}"`
     );
 
     return Promise.resolve();
   }
 
   /**
-   * onConnect hook is called when a new connection has been established.
-   * This is where we can check if the document has reached the maximum number of
-   * connections and reject the connection if it has.
+   * On connect hook
    *
-   * @param data The onConnect payload
-   * @returns Promise, resolving will allow the connection, rejecting will drop.
+   * @param data The connect payload
+   * @returns Promise, resolving will allow the connection, rejecting will drop it
    */
-  onConnect({ documentName }: withContext<onConnectPayload>) {
+  onConnect({ documentName, socketId }: withContext<onConnectPayload>) {
     const connections =
       this.connectionsByDocument.get(documentName) || new Set();
-
     if (connections?.size >= env.COLLABORATION_MAX_CLIENTS_PER_DOCUMENT) {
       Logger.info(
         "multiplayer",
@@ -70,30 +61,12 @@ export class ConnectionLimitExtension implements Extension {
       return Promise.reject(TooManyConnections);
     }
 
-    return Promise.resolve();
-  }
-
-  /**
-   * Connected hook is called after a new connection has been established.
-   * We can safely update the connection count for the document.
-   *
-   * @param data The onConnect payload
-   * @returns Promise
-   */
-  connected({ documentName, socketId }: withContext<connectedPayload>) {
-    const connections =
-      this.connectionsByDocument.get(documentName) || new Set();
-
     connections.add(socketId);
     this.connectionsByDocument.set(documentName, connections);
-    const connectionCount = connections.size ?? 0;
 
     Logger.debug(
       "multiplayer",
-      `${connectionCount} ${pluralize(
-        "connection",
-        connectionCount
-      )} to "${documentName}"`
+      `${connections.size} connections to "${documentName}"`
     );
 
     return Promise.resolve();

server/commands/accountProvisioner.test.ts

@@ -264,6 +264,7 @@ describe("accountProvisioner", () => {
             avatarUrl: faker.internet.avatar(),
           },
           team: {
+            name: existingTeam.name,
             avatarUrl: existingTeam.avatarUrl,
             subdomain: faker.internet.domainWord(),
           },
@@ -307,6 +308,7 @@ describe("accountProvisioner", () => {
           avatarUrl: faker.internet.avatar(),
         },
         team: {
+          name: team.name,
           avatarUrl: team.avatarUrl,
           subdomain: faker.internet.domainWord(),
         },

server/commands/accountProvisioner.ts

@@ -43,7 +43,7 @@ type Props = {
      */
     teamId?: string;
     /** The displayed name of the team */
-    name?: string;
+    name: string;
     /** The domain name from the email of the user logging in */
     domain?: string;
     /** The preferred subdomain to provision for the team if not yet created */
@@ -92,7 +92,6 @@ async function accountProvisioner({
 
   try {
     result = await teamProvisioner({
-      name: "Wiki",
       ...teamParams,
       authenticationProvider: authenticationProviderParams,
       ip,

server/commands/teamCreator.ts

@@ -3,6 +3,7 @@ import slugify from "slugify";
 import { RESERVED_SUBDOMAINS } from "@shared/utils/domains";
 import { traceFunction } from "@server/logging/tracing";
 import { Team, Event } from "@server/models";
+import { generateAvatarUrl } from "@server/utils/avatars";
 
 type Props = {
   /** The displayed name of the team */
@@ -28,14 +29,20 @@ type Props = {
 
 async function teamCreator({
   name,
+  domain,
   subdomain,
   avatarUrl,
   authenticationProviders,
   ip,
   transaction,
 }: Props): Promise<Team> {
-  if (!avatarUrl?.startsWith("http")) {
-    avatarUrl = null;
+  // If the service did not provide a logo/avatar then we attempt to generate
+  // one via ClearBit, or fallback to colored initials in worst case scenario
+  if (!avatarUrl || !avatarUrl.startsWith("http")) {
+    avatarUrl = await generateAvatarUrl({
+      domain,
+      id: subdomain,
+    });
   }
 
   const team = await Team.create(

server/commands/userProvisioner.test.ts

@@ -192,7 +192,7 @@ describe("userProvisioner", () => {
 
   it("should prefer isAdmin argument over defaultUserRole", async () => {
     const team = await buildTeam({
-      defaultUserRole: UserRole.Viewer,
+      defaultUserRole: "viewer",
     });
     const authenticationProviders = await team.$get("authenticationProviders");
     const authenticationProvider = authenticationProviders[0];

server/emails/templates/DocumentPublishedOrUpdatedEmail.tsx

@@ -86,8 +86,7 @@ export default class DocumentPublishedOrUpdatedEmail extends BaseEmail<
           }
           return;
         },
-        30,
-        10000
+        30
       );
     }
 

server/migrations/20250408192616-add-issueSources-to-integrations.js

@@ -1,15 +0,0 @@
-"use strict";
-
-/** @type {import('sequelize-cli').Migration} */
-module.exports = {
-  async up(queryInterface, Sequelize) {
-    queryInterface.addColumn("integrations", "issueSources", {
-      type: Sequelize.JSONB,
-      allowNull: true,
-    });
-  },
-
-  async down(queryInterface, Sequelize) {
-    queryInterface.removeColumn("integrations", "issueSources");
-  },
-};

server/models/Document.test.ts

@@ -11,7 +11,6 @@ import {
   buildUser,
   buildGuestUser,
 } from "@server/test/factories";
-import Collection from "./Collection";
 import UserMembership from "./UserMembership";
 
 beforeEach(() => {
@@ -79,34 +78,6 @@ describe("#delete", () => {
     expect(newDocument?.deletedAt).toBeTruthy();
   });
 
-  test("should soft delete archived document in an archived collection", async () => {
-    const user = await buildUser();
-    const collection = await buildCollection({
-      archivedAt: new Date(),
-      createdById: user.id,
-      teamId: user.teamId,
-    });
-    const document = await buildDocument({
-      archivedAt: new Date(),
-      collectionId: collection.id,
-      userId: user.id,
-      teamId: user.teamId,
-    });
-    await collection.addDocumentToStructure(document, 0);
-
-    await document.delete(user);
-    const [newDocument, newCollection] = await Promise.all([
-      Document.findByPk(document.id, {
-        paranoid: false,
-      }),
-      Collection.findByPk(collection.id),
-    ]);
-
-    expect(newDocument?.lastModifiedById).toEqual(user.id);
-    expect(newDocument?.deletedAt).toBeTruthy();
-    expect(newCollection?.documentStructure).toEqual([]);
-  });
-
   it("should delete draft without collection", async () => {
     const user = await buildUser();
     const document = await buildDraftDocument();

server/models/Document.ts

@@ -1112,26 +1112,18 @@ class Document extends ArchivableModel<
   // Delete a document, archived or otherwise.
   delete = (user: User) =>
     this.sequelize.transaction(async (transaction: Transaction) => {
-      let deleted = false;
-
-      if (!this.template && this.collectionId) {
-        const collection = await Collection.findByPk(this.collectionId!, {
+      if (!this.archivedAt && !this.template && this.collectionId) {
+        // delete any children and remove from the document structure
+        const collection = await Collection.findByPk(this.collectionId, {
           transaction,
           lock: transaction.LOCK.UPDATE,
           paranoid: false,
         });
-
-        if (!this.archivedAt || (this.archivedAt && collection?.archivedAt)) {
-          await collection?.deleteDocument(this, { transaction });
-          deleted = true;
-        }
-      }
-
-      if (!deleted) {
+        await collection?.deleteDocument(this, { transaction });
+      } else {
         await this.destroy({
           transaction,
         });
-        deleted = true;
       }
 
       this.lastModifiedById = user.id;

server/models/Integration.ts

@@ -13,7 +13,6 @@ import {
   IsIn,
   AfterDestroy,
 } from "sequelize-typescript";
-import { IssueSource } from "@shared/schema";
 import { IntegrationType, IntegrationService } from "@shared/types";
 import type { IntegrationSettings } from "@shared/types";
 import Collection from "@server/models/Collection";
@@ -54,9 +53,6 @@ class Integration<T = unknown> extends ParanoidModel<
   @Column(DataType.ARRAY(DataType.STRING))
   events: string[];
 
-  @Column(DataType.JSONB)
-  issueSources: IssueSource[] | null;
-
   // associations
 
   @BelongsTo(() => User, "userId")

server/models/helpers/ProsemirrorHelper.tsx

@@ -1,18 +1,19 @@
 import { JSDOM } from "jsdom";
 import compact from "lodash/compact";
 import flatten from "lodash/flatten";
-import isMatch from "lodash/isMatch";
+import isEqual from "lodash/isEqual";
 import uniq from "lodash/uniq";
-import { Node, DOMSerializer, Fragment } from "prosemirror-model";
+import { Node, DOMSerializer, Fragment, Mark } from "prosemirror-model";
 import * as React from "react";
 import { renderToString } from "react-dom/server";
 import styled, { ServerStyleSheet, ThemeProvider } from "styled-components";
 import { prosemirrorToYDoc } from "y-prosemirror";
 import * as Y from "yjs";
 import EditorContainer from "@shared/editor/components/Styles";
+import embeds from "@shared/editor/embeds";
 import GlobalStyles from "@shared/styles/globals";
 import light from "@shared/styles/theme";
-import { MentionType, ProsemirrorData, UnfurlResponse } from "@shared/types";
+import { MentionType, ProsemirrorData } from "@shared/types";
 import { attachmentRedirectRegex } from "@shared/utils/ProsemirrorHelper";
 import parseDocumentSlug from "@shared/utils/parseDocumentSlug";
 import { isRTL } from "@shared/utils/rtl";
@@ -42,8 +43,6 @@ export type MentionAttrs = {
   modelId: string;
   actorId: string | undefined;
   id: string;
-  href?: string;
-  unfurl?: UnfurlResponse[keyof UnfurlResponse];
 };
 
 @trace()
@@ -62,7 +61,47 @@ export class ProsemirrorHelper {
       );
     }
 
-    const node = parser.parse(input);
+    let node = parser.parse(input);
+
+    // in the editor embeds are created at runtime by converting links into
+    // embeds where they match.Because we're converting to a CRDT structure on
+    //  the server we need to mimic this behavior.
+    function urlsToEmbeds(node: Node): Node {
+      if (node.type.name === "paragraph") {
+        for (const textNode of node.content.content) {
+          for (const embed of embeds) {
+            if (
+              textNode.text &&
+              textNode.marks.some(
+                (m: Mark) =>
+                  m.type.name === "link" && m.attrs.href === textNode.text
+              ) &&
+              embed.matcher(textNode.text)
+            ) {
+              return schema.nodes.embed.createAndFill({
+                href: textNode.text,
+              }) as Node;
+            }
+          }
+        }
+      }
+
+      if (node.content) {
+        const contentAsArray =
+          node.content instanceof Fragment
+            ? node.content.content
+            : node.content;
+        // @ts-expect-error content
+        node.content = Fragment.fromArray(contentAsArray.map(urlsToEmbeds));
+      }
+
+      return node;
+    }
+
+    if (node) {
+      node = urlsToEmbeds(node);
+    }
+
     return node ? prosemirrorToYDoc(node, fieldName) : new Y.Doc();
   }
 
@@ -196,7 +235,7 @@ export class ProsemirrorHelper {
       node.descendants((childNode: Node) => {
         if (
           childNode.type.name === "mention" &&
-          isMatch(childNode.attrs, mention)
+          isEqual(childNode.attrs, mention)
         ) {
           foundMention = true;
           return false;

server/policies/collection.ts

@@ -2,7 +2,7 @@ import invariant from "invariant";
 import filter from "lodash/filter";
 import { CollectionPermission } from "@shared/types";
 import { Collection, User, Team } from "@server/models";
-import { allow } from "./cancan";
+import { allow, can } from "./cancan";
 import { and, isTeamAdmin, isTeamModel, isTeamMutable, or } from "./utils";
 
 allow(User, "createCollection", Team, (actor, team) =>
@@ -67,6 +67,15 @@ allow(
   }
 );
 
+allow(User, "export", Collection, (actor, collection) =>
+  and(
+    //
+    can(actor, "read", collection),
+    !actor.isViewer,
+    !actor.isGuest
+  )
+);
+
 allow(User, "share", Collection, (user, collection) => {
   if (
     !collection ||
@@ -152,7 +161,7 @@ allow(
   }
 );
 
-allow(User, ["update", "export", "archive"], Collection, (user, collection) =>
+allow(User, ["update", "archive"], Collection, (user, collection) =>
   and(
     !!collection,
     !!collection?.isActive,

server/queues/processors/FileOperationCreatedProcessor.ts

@@ -6,6 +6,7 @@ import ExportJSONTask from "../tasks/ExportJSONTask";
 import ExportMarkdownZipTask from "../tasks/ExportMarkdownZipTask";
 import ImportJSONTask from "../tasks/ImportJSONTask";
 import ImportMarkdownZipTask from "../tasks/ImportMarkdownZipTask";
+import ImportNotionTask from "../tasks/ImportNotionTask";
 import BaseProcessor from "./BaseProcessor";
 
 export default class FileOperationCreatedProcessor extends BaseProcessor {
@@ -24,6 +25,11 @@ export default class FileOperationCreatedProcessor extends BaseProcessor {
             fileOperationId: event.modelId,
           });
           break;
+        case FileOperationFormat.Notion:
+          await ImportNotionTask.schedule({
+            fileOperationId: event.modelId,
+          });
+          break;
         case FileOperationFormat.JSON:
           await ImportJSONTask.schedule({
             fileOperationId: event.modelId,

server/queues/processors/ImportsProcessor.ts

@@ -3,12 +3,7 @@ import chunk from "lodash/chunk";
 import keyBy from "lodash/keyBy";
 import truncate from "lodash/truncate";
 import { Fragment, Node } from "prosemirror-model";
-import {
-  CreateOptions,
-  CreationAttributes,
-  Transaction,
-  UniqueConstraintError,
-} from "sequelize";
+import { CreateOptions, CreationAttributes, Transaction } from "sequelize";
 import { v4 as uuidv4 } from "uuid";
 import { randomElement } from "@shared/random";
 import { ImportInput, ImportTaskInput } from "@shared/schema";
@@ -159,59 +154,45 @@ export default abstract class ImportsProcessor<
    * @returns Promise that resolves when mapping and persistence is completed.
    */
   private async onProcessed(importModel: Import<T>, transaction: Transaction) {
-    try {
-      const { collections } = await this.createCollectionsAndDocuments({
-        importModel,
-        transaction,
-      });
+    const { collections } = await this.createCollectionsAndDocuments({
+      importModel,
+      transaction,
+    });
 
-      // Once all collections and documents are created, update collection's document structure.
-      // This ensures the root documents have the whole subtree available in the structure.
-      for (const collection of collections) {
-        await Document.unscoped().findAllInBatches<Document>(
-          {
-            where: { parentDocumentId: null, collectionId: collection.id },
-            order: [
-              ["createdAt", "DESC"],
-              ["id", "ASC"],
-            ],
-            transaction,
-          },
-          async (documents) => {
-            for (const document of documents) {
-              await collection.addDocumentToStructure(document, 0, {
-                save: false,
-                silent: true,
-                transaction,
-              });
-            }
-          }
-        );
-
-        await collection.save({ silent: true, transaction });
-      }
-
-      importModel.state = ImportState.Completed;
-      importModel.error = null; // unset any error from previous attempts.
-      await importModel.saveWithCtx(
-        createContext({
-          user: importModel.createdBy,
+    // Once all collections and documents are created, update collection's document structure.
+    // This ensures the root documents have the whole subtree available in the structure.
+    for (const collection of collections) {
+      await Document.unscoped().findAllInBatches<Document>(
+        {
+          where: { parentDocumentId: null, collectionId: collection.id },
+          order: [
+            ["createdAt", "DESC"],
+            ["id", "ASC"],
+          ],
           transaction,
-        })
-      );
-    } catch (err) {
-      if (err instanceof UniqueConstraintError) {
-        Logger.error(
-          "ImportsProcessor persistence failed due to unique constraint error",
-          err,
-          {
-            fields: err.fields,
+        },
+        async (documents) => {
+          for (const document of documents) {
+            await collection.addDocumentToStructure(document, 0, {
+              save: false,
+              silent: true,
+              transaction,
+            });
           }
-        );
-      }
+        }
+      );
 
-      throw err;
+      await collection.save({ silent: true, transaction });
     }
+
+    importModel.state = ImportState.Completed;
+    importModel.error = null; // unset any error from previous attempts.
+    await importModel.saveWithCtx(
+      createContext({
+        user: importModel.createdBy,
+        transaction,
+      })
+    );
   }
 
   /**
@@ -323,15 +304,6 @@ export default abstract class ImportsProcessor<
 
             const output = outputMap[externalId];
 
-            // Skip this item if it has no output (likely due to an error during processing)
-            if (!output) {
-              Logger.debug(
-                "processor",
-                `Skipping item with no output: ${externalId}`
-              );
-              continue;
-            }
-
             const collectionItem = importInput[externalId];
 
             const attachments = await Attachment.findAll({
@@ -472,7 +444,7 @@ export default abstract class ImportsProcessor<
     importInput: Record<string, ImportInput<any>[number]>;
     actorId: string;
   }): ProsemirrorDoc {
-    // special case when the doc content is empty.
+    // special case when the doc content is empty
     if (!content.content.length) {
       return content;
     }

server/queues/processors/IntegrationCreatedProcessor.ts

@@ -3,7 +3,6 @@ import { Integration } from "@server/models";
 import BaseProcessor from "@server/queues/processors/BaseProcessor";
 import { IntegrationEvent, Event } from "@server/types";
 import { CacheHelper } from "@server/utils/CacheHelper";
-import CacheIssueSourcesTask from "../tasks/CacheIssueSourcesTask";
 
 export default class IntegrationCreatedProcessor extends BaseProcessor {
   static applicableEvents: Event["name"][] = ["integrations.create"];
@@ -19,11 +18,6 @@ export default class IntegrationCreatedProcessor extends BaseProcessor {
       return;
     }
 
-    // Store the available issue sources in the integration record.
-    await CacheIssueSourcesTask.schedule({
-      integrationId: integration.id,
-    });
-
     // Clear the cache of unfurled data for the team as it may be stale now.
     await CacheHelper.clearData(CacheHelper.getUnfurlKey(integration.teamId));
   }

server/queues/tasks/APIImportTask.ts

@@ -170,7 +170,7 @@ export default abstract class APIImportTask<
       await importTask.save({ transaction });
 
       const associatedImport = importTask.import;
-      associatedImport.documentCount += taskOutputWithReplacements.length;
+      associatedImport.documentCount += importTask.input.length;
       await associatedImport.saveWithCtx(
         createContext({
           user: associatedImport.createdBy,

server/queues/tasks/CacheIssueSourcesTask.ts

@@ -1,35 +0,0 @@
-import { Integration } from "@server/models";
-import { sequelize } from "@server/storage/database";
-import { Hook, PluginManager } from "@server/utils/PluginManager";
-import BaseTask from "./BaseTask";
-
-const plugins = PluginManager.getHooks(Hook.IssueProvider);
-
-type Props = {
-  integrationId: string;
-};
-
-export default class CacheIssueSourcesTask extends BaseTask<Props> {
-  async perform({ integrationId }: Props) {
-    await sequelize.transaction(async (transaction) => {
-      const integration = await Integration.findByPk(integrationId, {
-        transaction,
-        lock: transaction.LOCK.UPDATE,
-      });
-      if (!integration) {
-        return;
-      }
-
-      const plugin = plugins.find(
-        (p) => p.value.service === integration.service
-      );
-      if (!plugin) {
-        return;
-      }
-
-      const sources = await plugin.value.fetchSources(integration);
-      integration.issueSources = sources;
-      await integration.save({ transaction });
-    });
-  }
-}

server/queues/tasks/ImportNotionTask.test.ts

@@ -0,0 +1,87 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
+import path from "path";
+import { FileOperation } from "@server/models";
+import { buildFileOperation } from "@server/test/factories";
+import ImportNotionTask from "./ImportNotionTask";
+
+describe("ImportNotionTask", () => {
+  it("should import successfully from a Markdown export", async () => {
+    const fileOperation = await buildFileOperation();
+    Object.defineProperty(fileOperation, "handle", {
+      get() {
+        return {
+          path: path.resolve(
+            __dirname,
+            "..",
+            "..",
+            "test",
+            "fixtures",
+            "notion-markdown.zip"
+          ),
+          cleanup: async () => {},
+        };
+      },
+    });
+    jest.spyOn(FileOperation, "findByPk").mockResolvedValue(fileOperation);
+
+    const props = {
+      fileOperationId: fileOperation.id,
+    };
+
+    const task = new ImportNotionTask();
+    const response = await task.perform(props);
+
+    expect(response.collections.size).toEqual(2);
+    expect(response.documents.size).toEqual(6);
+    expect(response.attachments.size).toEqual(1);
+
+    // Check that the image url was replaced in the text with a redirect
+    const attachments = Array.from(response.attachments.values());
+    const documents = Array.from(response.documents.values());
+    expect(documents.map((d) => d.text).join("")).toContain(
+      attachments[0].redirectUrl
+    );
+  });
+
+  it("should import successfully from a HTML export", async () => {
+    const fileOperation = await buildFileOperation();
+    Object.defineProperty(fileOperation, "handle", {
+      get() {
+        return {
+          path: path.resolve(
+            __dirname,
+            "..",
+            "..",
+            "test",
+            "fixtures",
+            "notion-html.zip"
+          ),
+          cleanup: async () => {},
+        };
+      },
+    });
+    jest.spyOn(FileOperation, "findByPk").mockResolvedValue(fileOperation);
+
+    const props = {
+      fileOperationId: fileOperation.id,
+    };
+
+    const task = new ImportNotionTask();
+    const response = await task.perform(props);
+
+    expect(response.collections.size).toEqual(2);
+    expect(response.documents.size).toEqual(6);
+    expect(response.attachments.size).toEqual(4);
+
+    // Check that the image url was replaced in the text with a redirect
+    const attachments = Array.from(response.attachments.values());
+    const attachment = attachments.find((att) =>
+      att.key.endsWith("Screen_Shot_2022-04-21_at_2.23.26_PM.png")
+    );
+
+    const documents = Array.from(response.documents.values());
+    expect(documents.map((d) => d.text).join("")).toContain(
+      attachment?.redirectUrl
+    );
+  });
+});

server/queues/tasks/ImportNotionTask.ts

@@ -0,0 +1,354 @@
+import path from "path";
+import fs from "fs-extra";
+import compact from "lodash/compact";
+import escapeRegExp from "lodash/escapeRegExp";
+import mime from "mime-types";
+import { v4 as uuidv4 } from "uuid";
+import documentImporter from "@server/commands/documentImporter";
+import { createContext } from "@server/context";
+import Logger from "@server/logging/Logger";
+import { FileOperation, User } from "@server/models";
+import { sequelize } from "@server/storage/database";
+import ImportHelper, { FileTreeNode } from "@server/utils/ImportHelper";
+import ImportTask, { StructuredImportData } from "./ImportTask";
+
+export default class ImportNotionTask extends ImportTask {
+  public async parseData(
+    dirPath: string,
+    fileOperation: FileOperation
+  ): Promise<StructuredImportData> {
+    const tree = await ImportHelper.toFileTree(dirPath);
+    if (!tree) {
+      throw new Error("Could not find valid content in zip file");
+    }
+
+    // New Notion exports have a single folder with the name of the export, we must skip this
+    // folder and go directly to the children.
+    let parsed;
+    if (
+      tree.children.length === 1 &&
+      tree.children[0].children.find((child) => child.title === "index")
+    ) {
+      parsed = await this.parseFileTree(
+        fileOperation,
+        tree.children[0].children.filter((child) => child.title !== "index")
+      );
+    } else {
+      parsed = await this.parseFileTree(fileOperation, tree.children);
+    }
+
+    if (parsed.documents.length === 0 && parsed.collections.length === 1) {
+      const collection = parsed.collections[0];
+      const collectionId = uuidv4();
+      if (collection.description) {
+        parsed.documents.push({
+          title: collection.name,
+          icon: collection.icon,
+          color: collection.color,
+          path: "",
+          text: String(collection.description),
+          id: collection.id,
+          externalId: collection.externalId,
+          mimeType: "text/html",
+          collectionId,
+        });
+      }
+
+      collection.name = "Notion";
+      collection.icon = undefined;
+      collection.color = undefined;
+      collection.externalId = undefined;
+      collection.description = undefined;
+      collection.id = collectionId;
+    }
+
+    return parsed;
+  }
+
+  /**
+   * Converts the file structure from zipAsFileTree into documents,
+   * collections, and attachments.
+   *
+   * @param fileOperation The file operation
+   * @param tree An array of FileTreeNode representing root files in the zip
+   * @returns A StructuredImportData object
+   */
+  private async parseFileTree(
+    fileOperation: FileOperation,
+    tree: FileTreeNode[]
+  ): Promise<StructuredImportData> {
+    const user = await User.findByPk(fileOperation.userId, {
+      rejectOnEmpty: true,
+    });
+
+    const output: StructuredImportData = {
+      collections: [],
+      documents: [],
+      attachments: [],
+    };
+
+    const parseNodeChildren = async (
+      children: FileTreeNode[],
+      collectionId: string,
+      parentDocumentId?: string
+    ): Promise<void> => {
+      await Promise.all(
+        children.map(async (child) => {
+          // Ignore the CSV's for databases upfront
+          if (child.path.endsWith(".csv")) {
+            return;
+          }
+
+          const id = uuidv4();
+          const match = child.title.match(this.NotionUUIDRegex);
+          const name = child.title.replace(this.NotionUUIDRegex, "");
+          const externalId = match ? match[0].trim() : undefined;
+
+          // If it's not a text file we're going to treat it as an attachment.
+          const mimeType = mime.lookup(child.name);
+          const isDocument =
+            mimeType === "text/markdown" ||
+            mimeType === "text/plain" ||
+            mimeType === "text/html";
+
+          // If it's not a document and not a folder, treat it as an attachment
+          if (!isDocument && mimeType) {
+            output.attachments.push({
+              id,
+              name: child.name,
+              path: child.path,
+              mimeType,
+              buffer: () => fs.readFile(child.path),
+              externalId,
+            });
+            return;
+          }
+
+          Logger.debug("task", `Processing ${name} as ${mimeType}`);
+
+          const { title, icon, text } = await sequelize.transaction(
+            async (transaction) =>
+              documentImporter({
+                mimeType: mimeType || "text/markdown",
+                fileName: name,
+                content:
+                  child.children.length > 0
+                    ? ""
+                    : await fs.readFile(child.path, "utf8"),
+                user,
+                ctx: createContext({ user, transaction }),
+              })
+          );
+
+          const existingDocumentIndex = output.documents.findIndex(
+            (doc) => doc.externalId === externalId
+          );
+
+          const existingDocument = output.documents[existingDocumentIndex];
+
+          // If there is an existing document with the same externalId that means
+          // we've already parsed either a folder or a file referencing the same
+          // document, as such we should merge.
+          if (existingDocument) {
+            if (existingDocument.text === "") {
+              output.documents[existingDocumentIndex].text = text;
+            }
+
+            await parseNodeChildren(
+              child.children,
+              collectionId,
+              existingDocument.id
+            );
+          } else {
+            output.documents.push({
+              id,
+              title,
+              icon,
+              text,
+              collectionId,
+              parentDocumentId,
+              path: child.path,
+              mimeType: mimeType || "text/markdown",
+              externalId,
+            });
+            await parseNodeChildren(child.children, collectionId, id);
+          }
+        })
+      );
+    };
+
+    const replaceInternalLinksAndImages = (text: string) => {
+      // Find if there are any images in this document
+      const imagesInText = this.parseImages(text);
+
+      for (const image of imagesInText) {
+        const name = path.basename(image.src);
+        const attachment = output.attachments.find(
+          (att) =>
+            att.path.endsWith(image.src) ||
+            encodeURI(att.path).endsWith(image.src)
+        );
+
+        if (!attachment) {
+          if (!image.src.startsWith("http")) {
+            Logger.info(
+              "task",
+              `Could not find referenced attachment with name ${name} and src ${image.src}`
+            );
+          }
+        } else {
+          text = text.replace(
+            new RegExp(escapeRegExp(image.src), "g"),
+            `<<${attachment.id}>>`
+          );
+        }
+      }
+
+      // With Notion's HTML import, images sometimes come wrapped in anchor tags
+      // This isn't supported in Outline's editor, so we need to strip them.
+      text = text.replace(/\[!\[([^[]+)]/g, "![]");
+
+      // Find if there are any links in this document pointing to other documents
+      const internalLinksInText = this.parseInternalLinks(text);
+
+      // For each link update to the standardized format of <<documentId>>
+      // instead of a relative or absolute URL within the original zip file.
+      for (const link of internalLinksInText) {
+        const doc = output.documents.find(
+          (doc) => doc.externalId === link.externalId
+        );
+
+        if (!doc) {
+          Logger.info(
+            "task",
+            `Could not find referenced document with externalId ${link.externalId}`
+          );
+        } else {
+          text = text.replace(link.href, `<<${doc.id}>>`);
+        }
+      }
+
+      return text;
+    };
+
+    // All nodes in the root level should become collections
+    for (const node of tree) {
+      const match = node.title.match(this.NotionUUIDRegex);
+      const name = node.title.replace(this.NotionUUIDRegex, "");
+      const externalId = match ? match[0].trim() : undefined;
+      const mimeType = mime.lookup(node.name);
+
+      const existingCollectionIndex = output.collections.findIndex(
+        (collection) => collection.externalId === externalId
+      );
+      const existingCollection = output.collections[existingCollectionIndex];
+      const collectionId = existingCollection?.id || uuidv4();
+      let description;
+
+      // Root level docs become the descriptions of collections
+      if (
+        mimeType === "text/markdown" ||
+        mimeType === "text/plain" ||
+        mimeType === "text/html"
+      ) {
+        const { text } = await sequelize.transaction(async (transaction) =>
+          documentImporter({
+            mimeType,
+            fileName: name,
+            content: await fs.readFile(node.path, "utf8"),
+            user,
+            ctx: createContext({ user, transaction }),
+          })
+        );
+
+        description = text;
+      } else if (node.children.length > 0) {
+        await parseNodeChildren(node.children, collectionId);
+      } else {
+        Logger.debug("task", `Unhandled file in zip: ${node.path}`, {
+          fileOperationId: fileOperation.id,
+        });
+        continue;
+      }
+
+      if (existingCollectionIndex !== -1) {
+        if (description) {
+          output.collections[existingCollectionIndex].description = description;
+        }
+      } else {
+        output.collections.push({
+          id: collectionId,
+          name,
+          description,
+          externalId,
+        });
+      }
+    }
+
+    for (const document of output.documents) {
+      document.text = replaceInternalLinksAndImages(document.text);
+    }
+
+    for (const collection of output.collections) {
+      if (typeof collection.description === "string") {
+        collection.description = replaceInternalLinksAndImages(
+          collection.description
+        );
+      }
+    }
+
+    return output;
+  }
+
+  /**
+   * Extracts internal links from a markdown document, taking into account the
+   * externalId of the document, which is part of the link title.
+   *
+   * @param text The markdown text to parse
+   * @returns An array of internal links
+   */
+  private parseInternalLinks(
+    text: string
+  ): { title: string; href: string; externalId: string }[] {
+    return compact(
+      [...text.matchAll(this.NotionLinkRegex)].map((match) => ({
+        title: match[1],
+        href: match[2],
+        externalId: match[3],
+      }))
+    );
+  }
+
+  /**
+   * Extracts images from the markdown document
+   *
+   * @param text The markdown text to parse
+   * @returns An array of internal links
+   */
+  private parseImages(text: string): { alt: string; src: string }[] {
+    return compact(
+      [...text.matchAll(this.ImageRegex)].map((match) => ({
+        alt: match[1],
+        src: match[2],
+      }))
+    );
+  }
+
+  /**
+   * Regex to find markdown images of all types
+   */
+  private ImageRegex =
+    /!\[(?<alt>[^\][]*?)]\((?<filename>[^\][]*?)(?=“|\))“?(?<title>[^\][”]+)?”?\)/g;
+
+  /**
+   * Regex to find markdown links containing ID's that look like UUID's with the
+   * "-"'s removed, Notion's externalId format.
+   */
+  private NotionLinkRegex = /\[([^[]+)]\((.*?([0-9a-fA-F]{32})\..*?)\)/g;
+
+  /**
+   * Regex to find Notion document UUID's in the title of a document.
+   */
+  private NotionUUIDRegex =
+    /\s([0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}|[0-9a-fA-F]{32})$/;
+}

server/routes/api/collections/collections.ts

@@ -597,7 +597,6 @@ router.post(
           createdById: user.id,
         },
         transaction,
-        hooks: false,
       });
     }
 

server/routes/api/index.ts

@@ -23,7 +23,6 @@ import groups from "./groups";
 import imports from "./imports";
 import installation from "./installation";
 import integrations from "./integrations";
-import issues from "./issues";
 import apiErrorHandler from "./middlewares/apiErrorHandler";
 import apiResponse from "./middlewares/apiResponse";
 import apiTracer from "./middlewares/apiTracer";
@@ -100,7 +99,6 @@ router.use("/", urls.routes());
 router.use("/", userMemberships.routes());
 router.use("/", reactions.routes());
 router.use("/", imports.routes());
-router.use("/", issues.routes());
 
 if (!env.isCloudHosted) {
   router.use("/", installation.routes());

server/routes/api/issues/index.ts

@@ -1 +0,0 @@
-export { default } from "./issues";

server/routes/api/issues/issues.ts

@@ -1,70 +0,0 @@
-import { InternalError, InvalidRequestError } from "@server/errors";
-import auth from "@server/middlewares/authentication";
-import validate from "@server/middlewares/validate";
-import { Integration } from "@server/models";
-import presentUnfurl from "@server/presenters/unfurl";
-import { APIContext } from "@server/types";
-import { CacheHelper } from "@server/utils/CacheHelper";
-import { Hook, PluginManager } from "@server/utils/PluginManager";
-import { IssueSource } from "@shared/schema";
-import { UserRole } from "@shared/types";
-import Router from "koa-router";
-import * as T from "./schema";
-
-const router = new Router();
-const plugins = PluginManager.getHooks(Hook.IssueProvider);
-
-router.post(
-  "issues.list_sources",
-  auth({ role: UserRole.Member }),
-  async (ctx: APIContext) => {
-    const { user } = ctx.state.auth;
-
-    const integrations = await Integration.findAll({
-      attributes: ["issueSources"],
-      where: { teamId: user.teamId },
-    });
-
-    const sources = integrations
-      .flatMap((integration) => integration.issueSources)
-      .filter(Boolean) as IssueSource[];
-
-    ctx.body = {
-      data: sources,
-    };
-  }
-);
-
-router.post(
-  "issues.create",
-  auth({ role: UserRole.Member }),
-  validate(T.IssuesCreateSchema),
-  async (ctx: APIContext<T.IssuesCreateReq>) => {
-    const { title, source } = ctx.input.body;
-    const { user } = ctx.state.auth;
-
-    const plugin = plugins.find((p) => p.value.service === source.service);
-
-    if (!plugin) {
-      throw InvalidRequestError();
-    }
-
-    const issue = await plugin.value.createIssue(title, source, user);
-
-    if (!issue) {
-      throw InternalError();
-    }
-
-    await CacheHelper.setData(
-      CacheHelper.getUnfurlKey(user.teamId, issue.cacheKey),
-      issue,
-      plugin.value.cacheExpiry
-    );
-
-    ctx.body = {
-      data: await presentUnfurl(issue),
-    };
-  }
-);
-
-export default router;

server/routes/api/issues/schema.ts

@@ -1,12 +0,0 @@
-import { IssueSource } from "@shared/schema";
-import { z } from "zod";
-import { BaseSchema } from "../schema";
-
-export const IssuesCreateSchema = BaseSchema.extend({
-  body: z.object({
-    title: z.string().nonempty(),
-    source: IssueSource,
-  }),
-});
-
-export type IssuesCreateReq = z.infer<typeof IssuesCreateSchema>;

server/routes/api/notifications/notifications.test.ts

@@ -2,7 +2,6 @@ import queryString from "query-string";
 import { v4 as uuidv4 } from "uuid";
 import { randomElement } from "@shared/random";
 import { NotificationEventType } from "@shared/types";
-import NotificationSettingsHelper from "@server/models/helpers/NotificationSettingsHelper";
 import {
   buildCollection,
   buildDocument,
@@ -698,40 +697,3 @@ describe("#notifications.update_all", () => {
     expect(body.data.total).toBe(2);
   });
 });
-
-describe("#notifications.unsubscribe", () => {
-  it("should allow unsubscribe with valid token", async () => {
-    const user = await buildUser();
-    const token = NotificationSettingsHelper.unsubscribeToken(
-      user.id,
-      NotificationEventType.UpdateDocument
-    );
-
-    const res = await server.get(
-      `/api/notifications.unsubscribe?userId=${user.id}&token=${token}&eventType=documents.update&follow=true`,
-      {
-        redirect: "manual",
-      }
-    );
-    expect(res.status).toBe(302);
-    expect(res.headers.get("location")).toContain(
-      "/settings/notifications?success"
-    );
-
-    const events = (await user.reload()).notificationSettings;
-    expect(events).not.toContain("documents.update");
-  });
-
-  it("should not allow unsubscribe with invalid token", async () => {
-    const user = await buildUser();
-
-    const res = await server.get(
-      `/api/notifications.unsubscribe?userId=${user.id}&token=invalid-token&eventType=documents.update&follow=true`,
-      {
-        redirect: "manual",
-      }
-    );
-    expect(res.status).toBe(302);
-    expect(res.headers.get("location")).toContain("?notice=invalid-auth");
-  });
-});

server/routes/api/notifications/notifications.ts

@@ -53,7 +53,7 @@ const handleUnsubscribe = async (
   });
 
   user.setNotificationEventType(eventType, false);
-  await user.save({ transaction });
+  await user.save();
   ctx.redirect(`${user.team.url}/settings/notifications?success`);
 };
 

server/types.ts

@@ -2,7 +2,6 @@ import { ParameterizedContext, DefaultContext } from "koa";
 import { IRouterParamContext } from "koa-router";
 import { InferAttributes, Model, Transaction } from "sequelize";
 import { z } from "zod";
-import { IssueSource } from "@shared/schema";
 import {
   CollectionSort,
   NavigationNode,
@@ -11,7 +10,6 @@ import {
   JSONValue,
   UnfurlResourceType,
   ProsemirrorData,
-  IntegrationType,
 } from "@shared/types";
 import { BaseSchema } from "@server/routes/api/schema";
 import { AccountProvisionerResult } from "./commands/accountProvisioner";
@@ -587,19 +585,6 @@ export type UnfurlSignature = (
 
 export type UninstallSignature = (integration: Integration) => Promise<void>;
 
-export type CreateIssueResponse = Unfurl & { cacheKey: string };
-
-export type IssueProvider = {
-  listSources: (
-    integration: Integration<IntegrationType.Embed>
-  ) => Promise<IssueSource[]>;
-  createIssue: (
-    title: string,
-    source: IssueSource,
-    actor: User
-  ) => Promise<CreateIssueResponse | undefined>;
-};
-
 export type Replace<T, K extends keyof T, N extends string> = {
   [P in keyof T as P extends K ? N : P]: T[P extends K ? K : P];
 };

server/utils/CacheHelper.ts

@@ -18,14 +18,11 @@ export class CacheHelper {
    * @param key Cache key
    * @param callback Callback to get the data if not found in cache
    * @param expiry Cache data expiry in seconds
-   * @param lockTimeout Lock timeout in milliseconds
-   * @returns The data from cache or the result of the callback
    */
   public static async getDataOrSet<T>(
     key: string,
     callback: () => Promise<T | undefined>,
-    expiry: number,
-    lockTimeout: number = MutexLock.defaultLockTimeout
+    expiry?: number
   ): Promise<T | undefined> {
     let cache = await this.getData<T>(key);
 
@@ -38,7 +35,10 @@ export class CacheHelper {
     const lockKey = `lock:${key}`;
     try {
       try {
-        lock = await MutexLock.lock.acquire([lockKey], lockTimeout);
+        lock = await MutexLock.lock.acquire(
+          [lockKey],
+          MutexLock.defaultLockTimeout
+        );
       } catch (err) {
         Logger.error(`Could not acquire lock for ${key}`, err);
       }

server/utils/IssueProvider.ts

@@ -1,28 +0,0 @@
-import { Integration, User } from "@server/models";
-import { CreateIssueResponse } from "@server/types";
-import { IssueSource } from "@shared/schema";
-import {
-  IntegrationType,
-  IssueProviderIntegrationService,
-} from "@shared/types";
-import { Minute } from "@shared/utils/time";
-
-export abstract class BaseIssueProvider {
-  service: IssueProviderIntegrationService;
-  cacheExpiry: number;
-
-  constructor(service: IssueProviderIntegrationService, cacheExpiry?: number) {
-    this.service = service;
-    this.cacheExpiry = cacheExpiry ?? Minute.seconds;
-  }
-
-  abstract fetchSources(
-    integration: Integration<IntegrationType.Embed>
-  ): Promise<IssueSource[]>;
-
-  abstract createIssue(
-    title: string,
-    source: IssueSource,
-    actor: User
-  ): Promise<CreateIssueResponse | undefined>;
-}

server/utils/PluginManager.ts

@@ -9,7 +9,6 @@ import Logger from "@server/logging/Logger";
 import type BaseProcessor from "@server/queues/processors/BaseProcessor";
 import type BaseTask from "@server/queues/tasks/BaseTask";
 import { UnfurlSignature, UninstallSignature } from "@server/types";
-import { BaseIssueProvider } from "./IssueProvider";
 
 export enum PluginPriority {
   VeryHigh = 0,
@@ -26,7 +25,6 @@ export enum Hook {
   API = "api",
   AuthProvider = "authProvider",
   EmailTemplate = "emailTemplate",
-  IssueProvider = "issueProvider",
   Processor = "processor",
   Task = "task",
   UnfurlProvider = "unfurl",
@@ -41,7 +39,6 @@ type PluginValueMap = {
   [Hook.API]: Router;
   [Hook.AuthProvider]: { router: Router; id: string };
   [Hook.EmailTemplate]: typeof BaseEmail;
-  [Hook.IssueProvider]: BaseIssueProvider;
   [Hook.Processor]: typeof BaseProcessor;
   [Hook.Task]: typeof BaseTask<any>;
   [Hook.Uninstall]: UninstallSignature;

server/utils/avatars.test.ts

@@ -0,0 +1,9 @@
+import { generateAvatarUrl } from "./avatars";
+
+it("should return clearbit url if available", async () => {
+  const url = await generateAvatarUrl({
+    id: "google",
+    domain: "google.com",
+  });
+  expect(url).toBe("https://logo.clearbit.com/google.com");
+});

server/utils/avatars.ts

@@ -0,0 +1,28 @@
+import crypto from "crypto";
+import fetch from "./fetch";
+
+export async function generateAvatarUrl({
+  id,
+  domain,
+}: {
+  id: string;
+  domain?: string;
+}) {
+  // attempt to get logo from Clearbit API. If one doesn't exist then
+  // fall back to using tiley to generate a placeholder logo
+  const hash = crypto.createHash("sha256");
+  hash.update(id);
+  let cbResponse, cbUrl;
+
+  if (domain) {
+    cbUrl = `https://logo.clearbit.com/${domain}`;
+
+    try {
+      cbResponse = await fetch(cbUrl);
+    } catch (err) {
+      // okay
+    }
+  }
+
+  return cbUrl && cbResponse && cbResponse.status === 200 ? cbUrl : null;
+}

server/utils/indexing.test.ts

@@ -1,87 +0,0 @@
-import {
-  buildCollection,
-  buildDocument,
-  buildStar,
-  buildTeam,
-  buildUser,
-} from "@server/test/factories";
-import { collectionIndexing, starIndexing } from "./indexing";
-
-describe("collectionIndexing", () => {
-  it("should generate index for collections without index", async () => {
-    const team = await buildTeam();
-    const collections = await Promise.all([
-      buildCollection({
-        teamId: team.id,
-      }),
-      buildCollection({
-        teamId: team.id,
-      }),
-    ]);
-
-    // Set index to null to simulate no index
-    collections[0].index = null;
-    collections[1].index = null;
-    await collections[0].save({ hooks: false });
-    await collections[1].save({ hooks: false });
-
-    const result = await collectionIndexing(team.id, {});
-    expect(Object.keys(result).length).toBe(2);
-    expect(result[collections[0].id]).toBeTruthy();
-    expect(result[collections[1].id]).toBeTruthy();
-  });
-
-  it("should maintain existing indices", async () => {
-    const team = await buildTeam();
-    const collection = await buildCollection({
-      teamId: team.id,
-      index: "a1",
-    });
-
-    const result = await collectionIndexing(team.id, {});
-    expect(result[collection.id]).toBe("a1");
-  });
-});
-
-describe("starIndexing", () => {
-  it("should generate index for stars without index", async () => {
-    const team = await buildTeam();
-    const user = await buildUser({ teamId: team.id });
-    const document = await buildDocument();
-    const stars = await Promise.all([
-      buildStar({
-        userId: user.id,
-        documentId: document.id,
-      }),
-      buildStar({
-        userId: user.id,
-        documentId: document.id,
-      }),
-    ]);
-
-    // Set index to null to simulate no index
-    stars[0].index = null;
-    stars[1].index = null;
-    await stars[0].save({ hooks: false });
-    await stars[1].save({ hooks: false });
-
-    const result = await starIndexing(user.id);
-    expect(Object.keys(result).length).toBe(2);
-    expect(result[stars[0].id]).toBeTruthy();
-    expect(result[stars[1].id]).toBeTruthy();
-  });
-
-  it("should maintain existing indices", async () => {
-    const team = await buildTeam();
-    const user = await buildUser({ teamId: team.id });
-    const document = await buildDocument();
-    const star = await buildStar({
-      userId: user.id,
-      documentId: document.id,
-      index: "a1",
-    });
-
-    const result = await starIndexing(user.id);
-    expect(result[star.id]).toBe("a1");
-  });
-});

server/utils/indexing.ts

@@ -10,8 +10,10 @@ export async function collectionIndexing(
   const collections = await Collection.findAll({
     where: {
       teamId,
+      // no point in maintaining index of deleted collections.
+      deletedAt: null,
     },
-    attributes: ["id", "index", "name", "teamId"],
+    attributes: ["id", "index", "name"],
     transaction,
   });
 
@@ -24,9 +26,7 @@ export async function collectionIndexing(
   for (const collection of sortable) {
     if (collection.index === null) {
       collection.index = fractionalIndex(previousIndex, null);
-      promises.push(
-        collection.save({ fields: ["index"], silent: true, transaction })
-      );
+      promises.push(collection.save({ fields: ["index"], transaction })); // save only index to prevent overwriting other unfetched fields.
     }
 
     previousIndex = collection.index;
@@ -67,7 +67,7 @@ export async function starIndexing(userId: string) {
   for (const star of sortable) {
     if (star.index === null) {
       star.index = fractionalIndex(previousIndex, null);
-      promises.push(star.save({ silent: true }));
+      promises.push(star.save());
     }
 
     previousIndex = star.index;

shared/components/Text.tsx

@@ -1,73 +0,0 @@
-import styled, { css } from "styled-components";
-import { ellipsis } from "../styles";
-
-type Props = {
-  /** The type of text to render */
-  type?: "secondary" | "tertiary" | "danger";
-  /** The size of the text */
-  size?: "xlarge" | "large" | "medium" | "small" | "xsmall";
-  /** The direction of the text (defaults to ltr) */
-  dir?: "ltr" | "rtl" | "auto";
-  /** Whether the text should be selectable (defaults to false) */
-  selectable?: boolean;
-  /** The font weight of the text */
-  weight?: "xbold" | "bold" | "normal";
-  /** Whether the text should be italic */
-  italic?: boolean;
-  /** Whether the text should be truncated with an ellipsis */
-  ellipsis?: boolean;
-  /** Whether the text should be monospaced */
-  monospace?: boolean;
-};
-
-/**
- * Use this component for all interface text that should not be selectable
- * by the user, this is the majority of UI text explainers, notes, headings.
- */
-const Text = styled.span<Props>`
-  margin-top: 0;
-  text-align: ${(props) => (props.dir ? props.dir : "inherit")};
-  color: ${(props) =>
-    props.type === "secondary"
-      ? props.theme.textSecondary
-      : props.type === "tertiary"
-      ? props.theme.textTertiary
-      : props.type === "danger"
-      ? props.theme.brand.red
-      : props.theme.text};
-  font-size: ${(props) =>
-    props.size === "xlarge"
-      ? "26px"
-      : props.size === "large"
-      ? "18px"
-      : props.size === "medium"
-      ? "16px"
-      : props.size === "small"
-      ? "14px"
-      : props.size === "xsmall"
-      ? "13px"
-      : "inherit"};
-
-  ${(props) =>
-    props.weight &&
-    css`
-      font-weight: ${props.weight === "xbold"
-        ? 600
-        : props.weight === "bold"
-        ? 500
-        : props.weight === "normal"
-        ? 400
-        : "inherit"};
-    `}
-
-  font-style: ${(props) => (props.italic ? "italic" : "normal")};
-  font-family: ${(props) =>
-    props.monospace ? props.theme.fontFamilyMono : "inherit"};
-
-  white-space: normal;
-  user-select: ${(props) => (props.selectable ? "text" : "none")};
-
-  ${(props) => props.ellipsis && ellipsis()}
-`;
-
-export default Text;

shared/editor/components/Mentions.tsx

@@ -1,49 +1,17 @@
 import { observer } from "mobx-react";
-import {
-  DocumentIcon,
-  EmailIcon,
-  CollectionIcon,
-  WarningIcon,
-} from "outline-icons";
+import { DocumentIcon, EmailIcon, CollectionIcon } from "outline-icons";
 import { Node } from "prosemirror-model";
 import * as React from "react";
-import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
-import styled from "styled-components";
-import Flex from "../../components/Flex";
 import Icon from "../../components/Icon";
-import { IssueStatusIcon } from "../../components/IssueStatusIcon";
-import { PullRequestIcon } from "../../components/PullRequestIcon";
-import Spinner from "../../components/Spinner";
-import Text from "../../components/Text";
-import useIsMounted from "../../hooks/useIsMounted";
 import useStores from "../../hooks/useStores";
-import theme from "../../styles/theme";
-import type {
-  JSONValue,
-  UnfurlResourceType,
-  UnfurlResponse,
-} from "../../types";
 import { cn } from "../styles/utils";
 import { ComponentProps } from "../types";
 
-type Attrs = {
-  className: string;
-  unfurl?: UnfurlResponse[keyof UnfurlResponse];
-} & Record<string, JSONValue>;
-
-const getAttributesFromNode = (node: Node): Attrs => {
-  const spec = node.type.spec.toDOM?.(node) as any as Record<
-    string,
-    JSONValue
-  >[];
-  const { class: className, "data-unfurl": unfurl, ...attrs } = spec[1];
-
-  return {
-    className: className as Attrs["className"],
-    unfurl: unfurl ? (JSON.parse(unfurl as any) as Attrs["unfurl"]) : undefined,
-    ...attrs,
-  };
+const getAttributesFromNode = (node: Node) => {
+  const spec = node.type.spec.toDOM?.(node) as any as Record<string, string>[];
+  const { class: className, ...attrs } = spec[1];
+  return { className, ...attrs };
 };
 
 export const MentionUser = observer(function MentionUser_(
@@ -52,7 +20,7 @@ export const MentionUser = observer(function MentionUser_(
   const { isSelected, node } = props;
   const { users } = useStores();
   const user = users.get(node.attrs.modelId);
-  const { className, unfurl, ...attrs } = getAttributesFromNode(node);
+  const { className, ...attrs } = getAttributesFromNode(node);
 
   return (
     <span
@@ -74,7 +42,7 @@ export const MentionDocument = observer(function MentionDocument_(
   const { documents } = useStores();
   const doc = documents.get(node.attrs.modelId);
   const modelId = node.attrs.modelId;
-  const { className, unfurl, ...attrs } = getAttributesFromNode(node);
+  const { className, ...attrs } = getAttributesFromNode(node);
 
   React.useEffect(() => {
     if (modelId) {
@@ -107,7 +75,7 @@ export const MentionCollection = observer(function MentionCollection_(
   const { collections } = useStores();
   const collection = collections.get(node.attrs.modelId);
   const modelId = node.attrs.modelId;
-  const { className, unfurl, ...attrs } = getAttributesFromNode(node);
+  const { className, ...attrs } = getAttributesFromNode(node);
 
   React.useEffect(() => {
     if (modelId) {
@@ -132,185 +100,3 @@ export const MentionCollection = observer(function MentionCollection_(
     </Link>
   );
 });
-
-type IssuePrProps = ComponentProps & {
-  onChangeUnfurl: (
-    unfurl:
-      | UnfurlResponse[UnfurlResourceType.Issue]
-      | UnfurlResponse[UnfurlResourceType.PR]
-  ) => void;
-};
-
-export const MentionIssue = observer((props: IssuePrProps) => {
-  const { unfurls } = useStores();
-  const isMounted = useIsMounted();
-  const [loaded, setLoaded] = React.useState(false);
-  const onChangeUnfurl = React.useRef(props.onChangeUnfurl).current; // stable reference to callback function.
-
-  const { isSelected, node } = props;
-  const {
-    className,
-    unfurl: unfurlAttr,
-    ...attrs
-  } = getAttributesFromNode(node);
-
-  const unfurl = unfurls.get(attrs.href)?.data ?? unfurlAttr;
-
-  React.useEffect(() => {
-    const fetchIssue = async () => {
-      const unfurlModel = await unfurls.fetchUnfurl({ url: attrs.href });
-
-      if (!isMounted()) {
-        return;
-      }
-
-      if (unfurlModel) {
-        onChangeUnfurl({
-          ...unfurlModel.data,
-          description: null,
-        } satisfies UnfurlResponse[UnfurlResourceType.Issue]);
-      }
-
-      setLoaded(true);
-    };
-
-    void fetchIssue();
-  }, [unfurls, attrs.href, isMounted, onChangeUnfurl]);
-
-  if (!unfurl) {
-    return !loaded ? (
-      <MentionLoading className={className} />
-    ) : (
-      <MentionError className={className} />
-    );
-  }
-
-  const issue = unfurl as UnfurlResponse[UnfurlResourceType.Issue];
-
-  return (
-    <a
-      {...attrs}
-      className={cn(className, {
-        "ProseMirror-selectednode": isSelected,
-      })}
-      href={attrs.href as string}
-      target="_blank"
-      rel="noopener noreferrer nofollow"
-    >
-      <Flex align="center" gap={6}>
-        <IssueStatusIcon
-          size={14}
-          status={issue.state.name}
-          color={issue.state.color}
-        />
-        <Flex align="center" gap={4}>
-          <Text>{issue.title}</Text>
-          <Text type="tertiary">{issue.id}</Text>
-        </Flex>
-      </Flex>
-    </a>
-  );
-});
-
-export const MentionPullRequest = observer((props: IssuePrProps) => {
-  const { unfurls } = useStores();
-  const isMounted = useIsMounted();
-  const [loaded, setLoaded] = React.useState(false);
-  const onChangeUnfurl = React.useRef(props.onChangeUnfurl).current; // stable reference to callback function.
-
-  const { isSelected, node } = props;
-  const {
-    className,
-    unfurl: unfurlAttr,
-    ...attrs
-  } = getAttributesFromNode(node);
-
-  const unfurl = unfurls.get(attrs.href)?.data ?? unfurlAttr;
-
-  React.useEffect(() => {
-    const fetchPR = async () => {
-      const unfurlModel = await unfurls.fetchUnfurl({ url: attrs.href });
-
-      if (!isMounted()) {
-        return;
-      }
-
-      if (unfurlModel) {
-        onChangeUnfurl({
-          ...unfurlModel.data,
-          description: null,
-        } satisfies UnfurlResponse[UnfurlResourceType.PR]);
-      }
-
-      setLoaded(true);
-    };
-
-    void fetchPR();
-  }, [unfurls, attrs.href, isMounted, onChangeUnfurl]);
-
-  const sharedProps = {
-    className: cn(className, {
-      "ProseMirror-selectednode": isSelected,
-    }),
-  };
-
-  if (!unfurl) {
-    return !loaded ? (
-      <MentionLoading {...sharedProps} />
-    ) : (
-      <MentionError {...sharedProps} />
-    );
-  }
-
-  const pullRequest = unfurl as UnfurlResponse[UnfurlResourceType.PR];
-
-  return (
-    <a
-      {...attrs}
-      {...sharedProps}
-      href={attrs.href as string}
-      target="_blank"
-      rel="noopener noreferrer nofollow"
-    >
-      <Flex align="center" gap={6}>
-        <PullRequestIcon
-          size={14}
-          status={pullRequest.state.name}
-          color={pullRequest.state.color}
-        />
-        <Flex align="center" gap={4}>
-          <Text>{pullRequest.title}</Text>
-          <Text type="tertiary">{pullRequest.id}</Text>
-        </Flex>
-      </Flex>
-    </a>
-  );
-});
-
-export const MentionPlaceholder = () => <MentionLoading className="mention" />;
-
-const MentionLoading = ({ className }: { className: string }) => {
-  const { t } = useTranslation();
-
-  return (
-    <span className={className}>
-      <Spinner />
-      <Text type="tertiary">{`${t("Loading")}…`}</Text>
-    </span>
-  );
-};
-
-const MentionError = ({ className }: { className: string }) => {
-  const { t } = useTranslation();
-
-  return (
-    <span className={className}>
-      <StyledWarningIcon size={20} color={theme.danger} />
-      <Text type="secondary">{`${t("Error loading data")}`}</Text>
-    </span>
-  );
-};
-
-const StyledWarningIcon = styled(WarningIcon)`
-  margin: 0 -2px;
-`;

shared/editor/components/Styles.ts

@@ -313,10 +313,6 @@ width: 100%;
     background: ${props.theme.mentionHoverBackground};
   }
 
-  &[data-type="user"] {
-    gap: 0;
-  }
-
   &.mention-user::before {
     content: "@";
   }
@@ -1335,13 +1331,6 @@ mark {
   position: relative;
 }
 
-.code-block[data-language=none],
-.code-block[data-language=markdown] {
-  pre code {
-    color: ${props.theme.text};
-  }
-}
-
 .code-block[data-language=mermaidjs] {
   margin: 0.75em 0;
 

shared/editor/embeds/index.tsx

@@ -1,4 +1,3 @@
-import { BrowserIcon } from "outline-icons";
 import * as React from "react";
 import styled from "styled-components";
 import { Primitive } from "utility-types";
@@ -666,7 +665,7 @@ const embeds: EmbedDescriptor[] = [
     title: "Embed",
     keywords: "iframe webpage",
     placeholder: "Paste a URL to embed",
-    icon: <BrowserIcon />,
+    icon: <Img src="/images/embed.png" alt="Embed" />,
     defaultHidden: false,
     matchOnInput: false,
     regexMatch: [new RegExp("^https?://(.*)$")],

shared/editor/extensions/Prism.ts

@@ -4,7 +4,7 @@ import { Node } from "prosemirror-model";
 import { Plugin, PluginKey, Transaction } from "prosemirror-state";
 import { Decoration, DecorationSet } from "prosemirror-view";
 import refractor from "refractor/core";
-import { getRefractorLangForLanguage } from "../lib/code";
+import { getPrismLangForLanguage } from "../lib/code";
 import { isRemoteTransaction } from "../lib/multiplayer";
 import { findBlockNodes } from "../queries/findChildren";
 
@@ -14,34 +14,6 @@ type ParsedNode = {
 };
 
 const cache: Record<number, { node: Node; decorations: Decoration[] }> = {};
-const languagesToImport = new Set<string>();
-
-async function loadLanguage(language: string) {
-  if (!language || refractor.registered(language)) {
-    return;
-  }
-  try {
-    // @ts-expect-error we are adding a module to the window object to work
-    // around the fact that refractor doesn't export ESM but import expects it.
-    // See the rules of dynamic imports:
-    // https://github.com/rollup/plugins/blob/e1a5ef99f1578eb38a8c87563cb9651db228f3bd/packages/dynamic-import-vars/README.md#limitations
-    window.module ??= {};
-    return import(`../../../node_modules/refractor/lang/${language}.js`).then(
-      () => {
-        refractor.register(window.module.exports);
-        return language;
-      }
-    );
-  } catch (err) {
-    // It will retry loading the language on the next render
-    // eslint-disable-next-line no-console
-    console.error(
-      `Failed to load language ${language} for code highlighting`,
-      err
-    );
-  }
-  return;
-}
 
 function getDecorations({
   doc,
@@ -85,7 +57,12 @@ function getDecorations({
 
   blocks.forEach((block) => {
     let startPos = block.pos + 1;
-    const language = getRefractorLangForLanguage(block.node.attrs.language);
+    const language = getPrismLangForLanguage(block.node.attrs.language);
+
+    if (!language || !refractor.registered(language)) {
+      return;
+    }
+
     const lineDecorations = [];
 
     if (!cache[block.pos] || !cache[block.pos].node.eq(block.node)) {
@@ -114,48 +91,35 @@ function getDecorations({
         );
       }
 
+      const nodes = refractor.highlight(block.node.textContent, language);
+      const newDecorations = parseNodes(nodes)
+        .map((node: ParsedNode) => {
+          const from = startPos;
+          const to = from + node.text.length;
+
+          startPos = to;
+
+          return {
+            ...node,
+            from,
+            to,
+          };
+        })
+        .filter((node) => node.classes && node.classes.length)
+        .map((node) =>
+          Decoration.inline(node.from, node.to, {
+            class: node.classes.join(" "),
+          })
+        )
+        .concat(lineDecorations);
+
       cache[block.pos] = {
         node: block.node,
-        decorations: lineDecorations,
+        decorations: newDecorations,
       };
-
-      if (!language) {
-        // do nothing
-      } else if (refractor.registered(language)) {
-        languagesToImport.delete(language);
-
-        const nodes = refractor.highlight(block.node.textContent, language);
-        const newDecorations = parseNodes(nodes)
-          .map((node: ParsedNode) => {
-            const from = startPos;
-            const to = from + node.text.length;
-
-            startPos = to;
-
-            return {
-              ...node,
-              from,
-              to,
-            };
-          })
-          .filter((node) => node.classes && node.classes.length)
-          .map((node) =>
-            Decoration.inline(node.from, node.to, {
-              class: node.classes.join(" "),
-            })
-          )
-          .concat(lineDecorations);
-
-        cache[block.pos] = {
-          node: block.node,
-          decorations: newDecorations,
-        };
-      } else {
-        languagesToImport.add(language);
-      }
     }
 
-    cache[block.pos]?.decorations.forEach((decoration) => {
+    cache[block.pos].decorations.forEach((decoration) => {
       decorations.push(decoration);
     });
   });
@@ -169,7 +133,7 @@ function getDecorations({
   return DecorationSet.create(doc, decorations);
 }
 
-export function CodeHighlighting({
+export default function Prism({
   name,
   lineNumbers,
 }: {
@@ -181,7 +145,7 @@ export function CodeHighlighting({
   let highlighted = false;
 
   return new Plugin({
-    key: new PluginKey("codeHighlighting"),
+    key: new PluginKey("prism"),
     state: {
       init: (_, { doc }) => DecorationSet.create(doc, []),
       apply: (transaction: Transaction, decorationSet, oldState, state) => {
@@ -192,13 +156,11 @@ export function CodeHighlighting({
 
         // @ts-expect-error accessing private field.
         const isPaste = transaction.meta?.paste;
-        const langLoaded = transaction.getMeta("codeHighlighting")?.langLoaded;
 
         if (
           !highlighted ||
           codeBlockChanged ||
           isPaste ||
-          langLoaded ||
           isRemoteTransaction(transaction)
         ) {
           highlighted = true;
@@ -212,34 +174,15 @@ export function CodeHighlighting({
       if (!highlighted) {
         // we don't highlight code blocks on the first render as part of mounting
         // as it's expensive (relative to the rest of the document). Instead let
-        // it render un-highlighted and then trigger a defered render of highlighting
+        // it render un-highlighted and then trigger a defered render of Prism
         // by updating the plugins metadata
-        requestAnimationFrame(() => {
+        setTimeout(() => {
           if (!view.isDestroyed) {
-            view.dispatch(
-              view.state.tr.setMeta("codeHighlighting", { loaded: true })
-            );
+            view.dispatch(view.state.tr.setMeta("prism", { loaded: true }));
           }
-        });
+        }, 10);
       }
-      return {
-        update: () => {
-          if (!languagesToImport.size) {
-            return;
-          }
-
-          void Promise.all([...languagesToImport].map(loadLanguage)).then(
-            (language) =>
-              languagesToImport.size
-                ? view.dispatch(
-                    view.state.tr.setMeta("codeHighlighting", {
-                      langLoaded: language,
-                    })
-                  )
-                : null
-          );
-        },
-      };
+      return {};
     },
     props: {
       decorations(state) {

shared/editor/lib/code.test.ts

@@ -1,12 +1,12 @@
-import { getRefractorLangForLanguage, getLabelForLanguage } from "./code";
+import { getPrismLangForLanguage, getLabelForLanguage } from "./code";
 
-describe("getRefractorLangForLanguage", () => {
-  it("should return the correct lang identifier for a given language", () => {
-    expect(getRefractorLangForLanguage("javascript")).toBe("javascript");
-    expect(getRefractorLangForLanguage("mermaidjs")).toBe("mermaid");
-    expect(getRefractorLangForLanguage("xml")).toBe("markup");
-    expect(getRefractorLangForLanguage("unknown")).toBeUndefined();
-    expect(getRefractorLangForLanguage("")).toBeUndefined();
+describe("getPrismLangForLanguage", () => {
+  it("should return the correct Prism language identifier for a given language", () => {
+    expect(getPrismLangForLanguage("javascript")).toBe("javascript");
+    expect(getPrismLangForLanguage("mermaidjs")).toBe("mermaid");
+    expect(getPrismLangForLanguage("xml")).toBe("markup");
+    expect(getPrismLangForLanguage("unknown")).toBeUndefined();
+    expect(getPrismLangForLanguage("")).toBeUndefined();
   });
 });
 

shared/editor/lib/code.ts

@@ -1,6 +1,6 @@
 import Storage from "../../utils/Storage";
 
-const RecentlyUsedStorageKey = "rme-code-language";
+const RecentStorageKey = "rme-code-language";
 const StorageKey = "frequent-code-languages";
 const frequentLanguagesToGet = 5;
 const frequentLanguagesToTrack = 10;
@@ -9,7 +9,7 @@ const frequentLanguagesToTrack = 10;
  * List of supported code languages.
  *
  * Object key is the language identifier used in the editor, lang is the
- * language identifier used by Refractor. Note mismatches such as `markup` and
+ * language identifier used by Prism. Note mismatches such as `markup` and
  * `mermaid`.
  */
 export const codeLanguages = {
@@ -19,10 +19,8 @@ export const codeLanguages = {
   cpp: { lang: "cpp", label: "C++" },
   csharp: { lang: "csharp", label: "C#" },
   css: { lang: "css", label: "CSS" },
-  csv: { lang: "csv", label: "CSV" },
   docker: { lang: "docker", label: "Docker" },
   elixir: { lang: "elixir", label: "Elixir" },
-  erb: { lang: "erb", label: "ERB" },
   erlang: { lang: "erlang", label: "Erlang" },
   go: { lang: "go", label: "Go" },
   graphql: { lang: "graphql", label: "GraphQL" },
@@ -36,11 +34,8 @@ export const codeLanguages = {
   json: { lang: "json", label: "JSON" },
   jsx: { lang: "jsx", label: "JSX" },
   kotlin: { lang: "kotlin", label: "Kotlin" },
-  kusto: { lang: "kusto", label: "Kusto" },
   lisp: { lang: "lisp", label: "Lisp" },
   lua: { lang: "lua", label: "Lua" },
-  makefile: { lang: "makefile", label: "Makefile" },
-  markdown: { lang: "markdown", label: "Markdown" },
   mermaidjs: { lang: "mermaid", label: "Mermaid Diagram" },
   nginx: { lang: "nginx", label: "Nginx" },
   nix: { lang: "nix", label: "Nix" },
@@ -52,13 +47,11 @@ export const codeLanguages = {
   protobuf: { lang: "protobuf", label: "Protobuf" },
   python: { lang: "python", label: "Python" },
   r: { lang: "r", label: "R" },
-  regex: { lang: "regex", label: "Regex" },
   ruby: { lang: "ruby", label: "Ruby" },
   rust: { lang: "rust", label: "Rust" },
   scala: { lang: "scala", label: "Scala" },
   sass: { lang: "sass", label: "Sass" },
   scss: { lang: "scss", label: "SCSS" },
-  "splunk-spl": { lang: "splunk-spl", label: "Splunk SPL" },
   sql: { lang: "sql", label: "SQL" },
   solidity: { lang: "solidity", label: "Solidity" },
   swift: { lang: "swift", label: "Swift" },
@@ -86,14 +79,12 @@ export const getLabelForLanguage = (language: string) => {
 };
 
 /**
- * Get the Refractor language identifier for a given language.
+ * Get the Prism language identifier for a given language.
  *
  * @param language The language identifier.
- * @returns The Refractor language identifier for the language.
+ * @returns The Prism language identifier for the language.
  */
-export const getRefractorLangForLanguage = (
-  language: string
-): string | undefined =>
+export const getPrismLangForLanguage = (language: string): string | undefined =>
   codeLanguages[language as keyof typeof codeLanguages]?.lang;
 
 /**
@@ -101,14 +92,14 @@ export const getRefractorLangForLanguage = (
  *
  * @param language The language identifier.
  */
-export const setRecentlyUsedCodeLanguage = (language: string) => {
+export const setRecentCodeLanguage = (language: string) => {
   const frequentLangs = (Storage.get(StorageKey) ?? {}) as Record<
     string,
     number
   >;
 
   if (Object.keys(frequentLangs).length === 0) {
-    const lastUsedLang = Storage.get(RecentlyUsedStorageKey);
+    const lastUsedLang = Storage.get(RecentStorageKey);
     if (lastUsedLang) {
       frequentLangs[lastUsedLang] = 1;
     }
@@ -130,7 +121,7 @@ export const setRecentlyUsedCodeLanguage = (language: string) => {
   }
 
   Storage.set(StorageKey, Object.fromEntries(frequentLangEntries));
-  Storage.set(RecentlyUsedStorageKey, language);
+  Storage.set(RecentStorageKey, language);
 };
 
 /**
@@ -138,8 +129,8 @@ export const setRecentlyUsedCodeLanguage = (language: string) => {
  *
  * @returns The most recent code language used, or undefined if none is set.
  */
-export const getRecentlyUsedCodeLanguage = () =>
-  Storage.get(RecentlyUsedStorageKey) as keyof typeof codeLanguages | undefined;
+export const getRecentCodeLanguage = () =>
+  Storage.get(RecentStorageKey) as keyof typeof codeLanguages | undefined;
 
 /**
  * Get the most frequent code languages used.
@@ -147,7 +138,7 @@ export const getRecentlyUsedCodeLanguage = () =>
  * @returns An array of the most frequent code languages used.
  */
 export const getFrequentCodeLanguages = () => {
-  const recentLang = Storage.get(RecentlyUsedStorageKey);
+  const recentLang = Storage.get(RecentStorageKey);
   const frequentLangEntries = Object.entries(Storage.get(StorageKey) ?? {}) as [
     keyof typeof codeLanguages,
     number