@tulip-systems/create-app 0.12.3 → 0.13.0

package/dist/templates/code/src/app/admin/history/_config/filters.ts

@@ -0,0 +1,46 @@
+import {
+  arrayFilter,
+  createFilteringParser,
+  defineFilters,
+  resolveFiltersSchema,
+  stringFilter,
+} from "@tulip-systems/query";
+import { createDatabaseFiltersCompiler } from "@tulip-systems/query/drizzle";
+
+/**
+ * Filters use stored facts rather than module-specific definitions.
+ */
+export const historyFilters = defineFilters({
+  resourceType: arrayFilter(stringFilter).build((value) =>
+    value?.length ? { field: "resourceType", operator: "in", value } : null,
+  ),
+  action: arrayFilter(stringFilter).build((value) =>
+    value?.length ? { field: "action", operator: "in", value } : null,
+  ),
+  actorId: arrayFilter(stringFilter).build((value) =>
+    value?.length ? { field: "actorId", operator: "in", value } : null,
+  ),
+  search: stringFilter.build((value) => {
+    const search = value?.trim();
+    if (!search) return null;
+    return {
+      or: [
+        { field: "resourceLabel", operator: "ilike", value: `%${search}%` },
+        { field: "resourceType", operator: "ilike", value: `%${search}%` },
+        { field: "action", operator: "ilike", value: `%${search}%` },
+        { field: "actorName", operator: "ilike", value: `%${search}%` },
+      ],
+    };
+  }),
+});
+
+/**
+ * Validators
+ */
+export const historyFiltersSchema = resolveFiltersSchema(historyFilters);
+
+/**
+ * Parsers
+ */
+export const historyFiltersParser = createFilteringParser(historyFilters);
+export const historyDatabaseFiltersCompiler = createDatabaseFiltersCompiler(historyFilters);

package/dist/templates/code/src/app/admin/history/_config/sorting.ts

@@ -0,0 +1,30 @@
+import {
+  createSortingParser,
+  defineSorting,
+  resolveSortingSchema,
+  sortOption,
+} from "@tulip-systems/query";
+import { createDatabaseSortingCompiler } from "@tulip-systems/query/drizzle";
+
+/**
+ * Sorting
+ */
+export const historyTableSorts = defineSorting({
+  occurredAt: sortOption((direction) => ({ field: "occurredAt", direction })),
+  actorName: sortOption((direction) => ({ field: "actorName", direction })),
+  resourceLabel: sortOption((direction) => ({ field: "resourceLabel", direction })),
+  action: sortOption((direction) => ({ field: "action", direction })),
+});
+
+/**
+ * Validators
+ */
+export const historyTableSortsSchema = resolveSortingSchema(historyTableSorts);
+
+/**
+ * Parsers
+ */
+export const historyTableSortsParser = createSortingParser(historyTableSorts, {
+  fallback: [{ key: "occurredAt", direction: "desc" }],
+});
+export const historyTableDatabaseSortsCompiler = createDatabaseSortingCompiler(historyTableSorts);

package/dist/templates/code/src/app/admin/history/_lib/helpers.ts

