@rebasepro/admin 0.15.0 → 0.16.0

package/src/form/components/FormRail.tsx

@@ -36,10 +36,21 @@ export function FormRail({
             // `w-76` (304px), between the old 288 and a full `w-80`. The rail
             // holds real controls — a status select, a date picker — plus a
             // record block whose id is a 36-character UUID, so 288 left the
-            // select tighter than the identical select in the column. 320 took
-            // more than it gave back: past about 300px the extra goes to the
-            // gap beside a chip, not to anything that needed it.
-            "flex flex-col gap-6 shrink-0 w-76 border-l overflow-y-auto",
+            // select tighter than the identical select in the column.
+            //
+            // 304 is the floor rather than the answer everywhere. It was chosen
+            // against the *narrow* end, where 320 took more than it gave back —
+            // past about 300px the extra went to the gap beside a chip. That
+            // stops being true once the form is genuinely wide: `@7xl/form`
+            // (1280px of form) is the same signal the column widens on, and by
+            // then 32px is coming out of gutters, not out of the column.
+            //
+            // Container, not viewport, for the reason the whole rail is
+            // measured rather than breakpointed: a side panel inside a large
+            // window is not a wide form. Both surfaces that render a rail —
+            // `EntityForm` and `EntityViewBinding` — name their form element
+            // `@container/form`, so a panel that never gets that wide keeps 304.
+            "flex flex-col gap-6 shrink-0 w-76 @7xl/form:w-84 border-l overflow-y-auto",
             "px-5 py-6 bg-surface-50 dark:bg-surface-900",
             defaultBorderMixin
         )}>

package/src/form/useUndoableDiscard.ts

@@ -0,0 +1,39 @@
+import { useCallback } from "react";
+import type { EntityStatus } from "@rebasepro/types";
+import type { FormexController } from "@rebasepro/forms";
+import { useSafeSnackbarController } from "../collection_editor/useSafeSnackbarController";
+
+/**
+ * Throw away everything the user has typed, reversibly.
+ *
+ * "Discard" and "Clear" sit next to Save, take one click, and undo everything
+ * the user has done since they opened the record — the identity bar's version
+ * does not even stop to ask. So the reset goes *through* the undo history
+ * rather than around it (see `undoable` in `FormexResetProps`), and the
+ * confirmation carries the Undo, which is the only place it can be: the form
+ * has no undo button, only the ⌘Z the user has no reason to guess at.
+ *
+ * Pass `values` to reset to something other than the form's current baseline.
+ */
+export function useUndoableDiscard() {
+
+    const snackbarController = useSafeSnackbarController();
+
+    return useCallback((
+        formex: FormexController<any>,
+        status: EntityStatus,
+        values?: unknown
+    ) => {
+        formex.resetForm(values !== undefined
+            ? { values, undoable: true }
+            : { undoable: true });
+        snackbarController?.open({
+            type: "info",
+            message: status === "existing" ? "Changes discarded" : "Form cleared",
+            action: {
+                label: "Undo",
+                onClick: () => formex.undo()
+            }
+        });
+    }, [snackbarController]);
+}

package/src/preview/components/StorageThumbnail.tsx

@@ -33,6 +33,40 @@ function areEqual(prevProps: StorageThumbnailProps, nextProps: StorageThumbnailP
 
 const URL_CACHE: Record<string, DownloadConfig> = {};
 
+/**
+ * The signed-URL request currently in flight for a given cache key.
+ *
+ * A collection view draws one thumbnail per row and rows share images far more
+ * often than not — the demo's 200 blog posts are illustrated by 20 hero images.
+ * Every one of those thumbnails mounts in the same tick, and each used to call
+ * `getSignedUrl` on its own: {@link URL_CACHE} is only written when a response
+ * *lands*, so it is still empty while the burst goes out and dedupes nothing.
+ * The result was five or more identical requests per distinct file, and minting
+ * a download token is a real request — `/api/storage/metadata/<path>` — against
+ * a rate-limited surface. One page view was enough to exhaust the budget and
+ * every thumbnail on the screen then failed with a 429.
+ *
+ * Sharing the promise collapses that burst to one request per file. It
+ * deliberately does not extend how long anything is cached: `DownloadConfig.url`
+ * is temporal, so a later mount still refetches exactly as it did before.
+ */
+const IN_FLIGHT = new Map<string, Promise<DownloadConfig>>();
+
+function getSignedUrlOnce(
+    storage: { getSignedUrl: (path: string) => Promise<DownloadConfig> },
+    path: string,
+    cacheKey: string
+): Promise<DownloadConfig> {
+    const existing = IN_FLIGHT.get(cacheKey);
+    if (existing) return existing;
+
+    const request = storage.getSignedUrl(path).finally(() => {
+        IN_FLIGHT.delete(cacheKey);
+    });
+    IN_FLIGHT.set(cacheKey, request);
+    return request;
+}
+
 export function StorageThumbnailInternal({
     storeUrl,
     interactive,
@@ -64,7 +98,7 @@ export function StorageThumbnailInternal({
         if (!storagePathOrDownloadUrl)
             return;
         let unmounted = false;
-        storage.getSignedUrl(storagePathOrDownloadUrl)
+        getSignedUrlOnce(storage, storagePathOrDownloadUrl, cacheKey)
             .then(function (downloadConfig) {
                 if (!unmounted) {
                     setDownloadConfig(downloadConfig);

package/src/routes/RebaseRoute.tsx

@@ -41,32 +41,24 @@ export function RebaseRoute() {
     });
 
     useEffect(() => {
-        const lastEntry = navigationEntries[navigationEntries.length - 1];
-        const isViewingCollection = lastEntry?.type === "collection";
-
         breadcrumbs.set({
-            breadcrumbs: navigationEntries.map((entry, index) => {
-                const isLastEntry = index === navigationEntries.length - 1;
+            breadcrumbs: navigationEntries.map((entry) => {
 
                 if (entry.type === "entity") {
                     return ({
                         title: String(entry.entityId),
                         url: urlController.buildUrlCollectionPath(entry.path)
-                        // count: undefined (not applicable for entities)
                     });
                 } else if (entry.type === "custom_view") {
                     return ({
                         title: String(entry.view.name ?? entry.view.key),
                         url: urlController.buildUrlCollectionPath(entry.path)
-                        // count: undefined (not applicable for custom views)
                     });
                 } else if (entry.type === "collection") {
-                    const showCount = isLastEntry && isViewingCollection;
                     return ({
                         title: entry.collection.name,
                         url: urlController.buildUrlCollectionPath(entry.path),
-                        id: entry.path,
-                        ...(showCount ? { count: null } : {})
+                        id: entry.path
                     });
                 } else {
                     throw new Error("Unexpected navigation entry type");