Allow inline code to be bolded and italicized

* fix: New comments are measured incorrectly

* Remove defaultRect so we can always return a DOMRect

.github/config.yml

@@ -15,6 +15,8 @@ requestInfoDefaultTitles:
 
 requestInfoLabelToAdd: more information needed
 
+requestInfoUserstoExclude:
+  - tommoor
 
 # Configuration for new-pr-welcome - https://github.com/behaviorbot/new-pr-welcome
 

.github/workflows/lint.yml

@@ -0,0 +1,30 @@
+name: Lint
+
+on:
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  run-linters:
+    if: startsWith(github.actor, 'codegen-sh')
+    name: Run linters
+    runs-on: ubuntu-latest
+
+    permissions:
+      # Give the default GITHUB_TOKEN write permission to commit and push the
+      # added or changed files to the repository.
+      contents: write
+
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20.x
+          cache: 'yarn'
+      - run: yarn install --frozen-lockfile
+      - run: yarn lint --fix
+
+      - name: Commit changes
+        uses: stefanzweifel/git-auto-commit-action@v5
+        with:
+          commit_message: 'Applied automatic fixes'

app/components/Avatar/AvatarWithPresence.tsx

@@ -7,17 +7,43 @@ import User from "~/models/User";
 import Tooltip from "~/components/Tooltip";
 import Avatar, { AvatarSize } from "./Avatar";
 
+/**
+ * Props for the AvatarWithPresence component
+ */
 type Props = {
+  /** The user to display the avatar for */
   user: User;
+  /** Whether the user is currently present in the document */
   isPresent: boolean;
+  /** Whether the user is currently editing the document */
   isEditing: boolean;
+  /** Whether the user is currently observing the document */
   isObserving: boolean;
+  /** Whether this avatar represents the current user */
   isCurrentUser: boolean;
+  /** Optional click handler for the avatar */
   onClick?: React.MouseEventHandler<HTMLImageElement>;
+  /** Size of the avatar, defaults to AvatarSize.Large */
   size?: AvatarSize;
+  /** Optional inline styles to apply to the avatar wrapper */
   style?: React.CSSProperties;
 };
 
