@startsimpli/ui 0.4.157 → 0.4.159

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startsimpli/ui",
-  "version": "0.4.157",
+  "version": "0.4.159",
   "description": "Shared UI components package for StartSimpli applications",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -55,9 +55,9 @@
     "@codemirror/language": "^6.0.0",
     "@codemirror/state": "^6.0.0",
     "@codemirror/view": "^6.0.0",
-    "@startsimpli/auth": "^0.4.42",
+    "@startsimpli/api": "^0.5.68",
     "@startsimpli/i18n": "^0.1.3",
-    "@startsimpli/api": "^0.5.68"
+    "@startsimpli/auth": "^0.4.42"
   },
   "peerDependenciesMeta": {
     "@startsimpli/api": {

package/src/components/collection/InlineReviewActions.tsx

@@ -32,6 +32,7 @@ import {
   activeDecisionKey,
   applyDecisionToData,
   fieldStr,
+  isDecisionInForce,
   resolveReviewConfig,
   reviewDecisions,
   type ReviewConfig,
@@ -63,9 +64,23 @@ export interface InlineReviewActionsProps {
   config?: ReviewConfig;
   /** Fired after a successful save so the parent can refetch/invalidate. */
   onSaved?: () => void;
+  /**
+   * Whether this reader may change THIS record (bd startsim-m7fdm.32). False
+   * draws the record's state as a plain pill and no decisions, the same pill
+   * ReviewDrawer shows in place of its State select, so a view-only reader is
+   * not offered buttons that can only end in "Could not save.". Defaults to true.
+   */
+  canEdit?: boolean;
 }
 
-export function InlineReviewActions({ client, type, record, config, onSaved }: InlineReviewActionsProps) {
+export function InlineReviewActions({
+  client,
+  type,
+  record,
+  config,
+  onSaved,
+  canEdit = true,
+}: InlineReviewActionsProps) {
   const cfg = useMemo(() => resolveReviewConfig(type, config), [type, config]);
   /** The type's declared attribute names — the spellings a write must send back. */
   const declaredNames = useMemo(() => (type.attributes ?? []).map((a) => a.name), [type]);
@@ -126,19 +141,24 @@ export function InlineReviewActions({ client, type, record, config, onSaved }: I
   function iconButton(d: ReviewDecision, extraOnClick?: () => void) {
     const Icon = ICON[d.tone];
     const active = d.key === appliedKey;
+    // The decision already in force writes nothing (bd startsim-3c7h8). Not
+    // `disabled`: that dims the lit tick and it would read as un-approved.
+    const inert = isDecisionInForce(d, appliedKey);
     return (
       <button
         type="button"
         title={d.label}
         aria-label={d.label}
         aria-pressed={active}
+        aria-disabled={inert || undefined}
         disabled={busy === d.key}
         onClick={(e) => {
           e.stopPropagation();
+          if (inert) return;
           if (extraOnClick) extraOnClick();
           else void apply(d);
         }}
-        className={cn(BTN, active ? ACTIVE[d.tone] : IDLE[d.tone])}
+        className={cn(BTN, active ? ACTIVE[d.tone] : IDLE[d.tone], inert && 'cursor-default')}
       >
         <Icon className="h-4 w-4" />
       </button>
@@ -146,6 +166,14 @@ export function InlineReviewActions({ client, type, record, config, onSaved }: I
   }
 
   if (decisions.length === 0) return null;
+  if (!canEdit) {
+    const status = fieldStr(record.data, cfg.statusName);
+    return status ? (
+      <span className="whitespace-nowrap rounded-full bg-muted px-2 py-0.5 text-xs capitalize text-muted-foreground">
+        {status.replace(/_/g, ' ')}
+      </span>
+    ) : null;
+  }
   return (
     <div className="flex items-center justify-end gap-1" onClick={(e) => e.stopPropagation()}>
       {decisions.map((d) =>

package/src/components/collection/ReviewDrawer.tsx

@@ -46,6 +46,7 @@ import { declaredBlob, isVersionNumber, readData, writeData } from './data';
 import { parseSources } from './drafts';
 import {
   activeDecisionKey,
+  isDecisionInForce,
   resolveReviewConfig,
   reviewDecisions,
   shouldIgnoreShortcut,
@@ -217,6 +218,13 @@ function ReviewDrawerInner({
 
   /** One decision → write status AND verdict together (the coherent pair). */
   function applyDecision(d: ReviewDecision) {
+    // Restating the decision in force writes nothing (bd startsim-3c7h8) — the
+    // button and its shortcut both land here. It still walks the queue, so
+    // `a` over already-approved work keeps moving the reviewer on.
+    if (isDecisionInForce(d, activeKey)) {
+      if (d.advance && next) onNavigate(next);
+      return;
+    }
     const changes: Record<string, unknown> = {};
     if (d.status) changes[cfg.statusName] = d.status;
     if (d.verdict) changes[cfg.verdictAttr] = d.verdict;
@@ -494,6 +502,7 @@ function DecisionButton({
       type="button"
       onClick={onClick}
       disabled={busy}
+      aria-disabled={(active && !decision.promptNote) || undefined}
       title={`${decision.label} (${decision.shortcut})`}
       className={cn(
         'flex flex-1 flex-col items-center justify-center gap-0.5 rounded-md border px-3 py-2 text-sm font-medium transition disabled:opacity-60',

package/src/components/collection/__tests__/active-decision-inert.test.tsx

@@ -0,0 +1,155 @@
+/**
+ * The decision already in force is inert (bd startsim-3c7h8, startsim-tpz67,
+ * startsim-nyqbw).
+ *
+ * A lit Approve means the topic is `ready` or past it (`written`). Clicking it
+ * again used to write `status: ready` over a `written` topic, which moved it
+ * backwards and made the host treat the save as a fresh approval: it navigated
+ * to the story page and dispatched a writer the server then refused
+ * (drafts_exist). Clicking or pressing the decision that is already in force
+ * must write nothing.
+ */
+import * as React from 'react';
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+import { InlineReviewActions } from '../InlineReviewActions';
+import { ReviewDrawer } from '../ReviewDrawer';
+import type { CollectionClient, EntityRecord, EntityTypeDef, Paginated } from '../types';
+
+const TOPIC_TYPE: EntityTypeDef = {
+  id: 1,
+  key: 'topic',
+  label: 'Topic',
+  attributes: [
+    {
+      id: 'status',
+      name: 'status',
+      dataType: 'enum',
+      required: false,
+      config: { choices: ['suggested', 'ready', 'written', 'rejected'] },
+    },
+    { id: 'title', name: 'title', dataType: 'text', required: false, config: {} },
+    { id: 'team_verdict', name: 'team_verdict', dataType: 'text', required: false, config: {} },
+  ],
+};
+
+function topic(id: number, status: string): EntityRecord {
+  return {
+    id,
+    entityType: 'topic',
+    externalId: null,
+    name: `Topic ${id}`,
+    data: { title: `Topic ${id}`, status, team_verdict: 'good' },
+    createdAt: '2026-09-01T00:00:00Z',
+  };
+}
+
+function page<T>(results: T[]): Paginated<T> {
+  return { count: results.length, next: null, previous: null, results };
+}
+
+function stubClient(): CollectionClient & { updateEntity: jest.Mock } {
+  const updateEntity = jest.fn(async (id: number | string, input: { data?: Record<string, unknown> }) => ({
+    ...topic(Number(id), 'x'),
+    data: input.data ?? {},
+  }));
+  return {
+    listTypes: jest.fn(async () => page([TOPIC_TYPE])),
+    listAllEntities: jest.fn(async () => []),
+    updateEntity,
+  } as CollectionClient & { updateEntity: jest.Mock };
+}
+
+describe('InlineReviewActions: the lit decision writes nothing', () => {
+  it.each(['written', 'ready'])('clicking the lit Approve on a %s topic does not save', async (status) => {
+    const user = userEvent.setup();
+    const client = stubClient();
+    const onSaved = jest.fn();
+    render(<InlineReviewActions client={client} type={TOPIC_TYPE} record={topic(1, status)} onSaved={onSaved} />);
+
+    const approve = screen.getByRole('button', { name: /Approve/ });
+    expect(approve).toHaveAttribute('aria-pressed', 'true');
+    expect(approve).toHaveAttribute('aria-disabled', 'true');
+
+    await user.click(approve);
+
+    expect(client.updateEntity).not.toHaveBeenCalled();
+    expect(onSaved).not.toHaveBeenCalled();
+  });
+
+  it('a decision that is NOT in force still saves', async () => {
+    const user = userEvent.setup();
+    const client = stubClient();
+    render(<InlineReviewActions client={client} type={TOPIC_TYPE} record={topic(1, 'written')} />);
+
+    await user.click(screen.getByRole('button', { name: /Reject/ }));
+
+    await waitFor(() => expect(client.updateEntity).toHaveBeenCalledTimes(1));
+    expect(client.updateEntity.mock.calls[0][1].data).toMatchObject({ status: 'rejected' });
+  });
+
+  it('Approve on a suggested topic still saves ready', async () => {
+    const user = userEvent.setup();
+    const client = stubClient();
+    render(<InlineReviewActions client={client} type={TOPIC_TYPE} record={topic(1, 'suggested')} />);
+
+    const approve = screen.getByRole('button', { name: /Approve/ });
+    expect(approve).toHaveAttribute('aria-pressed', 'false');
+    await user.click(approve);
+
+    await waitFor(() => expect(client.updateEntity).toHaveBeenCalledTimes(1));
+    expect(client.updateEntity.mock.calls[0][1].data).toMatchObject({ status: 'ready' });
+  });
+});
+
+describe('ReviewDrawer: the decision in force writes nothing', () => {
+  function renderDrawer(status: string) {
+    const client = stubClient();
+    const onNavigate = jest.fn();
+    const onSaved = jest.fn();
+    const first = topic(1, status);
+    render(
+      <ReviewDrawer
+        client={client}
+        type={TOPIC_TYPE}
+        records={[first, topic(2, 'suggested')]}
+        record={first}
+        onClose={jest.fn()}
+        onNavigate={onNavigate}
+        onSaved={onSaved}
+      />,
+    );
+    return { client, onNavigate, onSaved };
+  }
+
+  it('clicking Approve on a written topic does not save, and still walks the queue', async () => {
+    const user = userEvent.setup();
+    const { client, onSaved, onNavigate } = renderDrawer('written');
+
+    await user.click(screen.getByRole('button', { name: /Approve/ }));
+
+    expect(client.updateEntity).not.toHaveBeenCalled();
+    expect(onSaved).not.toHaveBeenCalled();
+    expect(onNavigate).toHaveBeenCalledTimes(1);
+    expect(onNavigate.mock.calls[0][0].id).toBe(2);
+  });
+
+  it('the bare-key shortcut for the decision in force does not save either', async () => {
+    const user = userEvent.setup();
+    const { client } = renderDrawer('written');
+
+    await user.keyboard('a');
+
+    expect(client.updateEntity).not.toHaveBeenCalled();
+  });
+
+  it('a different decision from the drawer still saves', async () => {
+    const user = userEvent.setup();
+    const { client } = renderDrawer('written');
+
+    await user.click(screen.getByRole('button', { name: /Reject/ }));
+
+    await waitFor(() => expect(client.updateEntity).toHaveBeenCalledTimes(1));
+  });
+});

package/src/components/collection/__tests__/inline-review-reader.test.tsx

@@ -0,0 +1,77 @@
+/**
+ * The table-row and board-card decision cluster follows the record's
+ * permissions, like the drawer (bd startsim-m7fdm.32; drawer half startsim-j9agp).
+ *
+ * Before this, InlineReviewActions drew Reject / Approve / Needs work for every
+ * reader, and a view-only reader learned from "Could not save." that they could
+ * not decide. With `canEdit={false}` it draws the record's state instead, the
+ * same pill the drawer shows in place of its State select.
+ */
+import * as React from 'react';
+import { render, screen } from '@testing-library/react';
+
+import { InlineReviewActions } from '../InlineReviewActions';
+import type { CollectionClient, EntityRecord, EntityTypeDef, Paginated } from '../types';
+
+const TOPIC_TYPE: EntityTypeDef = {
+  id: 1,
+  key: 'topic',
+  label: 'Topic',
+  attributes: [
+    {
+      id: 'status',
+      name: 'status',
+      dataType: 'enum',
+      required: false,
+      config: { choices: ['suggested', 'ready', 'written', 'rejected'] },
+    },
+    { id: 'title', name: 'title', dataType: 'text', required: false, config: {} },
+    { id: 'team_verdict', name: 'team_verdict', dataType: 'text', required: false, config: {} },
+  ],
+};
+
+function topic(status: string): EntityRecord {
+  return {
+    id: 1,
+    entityType: 'topic',
+    externalId: null,
+    name: 'Oman customs',
+    data: { title: 'Oman customs', status },
+    createdAt: '2026-09-01T00:00:00Z',
+  };
+}
+
+function page<T>(results: T[]): Paginated<T> {
+  return { count: results.length, next: null, previous: null, results };
+}
+
+function stubClient(): CollectionClient {
+  return {
+    listTypes: jest.fn(async () => page([TOPIC_TYPE])),
+    listAllEntities: jest.fn(async () => []),
+    updateEntity: jest.fn(async () => topic('ready')),
+  } as unknown as CollectionClient;
+}
+
+describe('InlineReviewActions for a view-only reader', () => {
+  it('draws the state and no decision buttons', () => {
+    render(
+      <InlineReviewActions client={stubClient()} type={TOPIC_TYPE} record={topic('ready_for_review')} canEdit={false} />,
+    );
+    expect(screen.queryByRole('button')).toBeNull();
+    expect(screen.getByText('ready for review')).toBeInTheDocument();
+  });
+
+  it('draws nothing when the record has no state', () => {
+    const record = { ...topic('x'), data: { title: 'Oman customs' } };
+    const { container } = render(
+      <InlineReviewActions client={stubClient()} type={TOPIC_TYPE} record={record} canEdit={false} />,
+    );
+    expect(container).toBeEmptyDOMElement();
+  });
+
+  it('keeps all three decisions for an editor (the default)', () => {
+    render(<InlineReviewActions client={stubClient()} type={TOPIC_TYPE} record={topic('suggested')} />);
+    expect(screen.getAllByRole('button')).toHaveLength(3);
+  });
+});

package/src/components/collection/index.ts

@@ -14,6 +14,7 @@ export {
   deriveReviewTransitions,
   reviewDecisions,
   activeDecisionKey,
+  isDecisionInForce,
   isTerminalStatus,
   decisionLabel,
   DEFAULT_DECISION_LABELS,

package/src/components/collection/review.ts

@@ -475,6 +475,20 @@ export function activeDecisionKey(
   return null;
 }
 
+/**
+ * True when clicking `d` would only restate the decision already in force, so
+ * the click must write nothing (bd startsim-3c7h8). A lit Approve on a
+ * `written` topic used to write `status: ready` over it: the topic went
+ * backwards and the host read the save as a fresh approval, navigating to a
+ * story page that claimed a writer was running when the server had refused one.
+ *
+ * A note-prompting decision is never inert: re-opening it is how a reviewer
+ * edits the note that came with it.
+ */
+export function isDecisionInForce(d: ReviewDecision, activeKey: string | null): boolean {
+  return !d.promptNote && activeKey != null && d.key === activeKey;
+}
+
 // ---- small read helpers used by the component (kept here so they're tested) ----
 
 /** String read of an attr off a record's data blob ('' when missing). */

package/src/components/unified-table/__tests__/components/TableFilters.option-labels.test.tsx

@@ -0,0 +1,52 @@
+/**
+ * A chip filter can show a label while it filters on a key (review bead
+ * startsim-y78xg). The marketing-agents Kind chips read "weekly_brief" and
+ * "lead_magnet" beside a sidebar saying "Weekly Briefs" and "Evergreen"; the
+ * key has to stay the value because it is what travels in the URL.
+ */
+import * as React from 'react'
+import { fireEvent, render, screen } from '@testing-library/react'
+
+import { TableFilters } from '../../components/TableFilters'
+import type { FilterConfig, UseFiltersReturn } from '../../types'
+
+const config: FilterConfig = {
+  sections: [
+    {
+      id: 'kind',
+      type: 'chips',
+      filters: [
+        {
+          id: 'content_type',
+          label: 'Kind',
+          options: ['weekly_brief', 'lead_magnet', 'general'],
+          optionLabels: { weekly_brief: 'Weekly Briefs', lead_magnet: 'Evergreen' },
+        },
+      ],
+    },
+  ],
+}
+
+function filtersStub(value: Record<string, string> = {}): UseFiltersReturn {
+  return {
+    filters: value,
+    setFilter: jest.fn(),
+    clearFilter: jest.fn(),
+    clearAllFilters: jest.fn(),
+    hasActiveFilters: () => Object.keys(value).length > 0,
+    getActiveFilterCount: () => Object.keys(value).length,
+  }
+}
+
+describe('TableFilters chip labels', () => {
+  it('shows the label and filters on the key', () => {
+    const filters = filtersStub()
+    render(<TableFilters config={config} filters={filters} defaultExpanded />)
+
+    expect(screen.queryByRole('button', { name: 'weekly_brief' })).toBeNull()
+    fireEvent.click(screen.getByRole('button', { name: 'Evergreen' }))
+    expect(filters.setFilter).toHaveBeenCalledWith('content_type', 'lead_magnet')
+    // An option with no label still reads as itself.
+    expect(screen.getByRole('button', { name: 'general' })).toBeInTheDocument()
+  })
+})

package/src/components/unified-table/components/TableFilters/index.tsx

@@ -64,7 +64,7 @@ export function TableFilters({ config, filters, className, defaultExpanded = fal
                       }}
                       className="h-7 px-2 text-xs"
                     >
-                      {option}
+                      {filter.optionLabels?.[option] ?? option}
                     </Button>
                   )
                 })}
@@ -122,7 +122,7 @@ export function TableFilters({ config, filters, className, defaultExpanded = fal
             <SelectItem value="all">All</SelectItem>
             {filteredOptions.map((option: string) => (
               <SelectItem key={option} value={option}>
-                {option === 'null' ? 'Not Set' : option}
+                {option === 'null' ? 'Not Set' : (filter.optionLabels?.[option] ?? option)}
               </SelectItem>
             ))}
           </SelectContent>

package/src/components/unified-table/types.ts

@@ -164,6 +164,9 @@ export interface FilterItem {
   label: string
   type?: 'chips' | 'dropdown' | 'search' | 'checkbox'
   options?: string[]
+  /** What each option reads as on screen, keyed by option. The option itself
+   *  stays the value the filter holds, so a URL or API key is never a label. */
+  optionLabels?: Record<string, string>
   multiple?: boolean
 }