@agent-native/core-corpus 0.201.0-nightly-20261005153421 → 0.201.0

package/corpus/templates/content/actions/set-document-property.ts

@@ -269,14 +269,18 @@ export default defineAction({
         databaseId: database.id,
         properties:
           (
-            await listPropertiesForDatabaseDocuments(database.id, [
-              {
-                ...document,
-                content:
-                  target === "document_body" ? content : document.content,
-                updatedAt: now,
-              },
-            ])
+            await listPropertiesForDatabaseDocuments(
+              database.id,
+              [
+                {
+                  ...document,
+                  content:
+                    target === "document_body" ? content : document.content,
+                  updatedAt: now,
+                },
+              ],
+              { includeBlocksFieldIdentity: true },
+            )
           ).get(documentId) ?? [],
       };
     }
@@ -493,9 +497,11 @@ export default defineAction({
       documentId,
       databaseId: database.id,
       properties:
-        (await listPropertiesForDatabaseDocuments(database.id, [document])).get(
-          documentId,
-        ) ?? [],
+        (
+          await listPropertiesForDatabaseDocuments(database.id, [document], {
+            includeBlocksFieldIdentity: true,
+          })
+        ).get(documentId) ?? [],
     };
   },
 });

package/corpus/templates/content/app/components/editor/DocumentBlockFields.tsx

