@vexcms/next 0.1.0-alpha.26 → 0.1.0-alpha.28

package/dist/chunk-JB3GMZPF.js

@@ -0,0 +1,525 @@
+// src/NextAdminPage.tsx
+import {
+  ADMIN_COOKIE_NAME,
+  adminCollectionCookieName,
+  appendLivePreviewParams,
+  buildGetArgs,
+  buildGlobalGetArgs,
+  buildListViewFindQueryArgs,
+  buildListViewSearchQueryArgs,
+  collectListViewFilterRelationshipValues,
+  CRUD_ACTIONS,
+  parseListViewUrlState,
+  parseListViewConfigCookies,
+  parseListViewSkeletonRowCountCookie,
+  parseLocalSavedListViewsIndexCookie,
+  PERMISSION_SCOPES,
+  readLivePreviewLayoutCookie,
+  readLivePreviewPanelCookie,
+  resolveFieldPermissions,
+  resolveListViewQueryState,
+  resolveLivePreviewSettings,
+  resolveListViewSearchField,
+  vexConvexApi
+} from "@vexcms/core";
+import {
+  AdminNotFound,
+  AdminTopNav,
+  adminHref,
+  CollectionEditView,
+  CollectionListView,
+  CollectionsIndexView,
+  DashboardView,
+  GlobalEditView,
+  GlobalsListView,
+  MediaCollectionEditView,
+  MediaCollectionListView,
+  VexAuthProvider
+} from "@vexcms/react";
+import { dehydrate } from "@tanstack/react-query";
+import { fetchQuery } from "convex/nextjs";
+import { cookies } from "next/headers";
+import { notFound } from "next/navigation";
+import { HydrationBoundaryClient } from "./HydrationBoundaryClient";
+
+// src/serverQueryClient.ts
+import { defaultShouldDehydrateQuery, hashKey, QueryClient } from "@tanstack/react-query";
+import { getFunctionName } from "convex/server";
+import { convexToJson } from "convex/values";
+import { cache } from "react";
+function convexServerQueryKey(funcRef, args) {
+  return ["convexQuery", getFunctionName(funcRef), args];
+}
+function serverQueryKeyHashFn(queryKey) {
+  if (queryKey.length >= 2 && queryKey[0] === "convexQuery") {
+    return `convexQuery|${getFunctionName(queryKey[1])}|${JSON.stringify(convexToJson(queryKey[2]))}`;
+  }
+  return hashKey(queryKey);
+}
+var getServerQueryClient = cache(() => {
+  return new QueryClient({
+    defaultOptions: {
+      queries: {
+        // Matches `apps/*‍/src/components/providers/convex.tsx`'s client `QueryClient`, so a
+        // Convex query's dehydrated key hashes identically on both sides — required for
+        // hydration to find it rather than silently re-fetching.
+        queryKeyHashFn: serverQueryKeyHashFn,
+        retry: false
+      },
+      dehydrate: {
+        // `pending`: TanStack's own default only dehydrates settled queries — required for
+        // the "don't await the prefetch" half of the pattern, see above. `error`: a Convex
+        // query that genuinely fails (e.g. `UNINDEXED_SORT`) settles to "error" by the time
+        // `dehydrate()` runs (several awaits/microtasks after the un-awaited `prefetchQuery`
+        // call) — WITHOUT this, `defaultShouldDehydrateQuery` excludes it entirely (only
+        // "success" dehydrates by default), so the client's `useSuspenseQuery` would silently
+        // re-fetch from scratch and hit the identical error a second time — functionally fine
+        // (the client already handles its own error the same way, `ListViewQueryError`), but a
+        // wasted round trip; including "error" here lets the dehydrated failure reach the
+        // client directly, no second Convex call needed.
+        shouldDehydrateQuery: (query) => defaultShouldDehydrateQuery(query) || query.state.status === "pending" || query.state.status === "error",
+        // Next.js detects dynamic rendering via a thrown error during render; redacting it
+        // here (TanStack's own default) would hide that signal from Next.js.
+        shouldRedactErrors: () => false
+      }
+    }
+  });
+});
+
+// src/NextAdminPage.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function renderAdminShell(props) {
+  return /* @__PURE__ */ jsx(VexAuthProvider, { value: props.auth, children: /* @__PURE__ */ jsxs(HydrationBoundaryClient, { state: dehydrate(props.queryClient), children: [
+    /* @__PURE__ */ jsx(AdminTopNav, { activeSlug: props.activeSlug, activeDocID: props.activeDocID }),
+    /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 p-6 pt-0", children: props.children })
+  ] }) });
+}
+async function resolveInitialPreviewUrl(props) {
+  const url = await fetchQuery(
+    vexConvexApi.livePreviewUrl,
+    props.args,
+    props.token ? { token: props.token } : void 0
+  );
+  if (!url) return void 0;
+  return appendLivePreviewParams({ url, collectionSlug: props.slug });
+}
+var warnedMissingAuth = false;
+function warnIfAuthMissing(props) {
+  if (props.authPromise !== void 0) return;
+  if (!props.access || !props.access.enabled) return;
+  if (warnedMissingAuth) return;
+  if (process.env.NODE_ENV === "production") return;
+  warnedMissingAuth = true;
+  console.warn(
+    "[vexcms] NextAdminPage: config.access is enabled but no `authPromise` prop was passed. Every caller is being treated as anonymous (fail-closed) until you pass `authPromise={getUserOrg()}` from your own session source \u2014 see Decision 44 (.agent/docs/specs/2026-10-26-list-view-overhaul/spec.md)."
+  );
+}
+async function NextAdminPage(props) {
+  const { path = [] } = await props.params;
+  const [section, collectionSlug, documentId] = path;
+  const cookieStore = await cookies();
+  warnIfAuthMissing({ access: props.config.access, authPromise: props.authPromise });
+  const token = props.tokenPromise ? await props.tokenPromise : void 0;
+  const authPromise = props.authPromise ?? Promise.resolve({ user: null });
+  if (path.length === 0) {
+    const auth2 = await authPromise;
+    return renderAdminShell({
+      auth: auth2,
+      queryClient: getServerQueryClient(),
+      children: /* @__PURE__ */ jsx(DashboardView, {})
+    });
+  }
+  if (section !== "collections" && section !== "globals") {
+    notFound();
+  }
+  if (section === "globals") {
+    if (!collectionSlug) {
+      const auth3 = await authPromise;
+      return renderAdminShell({
+        auth: auth3,
+        activeSlug: "globals",
+        queryClient: getServerQueryClient(),
+        children: /* @__PURE__ */ jsx(GlobalsListView, {})
+      });
+    }
+    const globalConfig = props.config.globals.find((g) => g.slug === collectionSlug);
+    if (!globalConfig) {
+      const auth3 = await authPromise;
+      return renderAdminShell({
+        auth: auth3,
+        activeSlug: "globals",
+        queryClient: getServerQueryClient(),
+        children: /* @__PURE__ */ jsx(
+          AdminNotFound,
+          {
+            variant: "global",
+            detail: `Global "${collectionSlug}" doesn't exist.`,
+            backHref: adminHref({ type: "globals" }, props.config.basePath),
+            backLabel: "Back to globals"
+          }
+        )
+      });
+    }
+    const globalQueryClient = getServerQueryClient();
+    const globalArgs = buildGlobalGetArgs({ global: globalConfig });
+    const globalDocPromise = fetchQuery(
+      vexConvexApi.globals.get,
+      globalArgs,
+      token ? { token } : void 0
+    ).catch(() => null);
+    const globalLivePreview = resolveLivePreviewSettings({
+      config: props.config.admin.livePreview,
+      kind: "global",
+      slug: globalConfig.slug,
+      admin: globalConfig.admin.livePreview
+    });
+    const previewUrlPromise = globalLivePreview === void 0 ? Promise.resolve(void 0) : resolveInitialPreviewUrl({
+      args: { collection: globalConfig.slug, kind: "global", values: {} },
+      slug: globalConfig.slug,
+      token
+    });
+    const [auth2, initialPreviewUrl, globalDoc] = await Promise.all([
+      authPromise,
+      previewUrlPromise,
+      globalDocPromise
+    ]);
+    if (!globalDoc) {
+      return renderAdminShell({
+        auth: auth2,
+        activeSlug: "globals",
+        queryClient: globalQueryClient,
+        children: /* @__PURE__ */ jsx(
+          AdminNotFound,
+          {
+            variant: "document",
+            detail: "This document doesn't exist, or you don't have access to view it.",
+            backHref: `${props.config.basePath}/globals`,
+            backLabel: "Back to Globals"
+          }
+        )
+      });
+    }
+    await globalQueryClient.prefetchQuery({
+      queryKey: convexServerQueryKey(vexConvexApi.globals.get, globalArgs),
+      queryFn: () => globalDoc
+    }).catch(() => void 0);
+    return renderAdminShell({
+      auth: auth2,
+      activeSlug: "globals",
+      activeDocID: globalConfig.slug,
+      queryClient: globalQueryClient,
+      children: /* @__PURE__ */ jsx(
+        GlobalEditView,
+        {
+          global: globalConfig.slug,
+          initialData: globalDoc,
+          initialPreviewPanelOpen: globalLivePreview !== void 0 && readLivePreviewPanelCookie({
+            cookieValue: cookieStore.get(ADMIN_COOKIE_NAME)?.value,
+            defaultOpen: globalLivePreview.defaultOpen
+          }),
+          initialPreviewPanelSize: readLivePreviewLayoutCookie({
+            cookieValue: cookieStore.get(ADMIN_COOKIE_NAME)?.value
+          }),
+          initialPreviewUrl
+        }
+      )
+    });
+  }
+  if (!collectionSlug) {
+    const auth2 = await authPromise;
+    return renderAdminShell({
+      auth: auth2,
+      activeSlug: "collections",
+      queryClient: getServerQueryClient(),
+      children: /* @__PURE__ */ jsx(CollectionsIndexView, {})
+    });
+  }
+  const collection = props.config.collections.find((c) => c.slug === collectionSlug);
+  const mediaCollection = props.config.mediaCollections.find((mc) => mc.slug === collectionSlug);
+  if (!collection && !mediaCollection) {
+    const auth2 = await authPromise;
+    return renderAdminShell({
+      auth: auth2,
+      activeSlug: collectionSlug,
+      queryClient: getServerQueryClient(),
+      children: /* @__PURE__ */ jsx(
+        AdminNotFound,
+        {
+          variant: "collection",
+          detail: `Collection "${collectionSlug}" doesn't exist.`,
+          backHref: adminHref({ type: "collections" }, props.config.basePath),
+          backLabel: "Back to collections"
+        }
+      )
+    });
+  }
+  if (mediaCollection && documentId) {
+    const mediaEditQueryClient = getServerQueryClient();
+    const mediaEditArgs = buildGetArgs({ id: documentId, collection: mediaCollection });
+    const mediaDocPromise = fetchQuery(
+      vexConvexApi.get,
+      mediaEditArgs,
+      token ? { token } : void 0
+    ).catch(() => null);
+    const [auth2, mediaDoc] = await Promise.all([authPromise, mediaDocPromise]);
+    if (!mediaDoc) {
+      return renderAdminShell({
+        auth: auth2,
+        activeSlug: mediaCollection.slug,
+        queryClient: mediaEditQueryClient,
+        children: /* @__PURE__ */ jsx(
+          AdminNotFound,
+          {
+            variant: "document",
+            detail: "This document doesn't exist, or you don't have access to view it.",
+            backHref: `${props.config.basePath}/collections/${mediaCollection.slug}`,
+            backLabel: `Back to ${mediaCollection.labels.plural}`
+          }
+        )
+      });
+    }
+    await mediaEditQueryClient.prefetchQuery({
+      queryKey: convexServerQueryKey(vexConvexApi.get, mediaEditArgs),
+      queryFn: () => mediaDoc
+    }).catch(() => void 0);
+    return renderAdminShell({
+      auth: auth2,
+      activeSlug: mediaCollection.slug,
+      activeDocID: documentId,
+      queryClient: mediaEditQueryClient,
+      children: /* @__PURE__ */ jsx(MediaCollectionEditView, { collection: mediaCollection.slug, documentId, initialData: mediaDoc })
+    });
+  }
+  if (mediaCollection) {
+    const numItems2 = Math.max(
+      mediaCollection.admin.view.state.serverPageSize,
+      mediaCollection.admin.view.state.pageSize
+    );
+    const auth2 = await authPromise;
+    const mediaQueryClient = getServerQueryClient();
+    const mediaArgs = buildListViewFindQueryArgs({
+      collection: mediaCollection,
+      where: void 0,
+      sort: void 0,
+      drafts: void 0,
+      depth: 1,
+      numItems: numItems2
+    });
+    void mediaQueryClient.prefetchQuery({
+      queryKey: convexServerQueryKey(vexConvexApi.findPaginated, mediaArgs),
+      queryFn: () => fetchQuery(vexConvexApi.findPaginated, mediaArgs, token ? { token } : void 0)
+    }).catch(() => void 0);
+    return renderAdminShell({
+      auth: auth2,
+      activeSlug: mediaCollection.slug,
+      queryClient: mediaQueryClient,
+      children: /* @__PURE__ */ jsx(MediaCollectionListView, { collection: mediaCollection.slug })
+    });
+  }
+  if (collection && documentId) {
+    const collectionEditQueryClient = getServerQueryClient();
+    const collectionEditArgs = buildGetArgs({ id: documentId, collection });
+    const collectionDocPromise = fetchQuery(
+      vexConvexApi.get,
+      collectionEditArgs,
+      token ? { token } : void 0
+    ).catch(() => null);
+    const collectionLivePreview = resolveLivePreviewSettings({
+      config: props.config.admin.livePreview,
+      kind: "collection",
+      slug: collection.slug,
+      admin: collection.admin.livePreview
+    });
+    const previewUrlPromise = collectionLivePreview === void 0 ? Promise.resolve(void 0) : resolveInitialPreviewUrl({
+      args: { collection: collection.slug, kind: "collection", documentId, values: {} },
+      slug: collection.slug,
+      token
+    });
+    const [auth2, initialPreviewUrl, currentDocument] = await Promise.all([
+      authPromise,
+      previewUrlPromise,
+      collectionDocPromise
+    ]);
+    if (!currentDocument) {
+      return renderAdminShell({
+        auth: auth2,
+        activeSlug: collection.slug,
+        queryClient: collectionEditQueryClient,
+        children: /* @__PURE__ */ jsx(
+          AdminNotFound,
+          {
+            variant: "document",
+            detail: "This document doesn't exist, or you don't have access to view it.",
+            backHref: `${props.config.basePath}/collections/${collection.slug}`,
+            backLabel: `Back to ${collection.labels.plural}`
+          }
+        )
+      });
+    }
+    await collectionEditQueryClient.prefetchQuery({
+      queryKey: convexServerQueryKey(vexConvexApi.get, collectionEditArgs),
+      queryFn: () => currentDocument
+    }).catch(() => void 0);
+    return renderAdminShell({
+      auth: auth2,
+      activeSlug: collection.slug,
+      activeDocID: documentId,
+      queryClient: collectionEditQueryClient,
+      children: /* @__PURE__ */ jsx(
+        CollectionEditView,
+        {
+          collection: collection.slug,
+          documentId,
+          initialData: currentDocument,
+          initialPreviewPanelOpen: collectionLivePreview !== void 0 && readLivePreviewPanelCookie({
+            cookieValue: cookieStore.get(adminCollectionCookieName({ collection: collection.slug }))?.value,
+            defaultOpen: collectionLivePreview.defaultOpen
+          }),
+          initialPreviewPanelSize: readLivePreviewLayoutCookie({
+            cookieValue: cookieStore.get(adminCollectionCookieName({ collection: collection.slug }))?.value
+          }),
+          initialPreviewUrl
+        }
+      )
+    });
+  }
+  if (!collection) {
+    throw new Error("invalid collection slug");
+  }
+  const params = parseListViewUrlState({
+    searchParams: toSearchParams(await props.searchParams ?? {}),
+    collection
+  });
+  const [viewSource, viewId] = params.view?.split(":") ?? [];
+  const configView = viewSource === "config" ? collection.admin.views.find((view) => view.viewId === viewId) : void 0;
+  const listViewsPromise = fetchQuery(
+    vexConvexApi.listViews,
+    { collection: collection.slug },
+    token ? { token } : void 0
+  );
+  const peekArgs = params.peek === void 0 ? void 0 : buildGetArgs({ id: params.peek, collection });
+  const peekPromise = peekArgs === void 0 ? Promise.resolve(void 0) : (
+    // Same args as `useVexDocQuery`'s client query inside `ListViewPeek` (Design Decision
+    // 27/39), so the hydrated peek opens with no re-fetch.
+    fetchQuery(vexConvexApi.get, peekArgs, token ? { token } : void 0)
+  );
+  const queryClient = getServerQueryClient();
+  if (peekArgs !== void 0) {
+    void queryClient.prefetchQuery({
+      queryKey: convexServerQueryKey(vexConvexApi.get, peekArgs),
+      queryFn: () => peekPromise
+    }).catch(() => void 0);
+  }
+  const [auth, sharedView] = await Promise.all([
+    authPromise,
+    viewSource === "shared" ? listViewsPromise.catch(() => []).then((views) => views.find((view) => view.viewId === viewId)) : Promise.resolve(void 0)
+  ]);
+  const fieldPermissions = resolveFieldPermissions({
+    access: props.config.access,
+    user: auth.user,
+    organization: auth.organization,
+    resource: collection.slug,
+    action: CRUD_ACTIONS.read,
+    scope: PERMISSION_SCOPES.any
+  });
+  const resolved = resolveListViewQueryState({ collection, params, configView, sharedView, fieldPermissions });
+  const relationshipFilterValues = collectListViewFilterRelationshipValues({ where: resolved.where, collection });
+  const distinctFilterValues = [
+    ...new Map(relationshipFilterValues.map((v) => [`${v.targetCollection}:${v.id}`, v])).values()
+  ];
+  const filterValueTitlesPromise = Promise.allSettled(
+    distinctFilterValues.map(async (v) => {
+      const targetCollectionConfig = props.config.collections.find((c) => c.slug === v.targetCollection) ?? props.config.mediaCollections.find((c) => c.slug === v.targetCollection);
+      if (targetCollectionConfig === void 0) return [v.id, null];
+      const doc = await fetchQuery(
+        vexConvexApi.get,
+        buildGetArgs({ id: v.id, collection: targetCollectionConfig }),
+        token ? { token } : void 0
+      );
+      if (doc === null) return [v.id, null];
+      const titleField = targetCollectionConfig.admin.useAsTitle;
+      const title = doc[titleField];
+      return [v.id, typeof title === "string" && title !== "" ? title : String(doc._id)];
+    })
+  );
+  const numItems = Math.max(collection.admin.view.state.serverPageSize, resolved.pageSize);
+  const drafts = collection.versions.drafts ? true : void 0;
+  const resolvedSearchField = resolveListViewSearchField({
+    collection,
+    qf: resolved.searchField,
+    fieldPermissions
+  });
+  const isSearchActive = resolved.search.trim() !== "" && resolvedSearchField !== void 0;
+  if (isSearchActive) {
+    const args = buildListViewSearchQueryArgs({
+      collection,
+      where: resolved.where,
+      search: resolved.search,
+      searchField: resolvedSearchField,
+      drafts,
+      numItems
+    });
+    void queryClient.prefetchQuery({
+      queryKey: convexServerQueryKey(vexConvexApi.search, args),
+      queryFn: () => fetchQuery(vexConvexApi.search, args, token ? { token } : void 0)
+    }).catch(() => void 0);
+  } else {
+    const args = buildListViewFindQueryArgs({
+      collection,
+      where: resolved.where,
+      sort: resolved.sort,
+      drafts,
+      depth: 1,
+      numItems
+    });
+    void queryClient.prefetchQuery({
+      queryKey: convexServerQueryKey(vexConvexApi.findPaginated, args),
+      queryFn: () => fetchQuery(vexConvexApi.findPaginated, args, token ? { token } : void 0)
+    }).catch(() => void 0);
+  }
+  const listViewsPrefetch = queryClient.prefetchQuery({
+    queryKey: convexServerQueryKey(vexConvexApi.listViews, { collection: collection.slug }),
+    queryFn: () => listViewsPromise
+  }).catch(() => void 0);
+  await listViewsPrefetch;
+  const skeletonRowCountEntry = parseListViewSkeletonRowCountCookie({
+    cookieValue: cookieStore.get(adminCollectionCookieName({ collection: collection.slug }))?.value
+  })[viewId ?? "default"];
+  const filterValueTitleResults = await filterValueTitlesPromise;
+  const initialFilterValueTitles = Object.fromEntries(
+    filterValueTitleResults.map(
+      (result, index) => result.status === "fulfilled" ? result.value : [distinctFilterValues[index].id, null]
+    )
+  );
+  return renderAdminShell({
+    auth,
+    activeSlug: collection.slug,
+    queryClient,
+    children: /* @__PURE__ */ jsx(
+      CollectionListView,
+      {
+        collection: collection.slug,
+        initialLocalIndex: parseLocalSavedListViewsIndexCookie({
+          cookieValue: cookieStore.get(adminCollectionCookieName({ collection: collection.slug }))?.value
+        }),
+        initialPreferences: parseListViewConfigCookies({ cookies: cookieStore, collectionSlug: collection.slug }),
+        initialSkeletonRowCount: skeletonRowCountEntry?.n,
+        initialSkeletonDone: skeletonRowCountEntry?.done,
+        initialFilterValueTitles
+      }
+    )
+  });
+}
+function toSearchParams(raw) {
+  const params = new URLSearchParams();
+  for (const [key, value] of Object.entries(raw)) {
+    if (value === void 0) continue;
+    for (const entry of Array.isArray(value) ? value : [value]) params.append(key, entry);
+  }
+  return params;
+}
+
+export {
+  NextAdminPage
+};
+//# sourceMappingURL=chunk-JB3GMZPF.js.map