@btst/stack 3.0.0-rc.2 → 3.0.0-rc.4

package/dist/packages/stack/src/plugins/form-builder/client/components/pages/submissions-page.internal.mjs

@@ -1,29 +1,41 @@
 "use client";
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { useState } from 'react';
-import { useTranslate, useNotify, usePluginOverrides, useStack, useBasePath, CanAccess } from '@btst/stack/context';
+import { useState, useEffect } from 'react';
+import { useTranslate, useNotify, usePluginOverrides, useIdentity, usePluginSiteNavigation, PermissionAccess } from '@btst/stack/context';
 import { Button } from '../../../../../../../ui/src/components/button.mjs';
 import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from '../../../../../../../ui/src/components/table.mjs';
 import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction } from '../../../../../../../ui/src/components/alert-dialog.mjs';
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from '../../../../../../../ui/src/components/dialog.mjs';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '../../../../../../../ui/src/components/dialog.mjs';
 import { ArrowLeft, Eye, Trash2 } from 'lucide-react';
 import { PageWrapper } from '../shared/page-wrapper.mjs';
 import { EmptyState } from '../shared/empty-state.mjs';
 import { Pagination } from '../shared/pagination.mjs';
-import { useSuspenseFormById, useSuspenseSubmissions, useDeleteSubmission } from '../../hooks/form-builder-hooks.mjs';
+import { formBuilderPermissions } from '../../../../../../../../plugins/form-builder/permissions.mjs';
+import { FORM_BUILDER_PLUGIN_ID } from '../../constants.mjs';
+import { useSuspenseSubmissions, useDeleteSubmission, useSubmission } from '../../hooks/form-builder-hooks.mjs';
 
 function SubmissionsPage({ formId }) {
   const t = useTranslate();
   const notify = useNotify();
-  const { localization } = usePluginOverrides("form-builder");
-  const { router } = useStack();
-  const basePath = useBasePath();
-  const { form } = useSuspenseFormById(formId);
-  const { submissions, total, hasMore, isLoadingMore, loadMore } = useSuspenseSubmissions(formId);
+  const { localization } = usePluginOverrides(
+    FORM_BUILDER_PLUGIN_ID
+  );
+  const { identity } = useIdentity();
+  const { Link: LinkComponent, resolve } = usePluginSiteNavigation(
+    FORM_BUILDER_PLUGIN_ID
+  );
+  const { form, submissions, total, hasMore, isLoadingMore, loadMore } = useSuspenseSubmissions(formId);
   const deleteMutation = useDeleteSubmission(formId);
   const [deleteId, setDeleteId] = useState(null);
-  const [viewSubmission, setViewSubmission] = useState(null);
-  const LinkComponent = router?.Link ?? "a";
+  const [viewSubmissionId, setViewSubmissionId] = useState(null);
+  const {
+    submission: viewSubmission,
+    isLoading: isViewLoading,
+    error: viewError
+  } = useSubmission(formId, viewSubmissionId ?? void 0);
+  useEffect(() => {
+    setViewSubmissionId(null);
+  }, [identity]);
   const handleDelete = async () => {
     if (!deleteId) return;
     try {
@@ -42,18 +54,10 @@ function SubmissionsPage({ formId }) {
     );
     setDeleteId(null);
   };
-  const formatSubmissionData = (data) => {
-    const entries = Object.entries(data).slice(0, 3);
-    return entries.map(([key, value]) => {
-      const strValue = typeof value === "string" ? value : JSON.stringify(value);
-      const truncated = strValue.length > 30 ? `${strValue.slice(0, 30)}...` : strValue;
-      return `${key}: ${truncated}`;
-    }).join(", ");
-  };
   return /* @__PURE__ */ jsxs(PageWrapper, { testId: "submissions-page", children: [
     /* @__PURE__ */ jsxs("div", { className: "w-full max-w-5xl space-y-6", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", asChild: true, children: /* @__PURE__ */ jsx(LinkComponent, { href: `${basePath}/forms`, children: /* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" }) }) }),
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", asChild: true, children: /* @__PURE__ */ jsx(LinkComponent, { href: resolve("forms").href, children: /* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" }) }) }),
         /* @__PURE__ */ jsxs("div", { children: [
           /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold", children: form?.name || (localization?.FORM_BUILDER_SUBMISSIONS_TITLE ?? t("formBuilder.submissions.title", "Submissions")) }),
           /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: localization?.FORM_BUILDER_SUBMISSIONS_SUBTITLE ?? t("formBuilder.submissions.subtitle", "View form submissions") })
@@ -72,15 +76,10 @@ function SubmissionsPage({ formId }) {
         /* @__PURE__ */ jsx("div", { className: "rounded-lg border", children: /* @__PURE__ */ jsxs(Table, { children: [
           /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
             /* @__PURE__ */ jsx(TableHead, { className: "w-24", children: localization?.FORM_BUILDER_SUBMISSIONS_COLUMN_ID ?? t("formBuilder.submissions.columnId", "ID") }),
-            /* @__PURE__ */ jsx(TableHead, { children: localization?.FORM_BUILDER_SUBMISSIONS_COLUMN_DATA ?? t("formBuilder.submissions.columnData", "Data") }),
             /* @__PURE__ */ jsx(TableHead, { children: localization?.FORM_BUILDER_SUBMISSIONS_COLUMN_SUBMITTED_AT ?? t(
               "formBuilder.submissions.columnSubmittedAt",
               "Submitted"
             ) }),
-            /* @__PURE__ */ jsx(TableHead, { children: localization?.FORM_BUILDER_SUBMISSIONS_COLUMN_IP_ADDRESS ?? t(
-              "formBuilder.submissions.columnIpAddress",
-              "IP Address"
-            ) }),
             /* @__PURE__ */ jsx(TableHead, { className: "w-24", children: localization?.FORM_BUILDER_SUBMISSIONS_COLUMN_ACTIONS ?? t("formBuilder.submissions.columnActions", "Actions") })
           ] }) }),
           /* @__PURE__ */ jsx(TableBody, { children: submissions.map((sub) => /* @__PURE__ */ jsxs(TableRow, { children: [
@@ -88,28 +87,48 @@ function SubmissionsPage({ formId }) {
               sub.id.slice(0, 8),
               "..."
             ] }),
-            /* @__PURE__ */ jsx(TableCell, { className: "max-w-xs truncate text-sm text-muted-foreground", children: formatSubmissionData(sub.parsedData ?? {}) }),
             /* @__PURE__ */ jsx(TableCell, { className: "text-muted-foreground", children: new Date(sub.submittedAt).toLocaleString() }),
-            /* @__PURE__ */ jsx(TableCell, { className: "text-muted-foreground font-mono text-xs", children: sub.ipAddress || "-" }),
             /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsxs("div", { className: "flex gap-1", children: [
-              /* @__PURE__ */ jsxs(
-                Button,
+              /* @__PURE__ */ jsx(
+                PermissionAccess,
                 {
-                  variant: "ghost",
-                  size: "icon",
-                  onClick: () => setViewSubmission(sub),
-                  children: [
-                    /* @__PURE__ */ jsx(Eye, { className: "h-4 w-4" }),
-                    /* @__PURE__ */ jsx("span", { className: "sr-only", children: localization?.FORM_BUILDER_SUBMISSIONS_ACTION_VIEW ?? t("formBuilder.submissions.actionView", "View") })
-                  ]
+                  permission: formBuilderPermissions.submission.read({
+                    scope: "record",
+                    formId,
+                    submissionId: sub.id,
+                    exists: true,
+                    ...form?.createdBy ? { ownerId: form.createdBy } : {},
+                    ...sub.submittedBy ? { submittedBy: sub.submittedBy } : {}
+                  }),
+                  children: /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      variant: "ghost",
+                      size: "icon",
+                      onClick: () => setViewSubmissionId(sub.id),
+                      children: [
+                        /* @__PURE__ */ jsx(Eye, { className: "h-4 w-4" }),
+                        /* @__PURE__ */ jsx("span", { className: "sr-only", children: localization?.FORM_BUILDER_SUBMISSIONS_ACTION_VIEW ?? t(
+                          "formBuilder.submissions.actionView",
+                          "View"
+                        ) })
+                      ]
+                    }
+                  )
                 }
               ),
               /* @__PURE__ */ jsx(
-                CanAccess,
+                PermissionAccess,
                 {
-                  resource: "form-builder:submission",
-                  action: "delete",
-                  params: { formId, id: sub.id },
+                  permission: formBuilderPermissions.submission.delete(
+                    {
+                      formId,
+                      submissionId: sub.id,
+                      exists: true,
+                      ...form?.createdBy ? { ownerId: form.createdBy } : {},
+                      ...sub.submittedBy ? { submittedBy: sub.submittedBy } : {}
+                    }
+                  ),
                   children: /* @__PURE__ */ jsxs(
                     Button,
                     {
@@ -154,11 +173,24 @@ function SubmissionsPage({ formId }) {
     /* @__PURE__ */ jsx(
       Dialog,
       {
-        open: !!viewSubmission,
-        onOpenChange: () => setViewSubmission(null),
+        open: !!viewSubmissionId,
+        onOpenChange: (open) => {
+          if (!open) setViewSubmissionId(null);
+        },
         children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-2xl max-h-[80vh] overflow-auto", children: [
-          /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: localization?.FORM_BUILDER_SUBMISSIONS_DETAILS_TITLE ?? t("formBuilder.submissions.detailsTitle", "Submission Details") }) }),
-          viewSubmission && /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxs(DialogHeader, { children: [
+            /* @__PURE__ */ jsx(DialogTitle, { children: localization?.FORM_BUILDER_SUBMISSIONS_DETAILS_TITLE ?? t("formBuilder.submissions.detailsTitle", "Submission Details") }),
+            /* @__PURE__ */ jsx(DialogDescription, { className: "sr-only", children: t(
+              "formBuilder.submissions.detailsDescription",
+              "Submitted form data and request metadata."
+            ) })
+          ] }),
+          isViewLoading && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: localization?.FORM_BUILDER_STATUS_LOADING ?? t("formBuilder.common.statusLoading", "Loading...") }),
+          viewError && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-sm text-destructive", children: localization?.FORM_BUILDER_TOAST_ERROR ?? t(
+            "formBuilder.toasts.error",
+            "An error occurred. Please try again."
+          ) }),
+          !isViewLoading && !viewError && viewSubmission && /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
             /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4 text-sm", children: [
               /* @__PURE__ */ jsxs("div", { children: [
                 /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: localization?.FORM_BUILDER_SUBMISSIONS_FIELD_ID ?? t("formBuilder.submissions.fieldId", "ID:") }),

package/dist/packages/stack/src/plugins/form-builder/client/components/pages/submissions-page.mjs

@@ -2,10 +2,13 @@
 import { jsx } from 'react/jsx-runtime';
 import { lazy } from 'react';
 import { usePluginOverrides } from '@btst/stack/context';
-import { ComposedRoute } from '@btst/stack/client/components';
+import { ComposedRoute, PermissionRouteAccess } from '@btst/stack/client/components';
 import { DefaultError } from '../shared/default-error.mjs';
 import { SubmissionsSkeleton } from '../loading/submissions-skeleton.mjs';
 import { NotFoundPage } from './404-page.mjs';
+import { formBuilderPermissions } from '../../../../../../../../plugins/form-builder/permissions.mjs';
+import { FORM_BUILDER_PLUGIN_ID } from '../../constants.mjs';
+import { useSuspenseSubmissions } from '../../hooks/form-builder-hooks.mjs';
 
 const SubmissionsPage = lazy(
   () => import('./submissions-page.internal.mjs').then((m) => ({
@@ -13,21 +16,18 @@ const SubmissionsPage = lazy(
   }))
 );
 function SubmissionsPageComponent({ formId }) {
-  const { onRouteError } = usePluginOverrides("form-builder");
+  const { onRouteError } = usePluginOverrides(
+    FORM_BUILDER_PLUGIN_ID
+  );
   const path = `/forms/${formId}/submissions`;
   return /* @__PURE__ */ jsx(
     ComposedRoute,
     {
       path,
-      PageComponent: SubmissionsPage,
+      PageComponent: AuthorizedSubmissionsPage,
       ErrorComponent: DefaultError,
       LoadingComponent: SubmissionsSkeleton,
       NotFoundComponent: NotFoundPage,
-      permission: {
-        resource: "form-builder:submission",
-        action: "read",
-        params: { formId }
-      },
       props: { formId },
       onError: (error) => {
         if (onRouteError) {
@@ -41,5 +41,22 @@ function SubmissionsPageComponent({ formId }) {
     }
   );
 }
+function AuthorizedSubmissionsPage({ formId }) {
+  const { form } = useSuspenseSubmissions(formId);
+  if (!form) return /* @__PURE__ */ jsx(NotFoundPage, {});
+  return /* @__PURE__ */ jsx(
+    PermissionRouteAccess,
+    {
+      permission: formBuilderPermissions.submission.read({
+        scope: "collection",
+        formId,
+        formExists: form !== null,
+        ...form?.createdBy ? { ownerId: form.createdBy } : {}
+      }),
+      LoadingComponent: SubmissionsSkeleton,
+      children: /* @__PURE__ */ jsx(SubmissionsPage, { formId })
+    }
+  );
+}
 
 export { SubmissionsPageComponent };

package/dist/packages/stack/src/plugins/form-builder/client/components/shared/page-wrapper.cjs

@@ -4,13 +4,14 @@
 const jsxRuntime = require('react/jsx-runtime');
 const context = require('@btst/stack/context');
 const pageWrapper = require('../../../../../../../ui/src/components/page-wrapper.cjs');
+const constants = require('../../constants.cjs');
 
 function PageWrapper({
   children,
   className,
   testId
 }) {
-  const { showAttribution } = context.usePluginOverrides("form-builder", {
+  const { showAttribution } = context.usePluginOverrides(constants.FORM_BUILDER_PLUGIN_ID, {
     showAttribution: true
   });
   return /* @__PURE__ */ jsxRuntime.jsx(

package/dist/packages/stack/src/plugins/form-builder/client/components/shared/page-wrapper.mjs

@@ -2,13 +2,14 @@
 import { jsx } from 'react/jsx-runtime';
 import { usePluginOverrides } from '@btst/stack/context';
 import { PageWrapper as PageWrapper$1 } from '../../../../../../../ui/src/components/page-wrapper.mjs';
+import { FORM_BUILDER_PLUGIN_ID } from '../../constants.mjs';
 
 function PageWrapper({
   children,
   className,
   testId
 }) {
-  const { showAttribution } = usePluginOverrides("form-builder", {
+  const { showAttribution } = usePluginOverrides(FORM_BUILDER_PLUGIN_ID, {
     showAttribution: true
   });
   return /* @__PURE__ */ jsx(

package/dist/packages/stack/src/plugins/form-builder/client/constants.cjs

@@ -0,0 +1,5 @@
+'use strict';
+
+const FORM_BUILDER_PLUGIN_ID = "formBuilder";
+
+exports.FORM_BUILDER_PLUGIN_ID = FORM_BUILDER_PLUGIN_ID;

package/dist/packages/stack/src/plugins/form-builder/client/constants.mjs

@@ -0,0 +1,3 @@
+const FORM_BUILDER_PLUGIN_ID = "formBuilder";
+
+export { FORM_BUILDER_PLUGIN_ID };

package/dist/packages/stack/src/plugins/form-builder/client/hooks/form-builder-hooks.cjs

@@ -1,6 +1,7 @@
 "use client";
 'use strict';
 
+const context = require('@btst/stack/context');
 const formBuilderResource = require('./form-builder-resource.cjs');
 
 function flattenPages(pages) {
@@ -68,6 +69,13 @@ function useSuspenseFormById(id) {
     refetch
   };
 }
+function useSuspenseFormForUpdate(id) {
+  const { data, refetch } = formBuilderResource.formBuilder.forms.forUpdate.useSuspense([id]);
+  return {
+    form: data ?? null,
+    refetch
+  };
+}
 function useFormBySlug(slug) {
   const { data, isLoading, error, refetch } = formBuilderResource.formBuilder.forms.bySlug.use(
     [slug],
@@ -123,7 +131,9 @@ function useSubmissions(formId, options = {}) {
   const { items, total } = flattenPages(
     data?.pages
   );
+  const form = data?.pages?.[0]?.form ?? null;
   return {
+    form,
     submissions: items,
     total,
     isLoading,
@@ -140,7 +150,9 @@ function useSuspenseSubmissions(formId, options = {}) {
   const { items, total } = flattenPages(
     data.pages
   );
+  const form = data.pages[0]?.form ?? null;
   return {
+    form,
     submissions: items,
     total,
     loadMore: fetchNextPage,
@@ -149,6 +161,21 @@ function useSuspenseSubmissions(formId, options = {}) {
     refetch
   };
 }
+function useSubmission(formId, submissionId, options = {}) {
+  const { identity, isPending: isIdentityPending } = context.useIdentity();
+  const { data, isLoading, error, refetch } = formBuilderResource.formBuilder.formSubmissions.detail.use(
+    [formId, submissionId ?? "", identity],
+    {
+      enabled: (options.enabled ?? true) && !isIdentityPending && !!formId && !!submissionId
+    }
+  );
+  return {
+    submission: data ?? null,
+    isLoading,
+    error,
+    refetch
+  };
+}
 function useDeleteSubmission(formId) {
   const mutation = formBuilderResource.formBuilder.formSubmissions.delete.use();
   return {
@@ -165,10 +192,12 @@ exports.useFormBuilderForm = useFormBuilderForm;
 exports.useFormById = useFormById;
 exports.useFormBySlug = useFormBySlug;
 exports.useForms = useForms;
+exports.useSubmission = useSubmission;
 exports.useSubmissions = useSubmissions;
 exports.useSubmitForm = useSubmitForm;
 exports.useSuspenseFormById = useSuspenseFormById;
 exports.useSuspenseFormBySlug = useSuspenseFormBySlug;
+exports.useSuspenseFormForUpdate = useSuspenseFormForUpdate;
 exports.useSuspenseForms = useSuspenseForms;
 exports.useSuspenseSubmissions = useSuspenseSubmissions;
 exports.useUpdateForm = useUpdateForm;

package/dist/packages/stack/src/plugins/form-builder/client/hooks/form-builder-hooks.mjs

@@ -1,4 +1,5 @@
 "use client";
+import { useIdentity } from '@btst/stack/context';
 import { formBuilder } from './form-builder-resource.mjs';
 
 function flattenPages(pages) {
@@ -66,6 +67,13 @@ function useSuspenseFormById(id) {
     refetch
   };
 }
+function useSuspenseFormForUpdate(id) {
+  const { data, refetch } = formBuilder.forms.forUpdate.useSuspense([id]);
+  return {
+    form: data ?? null,
+    refetch
+  };
+}
 function useFormBySlug(slug) {
   const { data, isLoading, error, refetch } = formBuilder.forms.bySlug.use(
     [slug],
@@ -121,7 +129,9 @@ function useSubmissions(formId, options = {}) {
   const { items, total } = flattenPages(
     data?.pages
   );
+  const form = data?.pages?.[0]?.form ?? null;
   return {
+    form,
     submissions: items,
     total,
     isLoading,
@@ -138,7 +148,9 @@ function useSuspenseSubmissions(formId, options = {}) {
   const { items, total } = flattenPages(
     data.pages
   );
+  const form = data.pages[0]?.form ?? null;
   return {
+    form,
     submissions: items,
     total,
     loadMore: fetchNextPage,
@@ -147,6 +159,21 @@ function useSuspenseSubmissions(formId, options = {}) {
     refetch
   };
 }
+function useSubmission(formId, submissionId, options = {}) {
+  const { identity, isPending: isIdentityPending } = useIdentity();
+  const { data, isLoading, error, refetch } = formBuilder.formSubmissions.detail.use(
+    [formId, submissionId ?? "", identity],
+    {
+      enabled: (options.enabled ?? true) && !isIdentityPending && !!formId && !!submissionId
+    }
+  );
+  return {
+    submission: data ?? null,
+    isLoading,
+    error,
+    refetch
+  };
+}
 function useDeleteSubmission(formId) {
   const mutation = formBuilder.formSubmissions.delete.use();
   return {
@@ -156,4 +183,4 @@ function useDeleteSubmission(formId) {
   };
 }
 
-export { useCreateForm, useDeleteForm, useDeleteSubmission, useFormBuilderForm, useFormById, useFormBySlug, useForms, useSubmissions, useSubmitForm, useSuspenseFormById, useSuspenseFormBySlug, useSuspenseForms, useSuspenseSubmissions, useUpdateForm };
+export { useCreateForm, useDeleteForm, useDeleteSubmission, useFormBuilderForm, useFormById, useFormBySlug, useForms, useSubmission, useSubmissions, useSubmitForm, useSuspenseFormById, useSuspenseFormBySlug, useSuspenseFormForUpdate, useSuspenseForms, useSuspenseSubmissions, useUpdateForm };

package/dist/packages/stack/src/plugins/form-builder/client/hooks/form-builder-resource.cjs

@@ -3,9 +3,10 @@
 
 const hooks = require('@btst/stack/plugins/client/hooks');
 const plugins_formBuilder_queryKeys = require('../../../../../../../plugins/form-builder/query-keys.cjs');
+const constants = require('../constants.cjs');
 
 const formBuilder = hooks.createResource({
-  plugin: "form-builder",
+  plugin: constants.FORM_BUILDER_PLUGIN_ID,
   resources: plugins_formBuilder_queryKeys.formBuilderResources
 });
 

package/dist/packages/stack/src/plugins/form-builder/client/hooks/form-builder-resource.mjs

@@ -1,9 +1,10 @@
 "use client";
 import { createResource } from '@btst/stack/plugins/client/hooks';
 import { formBuilderResources } from '../../../../../../../plugins/form-builder/query-keys.mjs';
+import { FORM_BUILDER_PLUGIN_ID } from '../constants.mjs';
 
 const formBuilder = createResource({
-  plugin: "form-builder",
+  plugin: FORM_BUILDER_PLUGIN_ID,
   resources: formBuilderResources
 });