fix

fix: Allow revoking from list
Combined API keys and Apps screens

.env.sample

@@ -1,80 +1,48 @@
+# –––––––––––––––– REQUIRED ––––––––––––––––
+
 NODE_ENV=production
 
-# This URL should point to the fully qualified, publicly accessible, URL. If using a
-# proxy this will be the proxy's URL.
-URL=
+# Generate a hex-encoded 32-byte random key. You should use `openssl rand -hex 32`
+# in your terminal to generate a random value.
+SECRET_KEY=generate_a_new_key
 
-# The port to expose the Outline server on, this should match what is configured
-# in your docker-compose.yml
+# Generate a unique random key. The format is not important but you could still use
+# `openssl rand -hex 32` in your terminal to produce this.
+UTILS_SECRET=generate_a_new_key
+
+# For production point these at your databases, in development the default
+# should work out of the box.
+DATABASE_URL=postgres://user:pass@postgres:5432/outline
+DATABASE_CONNECTION_POOL_MIN=
+DATABASE_CONNECTION_POOL_MAX=
+# Uncomment this to disable SSL for connecting to Postgres
+# PGSSLMODE=disable
+
+# For redis you can either specify an ioredis compatible url like this
+REDIS_URL=redis://redis:6379
+# or alternatively, if you would like to provide additional connection options,
+# use a base64 encoded JSON connection option object. Refer to the ioredis documentation
+# for a list of available options.
+# Example: Use Redis Sentinel for high availability
+# {"sentinels":[{"host":"sentinel-0","port":26379},{"host":"sentinel-1","port":26379}],"name":"mymaster"}
+# REDIS_URL=ioredis://eyJzZW50aW5lbHMiOlt7Imhvc3QiOiJzZW50aW5lbC0wIiwicG9ydCI6MjYzNzl9LHsiaG9zdCI6InNlbnRpbmVsLTEiLCJwb3J0IjoyNjM3OX1dLCJuYW1lIjoibXltYXN0ZXIifQ==
+
+# URL should point to the fully qualified, publicly accessible URL. If using a
+# proxy the port in URL and PORT may be different.
+URL=
 PORT=3000
 
 # See [documentation](docs/SERVICES.md) on running a separate collaboration
 # server, for normal operation this does not need to be set.
 COLLABORATION_URL=
 
-# If using a Cloudfront/Cloudflare distribution or similar it can be set below.
-# This will cause paths to javascript, stylesheets, and images to be updated to
-# the hostname defined in CDN_URL. In your CDN configuration the origin server
-# should be set to the same as URL.
-CDN_URL=
-
-# How many processes should be spawned. As a reasonable rule divide your servers
-# available memory by 512 for a rough estimate
-WEB_CONCURRENCY=1
-
-# Generate a hex-encoded 32-byte random key. Use `openssl rand -hex 32` in your
-# terminal to generate a random value.
-SECRET_KEY=generate_a_new_key
-
-# Generate a unique random key. The format is not important but you could still use
-# `openssl rand -hex 32` in your terminal to generate a random value.
-UTILS_SECRET=generate_a_new_key
-
-# The default interface language. See translate.getoutline.com for a list of
-# available language codes and their rough percentage translated.
-DEFAULT_LANGUAGE=en_US
-
-
-# ––––––––––––––––––––––––––––––––––––––
-# –––––––––––––  DATABASE  –––––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
-# The database URL for your production database, including username, password, and database name.
-DATABASE_URL=postgres://user:pass@postgres:5432/outline
-
-# The in-memory database pool per-process settings. Ensure that the pool size that will not exceed
-# the maximum number of connections allowed by your database. Defaults to 0 and 5.
-DATABASE_CONNECTION_POOL_MIN=
-DATABASE_CONNECTION_POOL_MAX=
-
-# Uncomment this line if you will not use SSL for connecting to Postgres. This is acceptable
-# if the database and the application are on the same machine.
-# PGSSLMODE=disable
-
-
-# ––––––––––––––––––––––––––––––––––––––
-# ––––––––––––––  REDIS  –––––––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
-# The Redis URL for your environment you can either specify an ioredis compatible url or a Base64
-# encoded configuration object.
-# DOCS: https://docs.getoutline.com/s/hosting/doc/redis-LGM4BFXYp4
-REDIS_URL=redis://redis:6379
-
-
-# ––––––––––––––––––––––––––––––––––––––
-# –––––––––––  FILE STORAGE  –––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
 # Specify what storage system to use. Possible value is one of "s3" or "local".
-# For "local" images and document attachments will be saved on local disk, for "s3" they
-# will be stored in an S3-compatible network store.
-# DOCS: https://docs.getoutline.com/s/hosting/doc/file-storage-N4M0T6Ypu7
+# For "local", the avatar images and document attachments will be saved on local disk. 
 FILE_STORAGE=local
 
 # If "local" is configured for FILE_STORAGE above, then this sets the parent directory under
-# which all attachments/images are stored. Make sure that the process has permissions to
-# create this path and also to write files to it.
+# which all attachments/images go. Make sure that the process has permissions to create
+# this path and also to write files to it.
 FILE_STORAGE_LOCAL_ROOT_DIR=/var/lib/outline/data
 
 # Maximum allowed size for the uploaded attachment.
@@ -88,8 +56,8 @@ FILE_STORAGE_IMPORT_MAX_SIZE=
 # and the files are temporary being automatically deleted after a period of time.
 FILE_STORAGE_WORKSPACE_IMPORT_MAX_SIZE=
 
-# To support uploading of images for avatars and document attachments in a distributed
-# architecture, an s3-compatible storage can be configured if FILE_STORAGE=s3 above.
+# To support uploading of images for avatars and document attachments in a distributed 
+# architecture an s3-compatible storage can be configured if FILE_STORAGE=s3 above.
 AWS_ACCESS_KEY_ID=get_a_key_from_aws
 AWS_SECRET_ACCESS_KEY=get_the_secret_of_above_key
 AWS_REGION=xx-xxxx-x
@@ -99,55 +67,38 @@ AWS_S3_UPLOAD_BUCKET_NAME=bucket_name_here
 AWS_S3_FORCE_PATH_STYLE=true
 AWS_S3_ACL=private
 
-
-# ––––––––––––––––––––––––––––––––––––––
-# ––––––––––––––––  SSL  –––––––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
-# Base64 encoded private key and certificate for HTTPS termination. This is one
-# of three ways to configure SSL and can be left empty.
-# DOCS: https://docs.getoutline.com/s/hosting/doc/ssl-pzk7WO8d1n
-SSL_KEY=
-SSL_CERT=
-
-# Auto-redirect to https in production. The default is true but you may set to
-# false if you can be sure that SSL is terminated at an external loadbalancer.
-FORCE_HTTPS=true
-
-
-# ––––––––––––––––––––––––––––––––––––––
-# ––––––––––  AUTHENTICATION  ––––––––––
-# ––––––––––––––––––––––––––––––––––––––
+# –––––––––––––– AUTHENTICATION ––––––––––––––
 
 # Third party signin credentials, at least ONE OF EITHER Google, Slack,
-# Discord, or Microsoft is required for a working installation or you'll
-# have no sign-in options.
+# or Microsoft is required for a working installation or you'll have no sign-in
+# options.
 
-# Slack sign-in provider
-# DOCS: https://docs.getoutline.com/s/hosting/doc/slack-sgMujR8J9J
+# To configure Slack auth, you'll need to create an Application at
+# => https://api.slack.com/apps
+#
+# When configuring the Client ID, add a redirect URL under "OAuth & Permissions":
+# https://<URL>/auth/slack.callback
 SLACK_CLIENT_ID=get_a_key_from_slack
 SLACK_CLIENT_SECRET=get_the_secret_of_above_key
 
-# Google sign-in provider
-# DOCS: https://docs.getoutline.com/s/hosting/doc/google-hOuvtCmTqQ
+# To configure Google auth, you'll need to create an OAuth Client ID at
+# => https://console.cloud.google.com/apis/credentials
+#
+# When configuring the Client ID, add an Authorized redirect URI:
+# https://<URL>/auth/google.callback
 GOOGLE_CLIENT_ID=
 GOOGLE_CLIENT_SECRET=
 
-# Microsoft Entra / Azure AD sign-in provider
-# DOCS: https://docs.getoutline.com/s/hosting/doc/microsoft-entra-UVz6jsIOcv
+# To configure Microsoft/Azure auth, you'll need to create an OAuth Client. See
+# the guide for details on setting up your Azure App:
+# => https://wiki.generaloutline.com/share/dfa77e56-d4d2-4b51-8ff8-84ea6608faa4
 AZURE_CLIENT_ID=
 AZURE_CLIENT_SECRET=
 AZURE_RESOURCE_APP_ID=
 
-# Discord sign-in provider
-# DOCS: https://docs.getoutline.com/s/hosting/doc/discord-g4JdWFFub6
-DISCORD_CLIENT_ID=
-DISCORD_CLIENT_SECRET=
-DISCORD_SERVER_ID=
-DISCORD_SERVER_ROLES=
-
-# Generic OIDC provider
-# DOCS: https://docs.getoutline.com/s/hosting/doc/oidc-8CPBm6uC0I
+# To configure generic OIDC auth, you'll need some kind of identity provider.
+# See documentation for whichever IdP you use to acquire the following info:
+# Redirect URI is https://<URL>/auth/oidc.callback
 OIDC_CLIENT_ID=
 OIDC_CLIENT_SECRET=
 OIDC_AUTH_URI=
@@ -165,54 +116,83 @@ OIDC_DISPLAY_NAME=OpenID Connect
 # Space separated auth scopes.
 OIDC_SCOPES=openid profile email
 
-
-# ––––––––––––––––––––––––––––––––––––––
-# ––––––––––––––  EMAIL  –––––––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
-# To support sending outgoing transactional emails such as "document updated" or
-# email sign-in you'll need to connect an SMTP server. Service can be configured
-# with any service from this list: https://community.nodemailer.com/2-0-0-beta/setup-smtp/well-known-services/
-# DOCS: https://docs.getoutline.com/s/hosting/doc/smtp-cqCJyZGMIB
-SMTP_SERVICE=
-SMTP_USERNAME=
-SMTP_PASSWORD=
-SMTP_FROM_EMAIL=
-
-
-# ––––––––––––––––––––––––––––––––––––––
-# ––––––––––  RATE LIMITER  ––––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
-# Whether the rate limiter is enabled or not
-RATE_LIMITER_ENABLED=true
-
-# Individual endpoints have hardcoded rate limits that are enabled
-# with the above setting, however this is a global rate limiter
-# across all requests
-RATE_LIMITER_REQUESTS=1000
-RATE_LIMITER_DURATION_WINDOW=60
-
-
-# ––––––––––––––––––––––––––––––––––––––
-# –––––––––––  INTEGRATIONS  –––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
-# The GitHub integration allows previewing issue and pull request links
-# DOCS: https://docs.getoutline.com/s/hosting/doc/github-GchT3NNxI9
+# To configure the GitHub integration, you'll need to create a GitHub App at
+# => https://github.com/settings/apps
+#
+# When configuring the Client ID, add a redirect URL under "Permissions & events":
+# https://<URL>/api/github.callback
 GITHUB_CLIENT_ID=
 GITHUB_CLIENT_SECRET=
 GITHUB_APP_NAME=
 GITHUB_APP_ID=
 GITHUB_APP_PRIVATE_KEY=
 
-# The Linear integration allows previewing issue links as rich mentions
+# Linear
 LINEAR_CLIENT_ID=
 LINEAR_CLIENT_SECRET=
 
+# To configure Discord auth, you'll need to create a Discord Application at
+# => https://discord.com/developers/applications/
+#
+# When configuring the Client ID, add a redirect URL under "OAuth2":
+# https://<URL>/auth/discord.callback
+DISCORD_CLIENT_ID=
+DISCORD_CLIENT_SECRET=
+
+# DISCORD_SERVER_ID should be the ID of the Discord server that Outline is
+# integrated with. 
+# Used to verify that the user is a member of the server as well as server
+# metadata such as nicknames, server icon and name.
+DISCORD_SERVER_ID=
+
+# DISCORD_SERVER_ROLES should be a comma separated list of role IDs that are
+# allowed to access Outline. If this is not set, all members of the server
+# will be allowed to access Outline.
+# DISCORD_SERVER_ID and DISCORD_SERVER_ROLES must be set together.
+DISCORD_SERVER_ROLES=
+
+# –––––––––––––– IMPORTS ––––––––––––––
+NOTION_CLIENT_ID=
+NOTION_CLIENT_SECRET=
+
+# –––––––––––––––– OPTIONAL ––––––––––––––––
+
+# Base64 encoded private key and certificate for HTTPS termination. This is only
+# required if you do not use an external reverse proxy. See documentation:
+# https://wiki.generaloutline.com/share/1c922644-40d8-41fe-98f9-df2b67239d45
+SSL_KEY=
+SSL_CERT=
+
+# If using a Cloudfront/Cloudflare distribution or similar it can be set below.
+# This will cause paths to javascript, stylesheets, and images to be updated to
+# the hostname defined in CDN_URL. In your CDN configuration the origin server
+# should be set to the same as URL.
+CDN_URL=
+
+# Auto-redirect to https in production. The default is true but you may set to
+# false if you can be sure that SSL is terminated at an external loadbalancer.
+FORCE_HTTPS=true
+
+# Have the installation check for updates by sending anonymized statistics to
+# the maintainers
+ENABLE_UPDATES=true
+
+# How many processes should be spawned. As a reasonable rule divide your servers
+# available memory by 512 for a rough estimate
+WEB_CONCURRENCY=1
+
+# You can remove this line if your reverse proxy already logs incoming http
+# requests and this ends up being duplicative
+DEBUG=http
+
+# Configure lowest severity level for server logs. Should be one of
+# error, warn, info, http, verbose, debug and silly
+LOG_LEVEL=info
+
 # For a complete Slack integration with search and posting to channels the
-# following configs are also needed in addition to Slack authentication:
-# DOCS: https://docs.getoutline.com/s/hosting/doc/slack-G2mc8DOJHk
+# following configs are also needed, some more details
+# => https://wiki.generaloutline.com/share/be25efd1-b3ef-4450-b8e5-c4a4fc11e02a
+#
 SLACK_VERIFICATION_TOKEN=your_token
 SLACK_APP_ID=A0XXXXXXX
 SLACK_MESSAGE_ACTIONS=true
@@ -222,34 +202,29 @@ SLACK_MESSAGE_ACTIONS=true
 DROPBOX_APP_KEY=
 
 # Optionally enable Sentry (sentry.io) to track errors and performance,
-# DOCS: https://docs.getoutline.com/s/hosting/doc/sentry-jxcFttcDl5
+# and optionally add a Sentry proxy tunnel for bypassing ad blockers in the UI:
+# https://docs.sentry.io/platforms/javascript/troubleshooting/#using-the-tunnel-option)
 SENTRY_DSN=
 SENTRY_TUNNEL=
 
-# Enable importing pages from a Notion workspace
-# DOCS: https://docs.getoutline.com/s/hosting/doc/notion-2v6g7WY3l3
-NOTION_CLIENT_ID=
-NOTION_CLIENT_SECRET=
+# To support sending outgoing transactional emails such as "document updated" or
+# "you've been invited" you'll need to provide authentication for an SMTP server
+SMTP_SERVICE=
+SMTP_USERNAME=
+SMTP_PASSWORD=
+SMTP_FROM_EMAIL=
 
-# The Iframely integration allows previews of third-party content within Outline.
-# For example, hovering over an external link will show a preview.
-# DOCS: https://docs.getoutline.com/s/hosting/doc/iframely-HwLF1EZ9mo
+# The default interface language. See translate.getoutline.com for a list of
+# available language codes and their rough percentage translated.
+DEFAULT_LANGUAGE=en_US
+
+# Optionally enable rate limiter at application web server
+RATE_LIMITER_ENABLED=true
+
+# Configure default throttling parameters for rate limiter
+RATE_LIMITER_REQUESTS=1000
+RATE_LIMITER_DURATION_WINDOW=60
+
+# Iframely API config
 IFRAMELY_URL=
 IFRAMELY_API_KEY=
-
-
-# ––––––––––––––––––––––––––––––––––––––
-# –––––––––––––  DEBUGGING  ––––––––––––
-# ––––––––––––––––––––––––––––––––––––––
-
-# Have the installation check for updates by sending anonymized statistics to
-# the maintainers
-ENABLE_UPDATES=true
-
-# Debugging categories to enable – you can remove the default "http" value if
-# your proxy already logs incoming http requests and this ends up being duplicative
-DEBUG=http
-
-# Configure lowest severity level for server logs. Should be one of
-# error, warn, info, http, verbose, debug, or silly
-LOG_LEVEL=info

.github/workflows/auto_close_prs.yml

@@ -1,59 +0,0 @@
-name: Auto Close Unsigned PRs
-
-on:
-  schedule:
-    - cron: '0 0 * * *'  # Run daily at midnight UTC
-
-jobs:
-  close-unsigned-prs:
-    runs-on: ubuntu-latest
-    permissions:
-      pull-requests: write
-      issues: write
-
-    steps:
-      - name: Close unsigned PRs
-        uses: actions/github-script@v6
-        with:
-          script: |
-            const now = new Date();
-            const TWO_WEEKS = 14 * 24 * 60 * 60 * 1000; // 14 days in milliseconds
-
-            const prs = await github.rest.pulls.list({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              state: 'open'
-            });
-
-            for (const pr of prs.data) {
-              const prCreatedAt = new Date(pr.created_at);
-              const prAge = now - prCreatedAt;
-
-              if (prAge < TWO_WEEKS) continue;
-
-              const comments = await github.rest.issues.listComments({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                issue_number: pr.number
-              });
-
-              const hasNotSignedComment = comments.data.some(comment =>
-                comment.body.toLowerCase().includes('https://cla-assistant.io/pull/badge/not_signed')
-              );
-
-              if (hasNotSignedComment) {
-                await github.rest.pulls.update({
-                  owner: context.repo.owner,
-                  repo: context.repo.repo,
-                  pull_number: pr.number,
-                  state: 'closed'
-                });
-
-                await github.rest.issues.createComment({
-                  owner: context.repo.owner,
-                  repo: context.repo.repo,
-                  issue_number: pr.number,
-                  body: 'This PR has been automatically closed because it has been open for more than 14 days and has not accepted the CLA.'
-                });
-              }
-            }

LICENSE

@@ -3,7 +3,7 @@ Business Source License 1.1
 Parameters
 
 Licensor:             General Outline, Inc.
-Licensed Work:        Outline 0.84.0
+Licensed Work:        Outline 0.83.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-05-11
+Change Date:          2029-04-11
 
 Change License:       Apache License, Version 2.0
 

app/actions/definitions/teams.tsx

@@ -11,7 +11,7 @@ import { ActionContext } from "~/types";
 import Desktop from "~/utils/Desktop";
 import { TeamSection } from "../sections";
 