@@ -0,0 +1,98 @@
+import equal from "fast-deep-equal";
+import { applyPatch, createPatch, Pointer } from "rfc6902";
+import {
+  type HistoryChange,
+  type HistoryChangesInput,
+  type HistoryDiffInput,
+  type HistoryFieldChanges,
+  historyFieldChangeSchema,
+  historyFieldChangesSchema,
+  type JSONValue,
+} from "./validators";
+
+/**
+ * Compare selected fields from complete before/after snapshots.
+ * Only changed values are included, in field-configuration order.
+ * Values must be JSON; top-level Dates become ISO strings. Use null for absent values.
+ * Unselected fields are never read or recorded.
+ */
+export function createHistoryChanges<T extends object>({
+  before,
+  after,
+  fields,
+}: HistoryChangesInput<T>): HistoryFieldChanges {
+  const changes = fields.flatMap(({ field, label, format }) => {
+    const previous = before[field];
+    const next = after[field];
+    const previousValue = historyFieldChangeSchema.shape.before.parse(
+      previous instanceof Date ? previous.toISOString() : previous,
+    );
+
+    const nextValue = historyFieldChangeSchema.shape.after.parse(
+      next instanceof Date ? next.toISOString() : next,
+    );
+
+    if (equal(previousValue, nextValue)) return [];
+
+    return [
+      {
+        field,
+        label,
+        before: previousValue,
+        after: nextValue,
+        beforeLabel: format?.(before),
+        afterLabel: format?.(after),
+      },
+    ];
+  });
+
+  return historyFieldChangesSchema.parse(changes);
+}
+
+/**
+ * Generate JSON Patch with library comparison; changed arrays remain whole-value replacements.
+ */
+export function createHistoryDiff(before: JSONValue, after: JSONValue): HistoryDiffInput {
+  // Whole-array replacements leave independent paths, so sorting is safe and deterministic.
+  const changes: HistoryChange[] = (
+    before === null && after !== null
+      ? [{ op: "add" as const, path: "", value: after }]
+      : (createPatch(before, after, (previous, next, pointer) => {
+          if (Array.isArray(previous) || Array.isArray(next)) {
+            return equal(previous, next)
+              ? []
+              : [{ op: "replace", path: pointer.toString(), value: next }];
+          }
+        }) as HistoryChange[])
+  ).toSorted((a, b) => (a.path < b.path ? -1 : a.path > b.path ? 1 : 0));
+
+  if (!equal(applyHistoryChanges(before, changes), after)) {
+    throw new Error("History patch does not reconstruct the after state.");
+  }
+
+  return { snapshot: before, changes, dataVersion: 1 };
+}
+
+/**
+ * Apply JSON Patch to a copy. Handle root replacement because rfc6902 mutates objects in place.
+ */
+export function applyHistoryChanges(snapshot: JSONValue, changes: HistoryChange[]): JSONValue {
+  let result = structuredClone(snapshot);
+  for (const change of changes) {
+    if (change.path === "") {
+      result = change.op === "remove" ? null : structuredClone(change.value);
+    } else {
+      // rfc6902 skips these tokens; reject them rather than apply a different path silently.
+      if (
+        Pointer.fromJSON(change.path).tokens.some((key) =>
+          ["__proto__", "constructor", "prototype"].includes(key),
+        )
+      ) {
+        throw new Error("History patch contains an unsupported property path.");
+      }
+      const [error] = applyPatch(result, [change]);
+      if (error) throw error;
+    }
+  }
+  return result;
+}

package/dist/templates/code/src/app/admin/history/_lib/router.ts

