@graph8/sdk 0.362.0 → 0.373.0

package/blocks/newsletter/components/subscriber-timeline.tsx

@@ -0,0 +1,65 @@
+"use client";
+
+/**
+ * SubscriberTimeline: what one subscriber did with one sent issue (delivered, opened, clicked...), in order.
+ * Pick the issue from the ones already sent.
+ *
+ * SDK operations:
+ *   1. getSubscriberTimeline  GET /newsletters/{id}/issues/{issue}/analytics/subscribers/{subscriber}/timeline  (read)
+ *
+ * The payload is open-shaped: events are read from `events` (or `timeline`, or a bare list) and shown with whatever
+ * of `type`, `event`, `occurred_at`, `url` is present.
+ */
+import { useEffect, useState } from "react";
+import { Skeleton } from "@graph8/sdk/ui";
+import { ApiError } from "@/g8/components/api-error";
+import { EmptyState } from "@/g8/components/empty-state";
+import { SectionCard } from "@/g8/components/screen/section-card";
+import { useG8Query } from "@/g8/hooks/use-g8-query";
+import { g8Get } from "@/g8/lib/g8-client";
+import { issueTitle } from "../lib/newsletter-types";
+import type { Issue } from "../lib/newsletter-types";
+import { rowsOf, str } from "../lib/newsletter-extra";
+import type { Rec } from "../lib/newsletter-extra";
+
+export interface SubscriberTimelineProps {
+  newsletterId: string;
+  subscriberId: number;
+  /** The issues to choose from (only sent ones are offered). */
+  issues: Issue[];
+  className?: string;
+}
+
+const when = (v: unknown): string => {
+  const d = new Date(str(v));
+  return Number.isNaN(d.getTime()) ? "" : d.toLocaleString();
+};
+
+export function SubscriberTimeline({ newsletterId, subscriberId, issues, className }: SubscriberTimelineProps) {
+  const sent = issues.filter((i) => i.status === "sent" || i.sent_at);
+  const [issueId, setIssueId] = useState<string>(sent[0] ? String(sent[0].id) : "");
+  // On a deep link the issues arrive after the first render: pick the newest sent one once they do.
+  useEffect(() => { if (issueId === "" && sent[0]) setIssueId(String(sent[0].id)); }, [issueId, sent.length]); // eslint-disable-line react-hooks/exhaustive-deps
+  const res = useG8Query(
+    (signal) => g8Get(`/newsletters/${encodeURIComponent(newsletterId)}/issues/${issueId}/analytics/subscribers/${subscriberId}/timeline`, undefined, { signal }),
+    [newsletterId, issueId, subscriberId],
+    { enabled: issueId !== "" },
+  );
+  const events = rowsOf<Rec>(res.data?.data, "events", "timeline");
+  return (
+    <SectionCard className={className} title="Activity on an issue" description="What this person did with one sent issue."
+      actions={sent.length ? <select aria-label="Issue" className="border-input bg-background h-8 rounded-md border px-2 text-sm" value={issueId} onChange={(e) => setIssueId(e.target.value)}>{sent.map((i) => <option key={i.id} value={String(i.id)}>{issueTitle(i)}</option>)}</select> : undefined}>
+      {sent.length === 0 ? <EmptyState compact title="No sent issues yet" description="Activity appears after an issue is sent." />
+        : res.error ? <ApiError error={res.error} title="Could not load the activity" onRetry={() => void res.refetch()} />
+        : res.loading && !res.data ? <Skeleton className="h-16 w-full" aria-busy="true" />
+        : events.length === 0 ? <EmptyState compact title="No activity recorded" description="This person has not opened or clicked this issue." />
+        : (
+          <ol className="grid gap-2">
+            {events.map((e, i) => (
+              <li key={i} className="rounded-md border p-2 text-sm"><span className="font-medium">{str(e.type) || str(e.event) || "Event"}</span> <span className="text-muted-foreground text-xs">{when(e.occurred_at) || when(e.timestamp) || when(e.created_at)}</span>{str(e.url) ? <span className="text-muted-foreground block truncate text-xs">{str(e.url)}</span> : null}</li>
+            ))}
+          </ol>
+        )}
+    </SectionCard>
+  );
+}

package/blocks/newsletter/lib/newsletter-extra.ts

