@firedrill-tools/netsuite 0.1.2

package/firedrill/tools/netsuite/app/site/views/customer-form.js

@@ -0,0 +1,152 @@
+// The customer entry form (Lists → Relationships → Customers → New / Edit), rendered in NetSuite's
+// record-dialog style. Writes go through customer.create / customer.update with an idempotency key.
+import { call, el, newKey, toast, describe, ToolError } from "../ui.js";
+import { dialog } from "../overlay.js";
+import { app, can, go } from "../store.js";
+
+const TERMS = [["", "— None —"], ["1", "Net 15"], ["2", "Net 30"], ["3", "Due on receipt"]];
+
+function field(id, label, control, { required = false } = {}) {
+  return el("div", { class: "field" }, [
+    el("label", { class: "fl", for: id }, [label, required ? el("span", { class: "req", text: "*" }) : null]),
+    control,
+  ]);
+}
+
+/** record === null → New Customer; otherwise Edit Customer. onSaved receives the record id. */
+export function openCustomerForm(record, { subsidiaries = [], onSaved } = {}) {
+  const editing = record !== null && record !== undefined;
+  const values = {
+    isPerson: editing ? record.isPerson === true : false,
+    companyName: editing ? record.companyName ?? "" : "",
+    firstName: editing ? record.firstName ?? "" : "",
+    lastName: editing ? record.lastName ?? "" : "",
+    email: editing ? record.email ?? "" : "",
+    phone: editing ? record.phone ?? "" : "",
+    subsidiary: editing ? record.subsidiary?.id ?? "" : "",
+    terms: editing ? record.terms?.id ?? "" : "",
+    creditLimit: editing ? (record.creditLimit ?? "") : "",
+    comments: editing ? record.comments ?? "" : "",
+  };
+  const controls = {};
+  const make = (name, type = "text") => {
+    const id = `cust-${name}`;
+    const node = type === "textarea"
+      ? el("textarea", { id, value: values[name] })
+      : el("input", { type, id, value: String(values[name] ?? "") });
+    node.addEventListener("input", () => { app.dirty = true; });
+    controls[name] = node;
+    return node;
+  };
+  const personBox = el("input", { type: "checkbox", id: "cust-isPerson", checked: values.isPerson });
+  const subsidiarySelect = el("select", { id: "cust-subsidiary" }, [
+    el("option", { value: "", text: subsidiaries.length ? "— Select —" : "Account default" }),
+    ...subsidiaries.map((s) => el("option", { value: s.id, text: s.name, selected: s.id === values.subsidiary })),
+  ]);
+  const termsSelect = el("select", { id: "cust-terms" },
+    TERMS.map(([id, label]) => el("option", { value: id, text: label, selected: id === values.terms })));
+  const errorHost = el("div", {});
+
+  const nameBlock = el("div", { class: "formgrid" }, [
+    el("div", { class: "field inline" }, [personBox, el("label", { class: "fl", for: "cust-isPerson", text: "Individual" })]),
+    field("cust-companyName", "Company Name", make("companyName"), { required: true }),
+    field("cust-firstName", "First Name", make("firstName")),
+    field("cust-lastName", "Last Name", make("lastName")),
+  ]);
+  const contactBlock = el("div", { class: "formgrid" }, [
+    field("cust-email", "Email", make("email", "email")),
+    field("cust-phone", "Phone", make("phone", "tel")),
+    field("cust-subsidiary", "Subsidiary", subsidiarySelect, { required: !editing }),
+    field("cust-terms", "Terms", termsSelect),
+    field("cust-creditLimit", "Credit Limit", make("creditLimit", "number")),
+  ]);
+  const commentBlock = field("cust-comments", "Comments", make("comments", "textarea"));
+
+  let saving = false;
+  let key = newKey();
+
+  function body() {
+    const person = personBox.checked;
+    controls.companyName.closest(".field").hidden = false;
+    controls.firstName.closest(".field").hidden = !person;
+    controls.lastName.closest(".field").hidden = !person;
+    const payload = {};
+    const put = (name, value) => { if (value !== "" && value !== undefined) payload[name] = value; };
+    payload.isPerson = person;
+    put("companyName", controls.companyName.value.trim());
+    if (person) {
+      put("firstName", controls.firstName.value.trim());
+      put("lastName", controls.lastName.value.trim());
+    }
+    put("email", controls.email.value.trim());
+    put("phone", controls.phone.value.trim());
+    put("comments", controls.comments.value.trim());
+    const limit = controls.creditLimit.value.trim();
+    if (limit !== "") payload.creditLimit = Number(limit);
+    if (subsidiarySelect.value !== "") payload.subsidiary = { id: subsidiarySelect.value };
+    if (termsSelect.value !== "") payload.terms = { id: termsSelect.value };
+    return payload;
+  }
+
+  personBox.addEventListener("change", () => {
+    controls.firstName.closest(".field").hidden = !personBox.checked;
+    controls.lastName.closest(".field").hidden = !personBox.checked;
+  });
+  controls.firstName.closest(".field").hidden = !values.isPerson;
+  controls.lastName.closest(".field").hidden = !values.isPerson;
+
+  if (subsidiaries.length === 0 && can("LIST_SUBSIDIARY")) {
+    call("subsidiary.list", { limit: 50, offset: 0 })
+      .then((page) => {
+        for (const item of page.items ?? []) {
+          subsidiarySelect.append(el("option", { value: item.id, text: item.name, selected: item.id === values.subsidiary }));
+        }
+        subsidiarySelect.querySelector("option").textContent = "— Select —";
+      })
+      .catch(() => { /* the select keeps the account default */ });
+  }
+
+  const box = dialog({
+    title: editing ? `Edit Customer — ${record.entityId ?? record.id}` : "New Customer",
+    wide: true,
+    body: [errorHost, nameBlock, contactBlock, commentBlock,
+      el("p", { class: "muted", text: "Address book entries are seeded by the world and are not editable in this Tool." })],
+    actions: [
+      { label: "Cancel", run: (close) => { app.dirty = false; close(); } },
+      {
+        label: "Save",
+        kind: "primary",
+        run: async (close) => {
+          if (saving) return;
+          saving = true;
+          errorHost.replaceChildren();
+          try {
+            const payload = body();
+            const result = editing
+              ? await call("customer.update", { recordId: record.id, body: payload }, key)
+              : await call("customer.create", { body: payload }, key);
+            app.dirty = false;
+            toast(editing ? "Customer saved." : `Customer created (internal id ${result.id}).`);
+            close();
+            if (onSaved) await onSaved(result.id);
+            else go(`#/customers/${encodeURIComponent(result.id)}`);
+          } catch (error) {
+            key = newKey();
+            const path = error instanceof ToolError ? error.details?.errorPath : undefined;
+            errorHost.replaceChildren(el("div", { class: "banner error", role: "alert" }, [
+              el("div", {}, [
+                el("div", { class: "banner-title", text: editing ? "The customer could not be saved" : "The customer could not be created" }),
+                el("div", { class: "banner-detail", text: describe(error) }),
+              ]),
+            ]));
+            if (path && controls[path]) controls[path].focus();
+          } finally {
+            saving = false;
+          }
+        },
+      },
+    ],
+    onClose: () => { app.dirty = false; },
+  });
+  return box;
+}