@@ -0,0 +1,100 @@
+import "server-cli-only";
+import { offsetPaginationResponse, offsetPaginationSchema } from "@tulip-systems/query";
+import { asc, count, desc, eq } from "drizzle-orm";
+import { z } from "zod";
+import { permissionMiddleware } from "@/server/router/middleware";
+import { protectedProcedure } from "@/server/router/procedures";
+import {
+  historyDatabaseFiltersCompiler,
+  historyFiltersParser,
+  historyFiltersSchema,
+} from "../_config/filters";
+import {
+  historyTableDatabaseSortsCompiler,
+  historyTableSortsParser,
+  historyTableSortsSchema,
+} from "../_config/sorting";
+import { historyDiffs, historyEntries } from "./schema";
+
+export const historyRouter = {
+  getById: protectedProcedure
+    .use(permissionMiddleware({ history: ["view"] }))
+    .input(z.object({ id: z.uuid() }))
+    .handler(async ({ context, input }) => {
+      const [result] = await context.db
+        .select({ entry: historyEntries, diff: historyDiffs })
+        .from(historyEntries)
+        .leftJoin(historyDiffs, eq(historyDiffs.historyEntryId, historyEntries.id))
+        .where(eq(historyEntries.id, input.id));
+      return result ?? null;
+    }),
+  list: protectedProcedure
+    .use(permissionMiddleware({ history: ["view"] }))
+    .input(
+      z.object({
+        pagination: offsetPaginationSchema,
+        filters: historyFiltersSchema,
+        sorts: historyTableSortsSchema,
+      }),
+    )
+    .handler(async ({ context, input }) => {
+      const parsedSorts = historyTableSortsParser.parse(input.sorts);
+      const orderBy = historyTableDatabaseSortsCompiler(historyEntries).parse(parsedSorts);
+      const parsedFilters = historyFiltersParser.parse(input.filters);
+      const where = historyDatabaseFiltersCompiler(historyEntries).parse(parsedFilters);
+
+      const [data, [aggregate]] = await Promise.all([
+        context.db
+          .select()
+          .from(historyEntries)
+          .where(where)
+          .orderBy(...orderBy, desc(historyEntries.id))
+          .limit(input.pagination.limit)
+          .offset(input.pagination.page * input.pagination.limit),
+        context.db.select({ total: count() }).from(historyEntries).where(where),
+      ]);
+      return offsetPaginationResponse({
+        data,
+        pagination: input.pagination,
+        total: aggregate?.total ?? 0,
+      });
+    }),
+  filterResourceTypes: protectedProcedure
+    .use(permissionMiddleware({ history: ["view"] }))
+    .handler(({ context }) =>
+      context.db
+        .selectDistinct({
+          value: historyEntries.resourceType,
+          label: historyEntries.resourceType,
+        })
+        .from(historyEntries)
+        .orderBy(asc(historyEntries.resourceType)),
+    ),
+  filterActions: protectedProcedure
+    .use(permissionMiddleware({ history: ["view"] }))
+    .handler(({ context }) =>
+      context.db
+        .selectDistinct({
+          value: historyEntries.action,
+          label: historyEntries.action,
+        })
+        .from(historyEntries)
+        .orderBy(asc(historyEntries.action)),
+    ),
+  filterActors: protectedProcedure
+    .use(permissionMiddleware({ history: ["view"] }))
+    .handler(async ({ context }) => {
+      // Each account is shown once, using its latest recorded name snapshot.
+      const actors = await context.db
+        .selectDistinctOn([historyEntries.actorId], {
+          value: historyEntries.actorId,
+          label: historyEntries.actorName,
+        })
+        .from(historyEntries)
+        .orderBy(historyEntries.actorId, desc(historyEntries.occurredAt), desc(historyEntries.id));
+
+      return actors.toSorted(
+        (a, b) => a.label.localeCompare(b.label) || a.value.localeCompare(b.value),
+      );
+    }),
+};

package/dist/templates/code/src/app/admin/history/_lib/schema.ts

@@ -0,0 +1,45 @@
+import { index, pgTable } from "drizzle-orm/pg-core";
+import { baseColumns } from "@/server/db/helpers";
+import type { HistoryChange, HistoryContext, JSONValue } from "./validators";
+
+/**
+ * History entries table schema.
+ */
+export const historyEntries = pgTable(
+  "history_entries",
+  (t) => ({
+    ...baseColumns,
+    eventId: t.uuid().notNull().unique("history_entries_event_id_unique"),
+    eventName: t.text().notNull(),
+    eventVersion: t.integer().notNull(),
+    actorId: t.uuid().notNull(),
+    actorName: t.text().notNull(),
+    occurredAt: t.timestamp({ withTimezone: true, precision: 3 }).notNull(),
+    resourceType: t.text().notNull(),
+    resourceId: t.text(),
+    resourceLabel: t.text(),
+    context: t.jsonb().$type<HistoryContext>().default([]).notNull(),
+    action: t.text().notNull(),
+  }),
+  (t) => [
+    index("history_entries_time_idx").on(t.occurredAt.desc(), t.id.desc()),
+    index("history_entries_resource_time_idx").on(t.resourceType, t.occurredAt.desc(), t.id.desc()),
+    index("history_entries_actor_time_idx").on(t.actorId, t.occurredAt.desc(), t.id.desc()),
+    index("history_entries_action_time_idx").on(t.action, t.occurredAt.desc(), t.id.desc()),
+  ],
+);
+
+/**
+ * History diffs table schema.
+ */
+export const historyDiffs = pgTable("history_diffs", (t) => ({
+  ...baseColumns,
+  historyEntryId: t
+    .uuid()
+    .notNull()
+    .unique()
+    .references(() => historyEntries.id, { onDelete: "cascade" }),
+  snapshot: t.jsonb().$type<JSONValue>().notNull(),
+  changes: t.jsonb().$type<HistoryChange[]>().notNull(),
+  dataVersion: t.integer().default(1).notNull(),
+}));

