create-feedbax 0.2.1 → 0.2.2

package/template/src/my-feedback-runtime.ts

@@ -0,0 +1,154 @@
+import {
+  boundedBody,
+  BrowserCapabilityAuthorizationError,
+  createMyFeedbackModule,
+  type ConnectedDatabase,
+  type FeedbackModule,
+  type VerifiedParticipant,
+} from "@feedbax/feedback";
+import { sameOrigin } from "./connected-identity";
+import { createPortalDraftManagement } from "./portal-feedback-submission";
+
+export function createMyFeedbackRequestHandler(options: {
+  enabled: boolean;
+  siteUrl: string;
+  database: ConnectedDatabase;
+  getParticipant(request: Request): Promise<VerifiedParticipant | undefined>;
+  getFeedback(participant: VerifiedParticipant): FeedbackModule;
+  rateLimit(request: Request): Promise<boolean>;
+  limits?: { maxTitleLength: number; maxDescriptionLength: number };
+}) {
+  const json = (body: unknown, status = 200) =>
+    Response.json(body, {
+      status,
+      headers: {
+        "Cache-Control": "no-store",
+        "Referrer-Policy": "no-referrer",
+        Vary: "Cookie",
+      },
+    });
+  return async (request: Request): Promise<Response | undefined> => {
+    const url = new URL(request.url);
+    if (!url.pathname.startsWith("/internal/my-feedback")) return;
+    if (!options.enabled) return json({ error: "Not found." }, 404);
+    if (request.method !== "GET" && !sameOrigin(request, options.siteUrl))
+      return json({ error: "Request origin is invalid." }, 403);
+    try {
+      const participant = await options.getParticipant(request);
+      if (!participant)
+        return json(
+          { error: "Sign in through the product to view My feedback." },
+          401,
+        );
+      if (!(await options.rateLimit(request)))
+        return json({ error: "Too many requests. Try again shortly." }, 429);
+      const feedback = options.getFeedback(participant);
+      if (
+        url.pathname === "/internal/my-feedback" &&
+        request.method === "GET"
+      ) {
+        const filter = url.searchParams.get("filter") ?? "submitted";
+        if (
+          filter !== "submitted" &&
+          filter !== "supported" &&
+          filter !== "following"
+        )
+          return json({ error: "Invalid My feedback filter." }, 400);
+        return json(
+          await createMyFeedbackModule({
+            database: options.database,
+            feedback,
+            participant,
+          }).list({
+            filter,
+            cursor: url.searchParams.get("cursor") ?? undefined,
+          }),
+        );
+      }
+      if (
+        url.pathname !== "/internal/my-feedback/post" ||
+        request.method !== "POST"
+      )
+        return json({ error: "Not found." }, 404);
+      const value = JSON.parse(await boundedBody(request, 16_384)) as Record<
+        string,
+        unknown
+      >;
+      if (
+        !value ||
+        typeof value !== "object" ||
+        typeof value.id !== "string" ||
+        value.id.length > 128
+      )
+        return json({ error: "Invalid submission request." }, 400);
+      if (value.action === "claim") {
+        if (
+          typeof value.browserCapability !== "string" ||
+          value.browserCapability.length > 512
+        )
+          return json(
+            {
+              error:
+                "A valid Browser Capability is required to link this draft.",
+            },
+            400,
+          );
+        const draft = await feedback.claimDraftPost({
+          id: value.id,
+          browserCapability:
+            value.browserCapability as import("@feedbax/feedback").BrowserCapability,
+        });
+        return draft
+          ? json(draft)
+          : json({ error: "Submission unavailable." }, 404);
+      }
+      const post = await feedback.getParticipantPost(value.id);
+      if (!post) return json({ error: "Submission unavailable." }, 404);
+      if (value.action === "read") return json(post);
+      if (!post.editable)
+        return json(
+          { error: "Only New, unpublished drafts may be changed." },
+          409,
+        );
+      const drafts = createPortalDraftManagement({
+        feedback,
+        limits: options.limits ?? {
+          maxTitleLength: 160,
+          maxDescriptionLength: 5000,
+        },
+      });
+      if (value.action === "edit") {
+        const updated = await drafts.edit({
+          ...value,
+          browserCapability: "participant-owner",
+        });
+        return json({
+          id: updated.id,
+          slug: updated.slug,
+          title: updated.title,
+          description: updated.description,
+          type: updated.type,
+          status: updated.status,
+          published: updated.published,
+          createdAt: updated.createdAt,
+          updatedAt: updated.updatedAt,
+        });
+      }
+      if (value.action === "withdraw") {
+        await drafts.withdraw({
+          id: value.id,
+          browserCapability: "participant-owner",
+        });
+        return json({ withdrawn: true });
+      }
+      return json({ error: "Invalid submission action." }, 400);
+    } catch (error) {
+      if (error instanceof BrowserCapabilityAuthorizationError)
+        return json({ error: "Submission unavailable." }, 404);
+      return json(
+        { error: "My feedback is unavailable. Refresh and try again." },
+        503,
+      );
+    }
+  };
+}

package/template/src/participation-runtime.ts