package/firedrill/tools/netsuite/app/site/views/customer.js

@@ -0,0 +1,147 @@
+// The customer record page: NetSuite's subtab layout (Primary Information, Address, Financial,
+// Transactions, System Information) with Edit, Delete and the related-transaction sublists.
+import { app, can, go, listIds, expand, register, remember } from "../store.js";
+import { call, el, errorBanner, money, mdy, describe, newKey, toast, lit } from "../ui.js";
+import { confirmDialog, openMenu } from "../overlay.js";
+import {
+  recordShell, recordButtons, subtabStrip, fieldGroup, kvColumns, kv, setPageTitle,
+  toolbarButton, nsButton, pill, currencyOf,
+} from "./common.js";
+import { openCustomerForm } from "./customer-form.js";
+
+const TABS = ["Primary Information", "Address", "Financial", "Transactions", "System Information"];
+
+function addressCard(entry) {
+  const address = entry.addressBookAddress ?? {};
+  const lines = [address.addressee, address.addr1, address.addr2,
+    [address.city, address.state, address.zip].filter(Boolean).join(" "), address.country?.refName]
+    .filter((line) => line !== undefined && line !== null && line !== "");
+  return el("div", { class: "fieldgroup" }, [
+    el("h3", { text: `${entry.label ?? "Address"}${entry.defaultBilling ? " · Default Billing" : ""}${entry.defaultShipping ? " · Default Shipping" : ""}` }),
+    el("div", { class: "fg-body" }, lines.map((line) => el("div", { text: line }))),
+  ]);
+}
+
+async function transactionsTab(node, customer) {
+  const blocks = [];
+  if (can("TRAN_SALESORD")) blocks.push(["Sales Orders", "sales-order.list", "sales-order.get", "#/orders/"]);
+  if (can("TRAN_CUSTINVC")) blocks.push(["Invoices", "invoice.list", "invoice.get", "#/invoices/"]);
+  if (blocks.length === 0) {
+    node.replaceChildren(el("p", { class: "muted", text: "This role cannot view transactions." }));
+    return;
+  }
+  node.replaceChildren(el("p", { class: "muted", text: "Loading transactions…" }));
+  const sections = [];
+  for (const [title, listOperation, getOperation, base] of blocks) {
+    try {
+      const page = await listIds(listOperation, { q: `entity ANY_OF [${customer.id}]`, limit: 10, offset: 0 });
+      const rows = await expand(getOperation, page.ids);
+      const currency = currencyOf(customer);
+      sections.push(el("section", { class: "sublist" }, [
+        el("header", {}, [el("h3", { text: title }), el("span", { class: "grow" }),
+          el("span", { class: "muted", text: `${rows.length} of ${page.totalResults}` })]),
+        el("div", { class: "tablewrap" }, el("table", { class: "grid" }, [
+          el("thead", {}, el("tr", {}, ["Document Number", "Date", "Status", "Amount"].map((label, index) =>
+            el("th", { scope: "col", class: index === 3 ? "num" : "", text: label })))),
+          el("tbody", {}, rows.length === 0
+            ? [el("tr", {}, el("td", { colspan: "4", class: "muted", text: `No ${title.toLowerCase()} for this customer.` }))]
+            : rows.map((row) => el("tr", {}, [
+                el("td", {}, el("a", { href: `${base}${encodeURIComponent(row.id)}`, text: row.tranId })),
+                el("td", { class: "tight", text: mdy(row.tranDate) }),
+                el("td", {}, pill(row.status)),
+                el("td", { class: "num", text: money(row.total, currency) }),
+              ]))),
+        ])),
+      ]));
+    } catch (error) {
+      sections.push(errorBanner(error, `${title} could not be loaded`));
+    }
+  }
+  node.replaceChildren(...sections);
+}
+
+register("customer", async (main, route) => {
+  const id = route.id;
+  let record;
+  try {
+    record = await call("customer.get", { recordId: id, expandSubResources: true });
+  } catch (error) {
+    main.replaceChildren(errorBanner(error, "This customer could not be opened"));
+    return;
+  }
+  const name = record.entityId ?? record.companyName ?? record.id;
+  setPageTitle(name);
+  remember({ label: `Customer: ${name}`, href: `#/customers/${encodeURIComponent(record.id)}` });
+  const currency = currencyOf(record);
+  let tab = TABS.includes(route.params.get("tab")) ? route.params.get("tab") : TABS[0];
+  const panel = el("div", {});
+
+  function paint() {
+    if (tab === "Primary Information") {
+      panel.replaceChildren(fieldGroup("Primary Information", kvColumns(
+        [kv("Customer ID", record.entityId), kv("Company Name", record.companyName ?? ""), kv("Individual", record.isPerson ? "Yes" : "No"),
+          kv("Email", record.email ? el("a", { href: `mailto:${record.email}`, text: record.email }) : "")],
+        [kv("Phone", record.phone ?? ""), kv("Subsidiary", record.subsidiary?.refName ?? ""), kv("Primary Currency", currency),
+          kv("Status", record.isInactive ? "Inactive" : "Active")],
+      )), ...(record.comments ? [fieldGroup("Comments", el("div", { text: record.comments }))] : []));
+    } else if (tab === "Address") {
+      const entries = record.addressBook?.items ?? [];
+      panel.replaceChildren(...(entries.length ? entries.map(addressCard) : [el("p", { class: "muted", text: "No addresses on this customer." })]));
+    } else if (tab === "Financial") {
+      panel.replaceChildren(fieldGroup("Financial", kvColumns(
+        [kv("Terms", record.terms?.refName ?? "— None —"), kv("Credit Limit", record.creditLimit === undefined ? "" : money(record.creditLimit, currency))],
+        [kv("Balance", money(record.balance, currency)), kv("Unbilled Orders", money(record.unbilledOrders, currency)),
+          kv("Overdue Balance", el("span", { class: Number(record.overdueBalance) > 0 ? "overdue" : "", text: money(record.overdueBalance, currency) }))],
+      )));
+    } else if (tab === "Transactions") {
+      transactionsTab(panel, record);
+    } else {
+      panel.replaceChildren(fieldGroup("System Information", kvColumns(
+        [kv("Internal ID", record.id), kv("Date Created", mdy(record.dateCreated))],
+        [kv("Last Modified", mdy(record.lastModifiedDate)), kv("Record Type", "customer")],
+      )));
+    }
+  }
+
+  async function remove() {
+    const confirmed = await confirmDialog(
+      "Delete Customer",
+      `Delete ${name}? NetSuite refuses to delete a customer that has transactions.`,
+      "Delete",
+      "danger",
+    );
+    if (!confirmed) return;
+    try {
+      await call("customer.delete", { recordId: record.id }, newKey());
+      toast(`${name} was deleted.`);
+      go("#/customers");
+    } catch (error) {
+      main.prepend(errorBanner(error, "This customer could not be deleted"));
+    }
+  }
+
+  const actionsButton = el("button", { type: "button", class: "btn", "aria-haspopup": "true", "aria-expanded": "false", text: "Actions ▾" });
+  actionsButton.addEventListener("click", (event) => {
+    event.stopPropagation();
+    openMenu(actionsButton, [
+      { label: "Delete", run: remove, disabled: !can("LIST_CUSTJOB", "full") },
+      { label: "Make Inactive" },
+      { label: "Merge" },
+      { label: "New Sales Order", run: () => go(`#/orders/new?entity=${encodeURIComponent(record.id)}`) },
+    ]);
+  });
+
+  main.replaceChildren(recordShell({
+    title: name,
+    subtitle: `Customer · internal id ${record.id} · ${record.subsidiary?.refName ?? ""}`,
+    actions: recordButtons({
+      onEdit: () => openCustomerForm(record, { onSaved: () => go(`#/customers/${encodeURIComponent(record.id)}`) }),
+      editDisabled: !can("LIST_CUSTJOB", "edit"),
+      onBack: () => go("#/customers"),
+      actions: [actionsButton],
+    }),
+    subtabs: subtabStrip(TABS, tab, (next) => { tab = next; paint(); }),
+    body: panel,
+  }));
+  paint();
+});