package/dist/templates/code/src/app/admin/history/_lib/service.server.ts

@@ -0,0 +1,30 @@
+import "server-cli-only";
+import { sql } from "drizzle-orm";
+import { db } from "@/server/db/init";
+import { applyHistoryChanges } from "./helpers";
+import { historyDiffs, historyEntries } from "./schema";
+import { type HistoryEntryInput, historyEntryInputSchema } from "./validators";
+
+/**
+ * Store an entry and optional diff atomically; duplicate deliveries are ignored and errors propagate.
+ */
+export async function createHistoryEntry(input: HistoryEntryInput): Promise<void> {
+  const { diff, ...entry } = historyEntryInputSchema.parse(input);
+  if (diff) applyHistoryChanges(diff.snapshot, diff.changes);
+
+  await db.transaction(async (tx) => {
+    const [created] = await tx
+      .insert(historyEntries)
+      .values(entry)
+      .onConflictDoNothing({ target: historyEntries.eventId })
+      .returning({ id: historyEntries.id });
+
+    if (created && diff) {
+      await tx.insert(historyDiffs).values({
+        ...diff,
+        historyEntryId: created.id,
+        snapshot: diff.snapshot === null ? sql`'null'::jsonb` : diff.snapshot,
+      });
+    }
+  });
+}

package/dist/templates/code/src/app/admin/history/_lib/validators.ts

@@ -0,0 +1,118 @@
+import { z } from "zod";
+import type { historyDiffs, historyEntries } from "./schema";
+
+/**
+ * Validate JSON without transforming object keys in complete row snapshots.
+ */
+export type JSONValue = z.infer<ReturnType<typeof z.json>>;
+export const historyJSONSchema = z.custom<JSONValue>((value) => z.json().safeParse(value).success);
+
+/**
+ * History entry type
+ */
+export type HistoryEntry = typeof historyEntries.$inferSelect;
+
+/**
+ * Account identity captured before a tracked mutation.
+ */
+export const historyActorSchema = z.object({
+  id: z.uuid(),
+  name: z.string().trim().min(1),
+});
+export type HistoryActor = z.infer<typeof historyActorSchema>;
+
+/**
+ * Actor metadata shared by domain events and tracked mutations.
+ */
+export const eventHistoryMetadata = { actor: historyActorSchema };
+
+/**
+ * Historical ancestors, ordered from broadest to nearest by the owning module.
+ */
+export const historyContextSchema = z.array(
+  z.object({
+    type: z.string().trim().min(1),
+    id: z.string().trim().min(1),
+    label: z.string().trim().min(1),
+  }),
+);
+export type HistoryContext = z.infer<typeof historyContextSchema>;
+
+/**
+ * Field changes preserve raw JSON values and optional display-name snapshots.
+ * Null means no value; dates must be supplied as ISO strings.
+ */
+export const historyFieldChangeSchema = z.object({
+  field: z.string().trim().min(1),
+  label: z.string().trim().min(1),
+  before: historyJSONSchema,
+  after: historyJSONSchema,
+  beforeLabel: z.string().optional(),
+  afterLabel: z.string().optional(),
+});
+export const historyFieldChangesSchema = z
+  .array(historyFieldChangeSchema)
+  .refine((changes) => new Set(changes.map((change) => change.field)).size === changes.length, {
+    message: "Each field must appear only once in an entry.",
+  });
+export type HistoryFieldChange = z.infer<typeof historyFieldChangeSchema>;
+export type HistoryFieldChanges = z.infer<typeof historyFieldChangesSchema>;
+
+/**
+ * Explicitly selected snapshot fields. Formatters supply labels without changing stored values.
+ */
+export type HistoryChangesInput<T extends object> = {
+  before: T;
+  after: T;
+  fields: {
+    field: Extract<keyof T, string>;
+    label: string;
+    format?: (snapshot: T) => string | undefined;
+  }[];
+};
+
+/**
+ * Versioned snapshot diffs. Paths use JSON Pointer; arrays are replaced as whole values.
+ */
+const historyPathSchema = z.string().regex(/^(?:\/(?:[^~]|~[01])*)*$/);
+export const historyChangeSchema = z.discriminatedUnion("op", [
+  z.object({ op: z.literal("add"), path: historyPathSchema, value: historyJSONSchema }).strict(),
+  z.object({ op: z.literal("remove"), path: historyPathSchema }).strict(),
+  z
+    .object({ op: z.literal("replace"), path: historyPathSchema, value: historyJSONSchema })
+    .strict(),
+]);
+export const historyChangesSchema = z.array(historyChangeSchema);
+export type HistoryChange = z.infer<typeof historyChangeSchema>;
+
+/**
+ * History diff input schema.
+ */
+export const historyDiffInputSchema = z.object({
+  snapshot: historyJSONSchema,
+  changes: historyChangesSchema,
+  dataVersion: z.literal(1).default(1),
+});
+
+export type HistoryDiffInput = z.input<typeof historyDiffInputSchema>;
+export type HistoryDiff = typeof historyDiffs.$inferSelect;
+
+/**
+ * Generic entry input. Modules supply resource snapshots and ordered context.
+ */
+export const historyEntryInputSchema = z.object({
+  eventId: z.uuid(),
+  eventName: z.string().min(1),
+  eventVersion: z.number().int().positive(),
+  actorId: historyActorSchema.shape.id,
+  actorName: historyActorSchema.shape.name,
+  occurredAt: z.coerce.date(),
+  resourceType: z.string().trim().min(1),
+  resourceId: z.string().trim().min(1),
+  resourceLabel: z.string().trim().min(1),
+  context: historyContextSchema.default([]),
+  action: z.string().trim().min(1),
+  diff: historyDiffInputSchema.optional(),
+});
+
+export type HistoryEntryInput = z.input<typeof historyEntryInputSchema>;