@@ -0,0 +1,60 @@
+"use client";
+
+/**
+ * Small helpers for the newsletter management components (settings, versions, list syncs, templates).
+ * Responses for these endpoints are open dicts in the contract, so every reader accepts what is present.
+ */
+import type { PaginatedResponse } from "@graph8/sdk";
+
+export type Rec = Record<string, unknown>;
+
+export function asRec(value: unknown): Rec {
+  return value && typeof value === "object" && !Array.isArray(value) ? (value as Rec) : {};
+}
+
+export function str(value: unknown, fallback = ""): string {
+  return typeof value === "string" ? value : value == null ? fallback : String(value);
+}
+
+export function num(value: unknown): number | undefined {
+  return typeof value === "number" && Number.isFinite(value) ? value : undefined;
+}
+
+/** The rows of a list payload: a bare array, or the first of `keys` (then `items`) that holds one. */
+export function rowsOf<T = Rec>(data: unknown, ...keys: string[]): T[] {
+  if (Array.isArray(data)) return data as T[];
+  const rec = asRec(data);
+  for (const key of [...keys, "items"]) if (Array.isArray(rec[key])) return rec[key] as T[];
+  return [];
+}
+
+/** The fields of `draft` that differ from `saved`: the body of a partial update. Strings are compared trimmed. */
+export function changedFields<T extends Record<string, string | boolean>>(saved: T, draft: T): Partial<T> {
+  const out: Partial<T> = {};
+  for (const key of Object.keys(draft) as Array<keyof T>) {
+    const a = saved[key];
+    const b = draft[key];
+    if (typeof b === "string" ? b.trim() !== String(a).trim() : b !== a) out[key] = (typeof b === "string" ? b.trim() : b) as T[keyof T];
+  }
+  return out;
+}
+
+/** True for a bare hostname such as updates.acme.com (no scheme, path or spaces). */
+export function isDomain(raw: string): boolean {
+  return /^(?=.{4,253}$)([a-z0-9]([a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z]{2,}$/i.test(raw.trim());
+}
+
+/** The DNS records a verify-domain answer lists, under whichever key it used. */
+export function dnsRecordsOf(data: unknown): Rec[] {
+  return rowsOf<Rec>(data, "dns_records", "records");
+}
+
+/** A version row's number, under whichever key it used. */
+export function versionNumber(v: Rec): number | undefined {
+  return num(v.version_num) ?? num(v.version) ?? num(v.number) ?? num(v.id);
+}
+
+/** Wrap rows and the API's "next" marker (a cursor or an offset; null or absent when there is no more) for `usePaginated`. */
+export function pageOf<T>(rows: T[], next: unknown): PaginatedResponse<T> {
+  return { data: rows, pagination: { next_cursor: next == null || next === "" ? null : String(next) } } as unknown as PaginatedResponse<T>;
+}

package/blocks/nurture/block.json

@@ -14,27 +14,40 @@
     "lists"
   ],
   "operations": [
-    "list_nurtures_nurtures_get",
-    "pause_nurture_nurtures__nurture_id__pause_post",
-    "resume_nurture_nurtures__nurture_id__resume_post",
-    "duplicate_nurture_nurtures__nurture_id__duplicate_post",
-    "delete_nurture_nurtures__nurture_id__delete",
-    "list_my_mailboxes_mailboxes_my_get",
-    "list_lists_lists_get",
+    "add_contacts_to_list_lists__list_id__contacts_post",
     "create_nurture_nurtures_post",
-    "update_nurture_nurtures__nurture_id__patch",
+    "delete_nurture_nurtures__nurture_id__delete",
+    "duplicate_nurture_nurtures__nurture_id__duplicate_post",
     "get_nurture_nurtures__nurture_id__get",
-    "add_contacts_to_list_lists__list_id__contacts_post",
+    "get_sequence_performance_by_id_analytics_outbound_sequence_performance__sequence_id__get",
     "launch_nurture_nurtures__nurture_id__launch_post",
-    "get_sequence_performance_by_id_analytics_outbound_sequence_performance__sequence_id__get"
+    "list_lists_lists_get",
+    "list_my_mailboxes_mailboxes_my_get",
+    "list_nurtures_nurtures_get",
+    "pause_nurture_nurtures__nurture_id__pause_post",
+    "resume_nurture_nurtures__nurture_id__resume_post",
+    "update_nurture_nurtures__nurture_id__patch"
   ],
   "components": [
     {
       "name": "NurtureScreen",
       "file": "components/nurture-screen.tsx",
       "purpose": "Finished nurture workspace: list with state and row actions, create sheet, detail with results, audience and launch, and settings.",
-      "operations": [],
-      "tiers": []
+      "operations": [
+        "delete_nurture_nurtures__nurture_id__delete",
+        "duplicate_nurture_nurtures__nurture_id__duplicate_post",
+        "get_nurture_nurtures__nurture_id__get",
+        "list_lists_lists_get",
+        "list_my_mailboxes_mailboxes_my_get",
+        "list_nurtures_nurtures_get",
+        "pause_nurture_nurtures__nurture_id__pause_post",
+        "resume_nurture_nurtures__nurture_id__resume_post"
+      ],
+      "tiers": [
+        "read",
+        "write",
+        "destructive"
+      ]
     },
     {
       "name": "NurtureBuilder",
@@ -58,9 +71,10 @@
       "file": "components/nurture-form.tsx",
       "purpose": "Create a nurture (name, sender mailbox, audience, email steps) or edit its settings.",
       "operations": [
-        "list_my_mailboxes_mailboxes_my_get",
-        "list_lists_lists_get",
         "create_nurture_nurtures_post",
+        "get_nurture_nurtures__nurture_id__get",
+        "list_lists_lists_get",
+        "list_my_mailboxes_mailboxes_my_get",
         "update_nurture_nurtures__nurture_id__patch"
       ],
       "tiers": [

package/blocks/nurture/components/nurture-builder.tsx

@@ -17,6 +17,9 @@
 import { useState } from "react";
 import { Button, Card, CardContent, CardHeader, CardTitle, Skeleton } from "@graph8/sdk/ui";
 import { ApiError } from "@/g8/components/api-error";
+import { useLoadMoreList } from "@/g8/hooks/use-load-more-list";
+import { byPage, hasNextOf } from "@/g8/lib/paging";
+import { LoadMore } from "@/g8/components/paging-notices";
 import { ConfirmSpendDialog } from "@/g8/components/confirm-spend-dialog";
 import { EmptyState } from "@/g8/components/empty-state";
 import { g8Delete, g8Get, g8Post } from "@/g8/lib/g8-client";
@@ -25,6 +28,7 @@ import { useG8Query } from "@/g8/hooks/use-g8-query";
 import { isFinished, isLiveLike, isNurtureOff, isPaused, statusOf } from "../lib/nurture-types";
 import type { Nurture } from "../lib/nurture-types";
 import { NurtureForm } from "./nurture-form";
+import { useBrand } from "@/g8/hooks/use-brand";
 
 export interface NurtureBuilderProps {
   /** Called when a nurture is chosen for launch/enrollment (render NurtureEnroll with its id). */
@@ -35,10 +39,15 @@ export interface NurtureBuilderProps {
 type Action = { kind: "pause" | "duplicate"; nurture: Nurture };
 
 export function NurtureBuilder({ onSelectNurture, pageSize = 50 }: NurtureBuilderProps) {
+  const brand = useBrand();
   const [form, setForm] = useState<{ nurture?: Nurture } | null>(null);
   const [toArchive, setToArchive] = useState<Nurture | null>(null);
   const [toResume, setToResume] = useState<Nurture | null>(null);
-  const list = useG8Query((signal) => g8Get<{ nurtures?: Nurture[] }>("/nurtures", { page: 1, limit: pageSize }, { signal }).then((r) => r.data?.nurtures ?? []), [pageSize]);
+  const list = useLoadMoreList(byPage<Nurture>(pageSize, async (page, signal) => {
+    const r = await g8Get<{ nurtures?: Nurture[] }>("/nurtures", { page, limit: pageSize }, { signal });
+    const rows = r.data?.nurtures ?? [];
+    return { rows, hasNext: hasNextOf(r, pageSize, rows.length) };
+  }), [pageSize]);
   const [busy, setBusy] = useState<string | null>(null);
   const act = useG8Mutation((a: Action) => g8Post(`/nurtures/${encodeURIComponent(a.nurture.id)}/${a.kind}`, a.kind === "duplicate" ? {} : undefined), { onSuccess: () => void list.refetch() });
   const run = async (a: Action): Promise<void> => {
@@ -49,7 +58,7 @@ export function NurtureBuilder({ onSelectNurture, pageSize = 50 }: NurtureBuilde
   const resume = useG8Mutation((n: Nurture) => g8Post(`/nurtures/${encodeURIComponent(n.id)}/resume`), { onSuccess: () => { setToResume(null); void list.refetch(); } });
   const archive = useG8Mutation((n: Nurture) => g8Delete(`/nurtures/${encodeURIComponent(n.id)}`), { onSuccess: () => { setToArchive(null); void list.refetch(); } });
 
-  if (isNurtureOff(list.error)) return <EmptyState title="Nurture is not enabled" description="Nurture is behind a feature flag for this workspace. Ask graph8 to turn it on, then reload." />;
+  if (isNurtureOff(list.error)) return <EmptyState title="Nurture is not enabled" description={`Nurture is behind a feature flag for this workspace. Ask ${brand.linkLabel} to turn it on, then reload.`} />;
   if (list.error) return <ApiError error={list.error} title="Could not load nurtures" onRetry={() => void list.refetch()} />;
   if (form) {
     return (
@@ -63,7 +72,7 @@ export function NurtureBuilder({ onSelectNurture, pageSize = 50 }: NurtureBuilde
   return (
     <div className="grid gap-3">
       <div className="flex items-center justify-between">
-        <h2 className="text-lg font-semibold">Nurtures</h2>
+        <h2 className="text-lg font-medium">Nurtures</h2>
         <Button onClick={() => setForm({})}>New nurture</Button>
       </div>
       {act.error ? <ApiError error={act.error} title="That did not work" /> : null}
@@ -89,6 +98,7 @@ export function NurtureBuilder({ onSelectNurture, pageSize = 50 }: NurtureBuilde
           ))}
         </ul>
       )}
+      <LoadMore shown={nurtures.length} noun="nurtures" hasMore={list.hasMore} loading={list.loadingMore} onLoadMore={list.loadMore} />
       <ConfirmSpendDialog
         open={toResume !== null}
         tier="external"

package/blocks/nurture/components/nurture-enroll.tsx

@@ -17,13 +17,17 @@
 import { useEffect, useState } from "react";
 import { Button, Card, CardContent, CardHeader, CardTitle, Skeleton } from "@graph8/sdk/ui";
 import { ApiError } from "@/g8/components/api-error";
+import { useAllLists } from "@/g8/crm/hooks/use-all-lists";
+import { ListSelect } from "@/g8/crm/components/list-select";
 import { ConfirmSpendDialog } from "@/g8/components/confirm-spend-dialog";
 import { EmptyState } from "@/g8/components/empty-state";
 import { g8Get, g8Patch, g8Post } from "@/g8/lib/g8-client";
 import { useG8Mutation } from "@/g8/hooks/use-g8-mutation";
 import { useG8Query } from "@/g8/hooks/use-g8-query";
 import { isDrafted, isNurtureMissing, isNurtureOff, statusOf } from "../lib/nurture-types";
-import type { ListOption, Nurture } from "../lib/nurture-types";
+import type { Nurture } from "../lib/nurture-types";
+import { pluralWord } from "@/g8/lib/plural";
+import { useBrand } from "@/g8/hooks/use-brand";
 
 export interface NurtureEnrollProps {
   nurtureId: string;
@@ -33,9 +37,10 @@ export interface NurtureEnrollProps {
 }
 
 export function NurtureEnroll({ nurtureId, contactIds = [], onLaunched }: NurtureEnrollProps) {
+  const brand = useBrand();
   const base = `/nurtures/${encodeURIComponent(nurtureId)}`;
   const nurture = useG8Query((signal) => g8Get<Nurture>(base, {}, { signal }).then((r) => r.data), [base]);
-  const lists = useG8Query((signal) => g8Get<ListOption[]>("/lists", { limit: 200 }, { signal }).then((r) => r.data ?? []), []);
+  const lists = useAllLists([]);
   const [listId, setListId] = useState("");
   const [consent, setConsent] = useState(false);
   const [confirming, setConfirming] = useState(false);
@@ -55,12 +60,12 @@ export function NurtureEnroll({ nurtureId, contactIds = [], onLaunched }: Nurtur
   const addContacts = useG8Mutation((id: number) => g8Post(`/lists/${id}/contacts`, { contact_ids: [...contactIds] }), { onSuccess: () => void lists.refetch() });
   const launch = useG8Mutation(() => g8Post(`${base}/launch`), { onSuccess: () => { setConfirming(false); void nurture.refetch(); onLaunched?.(); } });
 
-  if (isNurtureOff(nurture.error)) return <EmptyState title="Nurture is not enabled" description="Nurture is behind a feature flag for this workspace. Ask graph8 to turn it on." />;
+  if (isNurtureOff(nurture.error)) return <EmptyState title="Nurture is not enabled" description={`Nurture is behind a feature flag for this workspace. Ask ${brand.linkLabel} to turn it on.`} />;
   if (isNurtureMissing(nurture.error)) return <EmptyState title="This nurture no longer exists" description="It may have been deleted, or it is not yours to see. Pick another nurture." />;
   if (nurture.error) return <ApiError error={nurture.error} title="Could not load the nurture" onRetry={() => void nurture.refetch()} />;
   if (!nurture.data) return <Skeleton className="h-40 w-full" aria-busy="true" />;
 
-  const list = (lists.data ?? []).find((l) => String(l.id) === listId);
+  const list = lists.items.find((l) => String(l.id) === listId);
   const attached = nurture.data.associated_list_id ? String(nurture.data.associated_list_id) === listId : false;
   const audience = list?.contact_count ?? 0;
   const canLaunch = isDrafted(nurture.data) && attached && audience > 0 && consent;
@@ -70,15 +75,12 @@ export function NurtureEnroll({ nurtureId, contactIds = [], onLaunched }: Nurtur
       <CardContent className="grid gap-4">
         <div className="grid max-w-md gap-1">
           <label htmlFor="g8-nurture-audience" className="text-sm font-medium">Audience list</label>
-          <select id="g8-nurture-audience" className="border-input bg-background h-9 rounded-md border px-2 text-sm" value={listId} disabled={!isDrafted(nurture.data)} onChange={(e) => setListId(e.target.value)}>
-            <option value="">Choose a list</option>
-            {(lists.data ?? []).map((l) => <option key={l.id} value={l.id}>{l.title} ({(l.contact_count ?? 0).toLocaleString()})</option>)}
-          </select>
+          <ListSelect id="g8-nurture-audience" label="Audience list" emptyOption="Choose a list" pageSize={200} optionLabel={(l) => `${l.title} (${(l.contact_count ?? 0).toLocaleString()})`} value={listId} valueLabel={list?.title} disabled={!isDrafted(nurture.data)} onChange={(l) => setListId(l ? String(l.id) : "")} />
           <div className="flex gap-2">
             <Button size="sm" variant="outline" loading={setAudience.loading} disabled={!listId || attached || !isDrafted(nurture.data)} onClick={() => void setAudience.mutate(Number(listId))}>Use this list</Button>
-            {contactIds.length > 0 ? <Button size="sm" variant="outline" loading={addContacts.loading} disabled={!attached} onClick={() => void addContacts.mutate(Number(listId))}>Add {contactIds.length} selected {contactIds.length === 1 ? "contact" : "contacts"}</Button> : null}
+            {contactIds.length > 0 ? <Button size="sm" variant="outline" loading={addContacts.loading} disabled={!attached} onClick={() => void addContacts.mutate(Number(listId))}>Add {contactIds.length} selected {pluralWord(contactIds.length, "contact")}</Button> : null}
           </div>
-          {attached ? <p className="text-sm">This nurture will engage <strong>{audience.toLocaleString()}</strong> {audience === 1 ? "contact" : "contacts"}.</p> : null}
+          {attached ? <p className="text-sm">This nurture will engage <strong>{audience.toLocaleString()}</strong> {pluralWord(audience, "contact")}.</p> : null}
         </div>
         {[setAudience.error, addContacts.error].filter(Boolean).map((e, i) => <ApiError key={i} error={e} title="That did not work" />)}
         {isDrafted(nurture.data) ? (

package/blocks/nurture/components/nurture-form.tsx

@@ -13,13 +13,15 @@
  */
 
 import { useState } from "react";
-import { Button, Input, Label, Textarea } from "@graph8/sdk/ui";
+import { Button, Input, Label, Skeleton, Textarea } from "@graph8/sdk/ui";
 import { ApiError } from "@/g8/components/api-error";
+import { ListSelect } from "@/g8/crm/components/list-select";
 import { g8Get, g8Patch, g8Post } from "@/g8/lib/g8-client";
 import { useG8Mutation } from "@/g8/hooks/use-g8-mutation";
 import { useG8Query } from "@/g8/hooks/use-g8-query";
 import { channelPayload, stepsPayload } from "../lib/nurture-types";
-import type { ListOption, MailboxOption, Nurture, StepDraft } from "../lib/nurture-types";
+import type { MailboxOption, Nurture, StepDraft } from "../lib/nurture-types";
+import { useBrand } from "@/g8/hooks/use-brand";
 
 export interface NurtureFormProps {
   /** Edit this nurture; omit to create a new one. */
@@ -30,7 +32,22 @@ export interface NurtureFormProps {
 
 const SELECT = "border-input bg-background h-9 w-full rounded-md border px-2 text-sm disabled:opacity-50";
 
+/**
+ * Edit mode reads the FULL nurture (GET /nurtures/{id}) before it shows anything: the row a list hands over may omit
+ * fields (description, audience, flags), and saving a form seeded from it would blank them. Create mode needs no record.
+ */
 export function NurtureForm({ nurture, onSaved, onCancel }: NurtureFormProps) {
+  const full = useG8Query((signal) => g8Get<Nurture>(`/nurtures/${encodeURIComponent(nurture!.id)}`, {}, { signal }).then((r) => r.data), [nurture?.id], { enabled: Boolean(nurture) });
+  if (nurture) {
+    if (full.error && (!full.data || full.data.id !== nurture.id)) return <ApiError error={full.error} title="Could not load this nurture" onRetry={() => void full.refetch()} />;
+    if (!full.data || full.data.id !== nurture.id) return <Skeleton className="h-40 w-full" aria-label="Loading nurture" />;
+    return <NurtureFormFields key={full.data.id} nurture={full.data} onSaved={onSaved} onCancel={onCancel} />;
+  }
+  return <NurtureFormFields onSaved={onSaved} onCancel={onCancel} />;
+}
+
+function NurtureFormFields({ nurture, onSaved, onCancel }: NurtureFormProps) {
+  const brand = useBrand();
   const editing = Boolean(nurture);
   const [name, setName] = useState(nurture?.name ?? "");
   const [description, setDescription] = useState(nurture?.description ?? "");
@@ -41,7 +58,6 @@ export function NurtureForm({ nurture, onSaved, onCancel }: NurtureFormProps) {
   const [unsubscribe, setUnsubscribe] = useState(nurture?.include_unsubscribe_cta ?? true);
   const [steps, setSteps] = useState<StepDraft[]>([{ waitDays: 0, subject: "", body: "" }]);
   const mailboxes = useG8Query((signal) => g8Get<{ mailboxes?: MailboxOption[] }>("/mailboxes/my", {}, { signal }).then((r) => (r.data?.mailboxes ?? []).filter((m) => !m.is_archived)), []);
-  const lists = useG8Query((signal) => g8Get<ListOption[]>("/lists", { limit: 200 }, { signal }).then((r) => r.data ?? []), []);
 
   const mailbox = (mailboxes.data ?? []).find((m) => String(m.id) === mailboxId);
   const stepsOk = steps.length > 0 && steps.every((s) => s.subject.trim() && s.body.trim());
@@ -50,7 +66,11 @@ export function NurtureForm({ nurture, onSaved, onCancel }: NurtureFormProps) {
   const save = useG8Mutation(async () => {
     const flags = { finish_on_reply: finishOnReply, send_in_same_thread: sameThread, include_unsubscribe_cta: unsubscribe };
     if (nurture) {
-      return (await g8Patch<Nurture>(`/nurtures/${encodeURIComponent(nurture.id)}`, { name: name.trim(), description: description.trim() || null, associated_list_id: listId ? Number(listId) : null, ...flags })).data;
+      // Only what the person changed is sent.
+      const next = { name: name.trim(), description: description.trim() || null, associated_list_id: listId ? Number(listId) : null, ...flags };
+      const before = { name: nurture.name, description: nurture.description?.trim() || null, associated_list_id: nurture.associated_list_id ? Number(nurture.associated_list_id) : null, finish_on_reply: nurture.finish_on_reply ?? true, send_in_same_thread: nurture.send_in_same_thread ?? true, include_unsubscribe_cta: nurture.include_unsubscribe_cta ?? true };
+      const diff = Object.fromEntries(Object.entries(next).filter(([k, v]) => v !== before[k as keyof typeof before]));
+      return (await g8Patch<Nurture>(`/nurtures/${encodeURIComponent(nurture.id)}`, diff)).data;
     }
     return (await g8Post<Nurture>("/nurtures", {
       name: name.trim(),
@@ -75,14 +95,11 @@ export function NurtureForm({ nurture, onSaved, onCancel }: NurtureFormProps) {
             <option value="">{mailboxes.loading ? "Loading..." : "Choose a mailbox"}</option>
             {(mailboxes.data ?? []).map((m) => <option key={m.id} value={m.id}>{m.email}</option>)}
           </select>
-          {!editing && !mailboxes.loading && (mailboxes.data ?? []).length === 0 ? <p className="mt-1 text-xs text-amber-700">No mailbox is connected. Connect one in graph8 first (Google and Microsoft sign-in happens in the app).</p> : null}
+          {!editing && !mailboxes.loading && (mailboxes.data ?? []).length === 0 ? <p className="mt-1 text-xs text-warning-foreground">No mailbox is connected. Connect one in {brand.linkLabel} first (Google and Microsoft sign-in happens in the app).</p> : null}
         </div>
         <div>
           <Label htmlFor="g8-nurture-list" className="mb-1">Audience list (consented contacts)</Label>
-          <select id="g8-nurture-list" className={SELECT} value={listId} onChange={(e) => setListId(e.target.value)}>
-            <option value="">Choose later</option>
-            {(lists.data ?? []).map((l) => <option key={l.id} value={l.id}>{l.title}</option>)}
-          </select>
+          <ListSelect id="g8-nurture-list" label="Audience list (consented contacts)" emptyOption="Choose later" pageSize={200} value={listId} valueLabel={nurture?.associated_list_id ? `List ${nurture.associated_list_id}` : undefined} selectClassName={SELECT} onChange={(l) => setListId(l ? String(l.id) : "")} />
         </div>
       </div>
       <fieldset className="flex flex-wrap gap-4 text-sm">
@@ -93,7 +110,7 @@ export function NurtureForm({ nurture, onSaved, onCancel }: NurtureFormProps) {
       </fieldset>
       {editing ? <p className="text-muted-foreground text-sm">The emails and the sender are fixed once created. To change them, duplicate this nurture and build the copy.</p> : (
         <div className="grid gap-3">
-          <h3 className="text-sm font-semibold">Emails</h3>
+          <h3 className="text-sm font-medium">Emails</h3>
           {steps.map((s, i) => (
             <div key={i} className="grid gap-2 rounded-md border p-3">
               <div className="flex items-end gap-2">

package/blocks/nurture/components/nurture-screen.tsx

@@ -25,6 +25,10 @@ import type { ReactNode } from "react";
 import { Copy, ExternalLink, HeartHandshake, Pause, Play, Plus, Trash2 } from "lucide-react";
 import { Button, Skeleton } from "@graph8/sdk/ui";
 import { ApiError } from "@/g8/components/api-error";
+import { useLoadMoreList } from "@/g8/hooks/use-load-more-list";
+import { byPage, hasNextOf } from "@/g8/lib/paging";
+import { LoadMore } from "@/g8/components/paging-notices";
+import { useAllLists } from "@/g8/crm/hooks/use-all-lists";
 import { ConfirmSpendDialog } from "@/g8/components/confirm-spend-dialog";
 import { EmptyState } from "@/g8/components/empty-state";
 import { DetailPanel } from "@/g8/components/screen/detail-panel";
@@ -41,10 +45,12 @@ import { g8Delete, g8Get, g8Post } from "@/g8/lib/g8-client";
 import { useG8Mutation } from "@/g8/hooks/use-g8-mutation";
 import { useG8Query } from "@/g8/hooks/use-g8-query";
 import { isDrafted, isFinished, isLiveLike, isNurtureOff, isPaused, statusOf } from "../lib/nurture-types";
-import type { ListOption, MailboxOption, Nurture } from "../lib/nurture-types";
+import type { MailboxOption, Nurture } from "../lib/nurture-types";
 import { NurtureEnroll } from "./nurture-enroll";
 import { NurtureForm } from "./nurture-form";
 import { NurtureStats } from "./nurture-stats";
+import { plural } from "@/g8/lib/plural";
+import { useBrand } from "@/g8/hooks/use-brand";
 
 export interface NurtureScreenProps {
   /** Where a person connects a mailbox (Google and Microsoft sign-in only works in the graph8 app). */
@@ -77,6 +83,9 @@ function matchesFilter(n: Nurture, f: string): boolean {
   return isFinished(n);
 }
 
+/** Nurtures per read; "Load more" appends the next page. */
+const NURTURE_PAGE = 100;
+
 interface StepRow { step_order?: number; time_interval?: number; step_data?: { subject?: string; body?: string } }
 
 const when = (v: string | null | undefined): string => (v ? new Date(v).toLocaleString() : "");
@@ -85,12 +94,12 @@ const yesNo = (v: boolean | undefined, fallback: boolean): string => ((v ?? fall
 /** Every field of one nurture, its audience and sender by name, and each email of the series. */
 function NurtureDetails({ nurtureId }: { nurtureId: string }) {
   const one = useG8Query((signal) => g8Get<Nurture>(`/nurtures/${encodeURIComponent(nurtureId)}`, {}, { signal }).then((r) => r.data), [nurtureId]);
-  const lists = useG8Query((signal) => g8Get<ListOption[]>("/lists", { limit: 200 }, { signal }).then((r) => r.data ?? []), []);
+  const lists = useAllLists([]);
   const boxes = useG8Query((signal) => g8Get<{ mailboxes?: MailboxOption[] }>("/mailboxes/my", {}, { signal }).then((r) => r.data?.mailboxes ?? []), []);
   if (one.error) return <ApiError error={one.error} title="Could not load the nurture" onRetry={() => void one.refetch()} />;
   if (!one.data) return <Skeleton className="h-40 w-full" aria-busy="true" />;
   const n = one.data;
-  const list = (lists.data ?? []).find((l) => l.id === n.associated_list_id);
+  const list = lists.items.find((l) => l.id === n.associated_list_id);
   const box = (boxes.data ?? []).find((m) => m.id === n.pinned_mailbox_id);
   const steps = Array.isArray(n.steps) ? (n.steps as StepRow[]) : [];
   return (
@@ -129,10 +138,12 @@ function NurtureDetails({ nurtureId }: { nurtureId: string }) {
 
 /** "Wait 1 day" / "Wait 3 days" after the previous email (`time_interval` is seconds). */
 function waitText(days: number): string {
-  return `Wait ${days} ${days === 1 ? "day" : "days"} after the previous email`;
+  return `Wait ${plural(days, "day")} after the previous email`;
 }
 
-export function NurtureScreen({ connectMailboxUrl = "https://app.graph8.com", contactIds, renderRowActions, renderDetailActions, renderAudienceTools, extraDetailTabs, toolbarActions, className }: NurtureScreenProps) {
+export function NurtureScreen({ connectMailboxUrl: connectMailboxUrlProp, contactIds, renderRowActions, renderDetailActions, renderAudienceTools, extraDetailTabs, toolbarActions, className }: NurtureScreenProps) {
+  const brand = useBrand();
+  const connectMailboxUrl = connectMailboxUrlProp ?? brand.appUrl;
   const [id, setId] = useUrlState("id", "");
   const [view, setView] = useUrlState("view", "");
   const expandProps = { onExpand: () => setView("full"), onCollapse: view === "full" ? () => setView(null) : undefined };
@@ -143,7 +154,11 @@ export function NurtureScreen({ connectMailboxUrl = "https://app.graph8.com", co
   const [toArchive, setToArchive] = useState<Nurture | null>(null);
   const [busy, setBusy] = useState<string | null>(null);
 
-  const list = useG8Query((signal) => g8Get<{ nurtures?: Nurture[] }>("/nurtures", { page: 1, limit: 100 }, { signal }).then((r) => r.data?.nurtures ?? []), []);
+  const list = useLoadMoreList(byPage<Nurture>(NURTURE_PAGE, async (page, signal) => {
+    const r = await g8Get<{ nurtures?: Nurture[] }>("/nurtures", { page, limit: NURTURE_PAGE }, { signal });
+    const rows = r.data?.nurtures ?? [];
+    return { rows, hasNext: hasNextOf(r, NURTURE_PAGE, rows.length) };
+  }), []);
   const mailboxes = useG8Query((signal) => g8Get<{ mailboxes?: MailboxOption[] }>("/mailboxes/my", {}, { signal }).then((r) => (r.data?.mailboxes ?? []).filter((m) => !m.is_archived)), [], { enabled: creating });
 
   const act = useG8Mutation((a: { kind: "pause" | "duplicate"; nurture: Nurture }) => g8Post(`/nurtures/${encodeURIComponent(a.nurture.id)}/${a.kind}`, a.kind === "duplicate" ? {} : undefined), { onSuccess: () => void list.refetch() });
@@ -158,7 +173,7 @@ export function NurtureScreen({ connectMailboxUrl = "https://app.graph8.com", co
   });
 
   if (isNurtureOff(list.error)) {
-    return <ScreenLayout title="Nurture" description="Lifecycle email series for people who agreed to hear from you." icon={<HeartHandshake className="size-5" />}><EmptyState title="Nurture is not enabled" description="Nurture is switched off for this workspace. Ask graph8 to turn it on, then reload." /></ScreenLayout>;
+    return <ScreenLayout title="Nurture" description="Lifecycle email series for people who agreed to hear from you." icon={<HeartHandshake className="size-5" />}><EmptyState title="Nurture is not enabled" description={`Nurture is switched off for this workspace. Ask ${brand.linkLabel} to turn it on, then reload.`} /></ScreenLayout>;
   }
 
   const all = list.data ?? [];
@@ -177,7 +192,7 @@ export function NurtureScreen({ connectMailboxUrl = "https://app.graph8.com", co
         <li key={n.id} className={`flex flex-wrap items-center justify-between gap-2 rounded-md border p-3 ${n.id === id ? "bg-muted" : ""}`}>
           <button type="button" className="min-w-0 flex-1 text-left" onClick={() => setId(n.id)}>
             <span className="block truncate font-medium">{n.name}</span>
-            <span className="text-muted-foreground block text-xs">{Array.isArray(n.steps) && n.steps.length > 0 ? `${n.steps.length} ${n.steps.length === 1 ? "email" : "emails"}` : "Series"}{n.is_shared ? " · shared" : ""}</span>
+            <span className="text-muted-foreground block text-xs">{Array.isArray(n.steps) && n.steps.length > 0 ? plural(n.steps.length, "email") : "Series"}{n.is_shared ? " · shared" : ""}</span>
           </button>
           <StatusPill tone={toneOf(n)}>{statusOf(n)}</StatusPill>
           <div className="flex gap-1">
@@ -243,12 +258,12 @@ export function NurtureScreen({ connectMailboxUrl = "https://app.graph8.com", co
       )}
     >
       {act.error ? <ApiError error={act.error} title="That did not work" /> : null}
-      <SplitView list={rows} detail={detail} detailOpen={Boolean(selected)} onCloseDetail={() => { setId(null); setView(null); }} expanded={view === "full"} onExpandedChange={(e) => setView(e ? "full" : null)} detailWidth="xl" />
+      <SplitView list={<>{rows}<LoadMore shown={all.length} noun="nurtures" hasMore={list.hasMore} loading={list.loadingMore} onLoadMore={list.loadMore} /></>} detail={detail} detailOpen={Boolean(selected)} onCloseDetail={() => { setId(null); setView(null); }} expanded={view === "full"} onExpandedChange={(e) => setView(e ? "full" : null)} detailWidth="xl" />
       <FormSheet open={creating} onOpenChange={setCreating} title="New nurture" description="Pick the sender and the audience, then write the emails. Nothing is sent until you go live.">
         <div className="grid gap-4">
           {noMailbox ? (
-            <SectionCard title="Connect a mailbox first" description="A nurture sends from one connected mailbox. Google and Microsoft sign-in only works inside graph8.">
-              <a className="inline-flex items-center gap-1 text-sm underline" href={connectMailboxUrl} target="_blank" rel="noreferrer">Connect in graph8 <ExternalLink className="size-3.5" /></a>
+            <SectionCard title="Connect a mailbox first" description={`A nurture sends from one connected mailbox. Google and Microsoft sign-in only works inside ${brand.linkLabel}.`}>
+              <a className="inline-flex items-center gap-1 text-sm underline" href={connectMailboxUrl} target="_blank" rel="noreferrer">Connect in {brand.linkLabel} <ExternalLink className="size-3.5" /></a>
             </SectionCard>
           ) : null}
           {creating ? <NurtureForm onCancel={() => setCreating(false)} onSaved={(created) => { setCreating(false); void list.refetch(); setId(created.id); }} /> : null}

package/blocks/nurture/components/nurture-stats.tsx

@@ -15,11 +15,12 @@
 import { useState } from "react";
 import { Button, Card, CardContent, CardHeader, CardTitle, Skeleton } from "@graph8/sdk/ui";
 import { ApiError } from "@/g8/components/api-error";
+import { useAllLists } from "@/g8/crm/hooks/use-all-lists";
 import { EmptyState } from "@/g8/components/empty-state";
 import { g8Get } from "@/g8/lib/g8-client";
 import { useG8Query } from "@/g8/hooks/use-g8-query";
 import { isNurtureMissing, isNurtureOff, percentOf, statusOf } from "../lib/nurture-types";
-import type { ListOption, Nurture, NurturePerformance } from "../lib/nurture-types";
+import type { Nurture, NurturePerformance } from "../lib/nurture-types";
 
 export interface NurtureStatsProps {
   nurtureId: string;
@@ -31,7 +32,7 @@ function Tile({ label, value }: { label: string; value: string }) {
   return (
     <div className="rounded-md border p-3">
       <p className="text-muted-foreground text-xs">{label}</p>
-      <p className="text-xl font-semibold">{value}</p>
+      <p className="text-xl font-medium">{value}</p>
     </div>
   );
 }
@@ -39,7 +40,7 @@ function Tile({ label, value }: { label: string; value: string }) {
 export function NurtureStats({ nurtureId, days = 30 }: NurtureStatsProps) {
   const [windowDays, setWindowDays] = useState(days);
   const nurture = useG8Query((signal) => g8Get<Nurture>(`/nurtures/${encodeURIComponent(nurtureId)}`, {}, { signal }).then((r) => r.data), [nurtureId]);
-  const lists = useG8Query((signal) => g8Get<ListOption[]>("/lists", { limit: 200 }, { signal }).then((r) => r.data ?? []), []);
+  const lists = useAllLists([]);
   const perf = useG8Query(
     (signal) => g8Get<{ data?: NurturePerformance }>(`/analytics/outbound/sequence-performance/${encodeURIComponent(nurtureId)}`, { days: windowDays }, { signal }).then((r) => (r.data?.data ?? (r.data as NurturePerformance | undefined)) ?? null),
     [nurtureId, windowDays],
@@ -49,7 +50,7 @@ export function NurtureStats({ nurtureId, days = 30 }: NurtureStatsProps) {
   if (isNurtureMissing(nurture.error)) return <EmptyState title="This nurture no longer exists" description="It may have been deleted, or it is not yours to see. Pick another nurture." />;
   if (nurture.error) return <ApiError error={nurture.error} title="Could not load the nurture" onRetry={() => void nurture.refetch()} />;
   if (!nurture.data) return <Skeleton className="h-32 w-full" aria-busy="true" />;
-  const audience = (lists.data ?? []).find((l) => l.id === nurture.data?.associated_list_id);
+  const audience = lists.items.find((l) => l.id === nurture.data?.associated_list_id);
   const p = perf.data;
   const hasNumbers = Boolean(p && (p.contacts_total || p.emails_sent));
   return (

package/blocks/nurture/lib/nurture-types.ts

@@ -8,7 +8,7 @@
  * endpoint; status, audience size and the sequence-performance report are what the API gives.
  */
 
-import { G8Error } from "@graph8/sdk";
+import { G8Error } from "@graph8/sdk/errors";
 
 export interface Nurture {
   id: string;

package/blocks/objects/README.md

@@ -5,6 +5,22 @@ edit and archive their records. `ObjectTable` and `ObjectRecordDetail` are gener
 slug, including the standard `contacts`, `companies` and `deals`. This is the HubSpot "custom objects" / Salesforce
 "custom object" screen set.
 
+## Screens
+
+`ObjectsScreen` (no props) is the finished workspace: a picker of all objects (your own next to the standard contacts, companies and
+deals), the records table with search, load more, create, edit and archive, the open record beside it (values, owners, relationships,
+history, restore) and "Define objects", which opens `ObjectSchemaEditor` in a side sheet so an admin can create objects, add and archive
+fields and rename. The URL carries `?object=` and `?id=`, so a refresh or a shared link lands on the same record. Props:
+`initialObjectSlug`, `allowSchemaEditing` (default true; hide it from non-admins), `toolbarActions`. Needs the same prerequisites as
+the parts (`objects` and `records` in the proxy allow-list, `objects:read`/`write`/`delete`, and `objects:manage` for the editor).
+If the objects API is unreachable the screen says so.
+
+```tsx
+"use client";
+import { ObjectsScreen } from "@/g8/objects/components/objects-screen";
+export default function Page() { return <ObjectsScreen />; }
+```
+
 ## Install
 
 ```
@@ -35,7 +51,7 @@ Installs `foundation` first if it is missing. Everything lands under `g8/objects
 5. **Archive**: the only delete. The record leaves lists but stays readable by id with its history; `restoreObjectRecord` brings it back.
    Archiving a record, a field or a whole object always goes through `ConfirmSpendDialog`.
 
-For `contacts`, `companies` and `deals`, `ObjectRecordDetail` also renders `RecordRolesPanel` (SDR / AE / CSM owner slots).
+For `contacts`, `companies` and `deals`, `ObjectRecordDetail` also renders `RecordRolesPanel` (SDR / AE / CSM owner slots; each slot is a teammate picker, so nobody types a user id; `userOptions` still gives a fixed list). A person attribute (`actor_reference`) is a teammate picker too.
 Custom objects have no role slots.
 
 ```tsx
@@ -82,6 +98,7 @@ export default function Invoices() {
 
 | Component | File | What it is |
 |---|---|---|
+| `ObjectsScreen` | `components/objects-screen.tsx` | The finished workspace composing everything below. |
 | `ObjectSchemaEditor` | `components/object-schema-editor.tsx` | Create objects, edit their labels, add/edit/archive fields (text, number, select, reference...). |
 | `AttributeFormDialog` | `components/attribute-form-dialog.tsx` | Dialog to add or edit one field of an object. |
 | `ObjectTable` | `components/object-table.tsx` | Records of any object as a table with search over loaded rows, load-more, create, edit and archive. |