-export const switchTeamsList = ({ stores }: { stores: RootStore }) =>
+export const createTeamsList = ({ stores }: { stores: RootStore }) =>
   stores.auth.availableTeams?.map((session) => ({
     id: `switch-${session.id}`,
     name: session.name,
@@ -44,7 +44,7 @@ export const switchTeam = createAction({
   section: TeamSection,
   visible: ({ stores }) =>
     !!stores.auth.availableTeams && stores.auth.availableTeams?.length > 1,
-  children: switchTeamsList,
+  children: createTeamsList,
 });
 
 export const createTeam = createAction({

app/components/Collection/CollectionForm.tsx

@@ -1,4 +1,3 @@
-import uniq from "lodash/uniq";
 import { observer } from "mobx-react";
 import * as React from "react";
 import { Controller, useForm } from "react-hook-form";
@@ -15,15 +14,13 @@ import Button from "~/components/Button";
 import Flex from "~/components/Flex";
 import Input from "~/components/Input";
 import InputSelectPermission from "~/components/InputSelectPermission";
-import { createLazyComponent } from "~/components/LazyLoad";
 import Switch from "~/components/Switch";
 import Text from "~/components/Text";
 import useBoolean from "~/hooks/useBoolean";
 import useCurrentTeam from "~/hooks/useCurrentTeam";
-import useStores from "~/hooks/useStores";
 import { EmptySelectValue } from "~/types";
 
-const IconPicker = createLazyComponent(() => import("~/components/IconPicker"));
+const IconPicker = React.lazy(() => import("~/components/IconPicker"));
 
 export interface FormData {
   name: string;
@@ -33,26 +30,6 @@ export interface FormData {
   permission: CollectionPermission | undefined;
 }
 
-const useIconColor = (collection?: Collection) => {
-  const { collections } = useStores();
-  const hasMultipleCollections = collections.orderedData.length > 1;
-  const collectionColors = uniq(
-    collections.orderedData.map((c) => c.color).filter(Boolean)
-  ) as string[];
-
-  const iconColor = React.useMemo(
-    () =>
-      collection?.color ??
-      // If all the existing collections have the same color, use that color,
-      // otherwise pick a random color from the palette
-      (hasMultipleCollections && collectionColors.length === 1
-        ? collectionColors[0]
-        : randomElement(colorPalette)),
-    [collection?.color]
-  );
-  return iconColor;
-};
-
 export const CollectionForm = observer(function CollectionForm_({
   handleSubmit,
   collection,
@@ -65,7 +42,11 @@ export const CollectionForm = observer(function CollectionForm_({
 
   const [hasOpenedIconPicker, setHasOpenedIconPicker] = useBoolean(false);
 
-  const iconColor = useIconColor(collection);
+  const iconColor = React.useMemo(
+    () => collection?.color ?? randomElement(colorPalette),
+    [collection?.color]
+  );
+
   const fallbackIcon = <Icon value="collection" color={iconColor} />;
 
   const {
@@ -89,11 +70,6 @@ export const CollectionForm = observer(function CollectionForm_({
 
   const values = watch();
 
-  // Preload the IconPicker component on mount
-  React.useEffect(() => {
-    void IconPicker.preload();
-  }, []);
-
   React.useEffect(() => {
     // If the user hasn't picked an icon yet, go ahead and suggest one based on
     // the name of the collection. It's the little things sometimes.
@@ -208,7 +184,7 @@ export const CollectionForm = observer(function CollectionForm_({
   );
 });
 
-const StyledIconPicker = styled(IconPicker.Component)`
+const StyledIconPicker = styled(IconPicker)`
   margin-left: 4px;
   margin-right: 4px;
 `;

app/components/CollectionDescription.tsx

@@ -6,18 +6,15 @@ import { toast } from "sonner";
 import styled from "styled-components";
 import { richExtensions } from "@shared/editor/nodes";
 import { s } from "@shared/styles";
-import { ProsemirrorHelper } from "@shared/utils/ProsemirrorHelper";
 import { CollectionValidation } from "@shared/validations";
 import Collection from "~/models/Collection";
-import Document from "~/models/Document";
 import Editor from "~/components/Editor";
 import LoadingIndicator from "~/components/LoadingIndicator";
-import Text from "~/components/Text";
 import { withUIExtensions } from "~/editor/extensions";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
-import { Properties } from "~/types";
+import Text from "./Text";
 
 const extensions = withUIExtensions(richExtensions);
 
@@ -25,8 +22,8 @@ type Props = {
   collection: Collection;
 };
 
-function Overview({ collection }: Props) {
-  const { documents, collections } = useStores();
+function CollectionDescription({ collection }: Props) {
+  const { collections } = useStores();
   const { t } = useTranslation();
   const user = useCurrentUser({ rejectOnEmpty: true });
   const can = usePolicy(collection);
@@ -57,24 +54,6 @@ function Overview({ collection }: Props) {
     [childOffsetHeight]
   );
 
-  const onCreateLink = React.useCallback(
-    async (params: Properties<Document>) => {
-      const newDocument = await documents.create(
-        {
-          collectionId: collection.id,
-          data: ProsemirrorHelper.getEmptyDocument(),
-          ...params,
-        },
-        {
-          publish: true,
-        }
-      );
-
-      return newDocument.url;
-    },
-    [collection, documents]
-  );
-
   return (
     <>
       {collections.isSaving && <LoadingIndicator />}
@@ -86,7 +65,6 @@ function Overview({ collection }: Props) {
             placeholder={`${t("Add a description")}…`}
             extensions={extensions}
             maxLength={CollectionValidation.maxDescriptionLength}
-            onCreateLink={onCreateLink}
             canUpdate={can.update}
             readOnly={!can.update}
             userId={user.id}
@@ -105,4 +83,4 @@ const Placeholder = styled(Text)`
   min-height: 27px;
 `;
 
-export default observer(Overview);
+export default observer(CollectionDescription);

app/components/ContextMenu/Template.tsx

@@ -138,7 +138,7 @@ function Template({ items, actions, context, showIcons, ...menu }: Props) {
               as={Link}
               id={`${item.title}-${index}`}
               to={item.to}
-              key={`${item.type}-${item.title}-${index}`}
+              key={index}
               disabled={item.disabled}
               selected={item.selected}
               icon={showIcons !== false ? item.icon : undefined}
@@ -154,7 +154,7 @@ function Template({ items, actions, context, showIcons, ...menu }: Props) {
             <MenuItem
               id={`${item.title}-${index}`}
               href={item.href}
-              key={`${item.type}-${item.title}-${index}`}
+              key={index}
               disabled={item.disabled}
               selected={item.selected}
               level={item.level}
@@ -176,7 +176,7 @@ function Template({ items, actions, context, showIcons, ...menu }: Props) {
               disabled={item.disabled}
               selected={item.selected}
               dangerous={item.dangerous}
-              key={`${item.type}-${item.title}-${index}`}
+              key={index}
               icon={showIcons !== false ? item.icon : undefined}
               {...menu}
             >
@@ -185,25 +185,18 @@ function Template({ items, actions, context, showIcons, ...menu }: Props) {
           );
 
           return item.tooltip ? (
-            <Tooltip
-              content={item.tooltip}
-              placement={"bottom"}
-              key={`tooltip-${item.title}-${index}`}
-            >
+            <Tooltip content={item.tooltip} placement={"bottom"}>
               <div>{menuItem}</div>
             </Tooltip>
           ) : (
-            <React.Fragment key={`${item.type}-${item.title}-${index}`}>
-              {menuItem}
-            </React.Fragment>
+            <>{menuItem}</>
           );
         }
 
         if (item.type === "submenu") {
-          // Skip rendering empty submenus
-          return item.items.length > 0 ? (
+          return (
             <BaseMenuItem
-              key={`${item.type}-${item.title}-${index}`}
+              key={index}
               as={SubMenu}
               id={`${item.title}-${index}`}
               templateItems={item.items}
@@ -216,17 +209,15 @@ function Template({ items, actions, context, showIcons, ...menu }: Props) {
               }
               {...menu}
             />
-          ) : null;
+          );
         }
 
         if (item.type === "separator") {
-          return <Separator key={`separator-${index}`} />;
+          return <Separator key={index} />;
         }
 
         if (item.type === "heading") {
-          return (
-            <Header key={`heading-${item.title}-${index}`}>{item.title}</Header>
-          );
+          return <Header key={index}>{item.title}</Header>;
         }
 
         const _exhaustiveCheck: never = item;

app/components/EditableTitle.tsx

@@ -64,12 +64,11 @@ function EditableTitle(
     async (ev) => {
       ev.preventDefault();
       ev.stopPropagation();
-
+      setIsEditing(false);
       const trimmedValue = value.trim();
 
       if (trimmedValue === originalValue || trimmedValue.length === 0) {
         setValue(originalValue);
-        setIsEditing(false);
         onCancel?.();
         return;
       }
@@ -81,8 +80,6 @@ function EditableTitle(
         setValue(originalValue);
         toast.error(error.message);
         throw error;
-      } finally {
-        setIsEditing(false);
       }
     },
     [originalValue, value, onCancel, onSubmit]

app/components/IconPicker/index.tsx

@@ -45,7 +45,6 @@ type Props = {
   onChange: (icon: string | null, color: string | null) => void;
   onOpen?: () => void;
   onClose?: () => void;
-  children?: React.ReactNode;
 };
 
 const IconPicker = ({
@@ -60,7 +59,6 @@ const IconPicker = ({
   onOpen,
   onClose,
   borderOnHover,
-  children,
 }: Props) => {
   const { t } = useTranslation();
 
@@ -176,9 +174,7 @@ const IconPicker = ({
             onClick={handlePopoverButtonClick}
             $borderOnHover={borderOnHover}
           >
-            {children ? (
-              children
-            ) : iconType && icon ? (
+            {iconType && icon ? (
               <Icon value={icon} color={color} size={size} initial={initial} />
             ) : (
               <StyledSmileyIcon color={theme.placeholder} size={size} />

app/components/LazyLoad.ts

@@ -1,47 +0,0 @@
-import * as React from "react";
-import lazyWithRetry from "~/utils/lazyWithRetry";
-
-export interface LazyComponent<T extends React.ComponentType<any>> {
-  Component: React.LazyExoticComponent<T>;
-  preload: () => Promise<{ default: T }>;
-}
-
-interface LazyLoadOptions {
-  retries?: number;
-  interval?: number;
-}
-
-/**
- * Creates a lazy-loaded component with preloading capability and automatic retries on failure.
- *
- * @param factory A function that returns a promise of a component (eg: () => import('./MyComponent'))
- * @param options Optional configuration for retry behavior
- * @returns An object containing the lazy Component and a preload function
- *
- * @example
- * ```typescript
- * const MyComponent = createLazyComponent(() => import('./MyComponent'));
- *
- * function App() {
- *   return (
- *     <Suspense fallback={<div>Loading...</div>}>
- *       <MyComponent.Component />
- *     </Suspense>
- *   );
- * }
- *
- * // Preload when needed:
- * MyComponent.preload();
- * ```
- */
-export function createLazyComponent<T extends React.ComponentType<any>>(
-  factory: () => Promise<{ default: T }>,
-  options: LazyLoadOptions = {}
-): LazyComponent<T> {
-  const { retries, interval } = options;
-
-  return {
-    Component: lazyWithRetry(factory, retries, interval),
-    preload: factory,
-  };
-}

app/components/PaginatedList.tsx

@@ -195,27 +195,21 @@ const PaginatedList = <T extends PaginatedItem>({
     }
   }, [allowLoadMore, isFetching, items?.length, renderCount, fetchResults]);
 
+  React.useEffect(() => {
+    void fetchResults();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
   const prevFetch = usePrevious(fetch);
   const prevOptions = usePrevious(options);
 
-  // Initial fetch on mount
+  // Equivalent to componentDidUpdate
   React.useEffect(() => {
-    if (fetch) {
-      void fetchResults();
-    }
-  }, [fetch]);
-
-  // Handle updates to fetch or options
-  React.useEffect(() => {
-    if (!prevFetch || !prevOptions) {
-      return; // Skip on initial mount since it's handled by the above effect
-    }
-
     if (prevFetch !== fetch || !isEqual(prevOptions, options)) {
       reset();
       void fetchResults();
     }
-  }, [fetch, options, reset, fetchResults, prevFetch, prevOptions]);
+  }, [fetch, options, reset, prevFetch, prevOptions, fetchResults]);
 
   // Computed property equivalent
   const itemsToRender = React.useMemo(

app/components/Reactions/ReactionPicker.tsx

@@ -4,7 +4,6 @@ import { useTranslation } from "react-i18next";
 import { PopoverDisclosure, usePopoverState } from "reakit";
 import EventBoundary from "@shared/components/EventBoundary";
 import Flex from "~/components/Flex";
-import { createLazyComponent } from "~/components/LazyLoad";
 import NudeButton from "~/components/NudeButton";
 import PlaceholderText from "~/components/PlaceholderText";
 import Popover from "~/components/Popover";
@@ -13,7 +12,7 @@ import useOnClickOutside from "~/hooks/useOnClickOutside";
 import useWindowSize from "~/hooks/useWindowSize";
 import Tooltip from "../Tooltip";
 
-const EmojiPanel = createLazyComponent(
+const EmojiPanel = React.lazy(
   () => import("~/components/IconPicker/components/EmojiPanel")
 );
 
@@ -105,7 +104,6 @@ const ReactionPicker: React.FC<Props> = ({
               aria-label={t("Reaction picker")}
               className={className}
               onClick={handlePopoverButtonClick}
-              onMouseEnter={() => EmojiPanel.preload()}
               size={size}
             >
               <ReactionIcon size={22} />
@@ -125,7 +123,7 @@ const ReactionPicker: React.FC<Props> = ({
         {popover.visible && (
           <React.Suspense fallback={<Placeholder />}>
             <EventBoundary>
-              <EmojiPanel.Component
+              <EmojiPanel
                 height={300}
                 panelWidth={panelWidth}
                 query={query}

app/components/Sharing/components/Suggestions.tsx

@@ -93,13 +93,11 @@ export const Suggestions = observer(
     const suggestions = React.useMemo(() => {
       const filtered: Suggestion[] = (
         document
-          ? users
-              .notInDocument(document.id, query)
-              .filter((u) => u.id !== user.id)
+          ? users.notInDocument(document.id, query)
           : collection
           ? users.notInCollection(collection.id, query)
           : users.activeOrInvited
-      ).filter((u) => !u.isSuspended);
+      ).filter((u) => !u.isSuspended && u.id !== user.id);
 
       if (isEmail(query)) {
         filtered.push(getSuggestionForEmail(query));

app/components/Sidebar/App.tsx

@@ -12,7 +12,7 @@ import useCurrentTeam from "~/hooks/useCurrentTeam";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
-import TeamMenu from "~/menus/TeamMenu";
+import OrganizationMenu from "~/menus/OrganizationMenu";
 import { homePath, searchPath } from "~/utils/routeHelpers";
 import TeamLogo from "../TeamLogo";
 import Tooltip from "../Tooltip";
@@ -62,7 +62,7 @@ function AppSidebar() {
         <DndProvider backend={HTML5Backend} options={html5Options}>
           <DragPlaceholder />
 
-          <TeamMenu>
+          <OrganizationMenu>
             {(props: SidebarButtonProps) => (
               <SidebarButton
                 {...props}
@@ -91,7 +91,7 @@ function AppSidebar() {
                 </Tooltip>
               </SidebarButton>
             )}
-          </TeamMenu>
+          </OrganizationMenu>
           <Overflow>
             <Section>
               <SidebarLink

app/components/Sidebar/Settings.tsx

@@ -23,20 +23,12 @@ import ToggleButton from "./components/ToggleButton";
 import Version from "./components/Version";
 
 function SettingsSidebar() {
-  const { ui, integrations } = useStores();
+  const { ui } = useStores();
   const { t } = useTranslation();
   const history = useHistory();
   const location = useLocation();
   const configs = useSettingsConfig();
-
-  const groupedConfig = groupBy(
-    configs.filter((item) =>
-      item.group === "Integrations" && item.pluginId
-        ? integrations.findByService(item.pluginId)
-        : true
-    ),
-    "group"
-  );
+  const groupedConfig = groupBy(configs, "group");
 
   const returnToApp = React.useCallback(() => {
     history.push("/home");
@@ -71,9 +63,8 @@ function SettingsSidebar() {
                   <SidebarLink
                     key={item.path}
                     to={item.path}
-                    onClickIntent={item.preload}
                     active={
-                      item.path.startsWith(settingsPath("templates"))
+                      item.path !== settingsPath()
                         ? location.pathname.startsWith(item.path)
                         : undefined
                     }

app/components/Sidebar/Sidebar.tsx

@@ -321,7 +321,6 @@ const Container = styled(Flex)<ContainerProps>`
   z-index: ${depths.mobileSidebar};
   max-width: 80%;
   min-width: 280px;
-  padding-left: var(--sal);
   ${fadeOnDesktopBackgrounded()}
 
   @media print {

app/components/Sidebar/components/Collections.tsx

@@ -22,7 +22,7 @@ import SidebarContext from "./SidebarContext";
 function Collections() {
   const { documents, collections } = useStores();
   const { t } = useTranslation();
-  const orderedCollections = collections.allActive;
+  const orderedCollections = collections.orderedData;
 
   const params = React.useMemo(
     () => ({

app/components/Sidebar/components/StarredLink.tsx

@@ -38,10 +38,10 @@ function StarredLink({ star }: Props) {
   const { ui, collections, documents } = useStores();
   const [menuOpen, handleMenuOpen, handleMenuClose] = useBoolean();
   const { documentId, collectionId } = star;
-  const collection = collectionId ? collections.get(collectionId) : undefined;
+  const collection = collections.get(collectionId);
   const locationSidebarContext = useLocationSidebarContext();
   const sidebarContext = starredSidebarContext(
-    star.documentId ?? star.collectionId ?? ""
+    star.documentId ?? star.collectionId
   );
   const [expanded, setExpanded] = useState(
     (star.documentId
@@ -78,9 +78,9 @@ function StarredLink({ star }: Props) {
   }, [documentId, documents]);
 
   const handleDisclosureClick = React.useCallback(
-    (ev?: React.MouseEvent<HTMLButtonElement>) => {
-      ev?.preventDefault();
-      ev?.stopPropagation();
+    (ev: React.MouseEvent<HTMLButtonElement>) => {
+      ev.preventDefault();
+      ev.stopPropagation();
       setExpanded((prevExpanded) => !prevExpanded);
     },
     []

app/components/WebsocketProvider.tsx

@@ -1,4 +1,3 @@
-import * as Sentry from "@sentry/react";
 import invariant from "invariant";
 import find from "lodash/find";
 import { action, observable } from "mobx";
@@ -135,15 +134,6 @@ class WebsocketProvider extends React.Component<Props> {
       throw err;
     });
 
-    // add a listener for all events that logs a sentry breadcrumb
-    this.socket.onAny((event: string, data: Record<string, unknown>) => {
-      Sentry.addBreadcrumb({
-        category: "websocket",
-        message: `Received event: ${event}`,
-        data,
-      });
-    });
-
     this.socket.on(
       "entities",
       action(async (event: WebsocketEntitiesEvent) => {
@@ -261,10 +251,8 @@ class WebsocketProvider extends React.Component<Props> {
           }
           policies.remove(document.id);
 
-          if (event.collectionId) {
-            const collection = collections.get(event.collectionId);
-            collection?.removeDocument(document.id);
-          }
+          const collection = collections.get(event.collectionId);
+          collection?.removeDocument(document.id);
         }
       )
     );

app/editor/components/FindAndReplace.tsx

@@ -41,7 +41,6 @@ function useKeyboardShortcuts({
   useKeyDown(
     (ev) =>
       isModKey(ev) &&
-      !popover.visible &&
       ev.code === "KeyF" &&
       // Keyboard handler is through the AppMenu on Desktop v1.2.0+
       !(Desktop.bridge && "onFindInPage" in Desktop.bridge),

app/editor/components/FloatingToolbar.tsx

@@ -7,7 +7,6 @@ import { isCode } from "@shared/editor/lib/isCode";
 import { findParentNode } from "@shared/editor/queries/findParentNode";
 import { EditorStyleHelper } from "@shared/editor/styles/EditorStyleHelper";
 import { depths, s } from "@shared/styles";
-import { getSafeAreaInsets } from "@shared/utils/browser";
 import { HEADER_HEIGHT } from "~/components/Header";
 import { Portal } from "~/components/Portal";
 import useEventListener from "~/hooks/useEventListener";
@@ -242,16 +241,12 @@ const FloatingToolbar = React.forwardRef(function FloatingToolbar_(
 
     if (props.active) {
       const rect = document.body.getBoundingClientRect();
-      const safeAreaInsets = getSafeAreaInsets();
-
       return (
         <ReactPortal>
           <MobileWrapper
             ref={menuRef}
             style={{
-              bottom: `calc(100% - ${
-                height - rect.y - safeAreaInsets.bottom
-              }px)`,
+              bottom: `calc(100% - ${height - rect.y}px)`,
             }}
           >
             {props.children}

app/editor/components/PasteMenu.tsx

@@ -6,7 +6,6 @@ import { v4 } from "uuid";
 import { EmbedDescriptor } from "@shared/editor/embeds";
 import { MenuItem } from "@shared/editor/types";
 import { MentionType } from "@shared/types";
-import { isUrl } from "@shared/utils/urls";
 import Integration from "~/models/Integration";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import useStores from "~/hooks/useStores";
@@ -30,9 +29,9 @@ export const PasteMenu = observer(({ pastedText, embeds, ...props }: Props) => {
   const user = useCurrentUser({ rejectOnEmpty: false });
 
   let mentionType: MentionType | undefined;
+  const url = pastedText ? new URL(pastedText) : undefined;
 
-  if (pastedText && isUrl(pastedText)) {
-    const url = new URL(pastedText);
+  if (url) {
     const integration = integrations.find((intg: Integration) =>
       isURLMentionable({ url, integration: intg })
     );

app/editor/extensions/BlockMenu.tsx

@@ -1,12 +1,10 @@
 import { action } from "mobx";
 import { PlusIcon } from "outline-icons";
-import { Node, ResolvedPos } from "prosemirror-model";
-import { EditorState, Plugin } from "prosemirror-state";
+import { Plugin } from "prosemirror-state";
 import { Decoration, DecorationSet } from "prosemirror-view";
 import * as React from "react";
-import { createRoot } from "react-dom/client";
+import ReactDOM from "react-dom";
 import { WidgetProps } from "@shared/editor/lib/Extension";
-import { PlaceholderPlugin } from "@shared/editor/plugins/PlaceholderPlugin";
 import { findParentNode } from "@shared/editor/queries/findParentNode";
 import Suggestion from "~/editor/extensions/Suggestion";
 import BlockMenu from "../components/BlockMenu";
@@ -29,10 +27,7 @@ export default class BlockMenuExtension extends Suggestion {
     const button = document.createElement("button");
     button.className = "block-menu-trigger";
     button.type = "button";
-    button.addEventListener("click", this.handleClick);
-    const root = createRoot(button);
-    root.render(<PlusIcon />);
-    return button;
+    ReactDOM.render(<PlusIcon />, button);
 
     return [
       ...super.plugins,
@@ -54,6 +49,7 @@ export default class BlockMenuExtension extends Suggestion {
 
             const decorations: Decoration[] = [];
             const isEmptyNode = parent && parent.node.content.size === 0;
+            const isSlash = parent && parent.node.textContent === "/";
 
             if (isEmptyNode) {
               decorations.push(
@@ -73,39 +69,33 @@ export default class BlockMenuExtension extends Suggestion {
                   }
                 )
               );
+
+              const isEmptyDoc = state.doc.textContent === "";
+              if (!isEmptyDoc) {
+                decorations.push(
+                  Decoration.node(
+                    parent.pos,
+                    parent.pos + parent.node.nodeSize,
+                    {
+                      class: "placeholder",
+                      "data-empty-text": this.options.dictionary.newLineEmpty,
+                    }
+                  )
+                );
+              }
+            } else if (isSlash) {
+              decorations.push(
+                Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
+                  class: "placeholder",
+                  "data-empty-text": `  ${this.options.dictionary.newLineWithSlash}`,
+                })
+              );
             }
 
             return DecorationSet.create(state.doc, decorations);
           },
         },
       }),
-      new PlaceholderPlugin([
-        {
-          condition: (
-            node: Node,
-            $start: ResolvedPos,
-            _parent: Node | null,
-            state: EditorState
-          ) =>
-            $start.depth === 1 &&
-            node.textContent === "" &&
-            !!state.doc.textContent &&
-            state.selection.$from.pos === $start.pos + node.content.size,
-          text: this.options.dictionary.newLineEmpty,
-        },
-        {
-          condition: (
-            node: Node,
-            $start: ResolvedPos,
-            _parent: Node,
-            state: EditorState
-          ) =>
-            $start.depth === 1 &&
-            node.textContent === "/" &&
-            state.selection.$from.pos === $start.pos + node.content.size,
-          text: `  ${this.options.dictionary.newLineWithSlash}`,
-        },
-      ]),
     ];
   }
 

app/editor/extensions/SmartText.ts

@@ -2,8 +2,7 @@ import Extension from "@shared/editor/lib/Extension";
 import { InputRule } from "@shared/editor/lib/InputRule";
 
 const rightArrow = new InputRule(/->$/, "→");
-// Note that the suppression of pipe here prevents conflict with table creation rule.
-const emdash = new InputRule(/(?:^|[^\|])(--)$/, "—");
+const emdash = new InputRule(/--$/, "—");
 const oneHalf = new InputRule(/(?:^|\s)(1\/2)$/, "½");
 const threeQuarters = new InputRule(/(?:^|\s)(3\/4)$/, "¾");
 const copyright = new InputRule(/\(c\)$/, "©️");

app/editor/menus/formatting.tsx

@@ -67,7 +67,7 @@ export default function formattingMenuItems(
       shortcut: `${metaDisplay}+B`,
       icon: <BoldIcon />,
       active: isMarkActive(schema.marks.strong),
-      visible: !isCodeBlock && (!isMobile || !isEmpty),
+      visible: !isCode && (!isMobile || !isEmpty),
     },
     {
       name: "em",
@@ -75,7 +75,7 @@ export default function formattingMenuItems(
       shortcut: `${metaDisplay}+I`,
       icon: <ItalicIcon />,
       active: isMarkActive(schema.marks.em),
-      visible: !isCodeBlock && (!isMobile || !isEmpty),
+      visible: !isCode && (!isMobile || !isEmpty),
     },
     {
       name: "strikethrough",
@@ -83,7 +83,7 @@ export default function formattingMenuItems(
       shortcut: `${metaDisplay}+D`,
       icon: <StrikethroughIcon />,
       active: isMarkActive(schema.marks.strikethrough),
-      visible: !isCodeBlock && (!isMobile || !isEmpty),
+      visible: !isCode && (!isMobile || !isEmpty),
     },
     {
       tooltip: dictionary.mark,

app/hooks/useEmbeds.ts

@@ -18,7 +18,8 @@ export default function useEmbeds(loadIfMissing = false) {
   React.useEffect(() => {
     async function fetchEmbedIntegrations() {
       try {
-        await integrations.fetchAll({
+        await integrations.fetchPage({
+          limit: 100,
           type: IntegrationType.Embed,
         });
       } catch (err) {

app/hooks/useLoggedInSessions.ts

@@ -1,14 +0,0 @@
-import { getCookie } from "tiny-cookie";
-
-export type Sessions = Record<
-  string,
-  {
-    name: string;
-    logoUrl: string;
-    url: string;
-  }
->;
-
-export function useLoggedInSessions(): Sessions {
-  return JSON.parse(getCookie("sessions") || "{}");
-}

app/hooks/useRequest.ts

@@ -59,7 +59,7 @@ export default function useRequest<T = unknown>(
     if (makeRequestOnMount) {
       void request();
     }
-  }, []);
+  }, [request, makeRequestOnMount]);
 
   return { data, loading, loaded, error, request };
 }

app/hooks/useSettingsConfig.ts

@@ -13,21 +13,20 @@ import {
   ImportIcon,
   ShapesIcon,
   Icon,
-  PlusIcon,
   InternetIcon,
 } from "outline-icons";
 import React, { ComponentProps } from "react";
 import { useTranslation } from "react-i18next";
 import { integrationSettingsPath } from "@shared/utils/routeHelpers";
-import { Integrations } from "~/scenes/Settings/Integrations";
-import { createLazyComponent as lazy } from "~/components/LazyLoad";
+import ZapierIcon from "~/components/Icons/ZapierIcon";
 import { Hook, PluginManager } from "~/utils/PluginManager";
+import isCloudHosted from "~/utils/isCloudHosted";
+import lazy from "~/utils/lazyWithRetry";
 import { settingsPath } from "~/utils/routeHelpers";
 import { useComputed } from "./useComputed";
 import useCurrentTeam from "./useCurrentTeam";
 import useCurrentUser from "./useCurrentUser";
 import usePolicy from "./usePolicy";
-import useStores from "./useStores";
 
 const ApiKeys = lazy(() => import("~/scenes/Settings/ApiKeys"));
 const Applications = lazy(() => import("~/scenes/Settings/Applications"));
@@ -44,38 +43,30 @@ const Profile = lazy(() => import("~/scenes/Settings/Profile"));
 const Security = lazy(() => import("~/scenes/Settings/Security"));
 const Shares = lazy(() => import("~/scenes/Settings/Shares"));
 const Templates = lazy(() => import("~/scenes/Settings/Templates"));
+const Zapier = lazy(() => import("~/scenes/Settings/Zapier"));
 
 export type ConfigItem = {
   name: string;
   path: string;
   icon: React.FC<ComponentProps<typeof Icon>>;
   component: React.ComponentType;
-  description?: string;
-  preload?: () => void;
   enabled: boolean;
   group: string;
-  pluginId?: string;
 };
 
 const useSettingsConfig = () => {
-  const { integrations } = useStores();
   const user = useCurrentUser();
   const team = useCurrentTeam();
   const can = usePolicy(team);
   const { t } = useTranslation();
 
-  React.useEffect(() => {
-    void integrations.fetchAll();
-  }, [integrations]);
-
   const config = useComputed(() => {
     const items: ConfigItem[] = [
       // Account
       {
         name: t("Profile"),
         path: settingsPath(),
-        component: Profile.Component,
-        preload: Profile.preload,
+        component: Profile,
         enabled: true,
         group: t("Account"),
         icon: ProfileIcon,
@@ -83,8 +74,7 @@ const useSettingsConfig = () => {
       {
         name: t("Preferences"),
         path: settingsPath("preferences"),
-        component: Preferences.Component,
-        preload: Preferences.preload,
+        component: Preferences,
         enabled: true,
         group: t("Account"),
         icon: SettingsIcon,
@@ -92,8 +82,7 @@ const useSettingsConfig = () => {
       {
         name: t("Notifications"),
         path: settingsPath("notifications"),
-        component: Notifications.Component,
-        preload: Notifications.preload,
+        component: Notifications,
         enabled: true,
         group: t("Account"),
         icon: EmailIcon,
@@ -101,8 +90,7 @@ const useSettingsConfig = () => {
       {
         name: t("API & Apps"),
         path: settingsPath("api-and-apps"),
-        component: APIAndApps.Component,
-        preload: APIAndApps.preload,
+        component: APIAndApps,
         enabled: true,
         group: t("Account"),
         icon: PadlockIcon,
@@ -111,8 +99,7 @@ const useSettingsConfig = () => {
       {
         name: t("Details"),
         path: settingsPath("details"),
-        component: Details.Component,
-        preload: Details.preload,
+        component: Details,
         enabled: can.update,
         group: t("Workspace"),
         icon: TeamIcon,
@@ -120,8 +107,7 @@ const useSettingsConfig = () => {
       {
         name: t("Security"),
         path: settingsPath("security"),
-        component: Security.Component,
-        preload: Security.preload,
+        component: Security,
         enabled: can.update,
         group: t("Workspace"),
         icon: PadlockIcon,
@@ -129,8 +115,7 @@ const useSettingsConfig = () => {
       {
         name: t("Features"),
         path: settingsPath("features"),
-        component: Features.Component,
-        preload: Features.preload,
+        component: Features,
         enabled: can.update,
         group: t("Workspace"),
         icon: BeakerIcon,
@@ -138,8 +123,7 @@ const useSettingsConfig = () => {
       {
         name: t("Members"),
         path: settingsPath("members"),
-        component: Members.Component,
-        preload: Members.preload,
+        component: Members,
         enabled: can.listUsers,
         group: t("Workspace"),
         icon: UserIcon,
@@ -147,8 +131,7 @@ const useSettingsConfig = () => {
       {
         name: t("Groups"),
         path: settingsPath("groups"),
-        component: Groups.Component,
-        preload: Groups.preload,
+        component: Groups,
         enabled: can.listGroups,
         group: t("Workspace"),
         icon: GroupIcon,
@@ -156,8 +139,7 @@ const useSettingsConfig = () => {
       {
         name: t("Templates"),
         path: settingsPath("templates"),
-        component: Templates.Component,
-        preload: Templates.preload,
+        component: Templates,
         enabled: can.readTemplate,
         group: t("Workspace"),
         icon: ShapesIcon,
@@ -165,8 +147,7 @@ const useSettingsConfig = () => {
       {
         name: t("API Keys"),
         path: settingsPath("api-keys"),
-        component: ApiKeys.Component,
-        preload: ApiKeys.preload,
+        component: ApiKeys,
         enabled: can.listApiKeys,
         group: t("Workspace"),
         icon: CodeIcon,
@@ -174,8 +155,7 @@ const useSettingsConfig = () => {
       {
         name: t("Applications"),
         path: settingsPath("applications"),
-        component: Applications.Component,
-        preload: Applications.preload,
+        component: Applications,
         enabled: can.listOAuthClients,
         group: t("Workspace"),
         icon: InternetIcon,
@@ -183,8 +163,7 @@ const useSettingsConfig = () => {
       {
         name: t("Shared Links"),
         path: settingsPath("shares"),
-        component: Shares.Component,
-        preload: Shares.preload,
+        component: Shares,
         enabled: can.listShares,
         group: t("Workspace"),
         icon: GlobeIcon,
@@ -192,8 +171,7 @@ const useSettingsConfig = () => {
       {
         name: t("Import"),
         path: settingsPath("import"),
-        component: Import.Component,
-        preload: Import.preload,
+        component: Import,
         enabled: can.createImport,
         group: t("Workspace"),
         icon: ImportIcon,
@@ -201,20 +179,19 @@ const useSettingsConfig = () => {
       {
         name: t("Export"),
         path: settingsPath("export"),
-        component: Export.Component,
-        preload: Export.preload,
+        component: Export,
         enabled: can.createExport,
         group: t("Workspace"),
         icon: ExportIcon,
       },
       // Integrations
       {
-        name: `${t("Install")}…`,
-        path: settingsPath("integrations"),
-        component: Integrations,
-        enabled: true,
+        name: "Zapier",
+        path: integrationSettingsPath("zapier"),
+        component: Zapier,
+        enabled: can.update && isCloudHosted,
         group: t("Integrations"),
-        icon: PlusIcon,
+        icon: ZapierIcon,
       },
     ];
 
@@ -231,10 +208,7 @@ const useSettingsConfig = () => {
             ? integrationSettingsPath(plugin.id)
             : settingsPath(plugin.id),
         group: t(group),
-        pluginId: plugin.id,
-        description: plugin.value.description,
-        component: plugin.value.component.Component,
-        preload: plugin.value.component.preload,
+        component: plugin.value.component,
         enabled: plugin.value.enabled
           ? plugin.value.enabled(team, user)
           : can.update,

app/hooks/useTemplateMenuItems.tsx

@@ -1,88 +0,0 @@
-import { DocumentIcon } from "outline-icons";
-import * as React from "react";
-import { useTranslation } from "react-i18next";
-import Icon from "@shared/components/Icon";
-import { TextHelper } from "@shared/utils/TextHelper";
-import Document from "~/models/Document";
-import useCurrentUser from "~/hooks/useCurrentUser";
-import useStores from "~/hooks/useStores";
-import { MenuItem } from "~/types";
-
-type Props = {
-  /** The document to which the templates will be applied */
-  document: Document;
-  /** Callback to handle when a template is selected */
-  onSelectTemplate?: (template: Document) => void;
-};
-
-/**
- * This hook provides a memoized list of menu items for both collection-specific
- * templates and workspace-wide templates. It filters templates based on whether
- * they are published and organizes them into appropriate sections.
- *
- * Collection-specific templates are displayed first, followed by workspace templates
- * with a separator in between (if both types exist).
- *
- * @returns An array of MenuItem objects representing templates that can be applied
- * to the current document. Returns an empty array if no callback is provided.
- */
-export function useTemplateMenuItems({ document, onSelectTemplate }: Props) {
-  const user = useCurrentUser();
-  const { documents } = useStores();
-  const { t } = useTranslation();
-
-  const templateToMenuItem = React.useCallback(
-    (template: Document): MenuItem => ({
-      type: "button",
-      title: TextHelper.replaceTemplateVariables(
-        template.titleWithDefault,
-        user
-      ),
-      icon: template.icon ? (
-        <Icon value={template.icon} color={template.color ?? undefined} />
-      ) : (
-        <DocumentIcon />
-      ),
-      onClick: () => onSelectTemplate?.(template),
-    }),
-    [user, onSelectTemplate]
-  );
-
-  const templates = documents.templates.filter(
-    (template) => template.publishedAt
-  );
-
-  const collectionItems = templates
-    .filter(
-      (template) =>
-        !template.isWorkspaceTemplate &&
-        template.collectionId === document.collectionId
-    )
-    .map(templateToMenuItem);
-
-  const workspaceTemplates = templates
-    .filter((tmpl) => tmpl.isWorkspaceTemplate)
-    .map(templateToMenuItem);
-
-  const workspaceItems: MenuItem[] = React.useMemo(
-    () =>
-      workspaceTemplates.length
-        ? [{ type: "heading", title: t("Workspace") }, ...workspaceTemplates]
-        : [],
-    [t, workspaceTemplates]
-  );
-
-  if (!onSelectTemplate) {
-    return [];
-  }
-
-  return collectionItems
-    ? workspaceItems.length
-      ? [
-          ...collectionItems,
-          { type: "separator" } as MenuItem,
-          ...workspaceItems,
-        ]
-      : collectionItems
-    : workspaceItems;
-}

app/index.tsx

@@ -4,7 +4,7 @@ import { LazyMotion } from "framer-motion";
 import { KBarProvider } from "kbar";
 import { Provider } from "mobx-react";
 import * as React from "react";
-import { createRoot } from "react-dom/client";
+import { render } from "react-dom";
 import { HelmetProvider } from "react-helmet-async";
 import { Router } from "react-router-dom";
 import stores from "~/stores";
@@ -79,8 +79,7 @@ if (element) {
     </React.StrictMode>
   );
 
-  const root = createRoot(element);
-  root.render(<App />);
+  render(<App />, element);
 }
 
 window.addEventListener("load", async () => {

app/menus/DocumentMenu.tsx

@@ -2,13 +2,7 @@ import capitalize from "lodash/capitalize";
 import isEmpty from "lodash/isEmpty";
 import noop from "lodash/noop";
 import { observer } from "mobx-react";
-import {
-  EditIcon,
-  InputIcon,
-  RestoreIcon,
-  SearchIcon,
-  ShapesIcon,
-} from "outline-icons";
+import { EditIcon, InputIcon, RestoreIcon, SearchIcon } from "outline-icons";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { useHistory } from "react-router-dom";
@@ -63,7 +57,6 @@ import useMobile from "~/hooks/useMobile";
 import usePolicy from "~/hooks/usePolicy";
 import useRequest from "~/hooks/useRequest";
 import useStores from "~/hooks/useStores";
-import { useTemplateMenuItems } from "~/hooks/useTemplateMenuItems";
 import { MenuItem, MenuItemButton } from "~/types";
 import { documentEditPath } from "~/utils/routeHelpers";
 import { MenuContext, useMenuContext } from "./MenuContext";
@@ -83,7 +76,6 @@ type Props = {
   label?: (props: MenuButtonHTMLProps) => React.ReactNode;
   /** Invoked when the "Find and replace" menu item is clicked */
   onFindAndReplace?: () => void;
-  onSelectTemplate?: (template: Document) => void;
   /** Invoked when the "Rename" menu item is clicked */
   onRename?: () => void;
   /** Invoked when menu is opened */
@@ -155,7 +147,6 @@ type MenuContentProps = {
   onOpen?: () => void;
   onClose?: () => void;
   onFindAndReplace?: () => void;
-  onSelectTemplate?: (template: Document) => void;
   onRename?: () => void;
   showDisplayOptions?: boolean;
   showToggleEmbeds?: boolean;
@@ -165,7 +156,6 @@ const MenuContent: React.FC<MenuContentProps> = observer(function MenuContent_({
   onOpen,
   onClose,
   onFindAndReplace,
-  onSelectTemplate,
   onRename,
   showDisplayOptions,
   showToggleEmbeds,
@@ -228,11 +218,6 @@ const MenuContent: React.FC<MenuContentProps> = observer(function MenuContent_({
     [collections.orderedData, handleRestore, policies]
   );
 
-  const templateMenuItems = useTemplateMenuItems({
-    document,
-    onSelectTemplate,
-  });
-
   return !isEmpty(can) ? (
     <ContextMenu
       {...menuState}
@@ -325,12 +310,6 @@ const MenuContent: React.FC<MenuContentProps> = observer(function MenuContent_({
           actionToMenuItem(archiveDocument, context),
           actionToMenuItem(moveDocument, context),
           actionToMenuItem(moveTemplate, context),
-          {
-            type: "submenu",
-            title: t("Apply template"),
-            icon: <ShapesIcon />,
-            items: templateMenuItems,
-          },
           actionToMenuItem(pinDocument, context),
           actionToMenuItem(createDocumentFromTemplate, context),
           {
@@ -404,7 +383,6 @@ function DocumentMenu({
   modal = true,
   showToggleEmbeds,
   showDisplayOptions,
-  onSelectTemplate,
   label,
   onRename,
   onOpen,
@@ -488,7 +466,6 @@ function DocumentMenu({
             onOpen={onOpen}
             onClose={onClose}
             onRename={onRename}
-            onSelectTemplate={onSelectTemplate}
             showDisplayOptions={showDisplayOptions}
             showToggleEmbeds={showToggleEmbeds}
           />

app/menus/OrganizationMenu.tsx

@@ -10,7 +10,7 @@ import {
 } from "~/actions/definitions/navigation";
 import {
   createTeam,
-  switchTeamsList,
+  createTeamsList,
   desktopLoginTeam,
 } from "~/actions/definitions/teams";
 import useActionContext from "~/hooks/useActionContext";
@@ -22,7 +22,7 @@ type Props = {
   children?: React.ReactNode;
 };
 
-const TeamMenu: React.FC = ({ children }: Props) => {
+const OrganizationMenu: React.FC = ({ children }: Props) => {
   const menu = useMenuState({
     unstable_offset: [4, -4],
     placement: "bottom-start",
@@ -44,7 +44,7 @@ const TeamMenu: React.FC = ({ children }: Props) => {
   // menu is not cached at all.
   const actions = React.useMemo(
     () => [
-      ...switchTeamsList(context),
+      ...createTeamsList(context),
       createTeam,
       desktopLoginTeam,
       separator(),
@@ -64,4 +64,4 @@ const TeamMenu: React.FC = ({ children }: Props) => {
   );
 };
 
-export default observer(TeamMenu);
+export default observer(OrganizationMenu);

app/menus/TemplatesMenu.tsx

@@ -1,13 +1,17 @@
 import { observer } from "mobx-react";
-import { ShapesIcon } from "outline-icons";
+import { DocumentIcon, ShapesIcon } from "outline-icons";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { MenuButton, useMenuState } from "reakit/Menu";
+import Icon from "@shared/components/Icon";
+import { TextHelper } from "@shared/utils/TextHelper";
 import Document from "~/models/Document";
 import Button from "~/components/Button";
 import ContextMenu from "~/components/ContextMenu";
 import Template from "~/components/ContextMenu/Template";
-import { useTemplateMenuItems } from "~/hooks/useTemplateMenuItems";
+import useCurrentUser from "~/hooks/useCurrentUser";
+import useStores from "~/hooks/useStores";
+import { MenuItem } from "~/types";
 
 type Props = {
   /** The document to which the templates will be applied */
@@ -19,12 +23,57 @@ type Props = {
 };
 
 function TemplatesMenu({ isCompact, onSelectTemplate, document }: Props) {
-  const { t } = useTranslation();
   const menu = useMenuState({
     modal: true,
   });
+  const user = useCurrentUser();
+  const { documents } = useStores();
+  const { t } = useTranslation();
 
-  const items = useTemplateMenuItems({ onSelectTemplate, document });
+  const templateToMenuItem = React.useCallback(
+    (tmpl: Document): MenuItem => ({
+      type: "button",
+      title: TextHelper.replaceTemplateVariables(tmpl.titleWithDefault, user),
+      icon: tmpl.icon ? (
+        <Icon value={tmpl.icon} color={tmpl.color ?? undefined} />
+      ) : (
+        <DocumentIcon />
+      ),
+      onClick: () => onSelectTemplate(tmpl),
+    }),
+    [user, onSelectTemplate]
+  );
+
+  const templates = documents.templates.filter((tmpl) => tmpl.publishedAt);
+
+  const collectionItems = templates
+    .filter(
+      (tmpl) =>
+        !tmpl.isWorkspaceTemplate && tmpl.collectionId === document.collectionId
+    )
+    .map(templateToMenuItem);
+
+  const workspaceTemplates = templates
+    .filter((tmpl) => tmpl.isWorkspaceTemplate)
+    .map(templateToMenuItem);
+
+  const workspaceItems: MenuItem[] = React.useMemo(
+    () =>
+      workspaceTemplates.length
+        ? [{ type: "heading", title: t("Workspace") }, ...workspaceTemplates]
+        : [],
+    [t, workspaceTemplates]
+  );
+
+  const items = collectionItems
+    ? workspaceItems.length
+      ? [
+          ...collectionItems,
+          { type: "separator" } as MenuItem,
+          ...workspaceItems,
+        ]
+      : collectionItems
+    : workspaceItems;
 
   if (!items.length) {
     return null;

app/models/Document.ts

@@ -331,16 +331,6 @@ export default class Document extends ArchivableModel implements Searchable {
     );
   }
 
-  /**
-   * Returns the documents that link to this document.
-   *
-   * @returns documents that link to this document
-   */
-  @computed
-  get backlinks(): Document[] {
-    return this.store.getBacklinkedDocuments(this.id);
-  }
-
   /**
    * Returns users that have been individually given access to the document.
    *

app/models/Star.ts

@@ -22,7 +22,7 @@ class Star extends Model {
   document?: Document;
 
   /** The collection ID that is starred. */
-  collectionId?: string;
+  collectionId: string;
 
   /** The collection that is starred. */
   @Relation(() => Collection, { onDelete: "cascade" })

app/models/oauth/OAuthAuthentication.ts

@@ -19,7 +19,7 @@ class OAuthAuthentication extends ParanoidModel {
 
   userId: string;
 
-  oauthClient: Pick<OAuthClient, "id" | "name" | "clientId" | "avatarUrl">;
+  oauthClient: Pick<OAuthClient, "id" | "name" | "clientId">;
 
   oauthClientId: string;
 

app/routes/authenticated.tsx

@@ -29,6 +29,7 @@ const Drafts = lazy(() => import("~/scenes/Drafts"));
 const Home = lazy(() => import("~/scenes/Home"));
 const Search = lazy(() => import("~/scenes/Search"));
 const Trash = lazy(() => import("~/scenes/Trash"));
+const OAuthAuthorize = lazy(() => import("~/scenes/Login/OAuthAuthorize"));
 
 const RedirectDocument = ({
   match,
@@ -52,6 +53,8 @@ function AuthenticatedRoutes() {
 
   return (
     <Switch>
+      <Route exact path="/oauth/authorize" component={OAuthAuthorize} />
+
       <WebsocketProvider>
         <AuthenticatedLayout>
           <React.Suspense

app/routes/index.tsx

@@ -6,15 +6,14 @@ import FullscreenLoading from "~/components/FullscreenLoading";
 import Route from "~/components/ProfiledRoute";
 import env from "~/env";
 import useQueryNotices from "~/hooks/useQueryNotices";
-import lazy from "~/utils/lazyWithRetry";
+import lazyWithRetry from "~/utils/lazyWithRetry";
 import { matchDocumentSlug as slug } from "~/utils/routeHelpers";
 
-const Authenticated = lazy(() => import("~/components/Authenticated"));
-const AuthenticatedRoutes = lazy(() => import("./authenticated"));
-const SharedDocument = lazy(() => import("~/scenes/Document/Shared"));
-const Login = lazy(() => import("~/scenes/Login"));
-const Logout = lazy(() => import("~/scenes/Logout"));
-const OAuthAuthorize = lazy(() => import("~/scenes/Login/OAuthAuthorize"));
+const Authenticated = lazyWithRetry(() => import("~/components/Authenticated"));
+const AuthenticatedRoutes = lazyWithRetry(() => import("./authenticated"));
+const SharedDocument = lazyWithRetry(() => import("~/scenes/Document/Shared"));
+const Login = lazyWithRetry(() => import("~/scenes/Login"));
+const Logout = lazyWithRetry(() => import("~/scenes/Logout"));
 
 export default function Routes() {
   useQueryNotices();
@@ -44,7 +43,6 @@ export default function Routes() {
           <Route exact path="/create" component={Login} />
           <Route exact path="/logout" component={Logout} />
           <Route exact path="/desktop-redirect" component={DesktopRedirect} />
-          <Route exact path="/oauth/authorize" component={OAuthAuthorize} />
 
           <Redirect exact from="/share/:shareId" to="/s/:shareId" />
           <Route exact path="/s/:shareId" component={SharedDocument} />

app/scenes/Collection/index.tsx

@@ -12,7 +12,7 @@ import {
 } from "react-router-dom";
 import styled from "styled-components";
 import breakpoint from "styled-components-breakpoint";
-import { IconTitleWrapper } from "@shared/components/Icon";
+import Icon, { IconTitleWrapper } from "@shared/components/Icon";
 import { s } from "@shared/styles";
 import { StatusFilter } from "@shared/types";
 import { colorPalette } from "@shared/utils/collections";
@@ -20,6 +20,7 @@ import Collection from "~/models/Collection";
 import { Action } from "~/components/Actions";
 import CenteredContent from "~/components/CenteredContent";
 import { CollectionBreadcrumb } from "~/components/CollectionBreadcrumb";
+import CollectionDescription from "~/components/CollectionDescription";
 import Heading from "~/components/Heading";
 import CollectionIcon from "~/components/Icons/CollectionIcon";
 import InputSearchPage from "~/components/InputSearchPage";
@@ -45,7 +46,6 @@ import DropToImport from "./components/DropToImport";
 import Empty from "./components/Empty";
 import MembershipPreview from "./components/MembershipPreview";
 import Notices from "./components/Notices";
-import Overview from "./components/Overview";
 import ShareButton from "./components/ShareButton";
 
 const IconPicker = React.lazy(() => import("~/components/IconPicker"));
@@ -66,6 +66,7 @@ const CollectionScene = observer(function _CollectionScene() {
   const location = useLocation();
   const { t } = useTranslation();
   const { documents, collections, ui } = useStores();
+  const [isFetching, setFetching] = React.useState(false);
   const [error, setError] = React.useState<Error | undefined>();
   const currentPath = location.pathname;
   const [, setLastVisitedPath] = useLastVisitedPath();
@@ -119,16 +120,21 @@ const CollectionScene = observer(function _CollectionScene() {
 
   React.useEffect(() => {
     async function fetchData() {
-      try {
-        setError(undefined);
-        await collections.fetch(id);
-      } catch (err) {
-        setError(err);
+      if ((!can || !collection) && !error && !isFetching) {
+        try {
+          setError(undefined);
+          setFetching(true);
+          await collections.fetch(id);
+        } catch (err) {
+          setError(err);
+        } finally {
+          setFetching(false);
+        }
       }
     }
 
     void fetchData();
-  }, []);
+  }, [collections, isFetching, collection, error, id, can]);
 
   useCommandBarActions([editCollection], [ui.activeCollectionId ?? "none"]);
 
@@ -139,7 +145,11 @@ const CollectionScene = observer(function _CollectionScene() {
   const hasOverview = can.update || collection?.hasDescription;
 
   const fallbackIcon = collection ? (
-    <CollectionIcon collection={collection} size={40} expanded />
+    <Icon
+      value={collection.icon ?? "collection"}
+      color={collection.color || undefined}
+      size={40}
+    />
   ) : null;
 
   const tabProps = (path: CollectionPath) => ({
@@ -158,7 +168,7 @@ const CollectionScene = observer(function _CollectionScene() {
       left={
         collection.isArchived ? (
           <CollectionBreadcrumb collection={collection} />
-        ) : (
+        ) : collection.isEmpty ? undefined : (
           <InputSearchPage
             source="collection"
             placeholder={`${t("Search in collection")}…`}
@@ -202,9 +212,7 @@ const CollectionScene = observer(function _CollectionScene() {
                     popoverPosition="bottom-start"
                     onChange={handleIconChange}
                     borderOnHover
-                  >
-                    {fallbackIcon}
-                  </IconPicker>
+                  />
                 </React.Suspense>
               ) : (
                 fallbackIcon
@@ -257,7 +265,7 @@ const CollectionScene = observer(function _CollectionScene() {
                 path={collectionPath(collection.path, CollectionPath.Overview)}
               >
                 {hasOverview ? (
-                  <Overview collection={collection} />
+                  <CollectionDescription collection={collection} />
                 ) : (
                   <Redirect
                     to={{

app/scenes/Document/components/Document.tsx

@@ -4,7 +4,7 @@ import isEqual from "lodash/isEqual";
 import { action, observable } from "mobx";
 import { observer } from "mobx-react";
 import { Node } from "prosemirror-model";
-import { AllSelection, TextSelection } from "prosemirror-state";
+import { AllSelection } from "prosemirror-state";
 import * as React from "react";
 import { WithTranslation, withTranslation } from "react-i18next";
 import {
@@ -146,17 +146,7 @@ class DocumentScene extends React.Component<Props> {
     }
   }
 
-  /**
-   * Replaces the given selection with a template, if no selection is provided
-   * then the template is inserted at the beginning of the document.
-   *
-   * @param template The template to use
-   * @param selection The selection to replace, if any
-   */
-  replaceSelection = (
-    template: Document | Revision,
-    selection?: TextSelection | AllSelection
-  ) => {
+  replaceDocument = (template: Document | Revision) => {
     const editorRef = this.editor.current;
 
     if (!editorRef) {
@@ -164,7 +154,6 @@ class DocumentScene extends React.Component<Props> {
     }
 
     const { view, schema } = editorRef;
-    const sel = selection ?? TextSelection.near(view.state.doc.resolve(0));
     const doc = Node.fromJSON(
       schema,
       ProsemirrorHelper.replaceTemplateVariables(
@@ -174,7 +163,11 @@ class DocumentScene extends React.Component<Props> {
     );
 
     if (doc) {
-      view.dispatch(view.state.tr.setSelection(sel).replaceSelectionWith(doc));
+      view.dispatch(
+        view.state.tr
+          .setSelection(new AllSelection(view.state.doc))
+          .replaceSelectionWith(doc)
+      );
     }
 
     this.isEditorDirty = true;
@@ -224,10 +217,7 @@ class DocumentScene extends React.Component<Props> {
     });
 
     if (response) {
-      await this.replaceSelection(
-        response.data,
-        new AllSelection(editorRef.view.state.doc)
-      );
+      await this.replaceDocument(response.data);
       toast.success(t("Document restored"));
       history.replace(this.props.document.url, history.location.state);
     }
@@ -528,7 +518,7 @@ class DocumentScene extends React.Component<Props> {
               }
               savingIsDisabled={document.isSaving || this.isEmpty}
               sharedTree={this.props.sharedTree}
-              onSelectTemplate={this.replaceSelection}
+              onSelectTemplate={this.replaceDocument}
               onSave={this.onSave}
             />
             <Main fullWidth={document.fullWidth} tocPosition={tocPos}>

app/scenes/Document/components/Header.tsx

@@ -387,7 +387,6 @@ function DocumentHeader({
                     neutral
                   />
                 )}
-                onSelectTemplate={onSelectTemplate}
                 onFindAndReplace={editor?.commands.openFindAndReplace}
                 showToggleEmbeds={canToggleEmbeds}
                 showDisplayOptions

app/scenes/Document/components/References.tsx

@@ -18,7 +18,7 @@ type Props = {
 };
 
 function References({ document }: Props) {
-  const { documents } = useStores();
+  const { collections, documents } = useStores();
   const user = useCurrentUser();
   const location = useLocation();
   const locationSidebarContext = useLocationSidebarContext();
@@ -27,8 +27,10 @@ function References({ document }: Props) {
     void documents.fetchBacklinks(document.id);
   }, [documents, document.id]);
 
-  const backlinks = document.backlinks;
-  const collection = document.collection;
+  const backlinks = documents.getBacklinkedDocuments(document.id);
+  const collection = document.collectionId
+    ? collections.get(document.collectionId)
+    : undefined;
   const children = collection
     ? collection.getChildrenForDocument(document.id)
     : [];

app/scenes/KeyboardShortcuts.tsx

@@ -415,10 +415,6 @@ function KeyboardShortcuts() {
             shortcut: <Key>---</Key>,
             label: t("Horizontal divider"),
           },
-          {
-            shortcut: <Key>{"|--"}</Key>,
-            label: t("Table"),
-          },
           {
             shortcut: <Key>{"```"}</Key>,
             label: t("Code block"),

app/scenes/Login/Login.tsx

@@ -42,10 +42,9 @@ import { getRedirectUrl, navigateToSubdomain } from "./urls";
 
 type Props = {
   children?: (config?: Config) => React.ReactNode;
-  onBack?: () => void;
 };
 
-function Login({ children, onBack }: Props) {
+function Login({ children }: Props) {
   const location = useLocation();
   const query = useQuery();
   const notice = query.get("notice");
@@ -111,7 +110,7 @@ function Login({ children, onBack }: Props) {
   if (error) {
     return (
       <Background>
-        <BackButton onBack={onBack} />
+        <BackButton />
         <ChangeLanguage locale={detectLanguage()} />
         <Centered>
           <PageTitle title={t("Login")} />
@@ -143,7 +142,7 @@ function Login({ children, onBack }: Props) {
   if (isCloudHosted && isCustomDomain && !config.name) {
     return (
       <Background>
-        <BackButton onBack={onBack} config={config} />
+        <BackButton config={config} />
         <ChangeLanguage locale={detectLanguage()} />
         <Centered>
           <PageTitle title={t("Custom domain setup")} />
@@ -161,7 +160,7 @@ function Login({ children, onBack }: Props) {
   if (Desktop.isElectron() && notice === "domain-required") {
     return (
       <Background>
-        <BackButton onBack={onBack} config={config} />
+        <BackButton config={config} />
         <ChangeLanguage locale={detectLanguage()} />
 
         <Centered as="form" onSubmit={handleGoSubdomain}>
@@ -200,7 +199,7 @@ function Login({ children, onBack }: Props) {
   if (emailLinkSentTo) {
     return (
       <Background>
-        <BackButton onBack={onBack} config={config} />
+        <BackButton config={config} />
         <Centered>
           <PageTitle title={t("Check your email")} />
           <CheckEmailIcon size={38} />
@@ -235,7 +234,7 @@ function Login({ children, onBack }: Props) {
 
   return (
     <Background>
-      <BackButton onBack={onBack} config={config} />
+      <BackButton config={config} />
       <ChangeLanguage locale={detectLanguage()} />
 
       <Centered gap={12}>

app/scenes/Login/OAuthAuthorize.tsx

@@ -1,51 +1,23 @@
+import { MoreIcon } from "outline-icons";
 import React from "react";
 import { Trans, useTranslation } from "react-i18next";
 import styled from "styled-components";
 import Flex from "@shared/components/Flex";
 import { s } from "@shared/styles";
-import { parseDomain } from "@shared/utils/domains";
-import type OAuthClient from "~/models/oauth/OAuthClient";
+import { Avatar, AvatarSize } from "~/components/Avatar";
+import { AvatarVariant } from "~/components/Avatar/Avatar";
 import ButtonLarge from "~/components/ButtonLarge";
-import ChangeLanguage from "~/components/ChangeLanguage";
 import Heading from "~/components/Heading";
 import LoadingIndicator from "~/components/LoadingIndicator";
 import PageTitle from "~/components/PageTitle";
 import Text from "~/components/Text";
-import env from "~/env";
 import useCurrentTeam from "~/hooks/useCurrentTeam";
-import { useLoggedInSessions } from "~/hooks/useLoggedInSessions";
 import useQuery from "~/hooks/useQuery";
 import useRequest from "~/hooks/useRequest";
 import { client } from "~/utils/ApiClient";
-import { BadRequestError, NotFoundError } from "~/utils/errors";
-import isCloudHosted from "~/utils/isCloudHosted";
-import { detectLanguage } from "~/utils/language";
-import Login from "./Login";
 import { OAuthScopeHelper } from "./OAuthScopeHelper";
 import { Background } from "./components/Background";
 import { Centered } from "./components/Centered";
-import { ConnectHeader } from "./components/ConnectHeader";
-import { TeamSwitcher } from "./components/TeamSwitcher";
-
-export default function OAuthAuthorize() {
-  const team = useCurrentTeam({ rejectOnEmpty: false });
-  const sessions = useLoggedInSessions();
-
-  // We're self-hosted or on a team subdomain already, just show the authorize screen.
-  if (team) {
-    return <Authorize />;
-  }
-
-  // Cloud hosted and on root domain – show the workspace switcher.
-  const isAppRoot =
-    parseDomain(window.location.hostname).host === parseDomain(env.URL).host;
-  const hasLoggedInSessions = Object.keys(sessions).length > 0;
-  if (isCloudHosted && hasLoggedInSessions && isAppRoot) {
-    return <TeamSwitcher sessions={sessions} />;
-  }
-
-  return <Login />;
-}
 
 /**
  * Authorize component is responsible for handling the OAuth authorization process.
@@ -68,17 +40,19 @@ function Authorize() {
     scope,
   } = Object.fromEntries(params);
   const [scopes] = React.useState(() => scope?.split(" ") ?? []);
-  const { error: clientError, data: response } = useRequest<{
-    data: OAuthClient;
-  }>(() => client.post("/oauthClients.info", { clientId, redirectUri }), true);
+  const {
+    error: clientError,
+    data: response,
+    request,
+  } = useRequest(() => client.post("/oauthClients.info", { clientId }));
+
+  React.useEffect(() => {
+    if (clientId) {
+      void request();
+    }
+  }, []);
 
   const handleCancel = () => {
-    if (redirectUri && !clientError) {
-      const url = new URL(redirectUri);
-      url.searchParams.set("error", "access_denied");
-      window.location.href = url.toString();
-      return;
-    }
     if (window.history.length) {
       window.history.back();
     } else {
@@ -103,7 +77,6 @@ function Authorize() {
     !redirectUri && "redirect_uri",
     !responseType && "response_type",
     !scope && "scope",
-    !state && "state",
   ].filter(Boolean);
 
   if (missingParams.length || clientError) {
@@ -111,20 +84,13 @@ function Authorize() {
       <Background>
         <Centered>
           <StyledHeading>{t("An error occurred")}</StyledHeading>
-          {clientError instanceof NotFoundError ? (
+          {clientError ? (
             <Text as="p" type="secondary">
               {t(
                 "The OAuth client could not be found, please check the provided client ID"
               )}
               <Pre>{clientId}</Pre>
             </Text>
-          ) : clientError instanceof BadRequestError ? (
-            <Text as="p" type="secondary">
-              {t(
-                "The OAuth client could not be loaded, please check the redirect URI is valid"
-              )}
-              <Pre>{redirectUri}</Pre>
-            </Text>
           ) : (
             <Text as="p" type="secondary">
               {t("Required OAuth parameters are missing")}
@@ -151,10 +117,30 @@ function Authorize() {
 
   return (
     <Background>
-      <ChangeLanguage locale={detectLanguage()} />
       <PageTitle title={t("Authorize")} />
       <Centered gap={12}>
-        <ConnectHeader team={team} oauthClient={response.data} />
+        <Text type="tertiary">
+          <Flex gap={12} align="center">
+            <Avatar
+              variant={AvatarVariant.Square}
+              model={{
+                avatarUrl: response.data.avatarUrl,
+                initial: response.data.name[0],
+              }}
+              size={AvatarSize.XXLarge}
+              alt={response.data.name}
+            />
+
+            <MoreIcon />
+
+            <Avatar
+              variant={AvatarVariant.Square}
+              model={team}
+              size={AvatarSize.XXLarge}
+              alt={team.name}
+            />
+          </Flex>
+        </Text>
         <StyledHeading>
           {t(`{{ appName }} wants to access {{ teamName }}`, {
             appName: name,
@@ -258,3 +244,5 @@ const Pre = styled.pre`
   font-size: 12px;
   white-space: pre-wrap;
 `;
+
+export default Authorize;

app/scenes/Login/components/BackButton.tsx

@@ -10,21 +10,12 @@ import isCloudHosted from "~/utils/isCloudHosted";
 
 type Props = {
   config?: Config;
-  onBack?: () => void;
 };
 
-export function BackButton({ onBack, config }: Props) {
+export function BackButton({ config }: Props) {
   const { t } = useTranslation();
   const isSubdomain = !!config?.hostname;
 
-  if (onBack) {
-    return (
-      <Link onClick={onBack}>
-        <BackIcon /> {t("Back")}
-      </Link>
-    );
-  }
-
   if (!isCloudHosted || parseDomain(window.location.origin).custom) {
     return null;
   }

app/scenes/Login/components/ConnectHeader.tsx

@@ -1,40 +0,0 @@
-import { MoreIcon } from "outline-icons";
-import * as React from "react";
-import Flex from "@shared/components/Flex";
-import Text from "@shared/components/Text";
-import type Team from "~/models/Team";
-import type OAuthClient from "~/models/oauth/OAuthClient";
-import { Avatar } from "~/components/Avatar";
-import { AvatarSize, AvatarVariant } from "~/components/Avatar/Avatar";
-
-type Props = {
-  team: Team;
-  oauthClient: OAuthClient;
-};
-
-export function ConnectHeader({ team, oauthClient }: Props) {
-  return (
-    <Text type="tertiary">
-      <Flex gap={12} align="center">
-        <Avatar
-          variant={AvatarVariant.Square}
-          model={{
-            avatarUrl: oauthClient.avatarUrl,
-            initial: oauthClient.name[0],
-          }}
-          size={AvatarSize.XXLarge}
-          alt={oauthClient.name}
-        />
-
-        <MoreIcon />
-
-        <Avatar
-          variant={AvatarVariant.Square}
-          model={team}
-          size={AvatarSize.XXLarge}
-          alt={team.name}
-        />
-      </Flex>
-    </Text>
-  );
-}

app/scenes/Login/components/TeamSwitcher.tsx

@@ -1,109 +0,0 @@
-import { ArrowIcon } from "outline-icons";
-import React from "react";
-import { useTranslation } from "react-i18next";
-import styled from "styled-components";
-import Text from "@shared/components/Text";
-import { s } from "@shared/styles";
-import { AvatarSize } from "~/components/Avatar";
-import Avatar, { AvatarVariant } from "~/components/Avatar/Avatar";
-import ChangeLanguage from "~/components/ChangeLanguage";
-import Heading from "~/components/Heading";
-import OutlineIcon from "~/components/Icons/OutlineIcon";
-import env from "~/env";
-import type { Sessions } from "~/hooks/useLoggedInSessions";
-import { detectLanguage } from "~/utils/language";
-import Login from "../Login";
-import { Background } from "./Background";
-import { Centered } from "./Centered";
-
-type Props = { sessions: Sessions };
-
-export function TeamSwitcher({ sessions }: Props) {
-  const { t } = useTranslation();
-  const [showLogin, setShowLogin] = React.useState(false);
-  const url = new URL(window.location.href);
-  const appName = env.APP_NAME;
-
-  if (showLogin) {
-    return <Login onBack={() => setShowLogin(false)} />;
-  }
-
-  return (
-    <Background>
-      <ChangeLanguage locale={detectLanguage()} />
-      <Centered>
-        <OutlineIcon size={AvatarSize.XXLarge} />
-
-        <StyledHeading>{t("Choose a workspace")}</StyledHeading>
-        <Text type="tertiary" as="p">
-          {t(
-            "Choose an {{ appName }} workspace or login to continue connecting this app",
-            { appName }
-          )}
-          .
-        </Text>
-        {Object.keys(sessions)?.map((teamId) => {
-          const session = sessions[teamId];
-          const location = session.url + url.pathname + url.search;
-          return (
-            <TeamLink href={location} key={session.url}>
-              <Avatar
-                variant={AvatarVariant.Square}
-                model={{
-                  avatarUrl: session.logoUrl,
-                  initial: session.name[0],
-                }}
-                size={AvatarSize.Large}
-                alt={session.name}
-              />
-              {session.name}
-              <StyledArrowIcon />
-            </TeamLink>
-          );
-        })}
-        <TeamLink onClick={() => setShowLogin(true)}>
-          <ArrowIcon size={AvatarSize.Large} />
-          {t("Login to workspace")}
-        </TeamLink>
-      </Centered>
-    </Background>
-  );
-}
-
-const StyledArrowIcon = styled(ArrowIcon)`
-  position: absolute;
-  transition: all 0.2s ease-in-out;
-  opacity: 0;
-  right: 12px;
-`;
-
-const TeamLink = styled.a`
-  position: relative;
-  left: -8px;
-  right: -8px;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 8px;
-  margin: 4px;
-  border-radius: 8px;
-  width: 100%;
-  color: ${s("text")};
-  font-weight: ${s("fontWeightMedium")};
-
-  &:hover {
-    background: ${s("listItemHoverBackground")};
-
-    ${StyledArrowIcon} {
-      opacity: 1;
-      right: 8px;
-    }
-  }
-`;
-
-const StyledHeading = styled(Heading).attrs({
-  as: "h2",
-  centered: true,
-})`
-  margin-top: 0;
-`;

app/scenes/Settings/APIAndApps.tsx

@@ -67,7 +67,9 @@ function APIAndApps() {
           />
         </Text>
       ) : (
-        <Trans>API keys have been disabled by an admin for your account</Trans>
+        <Trans>
+          {t("API keys have been disabled by an admin for your account")}
+        </Trans>
       )}
       <PaginatedList<ApiKey>
         fetch={apiKeys.fetchPage}

app/scenes/Settings/Application.tsx

@@ -80,16 +80,11 @@ const Application = observer(function Application({ oauthClient }: Props) {
     async (data: FormData) => {
       try {
         await oauthClient.save(data);
-        toast.success(
-          oauthClient.published
-            ? t("Application published")
-            : t("Application updated")
-        );
       } catch (error) {
         toast.error(error.message);
       }
     },
-    [oauthClient, t]
+    [oauthClient]
   );
 
   const handleRotateSecret = React.useCallback(async () => {
@@ -178,6 +173,7 @@ const Application = observer(function Application({ oauthClient }: Props) {
           <Input
             type="text"
             {...register("description", {
+              required: true,
               maxLength: OAuthClientValidation.maxDescriptionLength,
             })}
             flex

app/scenes/Settings/Integrations.tsx

@@ -1,72 +0,0 @@
-import groupBy from "lodash/groupBy";
-import * as React from "react";
-import { Trans, useTranslation } from "react-i18next";
-import styled from "styled-components";
-import Flex from "@shared/components/Flex";
-import Heading from "~/components/Heading";
-import InputSearch from "~/components/InputSearch";
-import Scene from "~/components/Scene";
-import Text from "~/components/Text";
-import useSettingsConfig from "~/hooks/useSettingsConfig";
-import useStores from "~/hooks/useStores";
-import { settingsPath } from "~/utils/routeHelpers";
-import IntegrationCard from "./components/IntegrationCard";
-import { StickyFilters } from "./components/StickyFilters";
-
-export function Integrations() {
-  const { t } = useTranslation();
-  const { integrations } = useStores();
-  const items = useSettingsConfig();
-  const [query, setQuery] = React.useState("");
-
-  const handleQuery = (event: React.ChangeEvent<HTMLInputElement>) => {
-    setQuery(event.target.value);
-  };
-
-  const groupedItems = groupBy(
-    items.filter(
-      (item) =>
-        item.group === "Integrations" &&
-        item.enabled &&
-        item.path !== settingsPath("integrations") &&
-        item.name.toLowerCase().includes(query.toLowerCase())
-    ),
-    (item) =>
-      item.pluginId && integrations.findByService(item.pluginId)
-        ? "connected"
-        : "available"
-  );
-
-  return (
-    <Scene title={t("Integrations")}>
-      <Heading>{t("Integrations")}</Heading>
-      <Text as="p" type="secondary">
-        <Trans>
-          Configure a variety of integrations with third-party services.
-        </Trans>
-      </Text>
-      <StickyFilters gap={8}>
-        <InputSearch
-          short
-          value={query}
-          placeholder={`${t("Filter")}…`}
-          onChange={handleQuery}
-        />
-      </StickyFilters>
-
-      <Cards gap={30} wrap>
-        {groupedItems.connected?.map((item) => (
-          <IntegrationCard key={item.path} integration={item} isConnected />
-        ))}
-        {groupedItems.available?.map((item) => (
-          <IntegrationCard key={item.path} integration={item} />
-        ))}
-      </Cards>
-    </Scene>
-  );
-}
-
-const Cards = styled(Flex)`
-  margin-top: 20px;
-  width: "100%";
-`;

app/scenes/Settings/Zapier.tsx

@@ -1,22 +1,20 @@
 import * as React from "react";
 import { Helmet } from "react-helmet-async";
 import { Trans } from "react-i18next";
-import { IntegrationScene } from "~/scenes/Settings/components/IntegrationScene";
 import Heading from "~/components/Heading";
+import ZapierIcon from "~/components/Icons/ZapierIcon";
+import Scene from "~/components/Scene";
 import Text from "~/components/Text";
 import env from "~/env";
-import useCurrentUser from "~/hooks/useCurrentUser";
 import useStores from "~/hooks/useStores";
-import ZapierIcon from "./Icon";
 
 function Zapier() {
   const { ui } = useStores();
-  const user = useCurrentUser();
   const { resolvedTheme } = ui;
   const appName = env.APP_NAME;
 
   return (
-    <IntegrationScene title="Zapier" icon={<ZapierIcon />}>
+    <Scene title="Zapier" icon={<ZapierIcon />}>
       <Heading>Zapier</Heading>
       <Helmet>
         <script
@@ -41,15 +39,14 @@ function Zapier() {
       <zapier-app-directory
         app="outline"
         link-target="new-tab"
-        sign-up-email={user.email}
-        theme={resolvedTheme === "system" ? undefined : resolvedTheme}
+        theme={resolvedTheme}
         hide="notion,confluence-cloud,confluence,google-docs,slack"
         applimit={6}
         introcopy="hide"
         create-without-template="show"
         use-this-zap="show"
       />
-    </IntegrationScene>
+    </Scene>
   );
 }
 

app/scenes/Settings/components/IntegrationCard.tsx

@@ -1,93 +0,0 @@
-import * as React from "react";
-import { useTranslation } from "react-i18next";
-import { Link } from "react-router-dom";
-import styled from "styled-components";
-import { s, ellipsis } from "@shared/styles";
-import { ConfigItem } from "~/hooks/useSettingsConfig";
-import Button from "../../../components/Button";
-import Flex from "../../../components/Flex";
-import Text from "../../../components/Text";
-
-type Props = {
-  integration: ConfigItem;
-  isConnected?: boolean;
-};
-
-function IntegrationCard({ integration, isConnected }: Props) {
-  const { t } = useTranslation();
-
-  return (
-    <Card as={Link} to={integration.path}>
-      <Flex align="center" gap={8}>
-        <integration.icon size={48} />
-        <Flex auto column>
-          <Name>{integration.name}</Name>
-          {isConnected && <Status>{t("Connected")}</Status>}
-        </Flex>
-        <Button as="span" neutral>
-          {isConnected ? t("Configure") : t("Connect")}
-        </Button>
-      </Flex>
-
-      <Description>{integration.description}</Description>
-    </Card>
-  );
-}
-
-export default IntegrationCard;
-
-const Card = styled.div`
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-  padding: 20px;
-  width: 300px;
-  background: ${s("background")};
-  border: 1px solid ${s("inputBorder")};
-  color: ${s("text")};
-  border-radius: 8px;
-  transition: box-shadow 200ms ease;
-  cursor: var(--pointer);
-
-  &:hover {
-    box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 4px, rgba(0, 0, 0, 0.06) 0px 4px 8px;
-  }
-`;
-
-const Name = styled(Text)`
-  margin: 0;
-  font-size: 16px;
-  font-weight: 600;
-  color: ${s("text")};
-  ${ellipsis()}
-`;
-
-const Description = styled(Text)`
-  margin: 8px 0 0;
-  font-size: 15px;
-  max-width: 100%;
-  color: ${s("textTertiary")};
-`;
-
-const Status = styled(Text).attrs({
-  type: "secondary",
-  size: "small",
-  as: "span",
-})`
-  display: inline-flex;
-  align-items: center;
-
-  &::after {
-    content: "";
-    display: inline-block;
-    width: 17px;
-    height: 17px;
-
-    background: radial-gradient(
-      circle at center,
-      ${s("accent")} 0 33%,
-      transparent 33%
-    );
-    border-radius: 50%;
-  }
-`;

app/scenes/Settings/components/IntegrationScene.tsx

@@ -1,33 +0,0 @@
-import { SettingsIcon } from "outline-icons";
-import * as React from "react";
-import { useTranslation } from "react-i18next";
-import Breadcrumb from "~/components/Breadcrumb";
-import Scene from "~/components/Scene";
-import { settingsPath } from "~/utils/routeHelpers";
-
-export function IntegrationScene({
-  children,
-  ...rest
-}: React.ComponentProps<typeof Scene>) {
-  const { t } = useTranslation();
-
-  return (
-    <Scene
-      left={
-        <Breadcrumb
-          items={[
-            {
-              type: "route",
-              title: t("Integrations"),
-              icon: <SettingsIcon />,
-              to: settingsPath("integrations"),
-            },
-          ]}
-        />
-      }
-      {...rest}
-    >
-      {children}
-    </Scene>
-  );
-}

app/stores/CollectionsStore.ts

@@ -186,13 +186,6 @@ export default class CollectionsStore extends Store<Collection> {
       statusFilter: [CollectionStatusFilter.Archived],
     });
 
-  get(id: string): Collection | undefined {
-    return (
-      this.data.get(id) ??
-      this.orderedData.find((collection) => id.endsWith(collection.urlId))
-    );
-  }
-
   @computed
   get archived(): Collection[] {
     return orderBy(this.orderedData, "archivedAt", "desc").filter(

app/stores/DocumentsStore.ts

@@ -279,14 +279,19 @@ export default class DocumentsStore extends Store<Document> {
 
   @action
   fetchBacklinks = async (documentId: string): Promise<void> => {
-    const documents = await this.fetchAll({
+    const res = await client.post(`/documents.list`, {
       backlinkDocumentId: documentId,
     });
+    invariant(res?.data, "Document list not available");
+    const { data } = res;
 
     runInAction("DocumentsStore#fetchBacklinks", () => {
+      data.forEach(this.add);
+      this.addPolicies(res.policies);
+
       this.backlinks.set(
         documentId,
-        documents.map((doc) => doc.id)
+        data.map((doc: Partial<Document>) => doc.id)
       );
     });
   };
@@ -295,8 +300,8 @@ export default class DocumentsStore extends Store<Document> {
     const documentIds = this.backlinks.get(documentId) || [];
     return orderBy(
       compact(documentIds.map((id) => this.data.get(id))),
-      "title",
-      "asc"
+      "updatedAt",
+      "desc"
     );
   }
 

app/stores/IntegrationsStore.ts

@@ -10,12 +10,6 @@ class IntegrationsStore extends Store<Integration> {
     super(rootStore, Integration);
   }
 
-  findByService(service: string) {
-    return this.orderedData.find(
-      (integration) => integration.service === service
-    );
-  }
-
   @computed
   get orderedData(): Integration[] {
     return naturalSort(Array.from(this.data.values()), "name");

app/stores/RootStore.ts

@@ -154,7 +154,7 @@ export default class RootStore {
   private getStoreNameForModelName(modelName: string) {
     for (const key of Object.keys(this)) {
       const store = this[key as keyof RootStore];
-      if (store && "modelName" in store && store.modelName === modelName) {
+      if ("modelName" in store && store.modelName === modelName) {
         return key as keyof RootStore;
       }
     }

app/stores/base/Store.ts

@@ -104,9 +104,6 @@ export default abstract class Store<T extends Model> {
           if ("deletedAt" in item && item.deletedAt) {
             return false;
           }
-          if ("archivedAt" in item && item.archivedAt) {
-            return false;
-          }
           return true;
         })
         .slice(0, options?.maxResults);
@@ -117,9 +114,6 @@ export default abstract class Store<T extends Model> {
         if ("deletedAt" in item && item.deletedAt) {
           return false;
         }
-        if ("archivedAt" in item && item.archivedAt) {
-          return false;
-        }
         if ("searchContent" in item) {
           const seachables =
             typeof item.searchContent === "string"

app/utils/PluginManager.ts

@@ -3,7 +3,6 @@ import sortBy from "lodash/sortBy";
 import { action, observable } from "mobx";
 import Team from "~/models/Team";
 import User from "~/models/User";
-import { LazyComponent } from "~/components/LazyLoad";
 import { useComputed } from "~/hooks/useComputed";
 import Logger from "./Logger";
 import isCloudHosted from "./isCloudHosted";
@@ -28,10 +27,8 @@ type PluginValueMap = {
     after?: string;
     /** The displayed icon of the plugin. */
     icon: React.ElementType;
-    /** The lazy loaded settings screen component. */
-    component: LazyComponent<React.ComponentType>;
-    /** The description that will show on the plugins card. */
-    description?: string;
+    /** The settings screen somponent, should be lazy loaded. */
+    component: React.LazyExoticComponent<React.ComponentType>;
     /** Whether the plugin is enabled in the current context. */
     enabled?: (team: Team, user: User) => boolean;
   };

package.json

@@ -14,7 +14,6 @@
     "dev:backend": "NODE_ENV=development nodemon --exec \"yarn build:server && yarn dev\" -e js,ts,tsx --ignore *.test.ts --ignore data/ --ignore build/ --ignore app/ --ignore shared/editor --ignore server/migrations",
     "dev:watch": "NODE_ENV=development yarn concurrently -n backend,frontend \"yarn dev:backend\" \"yarn vite:dev\"",
     "lint": "eslint app server shared plugins",
-    "lint:changed": "git diff --name-only --diff-filter=ACMRTUXB | grep -E '\\.(js|jsx|ts|tsx)$' | xargs -r yarn eslint --fix",
     "prepare": "husky install",
     "postinstall": "yarn patch-package",
     "install-local-ssl": "node ./server/scripts/install-local-ssl.js",
@@ -49,18 +48,18 @@
     "> 0.25%, not dead"
   ],
   "dependencies": {
-    "@aws-sdk/client-s3": "3.812.0",
-    "@aws-sdk/lib-storage": "3.812.0",
-    "@aws-sdk/s3-presigned-post": "3.812.0",
-    "@aws-sdk/s3-request-presigner": "3.812.0",
-    "@aws-sdk/signature-v4-crt": "^3.812.0",
-    "@babel/core": "^7.27.1",
-    "@babel/plugin-proposal-decorators": "^7.27.1",
-    "@babel/plugin-transform-class-properties": "^7.27.1",
-    "@babel/plugin-transform-destructuring": "^7.27.1",
-    "@babel/plugin-transform-regenerator": "^7.27.1",
-    "@babel/preset-env": "^7.27.2",
-    "@babel/preset-react": "^7.27.1",
+    "@aws-sdk/client-s3": "3.787.0",
+    "@aws-sdk/lib-storage": "3.787.0",
+    "@aws-sdk/s3-presigned-post": "3.787.0",
+    "@aws-sdk/s3-request-presigner": "3.787.0",
+    "@aws-sdk/signature-v4-crt": "^3.787.0",
+    "@babel/core": "^7.26.10",
+    "@babel/plugin-proposal-decorators": "^7.25.9",
+    "@babel/plugin-transform-class-properties": "^7.25.9",
+    "@babel/plugin-transform-destructuring": "^7.25.9",
+    "@babel/plugin-transform-regenerator": "^7.27.0",
+    "@babel/preset-env": "^7.26.9",
+    "@babel/preset-react": "^7.26.3",
     "@benrbray/prosemirror-math": "^0.2.2",
     "@bull-board/api": "^6.7.10",
     "@bull-board/koa": "^6.7.10",
@@ -87,15 +86,15 @@
     "@outlinewiki/koa-passport": "^4.2.1",
     "@outlinewiki/passport-azure-ad-oauth2": "^0.1.0",
     "@radix-ui/react-select": "^2.1.4",
-    "@radix-ui/react-visually-hidden": "^1.2.2",
+    "@radix-ui/react-visually-hidden": "^1.2.0",
     "@renderlesskit/react": "^0.11.0",
     "@sentry/node": "^7.120.3",
     "@sentry/react": "^7.120.3",
-    "@tanstack/react-table": "^8.21.3",
+    "@tanstack/react-table": "^8.20.6",
     "@tanstack/react-virtual": "^3.13.6",
     "@tippyjs/react": "^4.2.6",
     "@types/form-data": "^2.5.2",
-    "@types/mailparser": "^3.4.6",
+    "@types/mailparser": "^3.4.5",
     "@types/sanitize-filename": "^1.6.3",
     "@vitejs/plugin-react": "^3.1.0",
     "addressparser": "^1.0.1",
@@ -142,7 +141,7 @@
     "jsdom": "^22.1.0",
     "jsonwebtoken": "^9.0.0",
     "jszip": "^3.10.1",
-    "katex": "^0.16.22",
+    "katex": "^0.16.21",
     "kbar": "0.1.0-beta.41",
     "koa": "^2.16.1",
     "koa-body": "^6.0.1",
@@ -176,7 +175,7 @@
     "passport-oauth2": "^1.8.0",
     "passport-slack-oauth2": "^1.2.0",
     "patch-package": "^7.0.2",
-    "pg": "^8.15.6",
+    "pg": "^8.14.1",
     "pg-tsquery": "^8.4.2",
     "pluralize": "^8.0.0",
     "png-chunks-extract": "^1.0.0",
@@ -198,20 +197,20 @@
     "query-string": "^7.1.3",
     "randomstring": "1.3.1",
     "rate-limiter-flexible": "^2.4.2",
-    "react": "^18.2.0",
+    "react": "^17.0.2",
     "react-avatar-editor": "^13.0.2",
     "react-color": "^2.17.3",
     "react-day-picker": "^8.10.1",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
-    "react-dom": "^18.2.0",
+    "react-dom": "^17.0.2",
     "react-dropzone": "^11.7.1",
     "react-helmet-async": "^2.0.5",
     "react-hook-form": "^7.54.2",
     "react-i18next": "^12.3.1",
-    "react-medium-image-zoom": "5.2.14",
+    "react-medium-image-zoom": "5.2.13",
     "react-merge-refs": "^2.1.1",
-    "react-portal": "^4.3.0",
+    "react-portal": "^4.2.2",
     "react-router-dom": "^5.3.4",
     "react-virtualized-auto-sizer": "^1.0.26",
     "react-waypoint": "^10.3.0",
@@ -229,7 +228,6 @@
     "sequelize": "^6.37.3",
     "sequelize-cli": "^6.6.2",
     "sequelize-encrypted": "^1.0.0",
-    "sequelize-strict-attributes": "^1.0.2",
     "sequelize-typescript": "^2.1.6",
     "slug": "^5.3.0",
     "slugify": "^1.6.6",
@@ -250,9 +248,9 @@
     "umzug": "^3.8.2",
     "utility-types": "^3.11.0",
     "uuid": "^8.3.2",
-    "validator": "13.15.0",
+    "validator": "13.12.0",
     "vaul": "^1.1.2",
-    "vite": "^6.3.4",
+    "vite": "^6.3.3",
     "vite-plugin-pwa": "^0.21.2",
     "winston": "^3.17.0",
     "ws": "^7.5.10",
@@ -264,12 +262,11 @@
     "zod": "^3.24.2"
   },
   "devDependencies": {
-    "@babel/cli": "^7.27.2",
-    "@babel/preset-typescript": "^7.27.1",
+    "@babel/cli": "^7.27.0",
+    "@babel/preset-typescript": "^7.27.0",
     "@faker-js/faker": "^8.4.1",
     "@relative-ci/agent": "^4.3.0",
-    "@testing-library/jest-dom": "^6.4.2",
-    "@testing-library/react": "^14.0.0",
+    "@testing-library/react": "^12.0.0",
     "@types/addressparser": "^1.0.3",
     "@types/body-scroll-lock": "^3.1.2",
     "@types/crypto-js": "^4.2.2",
@@ -309,10 +306,10 @@
     "@types/png-chunks-extract": "^1.0.2",
     "@types/quoted-printable": "^1.0.2",
     "@types/randomstring": "^1.3.0",
-    "@types/react": "^18.2.0",
+    "@types/react": "^17.0.34",
     "@types/react-avatar-editor": "^13.0.4",
     "@types/react-color": "^3.0.13",
-    "@types/react-dom": "^18.2.0",
+    "@types/react-dom": "^17.0.11",
     "@types/react-helmet": "^6.1.11",
     "@types/react-portal": "^4.0.7",
     "@types/react-router-dom": "^5.3.3",
@@ -331,7 +328,7 @@
     "@types/tmp": "^0.2.6",
     "@types/turndown": "^5.0.5",
     "@types/utf8": "^3.0.3",
-    "@types/validator": "^13.15.0",
+    "@types/validator": "^13.12.1",
     "@types/yauzl": "^2.10.3",
     "@typescript-eslint/eslint-plugin": "^6.21.0",
     "@typescript-eslint/parser": "^6.21.0",
@@ -345,7 +342,7 @@
     "discord-api-types": "^0.37.119",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^8.10.0",
-    "eslint-import-resolver-typescript": "^3.10.1",
+    "eslint-import-resolver-typescript": "^3.8.0",
     "eslint-plugin-es": "^4.1.0",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
@@ -360,10 +357,10 @@
     "jest-environment-jsdom": "^29.7.0",
     "jest-fetch-mock": "^3.0.3",
     "lint-staged": "^13.3.0",
-    "nodemon": "^3.1.10",
+    "nodemon": "^3.1.9",
     "postinstall-postinstall": "^2.1.0",
     "prettier": "^2.8.8",
-    "react-refresh": "^0.17.0",
+    "react-refresh": "^0.14.2",
     "rimraf": "^2.5.4",
     "rollup-plugin-webpack-stats": "^2.0.5",
     "terser": "^5.39.0",
@@ -381,6 +378,6 @@
     "qs": "6.9.7",
     "prismjs": "1.30.0"
   },
-  "version": "0.84.0",
+  "version": "0.83.0",
   "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }

plugins/email/server/auth/email.ts

@@ -1,5 +1,5 @@
 import Router from "koa-router";
-import { Client, NotificationEventType } from "@shared/types";
+import { NotificationEventType } from "@shared/types";
 import { parseDomain } from "@shared/utils/domains";
 import InviteAcceptedEmail from "@server/emails/templates/InviteAcceptedEmail";
 import SigninEmail from "@server/emails/templates/SigninEmail";
@@ -86,64 +86,66 @@ router.post(
   }
 );
 
-const emailCallback = async (ctx: APIContext<T.EmailCallbackReq>) => {
-  const token = ctx.input.query?.token || ctx.input.body?.token;
-  const client = ctx.input.query?.client || ctx.input.body?.client;
-  const follow = ctx.input.query?.follow || ctx.input.body?.follow;
+router.get(
+  "email.callback",
+  validate(T.EmailCallbackSchema),
+  async (ctx: APIContext<T.EmailCallbackReq>) => {
+    const { token, client, follow } = ctx.input.query;
 
-  // The link in the email does not include the follow query param, this
-  // is to help prevent anti-virus, and email clients from pre-fetching the link
-  // and spending the token before the user clicks on it. Instead we redirect
-  // to the same URL with the follow query param added from the client side.
-  if (!follow) {
-    return ctx.redirectOnClient(ctx.request.href + "&follow=true", "POST");
-  }
+    // The link in the email does not include the follow query param, this
+    // is to help prevent anti-virus, and email clients from pre-fetching the link
+    // and spending the token before the user clicks on it. Instead we redirect
+    // to the same URL with the follow query param added from the client side.
+    if (!follow) {
+      return ctx.redirectOnClient(ctx.request.href + "&follow=true");
+    }
 
-  let user!: User;
+    let user!: User;
 
-  try {
-    user = await getUserForEmailSigninToken(token as string);
-  } catch (err) {
-    ctx.redirect(`/?notice=expired-token`);
-    return;
-  }
+    try {
+      user = await getUserForEmailSigninToken(token as string);
+    } catch (err) {
+      ctx.redirect(`/?notice=expired-token`);
+      return;
+    }
 
-  if (!user.team.emailSigninEnabled) {
-    return ctx.redirect("/?notice=auth-error");
-  }
+    if (!user.team.emailSigninEnabled) {
+      return ctx.redirect("/?notice=auth-error");
+    }
 
-  if (user.isSuspended) {
-    return ctx.redirect("/?notice=user-suspended");
-  }
+    if (user.isSuspended) {
+      return ctx.redirect("/?notice=user-suspended");
+    }
 
-  if (user.isInvited) {
-    await new WelcomeEmail({
-      to: user.email,
-      role: user.role,
-      teamUrl: user.team.url,
-    }).schedule();
-
-    const inviter = await user.$get("invitedBy");
-    if (inviter?.subscribedToEventType(NotificationEventType.InviteAccepted)) {
-      await new InviteAcceptedEmail({
-        to: inviter.email,
-        inviterId: inviter.id,
-        invitedName: user.name,
+    if (user.isInvited) {
+      await new WelcomeEmail({
+        to: user.email,
+        role: user.role,
         teamUrl: user.team.url,
       }).schedule();
-    }
-  }
 
-  // set cookies on response and redirect to team subdomain
-  await signIn(ctx, "email", {
-    user,
-    team: user.team,
-    isNewTeam: false,
-    isNewUser: false,
-    client: client ?? Client.Web,
-  });
-};
-router.get("email.callback", validate(T.EmailCallbackSchema), emailCallback);
-router.post("email.callback", validate(T.EmailCallbackSchema), emailCallback);
+      const inviter = await user.$get("invitedBy");
+      if (
+        inviter?.subscribedToEventType(NotificationEventType.InviteAccepted)
+      ) {
+        await new InviteAcceptedEmail({
+          to: inviter.email,
+          inviterId: inviter.id,
+          invitedName: user.name,
+          teamUrl: user.team.url,
+        }).schedule();
+      }
+    }
+
+    // set cookies on response and redirect to team subdomain
+    await signIn(ctx, "email", {
+      user,
+      team: user.team,
+      isNewTeam: false,
+      isNewUser: false,
+      client,
+    });
+  }
+);
 
 export default router;

plugins/email/server/auth/schema.ts

@@ -13,12 +13,7 @@ export type EmailReq = z.infer<typeof EmailSchema>;
 
 export const EmailCallbackSchema = BaseSchema.extend({
   query: z.object({
-    token: z.string().optional(),
-    client: z.nativeEnum(Client).default(Client.Web),
-    follow: z.string().default(""),
-  }),
-  body: z.object({
-    token: z.string().optional(),
+    token: z.string(),
     client: z.nativeEnum(Client).default(Client.Web),
     follow: z.string().default(""),
   }),

plugins/github/client/Settings.tsx

@@ -4,7 +4,6 @@ import * as React from "react";
 import { useTranslation, Trans } from "react-i18next";
 import { IntegrationService } from "@shared/types";
 import { ConnectedButton } from "~/scenes/Settings/components/ConnectedButton";
-import { IntegrationScene } from "~/scenes/Settings/components/IntegrationScene";
 import { AvatarSize } from "~/components/Avatar";
 import Flex from "~/components/Flex";
 import Heading from "~/components/Heading";
@@ -12,6 +11,7 @@ import List from "~/components/List";
 import ListItem from "~/components/List/Item";
 import Notice from "~/components/Notice";
 import PlaceholderText from "~/components/PlaceholderText";
+import Scene from "~/components/Scene";
 import TeamLogo from "~/components/TeamLogo";
 import Text from "~/components/Text";
 import Time from "~/components/Time";
@@ -38,7 +38,7 @@ function GitHub() {
   }, [integrations]);
 
   return (
-    <IntegrationScene title="GitHub" icon={<GitHubIcon />}>
+    <Scene title="GitHub" icon={<GitHubIcon />}>
       <Heading>GitHub</Heading>
 
       {error === "access_denied" && (
@@ -146,7 +146,7 @@ function GitHub() {
           </Trans>
         </Notice>
       )}
-    </IntegrationScene>
+    </Scene>
   );
 }
 

plugins/github/client/index.tsx

@@ -1,4 +1,4 @@
-import { createLazyComponent } from "~/components/LazyLoad";
+import * as React from "react";
 import { Hook, PluginManager } from "~/utils/PluginManager";
 import config from "../plugin.json";
 import Icon from "./Icon";
@@ -10,9 +10,7 @@ PluginManager.add([
     value: {
       group: "Integrations",
       icon: Icon,
-      description:
-        "Connect your GitHub account to Outline to enable rich, realtime, issue and pull request previews inside documents.",
-      component: createLazyComponent(() => import("./Settings")),
+      component: React.lazy(() => import("./Settings")),
     },
   },
 ]);

plugins/github/server/api/github.ts

@@ -1,12 +1,13 @@
 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 apexAuthRedirect from "@server/middlewares/apexAuthRedirect";
+import Logger from "@server/logging/Logger";
 import auth from "@server/middlewares/authentication";
 import { transaction } from "@server/middlewares/transaction";
 import validate from "@server/middlewares/validate";
-import { IntegrationAuthentication, Integration } from "@server/models";
+import { IntegrationAuthentication, Integration, Team } from "@server/models";
 import { APIContext } from "@server/types";
 import { GitHubUtils } from "../../shared/GitHubUtils";
 import { GitHub } from "../github";
@@ -16,17 +17,10 @@ const router = new Router();
 
 router.get(
   "github.callback",
-  auth({ optional: true }),
-  validate(T.GitHubCallbackSchema),
-  apexAuthRedirect<T.GitHubCallbackReq>({
-    getTeamId: (ctx) => ctx.input.query.state,
-    getRedirectPath: (ctx, team) =>
-      GitHubUtils.callbackUrl({
-        baseUrl: team.url,
-        params: ctx.request.querystring,
-      }),
-    getErrorPath: () => GitHubUtils.errorUrl("unauthenticated"),
+  auth({
+    optional: true,
   }),
+  validate(T.GitHubCallbackSchema),
   transaction(),
   async (ctx: APIContext<T.GitHubCallbackReq>) => {
     const {
@@ -49,6 +43,33 @@ router.get(
       return;
     }
 
+    // this code block accounts for the root domain being unable to
+    // access authentication for subdomains. We must forward to the appropriate
+    // subdomain to complete the oauth flow
+    if (!user) {
+      if (teamId) {
+        try {
+          const team = await Team.findByPk(teamId, {
+            rejectOnEmpty: true,
+            transaction,
+          });
+          return parseDomain(ctx.host).teamSubdomain === team.subdomain
+            ? ctx.redirect("/")
+            : ctx.redirectOnClient(
+                GitHubUtils.callbackUrl({
+                  baseUrl: team.url,
+                  params: ctx.request.querystring,
+                })
+              );
+        } catch (err) {
+          Logger.error(`Error fetching team for teamId: ${teamId}!`, err);
+          return ctx.redirect(GitHubUtils.errorUrl("unauthenticated"));
+        }
+      } else {
+        return ctx.redirect(GitHubUtils.errorUrl("unauthenticated"));
+      }
+    }
+
     const client = await GitHub.authenticateAsUser(code!, teamId);
     const installationsByUser = await client.requestAppInstallations();
     const installation = find(

plugins/googleanalytics/client/Settings.tsx

@@ -6,12 +6,12 @@ import { useTranslation, Trans } from "react-i18next";
 import { toast } from "sonner";
 import { IntegrationType, IntegrationService } from "@shared/types";
 import Integration from "~/models/Integration";
-import { IntegrationScene } from "~/scenes/Settings/components/IntegrationScene";
 import SettingRow from "~/scenes/Settings/components/SettingRow";
 import Button from "~/components/Button";
 import Heading from "~/components/Heading";
 import GoogleIcon from "~/components/Icons/GoogleIcon";
 import Input from "~/components/Input";
+import Scene from "~/components/Scene";
 import Text from "~/components/Text";
 import useStores from "~/hooks/useStores";
 
@@ -40,6 +40,12 @@ function GoogleAnalytics() {
     },
   });
 
+  React.useEffect(() => {
+    void integrations.fetchPage({
+      type: IntegrationType.Analytics,
+    });
+  }, [integrations]);
+
   React.useEffect(() => {
     reset({ measurementId: integration?.settings.measurementId });
   }, [integration, reset]);
@@ -69,7 +75,7 @@ function GoogleAnalytics() {
   );
 
   return (
-    <IntegrationScene title={t("Google Analytics")} icon={<GoogleIcon />}>
+    <Scene title={t("Google Analytics")} icon={<GoogleIcon />}>
       <Heading>{t("Google Analytics")}</Heading>
 
       <Text as="p" type="secondary">
@@ -94,7 +100,7 @@ function GoogleAnalytics() {
           {formState.isSubmitting ? `${t("Saving")}…` : t("Save")}
         </Button>
       </form>
-    </IntegrationScene>
+    </Scene>
   );
 }
 

plugins/googleanalytics/client/index.tsx

@@ -1,4 +1,4 @@
-import { createLazyComponent } from "~/components/LazyLoad";
+import * as React from "react";
 import { Hook, PluginManager } from "~/utils/PluginManager";
 import config from "../plugin.json";
 import Icon from "./Icon";
@@ -10,9 +10,7 @@ PluginManager.add([
     value: {
       group: "Integrations",
       icon: Icon,
-      description:
-        "Measure adoption and engagement by sending view and event analytics directly to your GA4 dashboard.",
-      component: createLazyComponent(() => import("./Settings")),
+      component: React.lazy(() => import("./Settings")),
     },
   },
 ]);

plugins/googleanalytics/plugin.json

@@ -1,5 +1,5 @@
 {
-  "id": "google-analytics",
+  "id": "googleanalytics",
   "name": "Google Analytics",
   "priority": 30,
   "description": "Adds support for reporting analytics to a Google."

plugins/linear/client/index.tsx

@@ -1,4 +1,4 @@
-import { createLazyComponent } from "~/components/LazyLoad";
+import * as React from "react";
 import { Hook, PluginManager } from "~/utils/PluginManager";
 import config from "../plugin.json";
 import Icon from "./Icon";
@@ -10,9 +10,7 @@ PluginManager.add([
     value: {
       group: "Integrations",
       icon: Icon,
-      description:
-        "Connect your Linear account to Outline to enable rich, realtime, issue previews inside documents.",
-      component: createLazyComponent(() => import("./Settings")),
+      component: React.lazy(() => import("./Settings")),
     },
   },
 ]);

plugins/linear/server/api/linear.ts

@@ -1,10 +1,11 @@
 import Router from "koa-router";
 import { IntegrationService, IntegrationType } from "@shared/types";
-import apexAuthRedirect from "@server/middlewares/apexAuthRedirect";
+import { parseDomain } from "@shared/utils/domains";
+import Logger from "@server/logging/Logger";
 import auth from "@server/middlewares/authentication";
 import { transaction } from "@server/middlewares/transaction";
 import validate from "@server/middlewares/validate";
-import { IntegrationAuthentication, Integration } from "@server/models";
+import { IntegrationAuthentication, Integration, Team } from "@server/models";
 import { APIContext } from "@server/types";
 import { Linear } from "../linear";
 import UploadLinearWorkspaceLogoTask from "../tasks/UploadLinearWorkspaceLogoTask";
@@ -19,21 +20,49 @@ router.get(
     optional: true,
   }),
   validate(T.LinearCallbackSchema),
-  apexAuthRedirect<T.LinearCallbackReq>({
-    getTeamId: (ctx) => LinearUtils.parseState(ctx.input.query.state)?.teamId,
-    getRedirectPath: (ctx, team) =>
-      LinearUtils.callbackUrl({
-        baseUrl: team.url,
-        params: ctx.request.querystring,
-      }),
-    getErrorPath: () => LinearUtils.errorUrl("unauthenticated"),
-  }),
   transaction(),
   async (ctx: APIContext<T.LinearCallbackReq>) => {
-    const { code, error } = ctx.input.query;
+    const { code, state, error } = ctx.input.query;
     const { user } = ctx.state.auth;
     const { transaction } = ctx.state;
 
+    let parsedState;
+    try {
+      parsedState = LinearUtils.parseState(state);
+    } catch {
+      ctx.redirect(LinearUtils.errorUrl("invalid_state"));
+      return;
+    }
+
+    const { teamId } = parsedState;
+
+    // this code block accounts for the root domain being unable to
+    // access authentication for subdomains. We must forward to the appropriate
+    // subdomain to complete the oauth flow
+    if (!user) {
+      if (teamId) {
+        try {
+          const team = await Team.findByPk(teamId, {
+            rejectOnEmpty: true,
+            transaction,
+          });
+          return parseDomain(ctx.host).teamSubdomain === team.subdomain
+            ? ctx.redirect("/")
+            : ctx.redirectOnClient(
+                LinearUtils.callbackUrl({
+                  baseUrl: team.url,
+                  params: ctx.request.querystring,
+                })
+              );
+        } catch (err) {
+          Logger.error(`Error fetching team for teamId: ${teamId}!`, err);
+          return ctx.redirect(LinearUtils.errorUrl("unauthenticated"));
+        }
+      } else {
+        return ctx.redirect(LinearUtils.errorUrl("unauthenticated"));
+      }
+    }
+
     // Check error after any sub-domain redirection. Otherwise, the user will be redirected to the root domain.
     if (error) {
       ctx.redirect(LinearUtils.errorUrl(error));
@@ -78,12 +107,10 @@ router.get(
     );
 
     transaction.afterCommit(async () => {
-      if (workspace.logoUrl) {
-        await new UploadLinearWorkspaceLogoTask().schedule({
-          integrationId: integration.id,
-          logoUrl: workspace.logoUrl,
-        });
-      }
+      await UploadLinearWorkspaceLogoTask.schedule({
+        integrationId: integration.id,
+        logoUrl: workspace.logoUrl,
+      });
     });
 
     ctx.redirect(LinearUtils.successUrl());

plugins/linear/shared/LinearUtils.ts

@@ -46,7 +46,7 @@ export class LinearUtils {
       scope: this.oauthScopes,
       response_type: "code",
       prompt: "consent",
-      actor: "app",
+      actor: "application",
     };
     return `${this.authBaseUrl}?${queryString.stringify(params)}`;
   }

plugins/matomo/client/Settings.tsx

@@ -6,11 +6,11 @@ import { useTranslation, Trans } from "react-i18next";
 import { toast } from "sonner";
 import { IntegrationType, IntegrationService } from "@shared/types";
 import Integration from "~/models/Integration";
-import { IntegrationScene } from "~/scenes/Settings/components/IntegrationScene";
 import SettingRow from "~/scenes/Settings/components/SettingRow";
 import Button from "~/components/Button";
 import Heading from "~/components/Heading";
 import Input from "~/components/Input";
+import Scene from "~/components/Scene";
 import Text from "~/components/Text";
 import useStores from "~/hooks/useStores";
 import Icon from "./Icon";
@@ -42,6 +42,12 @@ function Matomo() {
     },
   });
 
+  React.useEffect(() => {
+    void integrations.fetchPage({
+      type: IntegrationType.Analytics,
+    });
+  }, [integrations]);
+
   React.useEffect(() => {
     reset({
       measurementId: integration?.settings.measurementId,
@@ -76,7 +82,7 @@ function Matomo() {
   );
 
   return (
-    <IntegrationScene title="Matomo" icon={<Icon />}>
+    <Scene title="Matomo" icon={<Icon />}>
       <Heading>Matomo</Heading>
 
       <Text as="p" type="secondary">
@@ -115,7 +121,7 @@ function Matomo() {
           {formState.isSubmitting ? `${t("Saving")}…` : t("Save")}
         </Button>
       </form>
-    </IntegrationScene>
+    </Scene>
   );
 }
 

plugins/matomo/client/index.tsx

@@ -1,5 +1,5 @@
+import * as React from "react";
 import { UserRole } from "@shared/types";
-import { createLazyComponent } from "~/components/LazyLoad";
 import { Hook, PluginManager } from "~/utils/PluginManager";
 import config from "../plugin.json";
 import Icon from "./Icon";
@@ -11,9 +11,7 @@ PluginManager.add([
     value: {
       group: "Integrations",
       icon: Icon,
-      description:
-        "Track your docs with a self-hosted, open-source analytics platform, link Outline to Matomo for 100% data ownership, GDPR compliance, and deep usage insights on your own servers.",
-      component: createLazyComponent(() => import("./Settings")),
+      component: React.lazy(() => import("./Settings")),
       enabled: (_, user) => user.role === UserRole.Admin,
     },
   },

plugins/notion/server/api/notion.ts

@@ -1,10 +1,11 @@
 import Router from "koa-router";
 import { IntegrationService, IntegrationType } from "@shared/types";
-import apexAuthRedirect from "@server/middlewares/apexAuthRedirect";
+import { parseDomain } from "@shared/utils/domains";
+import Logger from "@server/logging/Logger";
 import auth from "@server/middlewares/authentication";
 import { transaction } from "@server/middlewares/transaction";
 import validate from "@server/middlewares/validate";
-import { Integration, IntegrationAuthentication } from "@server/models";
+import { Integration, IntegrationAuthentication, Team } from "@server/models";
 import { APIContext } from "@server/types";
 import { NotionClient } from "../notion";
 import * as T from "./schema";
@@ -16,21 +17,49 @@ router.get(
   "notion.callback",
   auth({ optional: true }),
   validate(T.NotionCallbackSchema),
-  apexAuthRedirect<T.NotionCallbackReq>({
-    getTeamId: (ctx) => NotionUtils.parseState(ctx.input.query.state)?.teamId,
-    getRedirectPath: (ctx, team) =>
-      NotionUtils.callbackUrl({
-        baseUrl: team.url,
-        params: ctx.request.querystring,
-      }),
-    getErrorPath: () => NotionUtils.errorUrl("unauthenticated"),
-  }),
   transaction(),
   async (ctx: APIContext<T.NotionCallbackReq>) => {
-    const { code, error } = ctx.input.query;
+    const { code, state, error } = ctx.input.query;
     const { user } = ctx.state.auth;
     const { transaction } = ctx.state;
 
+    let parsedState;
+    try {
+      parsedState = NotionUtils.parseState(state);
+    } catch {
+      ctx.redirect(NotionUtils.errorUrl("invalid_state"));
+      return;
+    }
+
+    const { teamId } = parsedState;
+
+    // This code block accounts for the root domain being unable to access authentication for subdomains.
+    // We must forward to the appropriate subdomain to complete the oauth flow.
+    if (!user) {
+      if (teamId) {
+        try {
+          const team = await Team.findByPk(teamId, {
+            rejectOnEmpty: true,
+            transaction,
+          });
+
+          return parseDomain(ctx.host).teamSubdomain === team.subdomain
+            ? ctx.redirect("/")
+            : ctx.redirectOnClient(
+                NotionUtils.callbackUrl({
+                  baseUrl: team.url,
+                  params: ctx.request.querystring,
+                })
+              );
+        } catch (err) {
+          Logger.error(`Error fetching team for teamId: ${teamId}!`, err);
+          return ctx.redirect(NotionUtils.errorUrl("unauthenticated"));
+        }
+      } else {
+        return ctx.redirect(NotionUtils.errorUrl("unauthenticated"));
+      }
+    }
+
     // Check error after any sub-domain redirection. Otherwise, the user will be redirected to the root domain.
     if (error) {
       ctx.redirect(NotionUtils.errorUrl(error));

plugins/notion/server/processors/NotionImportsProcessor.ts

@@ -66,6 +66,6 @@ export class NotionImportsProcessor extends ImportsProcessor<IntegrationService.
   protected async scheduleTask(
     importTask: ImportTask<IntegrationService.Notion>
   ): Promise<void> {
-    await new NotionAPIImportTask().schedule({ importTaskId: importTask.id });
+    await NotionAPIImportTask.schedule({ importTaskId: importTask.id });
   }
 }

plugins/notion/server/tasks/NotionAPIImportTask.ts

@@ -77,7 +77,7 @@ export default class NotionAPIImportTask extends APIImportTask<IntegrationServic
   protected async scheduleNextTask(
     importTask: ImportTask<IntegrationService.Notion>
   ) {
-    await new NotionAPIImportTask().schedule({ importTaskId: importTask.id });
+    await NotionAPIImportTask.schedule({ importTaskId: importTask.id });
     return;
   }
 

plugins/notion/server/utils/NotionConverter.ts

@@ -288,7 +288,7 @@ export class NotionConverter {
       if (item.mention.type === "link_mention") {
         return {
           type: "text",
-          text: item.plain_text || item.mention.link_mention.href,
+          text: item.plain_text,
           marks: [
             {
               type: "link",
@@ -302,7 +302,7 @@ export class NotionConverter {
       if (item.mention.type === "link_preview") {
         return {
           type: "text",
-          text: item.plain_text || item.mention.link_preview.url,
+          text: item.plain_text,
           marks: [
             {
               type: "link",
@@ -314,14 +314,14 @@ export class NotionConverter {
         };
       }
 
-      if (item.plain_text) {
-        return {
-          type: "text",
-          text: item.plain_text,
-        };
+      if (!item.plain_text) {
+        return undefined;
       }
 
-      return undefined;
+      return {
+        type: "text",
+        text: item.plain_text,
+      };
     }
 
     if (item.type === "equation") {
@@ -336,20 +336,20 @@ export class NotionConverter {
       };
     }
 
-    if (item.text.content) {
-      return {
-        type: "text",
-        text: item.text.content,
-        marks: [
-          ...mapAttrs(),
-          ...(item.text.link
-            ? [{ type: "link", attrs: { href: item.text.link.url } }]
-            : []),
-        ].filter(Boolean),
-      };
+    if (!item.text.content) {
+      return undefined;
     }
 
-    return undefined;
+    return {
+      type: "text",
+      text: item.text.content,
+      marks: [
+        ...mapAttrs(),
+        ...(item.text.link
+          ? [{ type: "link", attrs: { href: item.text.link.url } }]
+          : []),
+      ].filter(Boolean),
+    };
   }
 
   private static rich_text_to_plaintext(item: RichTextItemResponse) {

plugins/oidc/server/auth/oidc.ts

@@ -1,5 +1,4 @@
 import passport from "@outlinewiki/koa-passport";
-import JWT from "jsonwebtoken";
 import type { Context } from "koa";
 import Router from "koa-router";
 import get from "lodash/get";
@@ -10,7 +9,6 @@ import {
   OIDCMalformedUserInfoError,
   AuthenticationError,
 } from "@server/errors";
-import Logger from "@server/logging/Logger";
 import passportMiddleware from "@server/middlewares/passport";
 import { AuthenticationProvider, User } from "@server/models";
 import { AuthenticationResult } from "@server/types";
@@ -60,7 +58,7 @@ if (
         ctx: Context,
         accessToken: string,
         refreshToken: string,
-        params: { expires_in: number; id_token: string },
+        params: { expires_in: number },
         _profile: unknown,
         done: (
           err: Error | null,
@@ -80,39 +78,14 @@ if (
             accessToken
           );
 
-          // Some providers, namely ADFS, don't provide anything more than the `sub` claim in the userinfo endpoint
-          // So, we'll decode the params.id_token and see if that contains what we need.
-          const token = (() => {
-            try {
-              const decoded = JWT.decode(params.id_token);
-
-              if (!decoded || typeof decoded !== "object") {
-                Logger.warn("Decoded id_token is not a valid object");
-                return {};
-              }
-
-              return decoded as {
-                email?: string;
-                preferred_username?: string;
-                sub?: string;
-              };
-            } catch (err) {
-              Logger.error("id_token decode threw error: ", err);
-              return {};
-            }
-          })();
-
-          const email = profile.email ?? token.email ?? null;
-
-          if (!email) {
+          if (!profile.email) {
             throw AuthenticationError(
-              `An email field was not returned in the profile or id_token parameter, but is required.`
+              `An email field was not returned in the profile parameter, but is required.`
             );
           }
-
           const team = await getTeamFromContext(ctx);
           const client = getClientFromContext(ctx);
-          const { domain } = parseEmail(email);
+          const { domain } = parseEmail(profile.email);
 
           // Only a single OIDC provider is supported – find the existing, if any.
           const authenticationProvider = team
@@ -145,16 +118,13 @@ if (
 
           // Claim name can be overriden using an env variable.
           // Default is 'preferred_username' as per OIDC spec.
-          // This will default to the profile.preferred_username, but will fall back to preferred_username from the id_token
-          const username =
-            get(profile, env.OIDC_USERNAME_CLAIM) ??
-            get(token, env.OIDC_USERNAME_CLAIM);
+          const username = get(profile, env.OIDC_USERNAME_CLAIM);
           const name = profile.name || username || profile.username;
           const profileId = profile.sub ? profile.sub : profile.id;
 
           if (!name) {
             throw AuthenticationError(
-              `Neither a ${env.OIDC_USERNAME_CLAIM}, name or username was returned in the profile parameter, but at least one is required.`
+              `Neither a name or username was returned in the profile parameter, but at least one is required.`
             );
           }
 
@@ -168,7 +138,7 @@ if (
             },
             user: {
               name,
-              email,
+              email: profile.email,
               avatarUrl: profile.picture,
             },
             authenticationProvider: {

plugins/slack/client/Settings.tsx

@@ -6,7 +6,6 @@ import { IntegrationService, IntegrationType } from "@shared/types";
 import Collection from "~/models/Collection";
 import Integration from "~/models/Integration";
 import { ConnectedButton } from "~/scenes/Settings/components/ConnectedButton";
-import { IntegrationScene } from "~/scenes/Settings/components/IntegrationScene";
 import SettingRow from "~/scenes/Settings/components/SettingRow";
 import Flex from "~/components/Flex";
 import Heading from "~/components/Heading";
@@ -14,6 +13,7 @@ import CollectionIcon from "~/components/Icons/CollectionIcon";
 import List from "~/components/List";
 import ListItem from "~/components/List/Item";
 import Notice from "~/components/Notice";
+import Scene from "~/components/Scene";
 import Text from "~/components/Text";
 import env from "~/env";
 import useCurrentTeam from "~/hooks/useCurrentTeam";
@@ -34,7 +34,13 @@ function Slack() {
   const error = query.get("error");
 
   React.useEffect(() => {
-    void collections.fetchAll();
+    void collections.fetchPage({
+      limit: 100,
+    });
+    void integrations.fetchPage({
+      service: IntegrationService.Slack,
+      limit: 100,
+    });
   }, [collections, integrations]);
 
   const commandIntegration = integrations.find({
@@ -61,7 +67,7 @@ function Slack() {
   const appName = env.APP_NAME;
 
   return (
-    <IntegrationScene title="Slack" icon={<SlackIcon />}>
+    <Scene title="Slack" icon={<SlackIcon />}>
       <Heading>Slack</Heading>
 
       {error === "access_denied" && (
@@ -199,7 +205,7 @@ function Slack() {
           </List>
         </>
       )}
-    </IntegrationScene>
+    </Scene>
   );
 }
 

plugins/slack/client/index.tsx

@@ -1,5 +1,5 @@
+import * as React from "react";
 import { UserRole } from "@shared/types";
-import { createLazyComponent } from "~/components/LazyLoad";
 import { Hook, PluginManager } from "~/utils/PluginManager";
 import config from "../plugin.json";
 import Icon from "./Icon";
@@ -11,9 +11,7 @@ PluginManager.add([
     value: {
       group: "Integrations",
       icon: Icon,
-      description:
-        "Search your knowledge base directly in Slack, get /outline search, rich link previews, and notifications on new or updated docs.",
-      component: createLazyComponent(() => import("./Settings")),
+      component: React.lazy(() => import("./Settings")),
       enabled: (_, user) =>
         [UserRole.Member, UserRole.Admin].includes(user.role),
     },

plugins/slack/server/api/hooks.ts

@@ -227,6 +227,9 @@ router.post(
     const options = {
       query: text,
       limit: 5,
+      searchConfig: {
+        boostRecent: true,
+      },
     };
 
     if (!user) {

plugins/slack/server/auth/slack.ts

@@ -4,15 +4,16 @@ import Router from "koa-router";
 import { Profile } from "passport";
 import { Strategy as SlackStrategy } from "passport-slack-oauth2";
 import { IntegrationService, IntegrationType } from "@shared/types";
+import { parseDomain } from "@shared/utils/domains";
 import accountProvisioner from "@server/commands/accountProvisioner";
 import { ValidationError } from "@server/errors";
-import apexAuthRedirect from "@server/middlewares/apexAuthRedirect";
 import auth from "@server/middlewares/authentication";
 import passportMiddleware from "@server/middlewares/passport";
 import validate from "@server/middlewares/validate";
 import {
   IntegrationAuthentication,
   Integration,
+  Team,
   User,
   Collection,
 } from "@server/models";
@@ -125,15 +126,6 @@ if (env.SLACK_CLIENT_ID && env.SLACK_CLIENT_SECRET) {
     "slack.post",
     auth({ optional: true }),
     validate(T.SlackPostSchema),
-    apexAuthRedirect<T.SlackPostReq>({
-      getTeamId: (ctx) => SlackUtils.parseState(ctx.input.query.state)?.teamId,
-      getRedirectPath: (ctx, team) =>
-        SlackUtils.connectUrl({
-          baseUrl: team.url,
-          params: ctx.request.querystring,
-        }),
-      getErrorPath: () => SlackUtils.errorUrl("unauthenticated"),
-    }),
     async (ctx: APIContext<T.SlackPostReq>) => {
       const { code, error, state } = ctx.input.query;
       const { user } = ctx.state.auth;
@@ -152,13 +144,37 @@ if (env.SLACK_CLIENT_ID && env.SLACK_CLIENT_SECRET) {
         throw ValidationError("Invalid state");
       }
 
-      const { collectionId, type } = parsedState;
+      const { teamId, collectionId, type } = parsedState;
+
+      // This code block accounts for the root domain being unable to access authentication for
+      // subdomains. We must forward to the appropriate subdomain to complete the OAuth flow.
+      if (!user) {
+        if (teamId) {
+          try {
+            const team = await Team.findByPk(teamId, {
+              rejectOnEmpty: true,
+            });
+            return parseDomain(ctx.host).teamSubdomain === team.subdomain
+              ? ctx.redirect("/")
+              : ctx.redirectOnClient(
+                  SlackUtils.connectUrl({
+                    baseUrl: team.url,
+                    params: ctx.request.querystring,
+                  })
+                );
+          } catch (err) {
+            return ctx.redirect(SlackUtils.errorUrl("unauthenticated"));
+          }
+        } else {
+          return ctx.redirect(SlackUtils.errorUrl("unauthenticated"));
+        }
+      }
 
       switch (type) {
         case IntegrationType.Post: {
-          const collection = await Collection.findByPk(collectionId, {
-            userId: user.id,
-          });
+          const collection = await Collection.scope({
+            method: ["withMembership", user.id],
+          }).findByPk(collectionId);
           authorize(user, "read", collection);
           authorize(user, "update", user.team);
 

plugins/umami/client/Settings.tsx

@@ -6,11 +6,11 @@ import { useTranslation, Trans } from "react-i18next";
 import { toast } from "sonner";
 import { IntegrationType, IntegrationService } from "@shared/types";
 import Integration from "~/models/Integration";
-import { IntegrationScene } from "~/scenes/Settings/components/IntegrationScene";
 import SettingRow from "~/scenes/Settings/components/SettingRow";
 import Button from "~/components/Button";
 import Heading from "~/components/Heading";
 import Input from "~/components/Input";
+import Scene from "~/components/Scene";
 import Text from "~/components/Text";
 import useStores from "~/hooks/useStores";
 import Icon from "./Icon";
@@ -44,6 +44,12 @@ function Umami() {
     },
   });
 
+  React.useEffect(() => {
+    void integrations.fetchPage({
+      type: IntegrationType.Analytics,
+    });
+  }, [integrations]);
+
   React.useEffect(() => {
     reset({
       umamiWebsiteId: integration?.settings.measurementId,
@@ -79,7 +85,7 @@ function Umami() {
   );
 
   return (
-    <IntegrationScene title="Umami" icon={<Icon />}>
+    <Scene title="Umami" icon={<Icon />}>
       <Heading>Umami</Heading>
 
       <Text as="p" type="secondary">
@@ -139,7 +145,7 @@ function Umami() {
           {formState.isSubmitting ? `${t("Saving")}…` : t("Save")}
         </Button>
       </form>
-    </IntegrationScene>
+    </Scene>
   );
 }
 

plugins/umami/client/index.tsx

@@ -1,5 +1,5 @@
+import * as React from "react";
 import { UserRole } from "@shared/types";
-import { createLazyComponent } from "~/components/LazyLoad";
 import { Hook, PluginManager } from "~/utils/PluginManager";
 import config from "../plugin.json";
 import Icon from "./Icon";
@@ -11,9 +11,7 @@ PluginManager.add([
     value: {
       group: "Integrations",
       icon: Icon,
-      description:
-        "Gain privacy-first insights into how your team consumes docs, inject your self-hosted Umami script across Outline pages to track views and engagement while retaining full control of your data.",
-      component: createLazyComponent(() => import("./Settings")),
+      component: React.lazy(() => import("./Settings")),
       enabled: (_, user) => user.role === UserRole.Admin,
     },
   },

plugins/webhooks/client/index.tsx

@@ -1,4 +1,4 @@
-import { createLazyComponent } from "~/components/LazyLoad";
+import * as React from "react";
 import { Hook, PluginManager } from "~/utils/PluginManager";
 import config from "../plugin.json";
 import Icon from "./Icon";
@@ -8,12 +8,9 @@ PluginManager.add([
     ...config,
     type: Hook.Settings,
     value: {
-      group: "Workspace",
-      after: "Shared Links",
+      group: "Integrations",
       icon: Icon,
-      description:
-        "Automate downstream workflows with real-time JSON POSTs, subscribe to events in Outline so external systems can react instantly.",
-      component: createLazyComponent(() => import("./Settings")),
+      component: React.lazy(() => import("./Settings")),
     },
   },
 ]);

plugins/webhooks/server/processors/WebhookProcessor.test.ts

@@ -29,12 +29,8 @@ describe("WebhookProcessor", () => {
 
     await processor.perform(event);
 
-    expect(
-      jest.mocked(DeliverWebhookTask.prototype.schedule)
-    ).toHaveBeenCalled();
-    expect(
-      jest.mocked(DeliverWebhookTask.prototype.schedule)
-    ).toHaveBeenCalledWith({
+    expect(DeliverWebhookTask.schedule).toHaveBeenCalled();
+    expect(DeliverWebhookTask.schedule).toHaveBeenCalledWith({
       event,
       subscriptionId: subscription.id,
     });
@@ -57,9 +53,7 @@ describe("WebhookProcessor", () => {
 
     await processor.perform(event);
 
-    expect(
-      jest.mocked(DeliverWebhookTask.prototype.schedule)
-    ).toHaveBeenCalledTimes(0);
+    expect(DeliverWebhookTask.schedule).toHaveBeenCalledTimes(0);
   });
 
   it("it schedules a delivery for the event for each subscription", async () => {
@@ -85,21 +79,13 @@ describe("WebhookProcessor", () => {
 
     await processor.perform(event);
 
-    expect(
-      jest.mocked(DeliverWebhookTask.prototype.schedule)
-    ).toHaveBeenCalled();
-    expect(
-      jest.mocked(DeliverWebhookTask.prototype.schedule)
-    ).toHaveBeenCalledTimes(2);
-    expect(
-      jest.mocked(DeliverWebhookTask.prototype.schedule)
-    ).toHaveBeenCalledWith({
+    expect(DeliverWebhookTask.schedule).toHaveBeenCalled();
+    expect(DeliverWebhookTask.schedule).toHaveBeenCalledTimes(2);
+    expect(DeliverWebhookTask.schedule).toHaveBeenCalledWith({
       event,
       subscriptionId: subscription.id,
     });
-    expect(
-      jest.mocked(DeliverWebhookTask.prototype.schedule)
-    ).toHaveBeenCalledWith({
+    expect(DeliverWebhookTask.schedule).toHaveBeenCalledWith({
       event,
       subscriptionId: subscriptionTwo.id,
     });

plugins/webhooks/server/processors/WebhookProcessor.ts

@@ -24,10 +24,7 @@ export default class WebhookProcessor extends BaseProcessor {
 
     await Promise.all(
       applicableSubscriptions.map((subscription) =>
-        new DeliverWebhookTask().schedule({
-          event,
-          subscriptionId: subscription.id,
-        })
+        DeliverWebhookTask.schedule({ event, subscriptionId: subscription.id })
       )
     );
   }

plugins/webhooks/server/tasks/DeliverWebhookTask.ts

@@ -237,11 +237,6 @@ export default class DeliverWebhookTask extends BaseTask<Props> {
       case "imports.delete":
         // Ignored
         return;
-      case "oauthClients.create":
-      case "oauthClients.update":
-      case "oauthClients.delete":
-        // Ignored
-        return;
       default:
         assertUnreachable(event);
     }

plugins/zapier/client/index.tsx

@@ -1,18 +0,0 @@
-import { createLazyComponent } from "~/components/LazyLoad";
-import { Hook, PluginManager } from "~/utils/PluginManager";
-import config from "../plugin.json";
-import Icon from "./Icon";
-
-PluginManager.add([
-  {
-    ...config,
-    type: Hook.Settings,
-    value: {
-      group: "Integrations",
-      icon: Icon,
-      description:
-        "Connect your Outline workspace to Zapier to automate workflows and integrate with thousands of other tools.",
-      component: createLazyComponent(() => import("./Settings")),
-    },
-  },
-]);

plugins/zapier/plugin.json

@@ -1,6 +0,0 @@
-{
-  "id": "zapier",
-  "name": "Zapier",
-  "description": "Adds a settings screen for connecting to Zapier.",
-  "deployments": ["cloud"]
-}

server/commands/documentLoader.ts

@@ -1,3 +1,4 @@
+import invariant from "invariant";
 import { Op, WhereOptions } from "sequelize";
 import isUUID from "validator/lib/isUUID";
 import { UrlHelper } from "@shared/utils/UrlHelper";
@@ -21,8 +22,8 @@ type Props = {
 
 type Result = {
   document: Document;
-  share: Share | null;
-  collection: Collection | null;
+  share?: Share;
+  collection?: Collection | null;
 };
 
 export default async function loadDocument({
@@ -32,9 +33,9 @@ export default async function loadDocument({
   user,
   includeState,
 }: Props): Promise<Result> {
-  let document: Document | null = null;
-  let collection: Collection | null = null;
-  let share: Share | null = null;
+  let document;
+  let collection;
+  let share;
 
   if (!shareId && !(id && user)) {
     throw AuthenticationError(`Authentication or shareId required`);
@@ -71,7 +72,20 @@ export default async function loadDocument({
       where: whereClause,
       include: [
         {
-          model: Document.scope("withDrafts"),
+          // unscoping here allows us to return unpublished documents
+          model: Document.unscoped(),
+          include: [
+            {
+              model: User,
+              as: "createdBy",
+              paranoid: false,
+            },
+            {
+              model: User,
+              as: "updatedBy",
+              paranoid: false,
+            },
+          ],
           required: true,
           as: "document",
         },
@@ -115,11 +129,14 @@ export default async function loadDocument({
     const canReadDocument = user && can(user, "read", document);
 
     if (canReadDocument) {
+      // Cannot use document.collection here as it does not include the
+      // documentStructure by default through the relationship.
       if (document.collectionId) {
-        collection = await Collection.findByPk(document.collectionId, {
-          includeDocumentStructure: true,
-          rejectOnEmpty: true,
-        });
+        collection = await Collection.findByPk(document.collectionId);
+
+        if (!collection) {
+          throw NotFoundError("Collection could not be found for document");
+        }
       }
 
       return {
@@ -138,13 +155,11 @@ export default async function loadDocument({
 
     // It is possible to disable sharing at the collection so we must check
     if (document.collectionId) {
-      collection = await Collection.findByPk(document.collectionId, {
-        includeDocumentStructure: true,
-        rejectOnEmpty: true,
-      });
+      collection = await Collection.findByPk(document.collectionId);
     }
+    invariant(collection, "collection not found");
 
-    if (!collection?.sharing) {
+    if (!collection.sharing) {
       throw AuthorizationError();
     }
 

server/commands/documentMover.ts

@@ -1,3 +1,4 @@
+import invariant from "invariant";
 import { Transaction } from "sequelize";
 import { createContext } from "@server/context";
 import { traceFunction } from "@server/logging/tracing";
@@ -23,7 +24,7 @@ type Props = {
   /** Position of moved document within document structure */
   index?: number;
   /** The IP address of the user moving the document */
-  ip: string | null;
+  ip: string;
   /** The database transaction to run within */
   transaction?: Transaction;
 };
@@ -66,7 +67,6 @@ async function documentMover({
   } else {
     // Load the current and the next collection upfront and lock them
     const collection = await Collection.findByPk(document.collectionId!, {
-      includeDocumentStructure: true,
       transaction,
       lock: Transaction.LOCK.UPDATE,
       paranoid: false,
@@ -76,7 +76,6 @@ async function documentMover({
     if (collectionChanged) {
       if (collectionId) {
         newCollection = await Collection.findByPk(collectionId, {
-          includeDocumentStructure: true,
           transaction,
           lock: Transaction.LOCK.UPDATE,
         });
@@ -145,12 +144,12 @@ async function documentMover({
 
       if (collectionId) {
         // Reload the collection to get relationship data
-        newCollection = await Collection.findByPk(collectionId, {
-          userId: user.id,
-          includeDocumentStructure: true,
-          rejectOnEmpty: true,
+        newCollection = await Collection.scope({
+          method: ["withMembership", user.id],
+        }).findByPk(collectionId, {
           transaction,
         });
+        invariant(newCollection, "Collection not found");
 
         result.collections.push(newCollection);
 

server/commands/documentPermanentDeleter.test.ts

@@ -4,11 +4,9 @@ import DeleteAttachmentTask from "@server/queues/tasks/DeleteAttachmentTask";
 import { buildAttachment, buildDocument } from "@server/test/factories";
 import documentPermanentDeleter from "./documentPermanentDeleter";
 
-jest.mock("@server/queues/tasks/DeleteAttachmentTask");
-
-beforeEach(() => {
-  jest.resetAllMocks();
-});
+jest.mock("@server/queues/tasks/DeleteAttachmentTask", () => ({
+  schedule: jest.fn(),
+}));
 
 describe("documentPermanentDeleter", () => {
   it("should destroy documents", async () => {
@@ -62,9 +60,7 @@ describe("documentPermanentDeleter", () => {
     await document.save();
     const countDeletedDoc = await documentPermanentDeleter([document]);
     expect(countDeletedDoc).toEqual(1);
-    expect(
-      jest.mocked(DeleteAttachmentTask.prototype.schedule)
-    ).toHaveBeenCalledTimes(2);
+    expect(DeleteAttachmentTask.schedule).toHaveBeenCalledTimes(2);
     expect(
       await Document.unscoped().count({
         where: {

server/commands/documentPermanentDeleter.ts

@@ -67,7 +67,7 @@ export default async function documentPermanentDeleter(documents: Document[]) {
             "commands",
             `Attachment ${attachmentId} scheduled for deletion`
           );
-          await new DeleteAttachmentTask().schedule({
+          await DeleteAttachmentTask.schedule({
             attachmentId,
             teamId: document.teamId,
           });

server/commands/userSuspender.ts

@@ -56,5 +56,5 @@ export default async function userSuspender({
     }
   );
 
-  await new CleanupDemotedUserTask().schedule({ userId: user.id });
+  await CleanupDemotedUserTask.schedule({ userId: user.id });
 }

server/emails/templates/BaseEmail.tsx

@@ -296,12 +296,7 @@ export default abstract class BaseEmail<
       return undefined;
     }
 
-    // Process user mentions to ensure they are uptodate with database
-    const processedNode = ProsemirrorHelper.toProsemirror(
-      await ProsemirrorHelper.processMentions(node)
-    );
-
-    let content = ProsemirrorHelper.toHTML(processedNode, {
+    let content = ProsemirrorHelper.toHTML(node, {
       centered: false,
     });
 

server/emails/templates/CollectionCreatedEmail.tsx

@@ -37,10 +37,9 @@ export default class CollectionCreatedEmail extends BaseEmail<
   }
 
   protected async beforeSend(props: InputProps) {
-    const collection = await Collection.findByPk(props.collectionId, {
-      includeOwner: true,
-    });
-
+    const collection = await Collection.scope("withUser").findByPk(
+      props.collectionId
+    );
     if (!collection) {
       return false;
     }