@@ -42,6 +42,9 @@ import {
 import { VisualEditor } from "./VisualEditor";
 
 const BLOCK_FIELD_DRAG_THRESHOLD = 6;
+// The default `auto` track grows to its widest unbreakable line, which widens
+// the whole page body past the window; the track must be allowed to shrink.
+const BLOCK_FIELDS_GRID = "grid grid-cols-[minmax(0,1fr)]";
 
 interface DocumentBlockFieldsProps {
   documentId: string;
@@ -309,7 +312,10 @@ export function DocumentBlockFields({
   // that state could bind the body before we know which storage target owns it.
   if (query.isError) {
     return (
-      <div className="grid gap-1" data-block-fields-state="error">
+      <div
+        className={cn(BLOCK_FIELDS_GRID, "gap-1")}
+        data-block-fields-state="error"
+      >
         <QueryErrorState
           compact
           onRetry={() => globalThis.location.reload()}
@@ -325,7 +331,7 @@ export function DocumentBlockFields({
     case "loading":
       return (
         <div
-          className="grid gap-1"
+          className={cn(BLOCK_FIELDS_GRID, "gap-1")}
           data-block-fields-state="loading"
           aria-busy="true"
         >
@@ -334,7 +340,10 @@ export function DocumentBlockFields({
       );
     case "empty":
       return (
-        <div className="grid gap-1" data-block-fields-state="empty">
+        <div
+          className={cn(BLOCK_FIELDS_GRID, "gap-1")}
+          data-block-fields-state="empty"
+        >
           {canEdit ? (
             <p className="px-1 py-2 text-sm text-muted-foreground">
               {t("editor.noBlocksFields")}
@@ -345,7 +354,10 @@ export function DocumentBlockFields({
     case "solo":
       if (state.target === "block_field_store") {
         return (
-          <div className="grid gap-1" data-block-fields-state="solo">
+          <div
+            className={cn(BLOCK_FIELDS_GRID, "gap-1")}
+            data-block-fields-state="solo"
+          >
             <AdditionalBlockEditor
               key={`${documentId}:${state.field.definition.id}`}
               documentId={documentId}
@@ -359,7 +371,10 @@ export function DocumentBlockFields({
         );
       }
       return (
-        <div className="grid gap-1" data-block-fields-state="solo">
+        <div
+          className={cn(BLOCK_FIELDS_GRID, "gap-1")}
+          data-block-fields-state="solo"
+        >
           {primaryEditor}
         </div>
       );
@@ -546,7 +561,7 @@ function MultiBlockFields({
   }
 
   return (
-    <div className="grid">
+    <div className={BLOCK_FIELDS_GRID}>
       <BlockFieldDragPreview preview={dragPreview} />
       {blockFields.map((property, index) => {
         const primary = isPrimaryBlocksField(property.definition.options);

package/corpus/templates/content/app/components/editor/DocumentEditor.tsx

@@ -10,6 +10,7 @@ import {
   actionErrorMessage,
   callAction,
   setClientAppState,
+  signOut,
   tryCallActionKeepalive,
   useAvatarUrl,
   useDbSync,
@@ -65,7 +66,7 @@ import {
   useState,
 } from "react";
 import type { ClipboardEvent, MutableRefObject, ReactNode } from "react";
-import { Navigate, useLocation, useNavigate } from "react-router";
+import { Link, Navigate, useLocation, useNavigate } from "react-router";
 import { toast } from "sonner";
 import type { Doc as YDoc } from "yjs";
 
@@ -107,6 +108,7 @@ import {
   patchDocumentCaches,
   documentQueryFilter,
   documentQueryKey,
+  startPageOpenReviewReads,
   startPreviewDocumentDraftRead,
   useContentNavigationContext,
   useDeleteDocument,
@@ -129,7 +131,6 @@ import {
 } from "@/hooks/use-optimistic-document-title";
 import {
   CONTENT_LANDING_PATH,
-  contentLandingRecoveryTarget,
   rememberContentLandingDocument,
 } from "@/lib/content-landing";
 import type { DesktopContentFileRevision } from "@/lib/desktop-content-files";
@@ -148,9 +149,12 @@ import {
   isDocumentCreationPending,
 } from "@/lib/optimistic-document";
 import {
+  readDocumentShapeHint,
   readPageIconRowHint,
+  readPageShapeHint,
   rememberPageIconRow,
-} from "@/lib/page-icon-row-hint";
+  rememberPageShape,
+} from "@/lib/page-startup-hints";
 import { startupAnchor } from "@/lib/startup-timing";
 import { cn } from "@/lib/utils";
 
@@ -180,9 +184,12 @@ import {
 } from "./CommentsSidebar";
 import type { DatabaseExportContext } from "./database/DatabaseExportDialog";
 import {
+  DOCUMENT_EDITOR_DATABASE_TITLE_SIZE_CLASS_NAME,
+  DOCUMENT_EDITOR_INLINE_REVIEW_MIN_WIDTH,
   DOCUMENT_EDITOR_PAGE_TITLE_SIZE_CLASS_NAME,
   DOCUMENT_EDITOR_TITLE_CLASS_NAME,
   documentEditorBodyClassName,
+  documentEditorDatabaseRegionClassName,
   documentEditorTitleRegionClassName,
   type DocumentEditorIconRow,
 } from "./document-editor-layout";
@@ -487,6 +494,26 @@ export function documentEditorReservesInlineReviewSpace(args: {
   );
 }
 
+export function documentEditorReviewReadsSettled(args: {
+  isLocalFileDocument: boolean;
+  hasThreads: boolean;
+  hasSuggestions: boolean;
+  commentsFetching: boolean;
+  suggestionsFetching: boolean;
+  commentsError: boolean;
+  suggestionsError: boolean;
+}) {
+  return (
+    args.isLocalFileDocument ||
+    (args.hasThreads &&
+      args.hasSuggestions &&
+      !args.commentsFetching &&
+      !args.suggestionsFetching &&
+      !args.commentsError &&
+      !args.suggestionsError)
+  );
+}
+
 export function suggestionPresentation(
   suggestion: Pick<ResourceSuggestion, "id" | "status" | "operations">,
   currentMarkdown: string,
@@ -1145,9 +1172,18 @@ function adoptConfirmedSaveWatermarks({
   }
 }
 
-function DocumentUnavailable() {
+// A Page link that this account can't read stays on its URL and says so.
+// Opening some other page instead hides the denial from the person who
+// followed the link.
+export function DocumentUnavailable({
+  host,
+}: {
+  host: PageEditorSurfaceProps["host"];
+}) {
   const t = useT();
   const sidebarTrigger = useSidebarTrigger();
+  const { session } = useSession();
+  const viewerEmail = host === "page" ? (session?.email ?? null) : null;
 
   return (
     <div className="flex min-h-0 flex-1 flex-col">
@@ -1167,6 +1203,21 @@ function DocumentUnavailable() {
           <p className="mt-3 text-sm leading-6 text-muted-foreground">
             {t("empty.documentUnavailableDescription")}
           </p>
+          {viewerEmail ? (
+            <p className="mt-4 break-all text-sm text-muted-foreground">
+              {t("empty.signedInAs", { email: viewerEmail })}
+            </p>
+          ) : null}
+          {host === "page" ? (
+            <div className="mt-6 flex flex-wrap items-center justify-center gap-2">
+              <Button asChild>
+                <Link to={CONTENT_LANDING_PATH}>{t("empty.goToMyPages")}</Link>
+              </Button>
+              <Button variant="outline" onClick={() => void signOut()}>
+                {t("empty.switchAccount")}
+              </Button>
+            </div>
+          ) : null}
         </div>
       </div>
     </div>
@@ -1243,7 +1294,6 @@ export function PageEditorSurface({
     isError,
     isFetching,
   } = documentQuery;
-  const navigate = useNavigate();
   const queryClient = useQueryClient();
   const documentQueryKeyValue = documentQueryKey(documentId, {
     databaseId,
@@ -1251,13 +1301,13 @@ export function PageEditorSurface({
   });
   useEffect(() => {
     if (readsStartedEarly) return;
-    startPreviewDocumentDraftRead(
-      queryClient,
-      documentId,
-      queryClient.getQueryData<Document>(
-        documentQueryKey(documentId, { databaseId, databaseDocumentId }),
-      ),
+    const cached = queryClient.getQueryData<Document>(
+      documentQueryKey(documentId, { databaseId, databaseDocumentId }),
     );
+    startPreviewDocumentDraftRead(queryClient, documentId, cached);
+    if (cached?.source?.mode !== "local-files") {
+      startPageOpenReviewReads(queryClient, documentId);
+    }
   }, [
     databaseDocumentId,
     databaseId,
@@ -1344,26 +1394,8 @@ export function PageEditorSurface({
     }
   }
 
-  const landingRecovery =
-    loadState.view === "unavailable"
-      ? contentLandingRecoveryTarget({ host, documentId })
-      : null;
-  const landingRecoveryDocumentId =
-    landingRecovery?.state.unavailableDocumentId ?? null;
-  useEffect(() => {
-    if (!landingRecoveryDocumentId) return;
-    void navigate(CONTENT_LANDING_PATH, {
-      replace: true,
-      state: { unavailableDocumentId: landingRecoveryDocumentId },
-    });
-  }, [landingRecoveryDocumentId, navigate]);
-
   if (loadState.view === "unavailable") {
-    return landingRecovery ? (
-      <DocumentEditorSkeleton />
-    ) : (
-      <DocumentUnavailable />
-    );
+    return <DocumentUnavailable host={host} />;
   }
 
   if (loadState.view === "error") {
@@ -1383,7 +1415,7 @@ export function PageEditorSurface({
     return host === "page" ? (
       <Navigate to="/home" replace />
     ) : (
-      <DocumentUnavailable />
+      <DocumentUnavailable host={host} />
     );
   }
 
@@ -1392,6 +1424,11 @@ export function PageEditorSurface({
       <DocumentEditorSkeleton
         title={optimisticTitle}
         iconRow={readPageIconRowHint(documentId)}
+        shape={
+          document
+            ? readDocumentShapeHint(document)
+            : readPageShapeHint(documentId)
+        }
       />
     );
   }
@@ -1847,7 +1884,9 @@ function useElementMinWidth(
 ) {
   const [matches, setMatches] = useState(false);
 
-  useEffect(() => {
+  // Measured before the first paint: a page that opens beside the review
+  // margin must not first paint without it.
+  useLayoutEffect(() => {
     const element = ref.current;
     if (!element) return;
     const update = () =>
@@ -2027,11 +2066,10 @@ export function documentEditorShowsUtilityPanelSheet(
   return args.utilityPanel === "info" && !args.hasUtilityRailSpace;
 }
 
-export { documentEditorTitleRegionClassName };
-
-export function documentEditorDatabaseRegionClassName() {
-  return "shrink-0 min-w-0 w-full max-w-none px-4 pb-8 sm:px-8 lg:px-10";
-}
+export {
+  documentEditorDatabaseRegionClassName,
+  documentEditorTitleRegionClassName,
+};
 
 export function resizeDocumentTitleTextarea(
   textarea: Pick<HTMLTextAreaElement, "scrollHeight" | "style">,
@@ -6279,9 +6317,12 @@ function PageEditorSessionBody({
     null,
   );
   const appliedSuggestionLinkRef = useRef<string | null>(null);
-  const { data: threads, isLoading: commentsLoading } = useComments(
-    !isLocalFileDocument ? documentId : null,
-  );
+  const {
+    data: threads,
+    isLoading: commentsLoading,
+    isFetching: commentsFetching,
+    isError: commentsError,
+  } = useComments(!isLocalFileDocument ? documentId : null);
   const commentAi = useCommentAiRequests(documentId, {
     enabled: !isLocalFileDocument && canComment,
   });
@@ -6310,7 +6351,10 @@ function PageEditorSessionBody({
     useState<AnchoredCommentPosition | null>(null);
   const [commentLaneOffset, setCommentLaneOffset] = useState(0);
   const hasUtilityRailSpace = useElementMinWidth(documentLayoutRef, 960);
-  const hasInlineCommentSpace = useElementMinWidth(documentLayoutRef, 1088);
+  const hasInlineCommentSpace = useElementMinWidth(
+    documentLayoutRef,
+    DOCUMENT_EDITOR_INLINE_REVIEW_MIN_WIDTH,
+  );
   const showCommentsHistoryDrawer =
     utilityPanel === "comments" && commentsBrowseOpen;
   const showDesktopCommentsHistory =
@@ -6343,12 +6387,52 @@ function PageEditorSessionBody({
     hasSelectedCommentThread,
     hasPendingComment: !!pendingComment,
   });
+  // A failed read says nothing about whether the page still has open review,
+  // so the remembered margin holds until both reads answer.
+  const reviewReadsSettled = documentEditorReviewReadsSettled({
+    isLocalFileDocument,
+    hasThreads: threads !== undefined,
+    hasSuggestions: suggestionsQuery.data !== undefined,
+    commentsFetching,
+    suggestionsFetching: suggestionsQuery.isFetching,
+    commentsError,
+    suggestionsError: suggestionsQuery.isError,
+  });
+  const pageHadOpenReview = useMemo(
+    () => host === "page" && readPageShapeHint(documentId) === "review",
+    [documentId, host],
+  );
   const reserveInlineReviewSpace = documentEditorReservesInlineReviewSpace({
     showInlineComments,
-    preserveInlineReviewSpace,
+    preserveInlineReviewSpace:
+      preserveInlineReviewSpace || (pageHadOpenReview && !reviewReadsSettled),
     hasInlineCommentSpace,
     isDatabasePage: Boolean(document.database),
   });
+  const hasOpenReview = hasOpenCommentThreads || hasOpenSuggestions;
+  useEffect(() => {
+    if (
+      host !== "page" ||
+      document.database ||
+      isLocalFileDocument ||
+      !reviewReadsSettled
+    )
+      return;
+    rememberPageShape(documentId, hasOpenReview ? "review" : "page");
+  }, [
+    document.database,
+    documentId,
+    hasOpenReview,
+    host,
+    isLocalFileDocument,
+    reviewReadsSettled,
+    suggestionsQuery.data,
+    suggestionsQuery.isError,
+    suggestionsQuery.isFetching,
+    threads,
+    commentsFetching,
+    commentsError,
+  ]);
   const showDesktopInfoPanel = utilityPanel === "info" && hasUtilityRailSpace;
   const showDesktopRightRail = showInlineComments || showDesktopInfoPanel;
   const showAnchoredCommentPopover =
@@ -7844,7 +7928,7 @@ function PageEditorSessionBody({
                       DOCUMENT_EDITOR_TITLE_CLASS_NAME,
                       "resize-none overflow-hidden border-none bg-transparent outline-none placeholder:text-muted-foreground/40",
                       host === "preview" || isDatabasePage
-                        ? "text-3xl"
+                        ? DOCUMENT_EDITOR_DATABASE_TITLE_SIZE_CLASS_NAME
                         : DOCUMENT_EDITOR_PAGE_TITLE_SIZE_CLASS_NAME,
                     )}
                   />

package/corpus/templates/content/app/components/editor/DocumentEditorSkeleton.tsx

@@ -3,29 +3,156 @@ import { Skeleton } from "@/components/ui/skeleton";
 import { startupAnchor } from "@/lib/startup-timing";
 import { cn } from "@/lib/utils";
 
+import { DatabaseViewSkeleton } from "./database/DatabaseViewSkeleton";
 import {
+  DOCUMENT_EDITOR_DATABASE_TITLE_SIZE_CLASS_NAME,
   DOCUMENT_EDITOR_PAGE_TITLE_SIZE_CLASS_NAME,
   DOCUMENT_EDITOR_TITLE_CLASS_NAME,
   documentEditorBodyClassName,
+  documentEditorDatabaseRegionClassName,
   documentEditorTitleRegionClassName,
   type DocumentEditorIconRow,
+  type DocumentEditorShape,
 } from "./document-editor-layout";
 
-// Before the app loads, the startup script marks <html> with the icon row the
-// page last drew; "startup" sizes the row from that mark, since storage is out
-// of reach while the server renders.
+// Before the app loads, the startup script marks <html> with the icon row and
+// shape the page last drew; "startup" draws from those marks, since storage is
+// out of reach while the server renders.
 const STARTUP_ICON_ROW_CLASS_NAME =
   "h-7 w-0 [html[data-content-page-icon-row=icon]_&]:size-14 [html[data-content-page-icon-row=none]_&]:hidden";
+const STARTUP_PAGE_COLUMN_CLASS_NAME =
+  "[html[data-content-page-shape=database]_&]:hidden [html[data-content-page-shape=database-constrained]_&]:hidden";
+const STARTUP_DATABASE_COLUMN_CLASS_NAME =
+  "hidden [html[data-content-page-shape=database]_&]:block [html[data-content-page-shape=database-constrained]_&]:block";
 
-// Every box here is the page editor's own box, so the title and the body start
-// where the editor will draw them. While `title` is undefined the title is
-// still unknown, and the body waits for it: a title that wraps would move it.
+// The editor opens the review margin from DOCUMENT_EDITOR_INLINE_REVIEW_MIN_WIDTH
+// of page width, measured on the box this one stands in for.
+const REVIEW_MARGIN_CLASS_NAME = "@min-[1088px]:pr-80";
+const STARTUP_REVIEW_MARGIN_CLASS_NAME =
+  "[html[data-content-page-shape=review]_&]:@min-[1088px]:pr-80";
+
+function PageColumn({
+  title,
+  iconRow,
+  review,
+  className,
+}: {
+  title?: string | null;
+  iconRow: DocumentEditorIconRow | "startup";
+  review: boolean | "startup";
+  className?: string;
+}) {
+  return (
+    <div
+      className={cn(
+        review === "startup"
+          ? STARTUP_REVIEW_MARGIN_CLASS_NAME
+          : review && REVIEW_MARGIN_CLASS_NAME,
+        className,
+      )}
+    >
+      <div className={documentEditorTitleRegionClassName(false)}>
+        <div className="mb-1">
+          {iconRow === "startup" ? (
+            <Skeleton className={STARTUP_ICON_ROW_CLASS_NAME} />
+          ) : iconRow === "icon" ? (
+            <Skeleton className="size-14 rounded-md" />
+          ) : iconRow === "add" ? (
+            <div className="h-7" />
+          ) : null}
+        </div>
+        <div
+          {...startupAnchor("title")}
+          className={cn(
+            DOCUMENT_EDITOR_TITLE_CLASS_NAME,
+            DOCUMENT_EDITOR_PAGE_TITLE_SIZE_CLASS_NAME,
+            "relative",
+          )}
+        >
+          <SkeletonTitle title={title} />
+        </div>
+      </div>
+      {title === undefined ? null : (
+        <div
+          {...startupAnchor("body")}
+          className={documentEditorBodyClassName("page")}
+        >
+          <div className="space-y-3 pt-1.5">
+            <Skeleton className="h-4 w-full" />
+            <Skeleton className="h-4 w-11/12" />
+            <Skeleton className="h-4 w-5/6" />
+            <Skeleton className="h-4 w-3/4" />
+          </div>
+          <div className="space-y-3 pt-8">
+            <Skeleton className="h-4 w-10/12" />
+            <Skeleton className="h-4 w-4/5" />
+            <Skeleton className="h-4 w-7/12" />
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
+
+// A collection always draws its 56px icon, and its view below the title.
+function DatabaseColumn({
+  title,
+  constraints,
+  className,
+}: {
+  title?: string | null;
+  constraints: boolean | "startup";
+  className?: string;
+}) {
+  return (
+    <div className={className}>
+      <div className={documentEditorTitleRegionClassName(true)}>
+        <div className="mb-1">
+          <Skeleton className="size-14 rounded-md" />
+        </div>
+        <div
+          {...startupAnchor("title")}
+          className={cn(
+            DOCUMENT_EDITOR_TITLE_CLASS_NAME,
+            DOCUMENT_EDITOR_DATABASE_TITLE_SIZE_CLASS_NAME,
+            "relative",
+          )}
+        >
+          <SkeletonTitle title={title} />
+        </div>
+      </div>
+      {title === undefined ? null : (
+        <div className={documentEditorDatabaseRegionClassName()}>
+          <DatabaseViewSkeleton constraints={constraints} />
+        </div>
+      )}
+    </div>
+  );
+}
+
+function SkeletonTitle({ title }: { title?: string | null }) {
+  return (
+    title || (
+      <>
+        &nbsp;
+        <Skeleton className="absolute inset-y-[20%] start-0 w-2/3" />
+      </>
+    )
+  );
+}
+
+// Every box here is the page editor's own box, so the title and what follows
+// it start where the editor will draw them. While `title` is undefined the
+// title is still unknown, and what follows waits for it: a title that wraps
+// would move it.
 export function DocumentEditorSkeleton({
   title,
   iconRow = "add",
+  shape = "page",
 }: {
   title?: string | null;
   iconRow?: DocumentEditorIconRow | "startup";
+  shape?: DocumentEditorShape | "startup";
 }) {
   const sidebarTrigger = useSidebarTrigger();
   return (
@@ -42,50 +169,32 @@ export function DocumentEditorSkeleton({
           <Skeleton className="h-7 w-7 rounded-md" />
         </div>
       </div>
-      <div className="min-h-0 flex-1 overflow-hidden">
-        <div className={documentEditorTitleRegionClassName(false)}>
-          <div className="mb-1">
-            {iconRow === "startup" ? (
-              <Skeleton className={STARTUP_ICON_ROW_CLASS_NAME} />
-            ) : iconRow === "icon" ? (
-              <Skeleton className="size-14 rounded-md" />
-            ) : iconRow === "add" ? (
-              <div className="h-7" />
-            ) : null}
-          </div>
-          <div
-            {...startupAnchor("title")}
-            className={cn(
-              DOCUMENT_EDITOR_TITLE_CLASS_NAME,
-              DOCUMENT_EDITOR_PAGE_TITLE_SIZE_CLASS_NAME,
-              "relative",
-            )}
-          >
-            {title || (
-              <>
-                &nbsp;
-                <Skeleton className="absolute inset-y-[20%] start-0 w-2/3" />
-              </>
-            )}
-          </div>
-        </div>
-        {title === undefined ? null : (
-          <div
-            {...startupAnchor("body")}
-            className={documentEditorBodyClassName("page")}
-          >
-            <div className="space-y-3 pt-1.5">
-              <Skeleton className="h-4 w-full" />
-              <Skeleton className="h-4 w-11/12" />
-              <Skeleton className="h-4 w-5/6" />
-              <Skeleton className="h-4 w-3/4" />
-            </div>
-            <div className="space-y-3 pt-8">
-              <Skeleton className="h-4 w-10/12" />
-              <Skeleton className="h-4 w-4/5" />
-              <Skeleton className="h-4 w-7/12" />
-            </div>
-          </div>
+      <div className="@container min-h-0 flex-1 overflow-hidden">
+        {shape === "startup" ? (
+          <>
+            <PageColumn
+              title={title}
+              iconRow={iconRow}
+              review="startup"
+              className={STARTUP_PAGE_COLUMN_CLASS_NAME}
+            />
+            <DatabaseColumn
+              title={title}
+              constraints="startup"
+              className={STARTUP_DATABASE_COLUMN_CLASS_NAME}
+            />
+          </>
+        ) : shape === "database" || shape === "database-constrained" ? (
+          <DatabaseColumn
+            title={title}
+            constraints={shape === "database-constrained"}
+          />
+        ) : (
+          <PageColumn
+            title={title}
+            iconRow={iconRow}
+            review={shape === "review"}
+          />
         )}
       </div>
     </div>