@@ -7,7 +7,7 @@ import { env } from "cloudflare:workers";
 import feedbax from "./feedbax";
 import {
   configuredImages,
-  createConfiguredNotionFeedbackModule,
+  createConfiguredContentFeedbackModule,
   getConnectedStore,
 } from "./feedback-runtime";
 import {
@@ -175,7 +175,7 @@ export function createParticipationRequestHandler(options: {
 
 export function configuredParticipation(participant?: VerifiedParticipant) {
   return createConfiguredParticipation(
-    createConfiguredNotionFeedbackModule(),
+    createConfiguredContentFeedbackModule(),
     participant,
   );
 }
@@ -241,7 +241,7 @@ export const handleParticipationRequest = createParticipationRequestHandler({
 });
 export async function synchronizeConnectedUpdates() {
   if (!feedbax.connected) return;
-  const content = createConfiguredNotionFeedbackModule();
+  const content = createConfiguredContentFeedbackModule();
   const module = createConfiguredParticipation(content);
   const observation = await module.synchronize();
   const email = await module.deliverEmails();

package/template/src/portal-comments.ts

@@ -26,6 +26,7 @@ export interface PortalCommentResult {
 const commentCapabilityLifetime = 15 * 60 * 1_000;
 
 export interface PortalCommentRequest {
+  submissionKey?: string;
   imageIds?: string[];
   slug: string;
   body: string;
@@ -92,6 +93,7 @@ export function createPortalCommentHandler(options: {
 
     const command = {
       ...(value.imageIds ? { imageIds: value.imageIds } : {}),
+      ...(value.submissionKey ? { submissionKey: value.submissionKey } : {}),
       slug: value.slug,
       body: value.body,
       displayName: value.displayName,
@@ -377,7 +379,16 @@ function validateCommentInput(
       ))
   )
     throw invalidCommentRequest();
+  if (
+    value.submissionKey !== undefined &&
+    (typeof value.submissionKey !== "string" ||
+      !/^[A-Za-z0-9_-]{43}$/.test(value.submissionKey))
+  )
+    throw invalidCommentRequest();
   return {
+    ...(typeof value.submissionKey === "string"
+      ? { submissionKey: value.submissionKey }
+      : {}),
     ...(value.imageIds ? { imageIds: value.imageIds as string[] } : {}),
     slug: value.slug.trim(),
     body: value.body.trim(),

package/template/src/portal-feedback-form.tsx

@@ -1,3 +1,4 @@
+import { submissionIntent } from "./submission-intent";
 import { ImageAttachments } from "./components/image-attachments";
 import { configuredTurnstileSiteKey } from "./turnstile-configuration";
 import type { Post, PostType, SubmittedPost } from "@feedbax/feedback";
@@ -163,9 +164,15 @@ export function PortalFeedbackForm({
     setPending(true);
     setMessage(undefined);
     try {
+      const intent = await submissionIntent(window.sessionStorage, {
+        ...values,
+        imageIds: images.map((image) => image.id),
+        submitter: readDeviceProfile(window.localStorage),
+      });
       const result = await mutations.submitPost({
         data: {
           ...values,
+          submissionKey: intent.key,
           ...(images.length
             ? { imageIds: images.map((image) => image.id) }
             : {}),
@@ -178,9 +185,9 @@ export function PortalFeedbackForm({
       const storedDraft: StoredDraft = {
         id: result.id,
         browserCapability: result.browserCapability,
-        title: values.title,
-        description: values.description,
-        type: values.type,
+        title: result.title,
+        description: result.description,
+        type: result.type,
       };
       setDraft(storedDraft);
       try {
@@ -193,6 +200,7 @@ export function PortalFeedbackForm({
           draftStorageKey,
           JSON.stringify(storedDraft),
         );
+        intent.complete();
       } catch {
         setMessage(
           "Draft submitted, but this browser could not save access. Keep this page open to manage it.",

package/template/src/portal-feedback-submission.ts

@@ -157,7 +157,16 @@ function validateInput(
   )
     throw invalidSubmission();
 
+  if (
+    value.submissionKey !== undefined &&
+    (typeof value.submissionKey !== "string" ||
+      !/^[A-Za-z0-9_-]{43}$/.test(value.submissionKey))
+  )
+    throw invalidSubmission();
   return {
+    ...(value.submissionKey
+      ? { submissionKey: value.submissionKey as string }
+      : {}),
     ...(value.imageIds ? { imageIds: value.imageIds as string[] } : {}),
     title: value.title,
     description: value.description,

package/template/src/portal-server-entry.ts

@@ -14,6 +14,7 @@ export function createPortalServerEntry({
   commentHandler,
   commentMutationHandler,
   applicationHandler = startHandler.fetch,
+  cachePublicReads = true,
 }: {
   connectedHandler?: (request: Request) => Promise<Response | undefined>;
   trustedFeedbackHandler: (request: Request) => Promise<Response>;
@@ -21,6 +22,7 @@ export function createPortalServerEntry({
   commentHandler?: (request: Request) => Promise<Response>;
   commentMutationHandler?: (request: Request) => Promise<Response>;
   applicationHandler?: typeof startHandler.fetch;
+  cachePublicReads?: boolean;
 }) {
   return createServerEntry({
     async fetch(request, options) {
@@ -62,6 +64,13 @@ export function createPortalServerEntry({
         return Response.redirect(canonicalRequest.url, 308);
       }
       const response = await applicationHandler(request, options);
+      if (!cachePublicReads) {
+        const privateResponse = new Response(response.body, response);
+        privateResponse.headers.set("Cache-Control", "no-store");
+        privateResponse.headers.delete("Cloudflare-CDN-Cache-Control");
+        privateResponse.headers.delete("Cache-Tag");
+        return privateResponse;
+      }
       return applyPublicCachePolicy(request, response);
     },
   });

package/template/src/public-portal-error.tsx

@@ -3,7 +3,7 @@ import { Button } from "@feedbax/ui/components/button";
 export function PublicPortalError({
   reset,
 }: {
-  error: Error;
+  error: unknown;
   reset: () => void;
 }) {
   return (