+/**
+ * AvatarWithPresence component displays a user's avatar with visual indicators
+ * for their current status (present, editing, observing).
+ *
+ * The component shows different visual states:
+ * - Present users have full opacity
+ * - Non-present users have reduced opacity
+ * - Observing users have a colored border matching their user color
+ * - Hovering shows a colored border
+ *
+ * A tooltip displays the user's name and current status.
+ *
+ * @param props - Component properties
+ * @returns React component
+ */
 function AvatarWithPresence({
   onClick,
   user,
@@ -64,16 +90,33 @@ function AvatarWithPresence({
   );
 }
 
+/**
+ * Centered container for tooltip content
+ */
 const Centered = styled.div`
   text-align: center;
 `;
 
+/**
+ * Props for the AvatarPresence styled component
+ */
 type AvatarWrapperProps = {
+  /** Whether the user is currently present */
   $isPresent: boolean;
+  /** Whether the user is currently observing */
   $isObserving: boolean;
+  /** The user's color for border highlighting */
   $color: string;
 };
 
+/**
+ * Styled component that wraps the Avatar and provides visual indicators
+ * for the user's presence status.
+ *
+ * - Adjusts opacity based on presence
+ * - Adds colored borders for observing users
+ * - Handles hover effects
+ */
 const AvatarPresence = styled.div<AvatarWrapperProps>`
   opacity: ${(props) => (props.$isPresent ? 1 : 0.5)};
   transition: opacity 250ms ease-in-out;

app/components/Fade.tsx

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

app/editor/components/SuggestionsMenu.tsx

@@ -645,12 +645,11 @@ function SuggestionsMenu<T extends MenuItem>(props: Props<T>) {
                     "section" in item ? item.section?.({ t }) : undefined;
 
                   const response = (
-                    <>
+                    <React.Fragment key={`${index}-${item.name}`}>
                       {currentHeading !== previousHeading && (
                         <Header key={currentHeading}>{currentHeading}</Header>
                       )}
                       <ListItem
-                        key={index}
                         onPointerMove={handlePointerMove}
                         onPointerDown={handlePointerDown}
                       >
@@ -659,7 +658,7 @@ function SuggestionsMenu<T extends MenuItem>(props: Props<T>) {
                           onClick: () => handleClickItem(item),
                         })}
                       </ListItem>
-                    </>
+                    </React.Fragment>
                   );
 
                   previousHeading = currentHeading;

app/editor/extensions/PasteHandler.tsx

@@ -88,7 +88,7 @@ export default class PasteHandler extends Extension {
 
             // If the users selection is currently in a code block then paste
             // as plain text, ignore all formatting and HTML content.
-            if (isInCode(state)) {
+            if (isInCode(state, { inclusive: true })) {
               event.preventDefault();
               view.dispatch(state.tr.insertText(text));
               return true;

app/hooks/useDictionary.ts

@@ -1,6 +1,11 @@
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 
+/**
+ * Hook that provides a dictionary of translated UI strings.
+ *
+ * @returns An object containing all translated UI strings used throughout the application
+ */
 export default function useDictionary() {
   const { t } = useTranslation();
 

app/hooks/useMaxHeight.ts

@@ -1,6 +1,15 @@
 import * as React from "react";
 import useWindowSize from "./useWindowSize";
 
+/**
+ * Hook to calculate the maximum height for an element based on its position and viewport size.
+ *
+ * @param options Configuration options
+ * @param options.elementRef A ref pointing to the element to calculate max height for
+ * @param options.maxViewportPercentage The maximum height of the element as a percentage of the viewport
+ * @param options.margin The margin to apply to the positioning
+ * @returns Object containing the calculated maxHeight and a function to recalculate it
+ */
 const useMaxHeight = ({
   elementRef,
   maxViewportPercentage = 90,

app/hooks/useMediaQuery.ts

@@ -1,5 +1,11 @@
 import { useState, useEffect } from "react";
 
+/**
+ * Hook to check if a media query matches the current viewport.
+ *
+ * @param query The CSS media query to check against
+ * @returns boolean indicating whether the media query matches
+ */
 export default function useMediaQuery(query: string): boolean {
   const [matches, setMatches] = useState<boolean>(false);
 

app/hooks/useMobile.ts

@@ -1,6 +1,11 @@
 import { breakpoints } from "@shared/styles";
 import useMediaQuery from "~/hooks/useMediaQuery";
 
+/**
+ * Hook to detect if the current viewport is mobile-sized.
+ *
+ * @returns boolean indicating whether the current viewport is mobile-sized
+ */
 export default function useMobile(): boolean {
   return useMediaQuery(`(max-width: ${breakpoints.tablet - 1}px)`);
 }

app/hooks/useQuery.ts

@@ -1,6 +1,11 @@
 import React from "react";
 import { useLocation } from "react-router-dom";
 
+/**
+ * Hook to access URL query parameters from the current location.
+ *
+ * @returns URLSearchParams object containing the current URL query parameters
+ */
 export default function useQuery() {
   const location = useLocation();
 

app/hooks/useStores.ts

@@ -2,6 +2,11 @@ import { MobXProviderContext } from "mobx-react";
 import * as React from "react";
 import RootStore from "~/stores";
 
+/**
+ * Hook to access the MobX stores from the React context.
+ *
+ * @returns The root store containing all application stores
+ */
 export default function useStores() {
   return React.useContext(MobXProviderContext) as typeof RootStore;
 }

app/hooks/useUnmount.ts

@@ -1,5 +1,10 @@
 import * as React from "react";
 
+/**
+ * Hook that executes a callback when the component unmounts.
+ *
+ * @param callback Function to be called on component unmount
+ */
 const useUnmount = (callback: (...args: Array<any>) => any) => {
   const ref = React.useRef(callback);
   ref.current = callback;

app/hooks/useViewportHeight.ts

@@ -1,5 +1,11 @@
 import { useLayoutEffect, useState } from "react";
 
+/**
+ * Hook to get the current viewport height, accounting for mobile virtual keyboards.
+ * Uses the VisualViewport API when available, falling back to window.innerHeight.
+ *
+ * @returns The current viewport height in pixels
+ */
 export default function useViewportHeight(): number | void {
   // https://developer.mozilla.org/en-US/docs/Web/API/VisualViewport#browser_compatibility
   // Note: No support in Firefox at time of writing, however this mainly exists

app/hooks/useWindowScrollPosition.ts

@@ -13,6 +13,13 @@ const defaultOptions = {
   throttle: 100,
 };
 
+/**
+ * Hook to track the window's scroll position.
+ *
+ * @param options Configuration options
+ * @param options.throttle Time in milliseconds to throttle the scroll event
+ * @returns Object containing the current scroll position (x, y coordinates)
+ */
 export default function useWindowScrollPosition(options: {
   throttle: number;
 }): {

app/models/Import.ts

@@ -15,6 +15,9 @@ class Import extends Model {
   /** The name of the import. */
   name: string;
 
+  /** Descriptive error message when the import errors out. */
+  error: string | null;
+
   /** The current state of the import. */
   @Field
   @observable

app/scenes/Document/components/CommentThread.tsx

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

app/scenes/Settings/components/ImportListItem.tsx

@@ -15,6 +15,7 @@ import Time from "~/components/Time";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import useStores from "~/hooks/useStores";
 import { ImportMenu } from "~/menus/ImportMenu";
+import isCloudHosted from "~/utils/isCloudHosted";
 
 type Props = {
   /** Import that's displayed as list item. */
@@ -29,6 +30,10 @@ export const ImportListItem = observer(({ importModel }: Props) => {
   const showProgress =
     importModel.state !== ImportState.Canceled &&
     importModel.state !== ImportState.Errored;
+  const showErrorInfo =
+    !isCloudHosted &&
+    importModel.state === ImportState.Errored &&
+    !!importModel.error;
 
   const stateMap = React.useMemo(
     () => ({
@@ -114,6 +119,12 @@ export const ImportListItem = observer(({ importModel }: Props) => {
       subtitle={
         <>
           {stateMap[importModel.state]}&nbsp;•&nbsp;
+          {showErrorInfo && (
+            <>
+              {importModel.error}
+              {`. ${t("Check server logs for more details.")}`}&nbsp;•&nbsp;
+            </>
+          )}
           {t(`{{userName}} requested`, {
             userName:
               user.id === importModel.createdBy.id

plugins/notion/server/notion.ts

@@ -1,4 +1,6 @@
 import {
+  APIErrorCode,
+  APIResponseError,
   Client,
   isFullPage,
   isFullPageOrDatabase,
@@ -247,19 +249,30 @@ export class NotionClient {
 
   private async fetchUsername(userId: string) {
     await this.limiter();
-    const user = await this.client.users.retrieve({ user_id: userId });
+    try {
+      const user = await this.client.users.retrieve({ user_id: userId });
 
-    if (user.type === "person" || !user.bot.owner) {
+      if (user.type === "person" || !user.bot.owner) {
+        return user.name;
+      }
+
+      // bot belongs to a user, get the user's name.
+      if (user.bot.owner.type === "user" && isFullUser(user.bot.owner.user)) {
+        return user.bot.owner.user.name;
+      }
+
+      // bot belongs to a workspace, fallback to bot's name.
       return user.name;
+    } catch (error) {
+      // Handle the case where a user can't be found
+      if (
+        error instanceof APIResponseError &&
+        error.code === APIErrorCode.ObjectNotFound
+      ) {
+        return "Unknown";
+      }
+      throw error;
     }
-
-    // bot belongs to a user, get the user's name.
-    if (user.bot.owner.type === "user" && isFullUser(user.bot.owner.user)) {
-      return user.bot.owner.user.name;
-    }
-
-    // bot belongs to a workspace, fallback to bot's name.
-    return user.name;
   }
 
   private parseTitle(item: PageObjectResponse | DatabaseObjectResponse) {

server/migrations/20250327110739-add-error-to-imports.js

@@ -0,0 +1,37 @@
+"use strict";
+
+/** @type {import('sequelize-cli').Migration} */
+module.exports = {
+  async up(queryInterface, Sequelize) {
+    await queryInterface.sequelize.transaction(async transaction => {
+      await queryInterface.addColumn(
+        "imports",
+        "error",
+        {
+          type: Sequelize.STRING,
+          allowNull: true,
+        },
+        { transaction }
+      );
+
+      await queryInterface.addColumn(
+        "import_tasks",
+        "error",
+        {
+          type: Sequelize.STRING,
+          allowNull: true,
+        },
+        { transaction }
+      );
+    });
+  },
+
+  async down(queryInterface, Sequelize) {
+    await queryInterface.sequelize.transaction(async transaction => {
+      await queryInterface.removeColumn("imports", "error", { transaction });
+      await queryInterface.removeColumn("import_tasks", "error", {
+        transaction,
+      });
+    });
+  },
+};

server/models/Collection.ts

@@ -1,4 +1,5 @@
 /* eslint-disable lines-between-class-members */
+import fractionalIndex from "fractional-index";
 import find from "lodash/find";
 import findIndex from "lodash/findIndex";
 import remove from "lodash/remove";
@@ -11,6 +12,8 @@ import {
   InferAttributes,
   InferCreationAttributes,
   EmptyResultError,
+  type CreateOptions,
+  type UpdateOptions,
 } from "sequelize";
 import {
   Sequelize,
@@ -32,6 +35,8 @@ import {
   BeforeDestroy,
   IsDate,
   AllowNull,
+  BeforeCreate,
+  BeforeUpdate,
 } from "sequelize-typescript";
 import isUUID from "validator/lib/isUUID";
 import type { CollectionSort, ProsemirrorData } from "@shared/types";
@@ -41,7 +46,9 @@ import { sortNavigationNodes } from "@shared/utils/collections";
 import slugify from "@shared/utils/slugify";
 import { CollectionValidation } from "@shared/validations";
 import { ValidationError } from "@server/errors";
+import removeIndexCollision from "@server/utils/removeIndexCollision";
 import { generateUrlId } from "@server/utils/url";
+import { ValidateIndex } from "@server/validation";
 import Document from "./Document";
 import FileOperation from "./FileOperation";
 import Group from "./Group";
@@ -217,8 +224,8 @@ class Collection extends ParanoidModel<
   color: string | null;
 
   @Length({
-    max: 256,
-    msg: `index must be 256 characters or less`,
+    max: ValidateIndex.maxLength,
+    msg: `index must be ${ValidateIndex.maxLength} characters or less`,
   })
   @Column
   index: string | null;
@@ -324,6 +331,30 @@ class Collection extends ParanoidModel<
     }
   }
 
+  @BeforeCreate
+  static async setIndex(model: Collection, options: CreateOptions<Collection>) {
+    if (model.index) {
+      model.index = await removeIndexCollision(model.teamId, model.index, {
+        transaction: options.transaction,
+      });
+      return;
+    }
+
+    const firstCollectionForTeam = await this.findOne({
+      where: {
+        teamId: model.teamId,
+      },
+      order: [
+        // using LC_COLLATE:"C" because we need byte order to drive the sorting
+        Sequelize.literal('"collection"."index" collate "C"'),
+        ["updatedAt", "DESC"],
+      ],
+      ...options,
+    });
+
+    model.index = fractionalIndex(null, firstCollectionForTeam?.index ?? null);
+  }
+
   @AfterCreate
   static async onAfterCreate(
     model: Collection,
@@ -343,6 +374,18 @@ class Collection extends ParanoidModel<
     });
   }
 
+  @BeforeUpdate
+  static async checkIndex(
+    model: Collection,
+    options: UpdateOptions<Collection>
+  ) {
+    if (model.index && model.changed("index")) {
+      model.index = await removeIndexCollision(model.teamId, model.index, {
+        transaction: options.transaction,
+      });
+    }
+  }
+
   // associations
 
   @BelongsTo(() => FileOperation, "importId")

server/models/Import.ts

@@ -60,6 +60,9 @@ class Import<T extends ImportableIntegrationService> extends ParanoidModel<
   @Column(DataType.INTEGER)
   documentCount: number;
 
+  @Column
+  error: string | null;
+
   // associations
 
   @BelongsTo(() => Integration, "integrationId")

server/models/ImportTask.ts

@@ -45,6 +45,9 @@ class ImportTask<T extends ImportableIntegrationService> extends IdModel<
   @Column(DataType.JSONB)
   output: ImportTaskOutput | null;
 
+  @Column
+  error: string | null;
+
   // associations
 
   @BelongsTo(() => Import, "importId")

server/models/helpers/NotificationHelper.test.ts

@@ -9,7 +9,7 @@ import NotificationHelper from "./NotificationHelper";
 
 describe("NotificationHelper", () => {
   describe("getCommentNotificationRecipients", () => {
-    it("should return users who have notification enabled for comment creation and are subscribed to the document in case of parent comment", async () => {
+    it("should only return users who have notification enabled for comment creation and are subscribed to the document in case of new thread", async () => {
       const documentAuthor = await buildUser();
       const document = await buildDocument({
         userId: documentAuthor.id,
@@ -54,7 +54,7 @@ describe("NotificationHelper", () => {
       expect(recipients[0].id).toEqual(notificationEnabledUser.id);
     });
 
-    it("should return users who have notification enabled for comment creation and are in the thread in case of child comment", async () => {
+    it("should only return users who have notification enabled for comment creation and are in the thread in case of child comment", async () => {
       const documentAuthor = await buildUser();
       const document = await buildDocument({
         userId: documentAuthor.id,
@@ -112,32 +112,104 @@ describe("NotificationHelper", () => {
       expect(recipients.length).toEqual(1);
       expect(recipients[0].id).toEqual(notificationEnabledUserInThread.id);
     });
-  });
 
-  describe("getDocumentNotificationRecipients", () => {
-    it("should return all users who have notification enabled for the event", async () => {
+    it("should not return users who have notification disabled for comment creation and are in the thread in case of child comment", async () => {
       const documentAuthor = await buildUser();
       const document = await buildDocument({
         userId: documentAuthor.id,
         teamId: documentAuthor.teamId,
       });
-      const notificationEnabledUser = await buildUser({
+      const notificationEnabledUserInThread = await buildUser({
         teamId: document.teamId,
-        notificationSettings: { [NotificationEventType.UpdateDocument]: true },
+        notificationSettings: { [NotificationEventType.CreateComment]: false },
+      });
+      const notificationEnabledUserNotInThread = await buildUser({
+        teamId: document.teamId,
+        notificationSettings: { [NotificationEventType.CreateComment]: true },
+      });
+      const notificationDisabledUser = await buildUser({
+        teamId: document.teamId,
+        notificationSettings: {
+          [NotificationEventType.CreateComment]: false,
+        },
+      });
+      await Promise.all([
+        buildSubscription({
+          userId: documentAuthor.id,
+          documentId: document.id,
+        }),
+        buildSubscription({
+          userId: notificationEnabledUserInThread.id,
+          documentId: document.id,
+        }),
+        buildSubscription({
+          userId: notificationEnabledUserNotInThread.id,
+          documentId: document.id,
+        }),
+        buildSubscription({
+          userId: notificationDisabledUser.id,
+          documentId: document.id,
+        }),
+      ]);
+      const parentComment = await buildComment({
+        documentId: document.id,
+        userId: notificationEnabledUserInThread.id,
+      });
+      const childComment = await buildComment({
+        documentId: document.id,
+        userId: documentAuthor.id,
+        parentCommentId: parentComment.id,
       });
 
       const recipients =
-        await NotificationHelper.getDocumentNotificationRecipients({
+        await NotificationHelper.getCommentNotificationRecipients(
           document,
-          notificationType: NotificationEventType.UpdateDocument,
-          onlySubscribers: false,
-          actorId: documentAuthor.id,
-        });
+          childComment,
+          childComment.createdById
+        );
 
-      expect(recipients.length).toEqual(1);
-      expect(recipients[0].id).toEqual(notificationEnabledUser.id);
+      expect(recipients.length).toEqual(0);
     });
 
+    it("should return users who have notification enabled and are in the thread but not explicitly subscribed to document", async () => {
+      const documentAuthor = await buildUser();
+      const document = await buildDocument({
+        userId: documentAuthor.id,
+        teamId: documentAuthor.teamId,
+      });
+      const notificationEnabledUserInThread = await buildUser({
+        teamId: document.teamId,
+        notificationSettings: { [NotificationEventType.CreateComment]: true },
+      });
+      await buildUser({
+        teamId: document.teamId,
+        notificationSettings: {
+          [NotificationEventType.CreateComment]: false,
+        },
+      });
+      const parentComment = await buildComment({
+        documentId: document.id,
+        userId: notificationEnabledUserInThread.id,
+      });
+      const childComment = await buildComment({
+        documentId: document.id,
+        userId: documentAuthor.id,
+        parentCommentId: parentComment.id,
+      });
+
+      const recipients =
+        await NotificationHelper.getCommentNotificationRecipients(
+          document,
+          childComment,
+          childComment.createdById
+        );
+
+      expect(recipients.length).toEqual(1);
+      expect(recipients[0].id).toEqual(notificationEnabledUserInThread.id);
+    });
+  });
+
+  describe("getDocumentNotificationRecipients", () => {
     it("should return users who have subscribed to the document", async () => {
       const documentAuthor = await buildUser();
       const document = await buildDocument({
@@ -150,11 +222,17 @@ describe("NotificationHelper", () => {
         documentId: document.id,
       });
 
+      const deletedUser = await buildUser({ teamId: document.teamId });
+      await buildSubscription({
+        userId: deletedUser.id,
+        documentId: document.id,
+      });
+      await deletedUser.destroy();
+
       const recipients =
         await NotificationHelper.getDocumentNotificationRecipients({
           document,
           notificationType: NotificationEventType.UpdateDocument,
-          onlySubscribers: true,
           actorId: documentAuthor.id,
         });
 
@@ -178,7 +256,6 @@ describe("NotificationHelper", () => {
         await NotificationHelper.getDocumentNotificationRecipients({
           document,
           notificationType: NotificationEventType.UpdateDocument,
-          onlySubscribers: true,
           actorId: documentAuthor.id,
         });
 
@@ -216,7 +293,6 @@ describe("NotificationHelper", () => {
         await NotificationHelper.getDocumentNotificationRecipients({
           document,
           notificationType: NotificationEventType.UpdateDocument,
-          onlySubscribers: true,
           actorId: documentAuthor.id,
         });
 
@@ -235,20 +311,19 @@ describe("NotificationHelper", () => {
       });
       const notificationEnabledUser = await buildUser({
         teamId: document.teamId,
-        notificationSettings: { [NotificationEventType.UpdateDocument]: true },
+        notificationSettings: { [NotificationEventType.PublishDocument]: true },
       });
       // suspended user
       await buildUser({
         suspendedAt: new Date(),
         teamId: document.teamId,
-        notificationSettings: { [NotificationEventType.UpdateDocument]: true },
+        notificationSettings: { [NotificationEventType.PublishDocument]: true },
       });
 
       const recipients =
         await NotificationHelper.getDocumentNotificationRecipients({
           document,
-          notificationType: NotificationEventType.UpdateDocument,
-          onlySubscribers: false,
+          notificationType: NotificationEventType.PublishDocument,
           actorId: documentAuthor.id,
         });
 

server/models/helpers/NotificationHelper.ts

@@ -14,7 +14,7 @@ import {
   Comment,
   View,
 } from "@server/models";
-import { can } from "@server/policies";
+import { canUserAccessDocument } from "@server/utils/permissions";
 import { ProsemirrorHelper } from "./ProsemirrorHelper";
 
 export default class NotificationHelper {
@@ -60,18 +60,12 @@ export default class NotificationHelper {
     comment: Comment,
     actorId: string
   ): Promise<User[]> => {
-    let recipients = await this.getDocumentNotificationRecipients({
-      document,
-      notificationType: NotificationEventType.CreateComment,
-      onlySubscribers: !comment.parentCommentId,
-      actorId,
-    });
+    let recipients: User[];
 
-    recipients = recipients.filter((recipient) =>
-      recipient.subscribedToEventType(NotificationEventType.CreateComment)
-    );
-
-    if (recipients.length > 0 && comment.parentCommentId) {
+    // If this is a reply to another comment, we want to notify all users
+    // that are involved in the thread of this comment (i.e. the original
+    // comment and all replies to it).
+    if (comment.parentCommentId) {
       const contextComments = await Comment.findAll({
         attributes: ["createdById", "data"],
         where: {
@@ -95,13 +89,37 @@ export default class NotificationHelper {
       const userIdsInThread = uniq([
         ...createdUserIdsInThread,
         ...mentionedUserIdsInThread,
-      ]);
-      recipients = recipients.filter((r) => userIdsInThread.includes(r.id));
+      ]).filter((userId) => userId !== actorId);
+
+      recipients = await User.findAll({
+        where: {
+          id: {
+            [Op.in]: userIdsInThread,
+          },
+          teamId: document.teamId,
+        },
+      });
+
+      recipients = recipients.filter((recipient) =>
+        recipient.subscribedToEventType(NotificationEventType.CreateComment)
+      );
+    } else {
+      recipients = await this.getDocumentNotificationRecipients({
+        document,
+        notificationType: NotificationEventType.CreateComment,
+        actorId,
+        // We will check below, this just prevents duplicate queries
+        disableAccessCheck: true,
+      });
     }
 
     const filtered: User[] = [];
 
     for (const recipient of recipients) {
+      if (recipient.isSuspended) {
+        continue;
+      }
+
       // If this recipient has viewed the document since the comment was made
       // then we can avoid sending them a useless notification, yay.
       const view = await View.findOne({
@@ -119,7 +137,13 @@ export default class NotificationHelper {
           "processor",
           `suppressing notification to ${recipient.id} because doc viewed`
         );
-      } else {
+        continue;
+      }
+
+      // Check the recipient has access to the collection this document is in. Just
+      // because they are subscribed doesn't mean they still have access to read
+      // the document.
+      if (await canUserAccessDocument(recipient, document.id)) {
         filtered.push(recipient);
       }
     }
@@ -132,74 +156,77 @@ export default class NotificationHelper {
    *
    * @param document The document to get recipients for.
    * @param notificationType The notification type for which to find the recipients.
-   * @param onlySubscribers Whether to consider only the users who have active subscription to the document.
    * @param actorId The id of the user that performed the action.
+   * @param disableAccessCheck Whether to disable the access check for the document.
    * @returns A list of recipients
    */
   public static getDocumentNotificationRecipients = async ({
     document,
     notificationType,
-    onlySubscribers,
     actorId,
+    disableAccessCheck = false,
   }: {
     document: Document;
     notificationType: NotificationEventType;
-    onlySubscribers: boolean;
     actorId: string;
+    disableAccessCheck?: boolean;
   }): Promise<User[]> => {
-    // First find all the users that have notifications enabled for this event
-    // type at all and aren't the one that performed the action.
-    let recipients = await User.findAll({
-      where: {
-        id: {
-          [Op.ne]: actorId,
+    let recipients: User[];
+
+    if (notificationType === NotificationEventType.PublishDocument) {
+      recipients = await User.findAll({
+        where: {
+          id: {
+            [Op.ne]: actorId,
+          },
+          teamId: document.teamId,
+          notificationSettings: {
+            [notificationType]: true,
+          },
         },
-        teamId: document.teamId,
-      },
-    });
-
-    recipients = recipients.filter((recipient) =>
-      recipient.subscribedToEventType(notificationType)
-    );
-
-    // Filter further to only those that have a subscription to the document…
-    if (onlySubscribers) {
+      });
+    } else {
       const subscriptions = await Subscription.findAll({
         attributes: ["userId"],
         where: {
-          userId: recipients.map((recipient) => recipient.id),
+          userId: {
+            [Op.ne]: actorId,
+          },
           event: SubscriptionType.Document,
           [Op.or]: [
             { collectionId: document.collectionId },
             { documentId: document.id },
           ],
         },
+        include: [
+          {
+            association: "user",
+            required: true,
+          },
+        ],
       });
 
-      const subscribedUserIds = subscriptions.map(
-        (subscription) => subscription.userId
-      );
-
-      recipients = recipients.filter((recipient) =>
-        subscribedUserIds.includes(recipient.id)
-      );
+      recipients = subscriptions.map((s) => s.user);
     }
 
+    recipients = recipients.filter((recipient) =>
+      recipient.subscribedToEventType(notificationType)
+    );
+
     const filtered = [];
 
     for (const recipient of recipients) {
-      if (!recipient.email || recipient.isSuspended) {
+      if (recipient.isSuspended) {
         continue;
       }
 
       // Check the recipient has access to the collection this document is in. Just
       // because they are subscribed doesn't mean they still have access to read
       // the document.
-      const doc = await Document.findByPk(document.id, {
-        userId: recipient.id,
-      });
-
-      if (can(recipient, "read", doc)) {
+      if (
+        disableAccessCheck ||
+        (await canUserAccessDocument(recipient, document.id))
+      ) {
         filtered.push(recipient);
       }
     }

server/presenters/import.ts

@@ -11,6 +11,7 @@ export default function presentImport(
     service: importModel.service,
     state: importModel.state,
     documentCount: importModel.documentCount,
+    error: importModel.error,
     createdBy: presentUser(importModel.createdBy),
     createdById: importModel.createdById,
     createdAt: importModel.createdAt,

server/queues/processors/DocumentSubscriptionProcessor.ts

@@ -1,44 +1,85 @@
-import { Op } from "sequelize";
 import { GroupUser } from "@server/models";
-import { DocumentGroupEvent, DocumentUserEvent, Event } from "@server/types";
-import DocumentSubscriptionTask from "../tasks/DocumentSubscriptionTask";
+import {
+  CollectionGroupEvent,
+  CollectionUserEvent,
+  DocumentGroupEvent,
+  DocumentUserEvent,
+  Event,
+} from "@server/types";
+import CollectionSubscriptionRemoveUserTask from "../tasks/CollectionSubscriptionRemoveUserTask";
+import DocumentSubscriptionRemoveUserTask from "../tasks/DocumentSubscriptionRemoveUserTask";
 import BaseProcessor from "./BaseProcessor";
 
+type ReceivedEvent =
+  | CollectionUserEvent
+  | CollectionGroupEvent
+  | DocumentUserEvent
+  | DocumentGroupEvent;
+
 export default class DocumentSubscriptionProcessor extends BaseProcessor {
   static applicableEvents: Event["name"][] = [
+    "collections.remove_user",
+    "collections.remove_group",
     "documents.remove_user",
     "documents.remove_group",
   ];
 
-  async perform(event: DocumentUserEvent | DocumentGroupEvent) {
+  async perform(event: ReceivedEvent) {
     switch (event.name) {
+      case "collections.remove_user": {
+        await CollectionSubscriptionRemoveUserTask.schedule(event);
+        return;
+      }
+
+      case "collections.remove_group":
+        return this.handleRemoveGroupFromCollection(event);
+
       case "documents.remove_user": {
-        await DocumentSubscriptionTask.schedule(event);
+        await DocumentSubscriptionRemoveUserTask.schedule(event);
         return;
       }
 
       case "documents.remove_group":
-        return this.handleGroup(event);
+        return this.handleRemoveGroupFromDocument(event);
 
       default:
     }
   }
 
-  private async handleGroup(event: DocumentGroupEvent) {
+  private async handleRemoveGroupFromCollection(event: CollectionGroupEvent) {
     await GroupUser.findAllInBatches<GroupUser>(
       {
         where: {
           groupId: event.modelId,
-          userId: {
-            [Op.ne]: event.actorId,
-          },
         },
         batchLimit: 10,
       },
       async (groupUsers) => {
         await Promise.all(
           groupUsers.map((groupUser) =>
-            DocumentSubscriptionTask.schedule({
+            CollectionSubscriptionRemoveUserTask.schedule({
+              ...event,
+              name: "collections.remove_user",
+              userId: groupUser.userId,
+            })
+          )
+        );
+      }
+    );
+  }
+
+  private async handleRemoveGroupFromDocument(event: DocumentGroupEvent) {
+    await GroupUser.findAllInBatches<GroupUser>(
+      {
+        where: {
+          groupId: event.modelId,
+        },
+        batchLimit: 10,
+      },
+      async (groupUsers) => {
+        await Promise.all(
+          groupUsers.map((groupUser) =>
+            DocumentSubscriptionRemoveUserTask.schedule({
               ...event,
               name: "documents.remove_user",
               userId: groupUser.userId,

server/queues/processors/ImportsProcessor.ts

@@ -49,33 +49,46 @@ export default abstract class ImportsProcessor<
    * @param event The import event
    */
   public async perform(event: ImportEvent) {
-    await sequelize.transaction(async (transaction) => {
-      const importModel = await Import.findByPk<Import<T>>(event.modelId, {
-        rejectOnEmpty: true,
-        paranoid: false,
-        transaction,
-        lock: transaction.LOCK.UPDATE,
+    try {
+      await sequelize.transaction(async (transaction) => {
+        const importModel = await Import.findByPk<Import<T>>(event.modelId, {
+          rejectOnEmpty: true,
+          paranoid: false,
+          transaction,
+          lock: transaction.LOCK.UPDATE,
+        });
+
+        if (
+          !this.canProcess(importModel) ||
+          importModel.state === ImportState.Errored ||
+          importModel.state === ImportState.Canceled
+        ) {
+          return;
+        }
+
+        switch (event.name) {
+          case "imports.create":
+            return this.onCreation(importModel, transaction);
+
+          case "imports.processed":
+            return this.onProcessed(importModel, transaction);
+
+          case "imports.delete":
+            return this.onDeletion(importModel, event, transaction);
+        }
       });
-
-      if (
-        !this.canProcess(importModel) ||
-        importModel.state === ImportState.Errored ||
-        importModel.state === ImportState.Canceled
-      ) {
-        return;
+    } catch (err) {
+      if (event.name !== "imports.delete" && err instanceof Error) {
+        const importModel = await Import.findByPk<Import<T>>(event.modelId, {
+          rejectOnEmpty: true,
+          paranoid: false,
+        });
+        importModel.error = truncate(err.message, { length: 255 });
+        await importModel.save();
       }
 
-      switch (event.name) {
-        case "imports.create":
-          return this.onCreation(importModel, transaction);
-
-        case "imports.processed":
-          return this.onProcessed(importModel, transaction);
-
-        case "imports.delete":
-          return this.onDeletion(importModel, event, transaction);
-      }
-    });
+      throw err; // throw error for retry.
+    }
   }
 
   public async onFailed(event: ImportEvent) {
@@ -173,6 +186,7 @@ export default abstract class ImportsProcessor<
     }
 
     importModel.state = ImportState.Completed;
+    importModel.error = null; // unset any error from previous attempts.
     await importModel.saveWithCtx(
       createContext({
         user: importModel.createdBy,

server/queues/tasks/APIImportTask.ts

@@ -1,5 +1,6 @@
 import { JobOptions } from "bull";
 import chunk from "lodash/chunk";
+import truncate from "lodash/truncate";
 import uniqBy from "lodash/uniqBy";
 import { Fragment, Node } from "prosemirror-model";
 import { Transaction, WhereOptions } from "sequelize";
@@ -63,20 +64,29 @@ export default abstract class APIImportTask<
       return;
     }
 
-    switch (importTask.state) {
-      case ImportTaskState.Created: {
-        importTask.state = ImportTaskState.InProgress;
-        importTask = await importTask.save();
-        return await this.onProcess(importTask);
+    try {
+      switch (importTask.state) {
+        case ImportTaskState.Created: {
+          importTask.state = ImportTaskState.InProgress;
+          importTask = await importTask.save();
+          return await this.onProcess(importTask);
+        }
+
+        case ImportTaskState.InProgress:
+          return await this.onProcess(importTask);
+
+        case ImportTaskState.Completed:
+          return await this.onCompletion(importTask);
+
+        default:
+      }
+    } catch (err) {
+      if (err instanceof Error) {
+        importTask.error = truncate(err.message, { length: 255 });
+        await importTask.save();
       }
 
-      case ImportTaskState.InProgress:
-        return await this.onProcess(importTask);
-
-      case ImportTaskState.Completed:
-        return await this.onCompletion(importTask);
-
-      default:
+      throw err; // throw error for retry.
     }
   }
 
@@ -108,6 +118,7 @@ export default abstract class APIImportTask<
       await importTask.save({ transaction });
 
       const associatedImport = importTask.import;
+      associatedImport.error = importTask.error; // copy error from ImportTask that caused the failure.
       associatedImport.state = ImportState.Errored;
       await associatedImport.saveWithCtx(
         createContext({
@@ -155,6 +166,7 @@ export default abstract class APIImportTask<
 
       importTask.output = taskOutputWithReplacements;
       importTask.state = ImportTaskState.Completed;
+      importTask.error = null; // unset any error from previous attempts.
       await importTask.save({ transaction });
 
       const associatedImport = importTask.import;

server/queues/tasks/CleanupOldImportsTask.ts

@@ -41,6 +41,7 @@ export default class CleanupOldImportsTask extends BaseTask<Props> {
           ],
           batchLimit: 50,
           totalLimit: maxImportsPerTask,
+          paranoid: false,
         },
         async (imports) => {
           // eslint-disable-next-line @typescript-eslint/no-explicit-any

server/queues/tasks/CollectionSubscriptionRemoveUserTask.ts

@@ -0,0 +1,52 @@
+import { Transaction } from "sequelize";
+import { SubscriptionType } from "@shared/types";
+import { createContext } from "@server/context";
+import Logger from "@server/logging/Logger";
+import { Collection, Subscription, User } from "@server/models";
+import { can } from "@server/policies";
+import { sequelize } from "@server/storage/database";
+import { CollectionUserEvent } from "@server/types";
+import BaseTask from "./BaseTask";
+
+export default class CollectionSubscriptionRemoveUserTask extends BaseTask<CollectionUserEvent> {
+  public async perform(event: CollectionUserEvent) {
+    const user = await User.findByPk(event.userId);
+
+    if (!user) {
+      return;
+    }
+
+    const collection = await Collection.scope({
+      method: ["withMembership", user.id],
+    }).findByPk(event.collectionId);
+
+    if (can(user, "read", collection)) {
+      Logger.debug(
+        "task",
+        `Skip unsubscribing user ${user.id} as they have permission to the collection ${event.collectionId} through other means`
+      );
+      return;
+    }
+
+    await sequelize.transaction(async (transaction) => {
+      const subscription = await Subscription.findOne({
+        where: {
+          userId: user.id,
+          collectionId: event.collectionId,
+          event: SubscriptionType.Document,
+        },
+        transaction,
+        lock: Transaction.LOCK.UPDATE,
+      });
+
+      await subscription?.destroyWithCtx(
+        createContext({
+          user,
+          authType: event.authType,
+          ip: event.ip,
+          transaction,
+        })
+      );
+    });
+  }
+}

server/queues/tasks/DocumentPublishedNotificationsTask.ts

@@ -54,7 +54,6 @@ export default class DocumentPublishedNotificationsTask extends BaseTask<Documen
       await NotificationHelper.getDocumentNotificationRecipients({
         document,
         notificationType: NotificationEventType.PublishDocument,
-        onlySubscribers: false,
         actorId: document.lastModifiedById,
       })
     ).filter((recipient) => !userIdsMentioned.includes(recipient.id));

server/queues/tasks/DocumentSubscriptionRemoveUserTask.ts

@@ -8,11 +8,11 @@ import { sequelize } from "@server/storage/database";
 import { DocumentUserEvent } from "@server/types";
 import BaseTask from "./BaseTask";
 
-export default class DocumentSubscriptionTask extends BaseTask<DocumentUserEvent> {
+export default class DocumentSubscriptionRemoveUserTask extends BaseTask<DocumentUserEvent> {
   public async perform(event: DocumentUserEvent) {
     const user = await User.findByPk(event.userId);
 
-    if (!user || event.name !== "documents.remove_user") {
+    if (!user) {
       return;
     }
 

server/queues/tasks/ErrorTimedOutImportsTask.ts

@@ -56,11 +56,13 @@ export default class ErrorTimedOutImportsTask extends BaseTask<Props> {
 
             await sequelize.transaction(async (transaction) => {
               importTask.state = ImportTaskState.Errored;
+              importTask.error = "Timed out";
               await importTask.save({ transaction });
 
               // this import could have been seen before in another import_task.
               if (!importsErrored[associatedImport.id]) {
                 associatedImport.state = ImportState.Errored;
+                associatedImport.error = "Timed out";
                 await associatedImport.save({ transaction });
                 importsErrored[associatedImport.id] = true;
               }

server/queues/tasks/RevisionCreatedNotificationsTask.ts

@@ -76,7 +76,6 @@ export default class RevisionCreatedNotificationsTask extends BaseTask<RevisionE
       await NotificationHelper.getDocumentNotificationRecipients({
         document,
         notificationType: NotificationEventType.UpdateDocument,
-        onlySubscribers: true,
         actorId: document.lastModifiedById,
       })
     ).filter((recipient) => !userIdsMentioned.includes(recipient.id));

server/routes/api/collections/collections.test.ts

@@ -1327,6 +1327,32 @@ describe("#collections.create", () => {
     expect(body.policies[0].abilities.read).toBeTruthy();
   });
 
+  it("should ensure unique index across the team", async () => {
+    const team = await buildTeam();
+    const [adminA, adminB] = await Promise.all([
+      buildAdmin({ teamId: team.id }),
+      buildAdmin({ teamId: team.id }),
+    ]);
+
+    const resA = await server.post("/api/collections.create", {
+      body: {
+        token: adminA.getJwtToken(),
+        name: "Test A",
+      },
+    });
+    const resB = await server.post("/api/collections.create", {
+      body: {
+        token: adminB.getJwtToken(),
+        name: "Test B",
+      },
+    });
+    const [bodyA, bodyB] = await Promise.all([resA.json(), resB.json()]);
+
+    expect(resA.status).toEqual(200);
+    expect(resB.status).toEqual(200);
+    expect(bodyA.data.index).not.toEqual(bodyB.data.index);
+  });
+
   it("if index collision, should updated index of other collection", async () => {
     const user = await buildUser();
     const createdCollectionAResponse = await server.post(

server/routes/api/collections/collections.ts

@@ -1,4 +1,3 @@
-import fractionalIndex from "fractional-index";
 import invariant from "invariant";
 import Router from "koa-router";
 import { Sequelize, Op, WhereOptions } from "sequelize";
@@ -42,7 +41,6 @@ import {
 import { APIContext } from "@server/types";
 import { RateLimiterStrategy } from "@server/utils/RateLimiter";
 import { collectionIndexing } from "@server/utils/indexing";
-import removeIndexCollision from "@server/utils/removeIndexCollision";
 import pagination from "../middlewares/pagination";
 import * as T from "./schema";
 
@@ -55,23 +53,21 @@ router.post(
   transaction(),
   async (ctx: APIContext<T.CollectionsCreateReq>) => {
     const { transaction } = ctx.state;
-    const { name, color, description, data, permission, sharing, icon, sort } =
-      ctx.input.body;
-    let { index } = ctx.input.body;
+    const {
+      name,
+      color,
+      description,
+      data,
+      permission,
+      sharing,
+      icon,
+      sort,
+      index,
+    } = ctx.input.body;
 
     const { user } = ctx.state.auth;
     authorize(user, "createCollection", user.team);
 
-    if (index) {
-      index = await removeIndexCollision(user.teamId, index, { transaction });
-    } else {
-      const first = await Collection.findFirstCollectionForUser(user, {
-        attributes: ["id", "index"],
-        transaction,
-      });
-      index = fractionalIndex(null, first ? first.index : null);
-    }
-
     const collection = Collection.build({
       name,
       content: data,
@@ -959,18 +955,16 @@ router.post(
   transaction(),
   async (ctx: APIContext<T.CollectionsMoveReq>) => {
     const { transaction } = ctx.state;
-    const { id } = ctx.input.body;
-    let { index } = ctx.input.body;
+    const { id, index } = ctx.input.body;
     const { user } = ctx.state.auth;
 
-    const collection = await Collection.findByPk(id, {
+    let collection = await Collection.findByPk(id, {
       transaction,
       lock: transaction.LOCK.UPDATE,
     });
     authorize(user, "move", collection);
 
-    index = await removeIndexCollision(user.teamId, index, { transaction });
-    await collection.update(
+    collection = await collection.update(
       {
         index,
       },
@@ -982,14 +976,14 @@ router.post(
       name: "collections.move",
       collectionId: collection.id,
       data: {
-        index,
+        index: collection.index,
       },
     });
 
     ctx.body = {
       success: true,
       data: {
-        index,
+        index: collection.index,
       },
     };
   }

server/utils/removeIndexCollision.ts

@@ -1,5 +1,5 @@
 import fractionalIndex from "fractional-index";
-import { Op, Sequelize, type FindOptions } from "sequelize";
+import { Sequelize, type FindOptions } from "sequelize";
 import Collection from "@server/models/Collection";
 
 /**
@@ -31,9 +31,7 @@ export default async function removeIndexCollision(
     where: {
       teamId,
       deletedAt: null,
-      index: {
-        [Op.gt]: index,
-      },
+      index: Sequelize.literal(`"collection"."index" collate "C" > '${index}'`),
     },
     attributes: ["id", "index"],
     limit: 1,

server/validation.ts

@@ -232,7 +232,7 @@ export class ValidateDocumentId {
 export class ValidateIndex {
   public static regex = new RegExp("^[\x20-\x7E]+$");
   public static message = "Must be between x20 to x7E ASCII";
-  public static maxLength = 100;
+  public static maxLength = 256;
 }
 
 export class ValidateURL {

shared/components/EventBoundary.tsx

@@ -10,6 +10,10 @@ type Props = {
   captureEvents?: "all" | "pointer" | "click";
 };
 
+/**
+ * EventBoundary is a component that prevents events from propagating to parent elements.
+ * This is useful for preventing clicks or other interactions from bubbling up the DOM tree.
+ */
 const EventBoundary: React.FC<Props> = ({
   children,
   className,

shared/components/Flex.tsx

@@ -5,14 +5,26 @@ type JustifyValues = CSSProperties["justifyContent"];
 
 type AlignValues = CSSProperties["alignItems"];
 
+/**
+ * Flex is a styled component that provides a flexible box layout with convenient props.
+ * It simplifies the use of flexbox CSS properties with a clean, declarative API.
+ */
 const Flex = styled.div<{
+  /** Makes the component grow to fill available space */
   auto?: boolean;
+  /** Changes flex direction to column */
   column?: boolean;
+  /** Sets the align-items CSS property */
   align?: AlignValues;
+  /** Sets the justify-content CSS property */
   justify?: JustifyValues;
+  /** Enables flex-wrap */
   wrap?: boolean;
+  /** Controls flex-shrink behavior */
   shrink?: boolean;
+  /** Reverses the direction (row-reverse or column-reverse) */
   reverse?: boolean;
+  /** Sets gap between flex items in pixels */
   gap?: number;
 }>`
   display: flex;

shared/components/Squircle.tsx

@@ -11,6 +11,11 @@ type Props = {
   className?: string;
 };
 
+/**
+ * Squircle is a component that renders a square with rounded corners (squircle shape).
+ * It's commonly used for app icons, avatars, and other UI elements where a softer
+ * square shape is desired.
+ */
 const Squircle: React.FC<Props> = ({
   color,
   size = 28,

shared/editor/commands/toggleList.ts

@@ -1,5 +1,5 @@
 import { NodeType } from "prosemirror-model";
-import { wrapInList, liftListItem } from "prosemirror-schema-list";
+import { liftListItem, wrapInList } from "prosemirror-schema-list";
 import { Command } from "prosemirror-state";
 import { chainTransactions } from "../lib/chainTransactions";
 import { findParentNode } from "../queries/findParentNode";
@@ -29,6 +29,14 @@ export default function toggleList(
         return liftListItem(itemType)(state, dispatch);
       }
 
+      const currentItemType = parentList.node.content.firstChild?.type;
+      if (currentItemType && currentItemType !== itemType) {
+        return chainTransactions(clearNodes(), wrapInList(listType))(
+          state,
+          dispatch
+        );
+      }
+
       if (
         isList(parentList.node, schema) &&
         listType.validContent(parentList.node.content)

shared/editor/components/Styles.ts

@@ -313,6 +313,10 @@ width: 100%;
     background: ${props.theme.mentionHoverBackground};
   }
 
+  &[data-type="user"] {
+    gap: 0;
+  }
+
   &.mention-user::before {
     content: "@";
   }

shared/editor/marks/Code.ts

@@ -21,7 +21,7 @@ export default class Code extends Mark {
 
   get schema(): MarkSpec {
     return {
-      excludes: "mention placeholder highlight em strong",
+      excludes: "mention placeholder highlight",
       parseDOM: [{ tag: "code", preserveWhitespace: true }],
       toDOM: () => ["code", { class: "inline", spellCheck: "false" }],
     };

shared/editor/nodes/Mention.tsx

@@ -32,6 +32,11 @@ export default class Mention extends Node {
   }
 
   get schema(): NodeSpec {
+    const toPlainText = (node: ProsemirrorNode) =>
+      node.attrs.type === MentionType.User
+        ? `@${node.attrs.label}`
+        : node.attrs.label;
+
     return {
       attrs: {
         type: {
@@ -88,12 +93,9 @@ export default class Mention extends Node {
           "data-actorid": node.attrs.actorId,
           "data-url": `mention://${node.attrs.id}/${node.attrs.type}/${node.attrs.modelId}`,
         },
-        String(node.attrs.label),
+        toPlainText(node),
       ],
-      toPlainText: (node) =>
-        node.attrs.type === MentionType.User
-          ? `@${node.attrs.label}`
-          : node.attrs.label,
+      toPlainText,
     };
   }
 

shared/editor/queries/isInCode.ts

@@ -7,6 +7,8 @@ type Options = {
   onlyBlock?: boolean;
   /** Only check if the selection is inside a code mark. */
   onlyMark?: boolean;
+  /** If true then code must contain entire selection */
+  inclusive?: boolean;
 };
 
 /**
@@ -20,17 +22,29 @@ export function isInCode(state: EditorState, options?: Options): boolean {
   const { nodes, marks } = state.schema;
 
   if (!options?.onlyMark) {
-    if (nodes.code_block && isNodeActive(nodes.code_block)(state)) {
+    if (
+      nodes.code_block &&
+      isNodeActive(nodes.code_block, undefined, {
+        inclusive: options?.inclusive,
+      })(state)
+    ) {
       return true;
     }
-    if (nodes.code_fence && isNodeActive(nodes.code_fence)(state)) {
+    if (
+      nodes.code_fence &&
+      isNodeActive(nodes.code_fence, undefined, {
+        inclusive: options?.inclusive,
+      })(state)
+    ) {
       return true;
     }
   }
 
   if (!options?.onlyBlock) {
     if (marks.code_inline) {
-      return isMarkActive(marks.code_inline)(state);
+      return isMarkActive(marks.code_inline, undefined, {
+        inclusive: options?.inclusive,
+      })(state);
     }
   }
 

shared/editor/queries/isMarkActive.ts

@@ -6,6 +6,8 @@ import { getMarksBetween } from "./getMarksBetween";
 type Options = {
   /** Only return match if the range and attrs is exact */
   exact?: boolean;
+  /** If true then mark must contain entire selection */
+  inclusive?: boolean;
 };
 
 /**
@@ -40,7 +42,8 @@ export const isMarkActive =
             Object.keys(attrs).every(
               (key) => mark.attrs[key] === attrs[key]
             )) &&
-          (!options?.exact || (start === from && end === to))
+          (!options?.exact || (start === from && end === to)) &&
+          (!options?.inclusive || (start <= from && end >= to))
       );
     }
 

shared/editor/queries/isNodeActive.ts

@@ -3,31 +3,55 @@ import { EditorState } from "prosemirror-state";
 import { Primitive } from "utility-types";
 import { findParentNode } from "./findParentNode";
 
+type Options = {
+  /** Only return match if the range and attrs is exact */
+  exact?: boolean;
+  /** If true then node must contain entire selection */
+  inclusive?: boolean;
+};
+
 /**
  * Checks if a node is active in the current selection or not.
  *
  * @param type The node type to check.
  * @param attrs The attributes to check.
+ * @param options The options to use.
  * @returns A function that checks if a node is active in the current selection or not.
  */
 export const isNodeActive =
-  (type: NodeType, attrs: Record<string, Primitive> = {}) =>
-  (state: EditorState) => {
+  (type: NodeType, attrs?: Record<string, Primitive>, options?: Options) =>
+  (state: EditorState): boolean => {
     if (!type) {
       return false;
     }
 
-    const nodeAfter = state.selection.$from.nodeAfter;
-    let node = nodeAfter?.type === type ? nodeAfter : undefined;
+    const { from, to } = state.selection;
+    const nodeWithPos = findParentNode(
+      (node) =>
+        node.type === type &&
+        (!attrs ||
+          Object.keys(attrs).every((key) => node.attrs[key] === attrs[key]))
+    )(state.selection);
 
-    if (!node) {
-      const parent = findParentNode((n) => n.type === type)(state.selection);
-      node = parent?.node;
+    if (!nodeWithPos) {
+      return false;
     }
 
-    if (!Object.keys(attrs).length || !node) {
-      return !!node;
+    if (options?.inclusive) {
+      // Check if the node's position contains the entire selection
+      return (
+        nodeWithPos.pos <= from &&
+        nodeWithPos.pos + nodeWithPos.node.nodeSize >= to
+      );
     }
 
-    return node.hasMarkup(type, { ...node.attrs, ...attrs });
+    if (options?.exact) {
+      // Check if node's range exactly matches selection
+      return (
+        nodeWithPos.pos === from &&
+        nodeWithPos.pos + nodeWithPos.node.nodeSize === to
+      );
+    }
+
+    return true;
   };

shared/hooks/useComponentSize.ts

@@ -1,16 +1,5 @@
 import { useState, useLayoutEffect } from "react";
 
-const defaultRect = {
-  top: 0,
-  left: 0,
-  bottom: 0,
-  right: 0,
-  x: 0,
-  y: 0,
-  width: 0,
-  height: 0,
-};
-
 /**
  * A hook that returns the size of an element or ref.
  *
@@ -19,19 +8,11 @@ const defaultRect = {
  */
 export function useComponentSize(
   input: HTMLElement | null | React.RefObject<HTMLElement | null>
-): DOMRect | typeof defaultRect {
+) {
   const element = input instanceof HTMLElement ? input : input?.current;
-  const [size, setSize] = useState(() => element?.getBoundingClientRect());
-
-  useLayoutEffect(() => {
-    const sizeObserver = new ResizeObserver(() => {
-      element?.dispatchEvent(new CustomEvent("resize"));
-    });
-    if (element) {
-      sizeObserver.observe(element);
-    }
-    return () => sizeObserver.disconnect();
-  }, [element]);
+  const [size, setSize] = useState<DOMRect | undefined>(
+    () => element?.getBoundingClientRect() || new DOMRect()
+  );
 
   useLayoutEffect(() => {
     const handleResize = () => {
@@ -55,6 +36,7 @@ export function useComponentSize(
     window.addEventListener("click", handleResize);
     window.addEventListener("resize", handleResize);
     element?.addEventListener("resize", handleResize);
+    handleResize();
 
     return () => {
       window.removeEventListener("click", handleResize);
@@ -63,5 +45,15 @@ export function useComponentSize(
     };
   });
 
-  return size ?? defaultRect;
+  useLayoutEffect(() => {
+    const sizeObserver = new ResizeObserver(() => {
+      element?.dispatchEvent(new CustomEvent("resize"));
+    });
+    if (element) {
+      sizeObserver.observe(element);
+    }
+    return () => sizeObserver.disconnect();
+  }, [element]);
+
+  return size ?? new DOMRect();
 }