package/dist/templates/code/src/app/admin/initiatives/_config/columns-data.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { formatCurrency, formatDate } from "@tulip-systems/core";
+import { Link } from "@tulip-systems/core/navigation";
 import { type TableColumnDef, TableColumnHeader } from "@tulip-systems/data-tables";
 import {
   createTableSelectCell,
@@ -9,7 +10,6 @@ import {
   TableStatusCell,
   TableTextCell,
 } from "@tulip-systems/data-tables/client";
-import Link from "next/link";
 import type { Initiative } from "../_lib/validators";
 import { InitiativeStatusField } from "./status";
 

package/dist/templates/code/src/app/admin/notifications/_components/command-toggle-push.tsx

@@ -0,0 +1,115 @@
+"use client";
+
+import { useSuspenseQuery } from "@tanstack/react-query";
+import { CommandClick, CommandLabel } from "@tulip-systems/commands/client";
+import { toast } from "@tulip-systems/ui/sonner";
+import { BellIcon, BellOffIcon } from "lucide-react";
+import { orpc } from "@/server/router/client";
+
+const notificationPushSubscriptionQueryKey = ["notifications", "push-subscription"] as const;
+
+export function CommandTogglePush() {
+  const { data: config } = useSuspenseQuery(orpc.notifications.getPushConfig.queryOptions());
+  const { data } = useSuspenseQuery({
+    queryKey: notificationPushSubscriptionQueryKey,
+    queryFn: async () => {
+      const supported =
+        typeof window !== "undefined" &&
+        "serviceWorker" in navigator &&
+        "PushManager" in window &&
+        "Notification" in window;
+
+      if (!supported) return { supported, enabled: false };
+
+      const registration = await navigator.serviceWorker.getRegistration("/sw.js");
+      const subscription = await registration?.pushManager.getSubscription();
+
+      return { supported, enabled: Boolean(subscription) };
+    },
+    refetchOnMount: "always",
+    staleTime: 0,
+  });
+
+  return (
+    <CommandClick
+      label={data.enabled ? "Disable push" : "Enable push"}
+      disabled={!data.supported}
+      variables={{ ...data, config }}
+      mutation={{
+        mutationFn: async (variables) => {
+          if (variables.enabled) {
+            const registration = await navigator.serviceWorker.getRegistration("/sw.js");
+            const subscription = await registration?.pushManager.getSubscription();
+
+            if (subscription) {
+              await orpc.notifications.unsubscribePush.call({ endpoint: subscription.endpoint });
+              await subscription.unsubscribe();
+            }
+
+            return false;
+          }
+
+          if (!variables.supported) throw new Error("This browser does not support Web Push");
+          if (!variables.config.configured || !variables.config.publicKey) {
+            throw new Error("Web Push is not configured for this environment");
+          }
+
+          if (Notification.permission === "denied") {
+            throw new Error("Notifications are blocked for this site");
+          }
+
+          const [registration, permission] = await Promise.all([
+            navigator.serviceWorker.register("/sw.js"),
+            Notification.requestPermission(),
+          ]);
+
+          if (permission !== "granted") {
+            throw new Error("Notification permission was not granted");
+          }
+
+          const publicKey = variables.config.publicKey;
+          const padding = "=".repeat((4 - (publicKey.length % 4)) % 4);
+          const base64 = `${publicKey}${padding}`.replace(/-/g, "+").replace(/_/g, "/");
+          const applicationServerKey = Uint8Array.from(window.atob(base64), (char) =>
+            char.charCodeAt(0),
+          );
+          const subscription = await registration.pushManager.subscribe({
+            userVisibleOnly: true,
+            applicationServerKey,
+          });
+          const subscriptionJson = subscription.toJSON();
+
+          if (!subscriptionJson.keys?.p256dh || !subscriptionJson.keys.auth) {
+            await subscription.unsubscribe();
+            throw new Error("Browser returned an invalid push subscription");
+          }
+
+          await orpc.notifications.subscribePush.call({
+            endpoint: subscription.endpoint,
+            expirationTime: subscription.expirationTime,
+            keys: {
+              p256dh: subscriptionJson.keys.p256dh,
+              auth: subscriptionJson.keys.auth,
+            },
+          });
+
+          return true;
+        },
+        meta: { invalidates: [notificationPushSubscriptionQueryKey] },
+        onSuccess: (enabled) => {
+          toast.success(
+            enabled ? "Browser notifications enabled" : "Browser notifications disabled",
+          );
+        },
+        onError: (error) => {
+          toast.error(
+            error instanceof Error ? error.message : "Could not update push notifications",
+          );
+        },
+      }}
+    >
+      {data.enabled ? <BellOffIcon className="size-4" /> : <BellIcon className="size-4" />}
+      <CommandLabel />
+    </CommandClick>
+  );
+}

package/dist/templates/code/src/app/admin/notifications/_components/tables.tsx

@@ -0,0 +1,37 @@
+"use client";
+
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { CommandFor } from "@tulip-systems/commands";
+import type { TableColumnDef } from "@tulip-systems/data-tables";
+import {
+  createTableConfig,
+  TableConfigProvider,
+  useLocalStrategy,
+} from "@tulip-systems/data-tables/client";
+import type { PropsWithChildren } from "react";
+import { orpc } from "@/server/router/client";
+import type { Notification } from "../_lib/validators";
+
+type NotificationTableProviderProps = PropsWithChildren<{
+  columns: TableColumnDef<Notification>[];
+  commands?: CommandFor<Notification[]>[];
+}>;
+
+export function NotificationTableProvider({
+  columns,
+  commands,
+  children,
+}: NotificationTableProviderProps) {
+  const response = useSuspenseQuery(orpc.notifications.list.queryOptions());
+  const strategy = useLocalStrategy({ total: response.data.length });
+
+  const config = createTableConfig<Notification>({
+    queryData: response.data,
+    getRowId: (row) => row.id,
+    columns,
+    strategy,
+    commands,
+  });
+
+  return <TableConfigProvider config={config}>{children}</TableConfigProvider>;
+}

package/dist/templates/code/src/app/admin/notifications/_components/toolbars.tsx

@@ -0,0 +1,21 @@
+"use client";
+
+import { TableToolbar, TableToolbarList } from "@tulip-systems/data-tables";
+import type { PropsWithChildren } from "react";
+
+export function NotificationTableToolbar({ children }: PropsWithChildren) {
+  return (
+    <TableToolbar>
+      <TableToolbarList>
+        <div>
+          <h1 className="font-semibold text-lg tracking-tight">Notifications</h1>
+          <p className="text-muted-foreground text-sm">
+            Created by event listeners running through the queue.
+          </p>
+        </div>
+      </TableToolbarList>
+
+      <TableToolbarList>{children}</TableToolbarList>
+    </TableToolbar>
+  );
+}