package/firedrill/tools/netsuite/app/site/views/customers.js

@@ -0,0 +1,111 @@
+// Lists → Relationships → Customers: the customer list view with the NetSuite quick filter, paging and New.
+import { app, can, go, listIds, expand, register } from "../store.js";
+import { el, errorBanner, emptyState, lit, money, skeletonRows } from "../ui.js";
+import { listShell, pagerStrip, setPageTitle, toolbarButton, nsButton, currencyOf } from "./common.js";
+import { openCustomerForm } from "./customer-form.js";
+
+const COLUMNS = [
+  { label: "Name" }, { label: "Internal ID" }, { label: "Email" }, { label: "Phone" },
+  { label: "Subsidiary" }, { label: "Balance", numeric: true }, { label: "Overdue", numeric: true },
+];
+
+function filterExpression(term, showInactive) {
+  const parts = [];
+  if (term !== "") {
+    const value = lit(term);
+    parts.push(`(entityId CONTAIN ${value} OR companyName CONTAIN ${value} OR email CONTAIN ${value} OR lastName CONTAIN ${value})`);
+  }
+  if (!showInactive) parts.push("isInactive IS false");
+  return parts.join(" AND ");
+}
+
+function row(record) {
+  const currency = currencyOf(record);
+  return el("tr", {}, [
+    el("td", {}, el("a", { class: "rowlink", href: `#/customers/${encodeURIComponent(record.id)}`, text: record.entityId ?? record.id })),
+    el("td", { class: "tight mono", text: record.id }),
+    el("td", { text: record.email ?? "" }),
+    el("td", { class: "tight", text: record.phone ?? "" }),
+    el("td", { text: record.subsidiary?.refName ?? "" }),
+    el("td", { class: "num", text: money(record.balance, currency) }),
+    el("td", { class: `num${Number(record.overdueBalance) > 0 ? " overdue" : ""}`, text: money(record.overdueBalance, currency) }),
+  ]);
+}
+
+register("customers", async (main, route) => {
+  setPageTitle("Customers");
+  const state = {
+    term: route.params.get("q") ?? "",
+    inactive: route.params.get("inactive") === "1",
+    offset: Number(route.params.get("offset") ?? 0) || 0,
+    size: Number(route.params.get("size") ?? 25) || 25,
+  };
+  const body = el("tbody", {}, skeletonRows(COLUMNS.length));
+  const pagerHost = el("div", {});
+
+  const searchId = "cust-quick-filter";
+  const inactiveId = "cust-show-inactive";
+  const input = el("input", { type: "search", id: searchId, value: state.term, placeholder: "Name, e-mail or company" });
+  const inactiveBox = el("input", { type: "checkbox", id: inactiveId, checked: state.inactive });
+  const form = el("form", { class: "filterbar", onsubmit: (event) => { event.preventDefault(); apply({ term: input.value.trim(), offset: 0 }); } }, [
+    el("div", { class: "field" }, [el("label", { class: "fl", for: searchId, text: "Quick Filter" }), input]),
+    el("div", { class: "field inline" }, [inactiveBox, el("label", { class: "fl", for: inactiveId, text: "Show Inactives" })]),
+    toolbarButton("Search", () => apply({ term: input.value.trim(), offset: 0 })),
+    toolbarButton("Reset", () => apply({ term: "", inactive: false, offset: 0 })),
+  ]);
+  inactiveBox.addEventListener("change", () => apply({ inactive: inactiveBox.checked, offset: 0 }));
+
+  function apply(patch) {
+    const next = { ...state, ...patch };
+    const params = new URLSearchParams();
+    if (next.term) params.set("q", next.term);
+    if (next.inactive) params.set("inactive", "1");
+    if (next.offset) params.set("offset", String(next.offset));
+    if (next.size !== 25) params.set("size", String(next.size));
+    const query = params.toString();
+    go(`#/customers${query ? `?${query}` : ""}`);
+  }
+
+  main.replaceChildren(listShell({
+    title: "Customers",
+    subtitle: app.session?.subsidiaryScope?.id !== "0" ? `Restricted to ${app.session.subsidiaryScope.refName}` : undefined,
+    actions: [
+      can("LIST_CUSTJOB", "create")
+        ? toolbarButton("New Customer", () => openCustomerForm(null), { kind: "primary" })
+        : toolbarButton("New Customer", () => {}, { disabled: true, title: "Your role cannot create customers" }),
+      nsButton("Customize View"),
+      nsButton("Export"),
+    ],
+    filter: form,
+    columns: COLUMNS,
+    body,
+    pager: pagerHost,
+  }));
+
+  if (route.params.get("new") === "1" && can("LIST_CUSTJOB", "create")) openCustomerForm(null);
+
+  try {
+    const q = filterExpression(state.term, state.inactive);
+    const page = await listIds("customer.list", { q, limit: state.size, offset: state.offset });
+    const rows = await expand("customer.get", page.ids);
+    if (rows.length === 0) {
+      body.replaceChildren(el("tr", {}, el("td", { colspan: String(COLUMNS.length) }, emptyState(
+        "No customers match this filter.",
+        state.term ? `Nothing found for "${state.term}".` : "Create a customer to get started.",
+      ))));
+    } else {
+      body.replaceChildren(...rows.map(row));
+    }
+    pagerHost.replaceChildren(pagerStrip({
+      offset: page.offset,
+      shown: rows.length,
+      total: page.totalResults,
+      hasMore: page.hasMore,
+      pageSize: state.size,
+      onOffset: (offset) => apply({ offset }),
+      onPageSize: (size) => apply({ size, offset: 0 }),
+    }));
+  } catch (error) {
+    body.replaceChildren(el("tr", {}, el("td", { colspan: String(COLUMNS.length) }, errorBanner(error, "The customer list could not be loaded"))));
+  }
+});

package/firedrill/tools/netsuite/app/site/views/home-chrome.js

@@ -0,0 +1,75 @@
+// Home portlets that are part of the real NetSuite frame but carry no simulated records: the Navigation portlet
+// (the menu tree, live for the pages this Tool serves), the Calendar (a month grid on the account date, with no
+// events because activities are not simulated) and the Tasks / Phone Calls activity lists. Nothing here invents
+// data: every list says plainly that the feature is outside this Tool's scope.
+import { app } from "../store.js";
+import { el, icon, dayNum } from "../ui.js";
+import { notSimulated } from "../overlay.js";
+import { MENUS } from "../menus.js";
+import { nsButton } from "./common.js";
+
+const NAV_MENUS = ["Transactions", "Lists", "Reports", "Analytics", "Setup"];
+
+function navEntry(menu, entry) {
+  if (entry.run) return el("li", {}, el("button", { type: "button", class: "nav-link", text: entry.label, onclick: entry.run }));
+  return el("li", {}, el("button", { type: "button", class: "nav-link off", text: entry.label, onclick: () => notSimulated(`${menu} › ${entry.label}`) }));
+}
+
+/** Navigation portlet: one collapsible branch per menu, the first branch open, each leaf routed or "not simulated". */
+export function navigationBody() {
+  const branches = NAV_MENUS.filter((name) => MENUS[name]).map((name, index) => {
+    const leaves = MENUS[name].filter((entry) => entry.label);
+    const list = el("ul", { class: "nav-tree", hidden: index !== 0 }, leaves.map((entry) => navEntry(name, entry)));
+    const toggle = el("button", {
+      type: "button", class: "nav-branch", "aria-expanded": index === 0 ? "true" : "false",
+      onclick: () => { const open = list.hidden; list.hidden = !open; toggle.setAttribute("aria-expanded", String(open)); },
+    }, [icon("chevron", 12), el("span", { text: name }), el("span", { class: "muted", text: `(${leaves.length})` })]);
+    return el("li", {}, [toggle, list]);
+  });
+  return el("ul", { class: "nav-root" }, branches);
+}
+
+const DOW = ["S", "M", "T", "W", "T", "F", "S"];
+const MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+
+/** Calendar portlet: the month that contains the account date, today highlighted; events are not simulated. */
+export function calendarBody() {
+  const today = dayNum(app.today);
+  if (Number.isNaN(today)) return el("p", { class: "muted", text: "The account date is unavailable, so the calendar cannot be drawn." });
+  const [y, m] = app.today.split("-").map(Number);
+  const first = new Date(Date.UTC(y, m - 1, 1));
+  const daysInMonth = new Date(Date.UTC(y, m, 0)).getUTCDate();
+  const cells = [];
+  for (let i = 0; i < first.getUTCDay(); i += 1) cells.push(el("td", { class: "pad" }));
+  for (let day = 1; day <= daysInMonth; day += 1) {
+    const isToday = dayNum(`${y}-${String(m).padStart(2, "0")}-${String(day).padStart(2, "0")}`) === today;
+    cells.push(el("td", { class: isToday ? "today" : "", text: String(day), "aria-current": isToday ? "date" : undefined }));
+  }
+  while (cells.length % 7 !== 0) cells.push(el("td", { class: "pad" }));
+  const rows = [];
+  for (let i = 0; i < cells.length; i += 7) rows.push(el("tr", {}, cells.slice(i, i + 7)));
+  return [
+    el("div", { class: "cal-head" }, [
+      el("strong", { text: `${MONTHS[m - 1]} ${y}` }),
+      el("span", { class: "muted", text: "Account date" }),
+    ]),
+    el("table", { class: "cal" }, [
+      el("thead", {}, el("tr", {}, DOW.map((d, i) => el("th", { text: d, "aria-label": ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"][i] })))),
+      el("tbody", {}, rows),
+    ]),
+    el("p", { class: "muted", text: "Events, tasks and phone calls are not simulated by this Tool, so the calendar shows no entries." }),
+    el("div", { class: "btn-row" }, [nsButton("New Event"), nsButton("View Calendar")]),
+  ];
+}
+
+/** Tasks and Phone Calls: the activity portlets a daily user sees, rendered as documented not-simulated lists. */
+export function activityBody(kind) {
+  const singular = kind === "Tasks" ? "Task" : "Phone Call";
+  return [
+    el("table", { class: "search-results" }, [
+      el("thead", {}, el("tr", {}, ["Date", "Title", "Status", "Priority"].map((h) => el("th", { text: h })))),
+      el("tbody", {}, el("tr", {}, el("td", { colspan: "4", class: "muted", text: `${kind} are not simulated by this Tool; this list is intentionally empty.` }))),
+    ]),
+    el("div", { class: "btn-row" }, [nsButton(`New ${singular}`), nsButton(`View All ${kind}`)]),
+  ];
+}

package/firedrill/tools/netsuite/app/site/views/home-data.js

@@ -0,0 +1,153 @@
+// Data-driven home portlets: Trend Graphs (invoiced sales by month), Report Snapshots (sales by customer) and
+// Custom Search (open invoices). Every bar and row is computed from this Tool's own invoice collection; the
+// scan is paged (never truncated silently) and says so when it stops at the KPI row cap.
+import { app, can, listIds, expand } from "../store.js";
+import { el, money, mdy, errorBanner, emptyState, isDenied } from "../ui.js";
+
+export const MAX_KPI_ROWS = 500;
+const SVG = "http://www.w3.org/2000/svg";
+
+function svg(tag, attrs = {}, children = []) {
+  const node = document.createElementNS(SVG, tag);
+  for (const [k, v] of Object.entries(attrs)) {
+    if (v === undefined || v === null || v === false) continue;
+    if (k === "text") node.textContent = String(v);
+    else node.setAttribute(k, String(v));
+  }
+  for (const child of [].concat(children)) if (child) node.append(child);
+  return node;
+}
+
+/** Every invoice the role can read, paged; `capped` when the KPI row cap stopped the scan. */
+export async function loadInvoices(q) {
+  const rows = [];
+  let capped = false;
+  for (let offset = 0; ; offset += 50) {
+    const page = await listIds("invoice.list", { q, limit: 50, offset });
+    rows.push(...await expand("invoice.get", page.ids));
+    if (!page.hasMore) break;
+    if (rows.length >= MAX_KPI_ROWS) { capped = true; break; }
+  }
+  return { rows, capped };
+}
+
+const capNote = (capped) => capped ? el("p", { class: "muted", text: `Computed over the first ${MAX_KPI_ROWS} matching invoices.` }) : document.createDocumentFragment();
+const COUNTED = new Set(["Open", "Paid In Full"]);
+const monthKey = (date) => String(date ?? "").slice(0, 7);
+function lastMonths(today, count) {
+  const [y, m] = today.split("-").map(Number);
+  const keys = [];
+  for (let i = count - 1; i >= 0; i -= 1) {
+    const d = new Date(Date.UTC(y, m - 1 - i, 1));
+    keys.push(d.toISOString().slice(0, 7));
+  }
+  return keys;
+}
+const MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+const monthLabel = (key) => MONTHS[Number(key.slice(5, 7)) - 1] ?? key;
+
+/** Trend Graphs: invoiced sales (open + paid invoices) per month for the last six account months, as an SVG bar chart. */
+export async function trendBody(node) {
+  if (!can("TRAN_CUSTINVC")) {
+    node.replaceChildren(el("p", { class: "muted", text: "The Invoice permission is required for this graph." }));
+    return;
+  }
+  try {
+    const currency = app.session?.account?.baseCurrency ?? "";
+    const { rows, capped } = await loadInvoices('(status IS "open" OR status IS "paidInFull")');
+    const keys = lastMonths(app.today, 6);
+    const totals = new Map(keys.map((k) => [k, 0]));
+    for (const row of rows) {
+      const key = monthKey(row.tranDate);
+      if (totals.has(key) && COUNTED.has(String(row.status?.refName))) totals.set(key, totals.get(key) + (Number(row.total) || 0));
+    }
+    const max = Math.max(1, ...totals.values());
+    const W = 300; const H = 120; const pad = 14; const bw = (W - pad * 2) / keys.length;
+    const chart = svg("svg", { viewBox: `0 0 ${W} ${H}`, class: "trend", role: "img", "aria-label": "Sales by month, last six months" });
+    chart.append(svg("line", { x1: pad, y1: H - 18, x2: W - pad, y2: H - 18, class: "axis" }));
+    keys.forEach((key, i) => {
+      const value = totals.get(key);
+      const h = Math.round((value / max) * (H - 40));
+      const x = pad + i * bw + bw * 0.2;
+      chart.append(svg("title", { text: `${monthLabel(key)}: ${money(value, currency)}` }));
+      chart.append(svg("rect", { x, y: H - 18 - h, width: bw * 0.6, height: h, class: key === monthKey(app.today) ? "bar current" : "bar" }));
+      chart.append(svg("text", { x: x + bw * 0.3, y: H - 5, class: "tick", "text-anchor": "middle", text: monthLabel(key) }));
+    });
+    const sum = [...totals.values()].reduce((a, b) => a + b, 0);
+    node.replaceChildren(
+      el("div", { class: "trend-head" }, [el("strong", { text: "Sales" }), el("span", { class: "muted", text: `Last 6 months · ${money(sum, currency)}` })]),
+      chart,
+      el("p", { class: "muted", text: "Invoiced totals (open and paid invoices) by transaction month." }),
+      capNote(capped),
+    );
+  } catch (error) {
+    node.replaceChildren(isDenied(error) ? errorBanner(error) : errorBanner(error, "Trend graph could not be computed"));
+  }
+}
+
+/** Report Snapshots: Sales by Customer, the five customers with the largest invoiced totals. */
+export async function snapshotBody(node) {
+  if (!can("TRAN_CUSTINVC")) {
+    node.replaceChildren(el("p", { class: "muted", text: "The Invoice permission is required for this snapshot." }));
+    return;
+  }
+  try {
+    const currency = app.session?.account?.baseCurrency ?? "";
+    const { rows, capped } = await loadInvoices('(status IS "open" OR status IS "paidInFull")');
+    const byCustomer = new Map();
+    for (const row of rows) {
+      const id = String(row.entity?.id ?? "");
+      const entry = byCustomer.get(id) ?? { id, name: row.entity?.refName ?? id, total: 0 };
+      entry.total += Number(row.total) || 0;
+      byCustomer.set(id, entry);
+    }
+    const top = [...byCustomer.values()].sort((a, b) => b.total - a.total || a.name.localeCompare(b.name)).slice(0, 5);
+    const max = Math.max(1, ...top.map((entry) => entry.total));
+    if (top.length === 0) { node.replaceChildren(emptyState("No results", "No open or paid invoices are visible to this role.")); return; }
+    node.replaceChildren(
+      el("div", { class: "snap-title", text: "Sales by Customer" }),
+      el("ul", { class: "snap-bars" }, top.map((entry) => el("li", {}, [
+        el("a", { href: `#/customers/${encodeURIComponent(entry.id)}`, text: entry.name }),
+        svg("svg", { class: "snap-track", viewBox: "0 0 100 8", preserveAspectRatio: "none", "aria-hidden": "true" },
+          svg("rect", { x: 0, y: 0, height: 8, width: Math.max(2, Math.round((entry.total / max) * 100)), class: "snap-fill" })),
+        el("span", { class: "num", text: money(entry.total, currency) }),
+      ]))),
+      capNote(capped),
+    );
+  } catch (error) {
+    node.replaceChildren(isDenied(error) ? errorBanner(error) : errorBanner(error, "Snapshot could not be computed"));
+  }
+}
+
+/** Custom Search: the "Open Invoices" saved-search view, five rows by due date with a link to the full list. */
+export async function searchBody(node) {
+  if (!can("TRAN_CUSTINVC")) {
+    node.replaceChildren(el("p", { class: "muted", text: "The Invoice permission is required for this search." }));
+    return;
+  }
+  try {
+    const currency = app.session?.account?.baseCurrency ?? "";
+    const { rows, capped } = await loadInvoices('status IS "open"');
+    const sorted = rows.filter((row) => Number(row.amountRemaining) > 0)
+      .sort((a, b) => String(a.dueDate).localeCompare(String(b.dueDate)) || String(a.tranId).localeCompare(String(b.tranId)));
+    const shown = sorted.slice(0, 5);
+    if (shown.length === 0) { node.replaceChildren(emptyState("No results", "There are no open invoices.")); return; }
+    node.replaceChildren(
+      el("div", { class: "snap-title", text: "Open Invoices" }),
+      el("table", { class: "search-results" }, [
+        el("thead", {}, el("tr", {}, ["Date", "Number", "Name", "Due Date", "Amount Remaining"].map((h) => el("th", { text: h })))),
+        el("tbody", {}, shown.map((row) => el("tr", {}, [
+          el("td", { text: mdy(row.tranDate) }),
+          el("td", {}, el("a", { href: `#/invoices/${encodeURIComponent(row.id)}`, text: row.tranId ?? "" })),
+          el("td", { text: row.entity?.refName ?? "" }),
+          el("td", { class: app.today && String(row.dueDate) < app.today ? "overdue" : "", text: mdy(row.dueDate) }),
+          el("td", { class: "num", text: money(row.amountRemaining, currency) }),
+        ]))),
+      ]),
+      el("p", { class: "muted" }, [`${shown.length} of ${sorted.length} result${sorted.length === 1 ? "" : "s"} · `, el("a", { href: "#/invoices?tab=Open", text: "View all" })]),
+      capNote(capped),
+    );
+  } catch (error) {
+    node.replaceChildren(isDenied(error) ? errorBanner(error) : errorBanner(error, "Search could not be run"));
+  }
+}