@adcops/autocore-react 3.3.113 → 3.3.116

package/src/components/tis/CycleConfigForm.tsx

@@ -0,0 +1,192 @@
+/*
+ * Copyright (C) 2026 Automated Design Corp. All Rights Reserved.
+ *
+ * <CycleConfigForm> — the Cycle tab. Operator-entered annotation that is
+ * recorded onto each cycle row: "which of the six positions is this?"
+ *
+ * Renders the selected method's `cycle_config_fields` with the same field
+ * rendering, unit handling and validation rules as Test Configuration (see
+ * TestFieldRow.tsx). What differs is the commit path and the lifecycle:
+ *
+ *   - Every edit round-trips through `tis.set_cycle_config` immediately.
+ *     There is no local draft: the value the operator sees must be the
+ *     value the server would stamp on the next row, because that is what
+ *     the `tis.cycle_ready` gate is computed from.
+ *   - While a cycle is running its annotation is LATCHED. The fields stay
+ *     visible but read-only, with a note saying edits apply to the next
+ *     cycle — an edit that silently relabelled the row being measured
+ *     would be worse than not being able to type at all.
+ *   - Under `cycle` scope the values clear after each recorded row
+ *     (`autoclear`), the gate re-arms, and the operator annotates again.
+ */
+
+import React, { useContext, useState } from 'react';
+import { Button } from 'primereact/button';
+import { Dialog } from 'primereact/dialog';
+import { Message } from 'primereact/message';
+import { useTis } from './TisProvider';
+import { TestFieldRow, labelOf, type TestFieldDef } from './TestFieldRow';
+import { EventEmitterContext } from '../../core/EventEmitterContext';
+
+export interface CycleConfigFormProps {
+    /** Extra class names applied to the root element. */
+    className?: string;
+    /** Inline style merged onto the root element. */
+    style?: React.CSSProperties;
+    /** Hide the explanatory header (used inside the prompt dialog, where
+     *  the dialog title already says what this is). */
+    compact?: boolean;
+    /** Called after each accepted edit — the dialog uses it to know the
+     *  operator has engaged with the form. */
+    onValueCommitted?: (field: TestFieldDef, raw: any) => void;
+}
+
+/**
+ * One-line summary of what the next recorded row will be labelled with.
+ * Shared by the Cycle tab header and <CycleStatusStrip> so the two can't
+ * describe the same state differently.
+ */
+export const cycleConfigSummary = (
+    fields: TestFieldDef[],
+    values: Record<string, any>,
+): string => {
+    if (fields.length === 0) return '';
+    return fields
+        .map(f => {
+            const v = values?.[f.name];
+            const shown = v === undefined || v === null || v === '' ? '—' : String(v);
+            return `${f.label ?? f.name}: ${shown}`;
+        })
+        .join('   ');
+};
+
+export const CycleConfigForm: React.FC<CycleConfigFormProps> = ({
+    className, style, compact, onValueCommitted,
+}) => {
+    const tis = useTis();
+    const { write } = useContext(EventEmitterContext);
+    const cfg = tis.cycleConfig;
+    const fields = tis.cycleConfigFields;
+    const [infoField, setInfoField] = useState<TestFieldDef | null>(null);
+
+    // A latch exists exactly while a cycle is running against these values.
+    const locked = cfg.latched !== null;
+
+    const commit = async (field: TestFieldDef, raw: any) => {
+        await tis.setCycleConfigValues({ [field.name]: raw ?? null });
+        // A `source`-bound annotation also drives the machine (e.g. the
+        // position the fixture should move to), so mirror it to GM the way
+        // Test Configuration does. Storage on both sides stays RAW.
+        if (field.source) {
+            try { await write(field.source, raw); }
+            catch (e) { console.error('[CycleConfigForm] failed to write source:', e); }
+        }
+        onValueCommitted?.(field, raw);
+    };
+
+    if (fields.length === 0) {
+        return (
+            <div className={className} style={{ padding: '1.25rem', ...style }}>
+                <h3 className="ac-form-section">No Cycle Configuration</h3>
+                <p style={{ color: 'var(--text-secondary-color)', marginTop: '0.5rem' }}>
+                    This test method records no operator-entered columns. Cycle rows
+                    are written entirely from measured values.
+                </p>
+            </div>
+        );
+    }
+
+    const gridStyle: React.CSSProperties = {
+        padding: '1.25rem',
+        gridTemplateColumns: 'auto 1fr 1.75rem 1.75rem',
+    };
+
+    return (
+        <div className={className} style={style}>
+            {!compact && (
+                <div style={{ padding: '1.25rem 1.25rem 0' }}>
+                    <h3 className="ac-form-section" style={{ display: 'flex', alignItems: 'center', gap: '10px' }}>
+                        Cycle Configuration
+                        {/* Status is stated in full by the messages below;
+                            this is the at-a-glance marker beside the title. */}
+                        <i
+                            className={cfg.ready ? 'pi pi-check-circle' : 'pi pi-exclamation-circle'}
+                            style={{ color: cfg.ready ? 'var(--green-500)' : 'var(--red-500)' }}
+                            aria-label={cfg.ready ? 'Cycle Configuration complete' : 'Cycle Configuration incomplete'}
+                        />
+                    </h3>
+                    <p style={{ color: 'var(--text-secondary-color)', margin: '0.25rem 0 0' }}>
+                        {cfg.scope === 'cycle'
+                            ? 'Recorded on the next cycle. Entered again for every cycle.'
+                            : 'Recorded on every cycle of this run.'}
+                    </p>
+                </div>
+            )}
+
+            {locked && (
+                <div style={{ padding: '0.75rem 1.25rem 0' }}>
+                    <Message
+                        severity="info"
+                        text="A cycle is running with these values. Edits apply to the next cycle."
+                    />
+                </div>
+            )}
+
+            {!cfg.ready && !locked && (
+                <div style={{ padding: '0.75rem 1.25rem 0' }}>
+                    <Message
+                        severity="warn"
+                        text={
+                            'Required: ' +
+                            cfg.missing
+                                .map(n => fields.find(f => f.name === n))
+                                .map((f, i) => (f ? labelOf(f) : cfg.missing[i]))
+                                .join(', ') +
+                            '. The machine will not start until these are filled in.'
+                        }
+                    />
+                </div>
+            )}
+
+            <div className="ac-form-grid" style={gridStyle}>
+                {fields.map(field => (
+                    <TestFieldRow
+                        key={field.name}
+                        field={field}
+                        // While latched, show what the running cycle is
+                        // actually recording rather than the pending entry.
+                        value={locked ? cfg.latched?.[field.name] : cfg.values?.[field.name]}
+                        disabled={locked}
+                        onChange={(raw) => { void commit(field, raw); }}
+                        onInfo={(f) => setInfoField(f)}
+                    />
+                ))}
+            </div>
+
+            {!compact && (
+                <div style={{ padding: '0 1.25rem 1.25rem' }}>
+                    <Button
+                        label="Clear"
+                        icon="pi pi-eraser"
+                        text
+                        disabled={locked}
+                        onClick={() => { void tis.clearCycleConfig(); }}
+                        tooltip="Clear every entry, including fields that don't autoclear"
+                        tooltipOptions={{ position: 'top' }}
+                    />
+                </div>
+            )}
+
+            <Dialog
+                header={infoField ? labelOf(infoField) : ''}
+                visible={infoField !== null}
+                onHide={() => setInfoField(null)}
+                style={{ width: '32rem', maxWidth: '90vw' }}
+                modal
+                dismissableMask
+            >
+                <p style={{ margin: 0, whiteSpace: 'pre-wrap' }}>{infoField?.description}</p>
+            </Dialog>
+        </div>
+    );
+};

package/src/components/tis/CycleStatusStrip.tsx

@@ -0,0 +1,84 @@
+/*
+ * Copyright (C) 2026 Automated Design Corp. All Rights Reserved.
+ *
+ * <CycleStatusStrip> — the Cycle Configuration state, rendered where the
+ * operator is already looking: next to the Start button.
+ *
+ * The Cycle tab is three panes away from the run screen. An operator
+ * about to press Start is looking at the lower-right corner of the
+ * footer, not at a tab they may never open, so the annotation that is
+ * about to be written onto the row has to be visible from there. This is
+ * the same idea as the specimen number Bluehill keeps beside its run
+ * control.
+ *
+ * Drop it into the footer beside Start:
+ *
+ *   <div className="footer">
+ *     <CycleStatusStrip />
+ *     <Button label="Start" onClick={...} />
+ *   </div>
+ *
+ * Clicking it opens the entry form in a dialog, so the operator can fill
+ * the fields in without leaving the run screen.
+ */
+
+import React, { useState } from 'react';
+import { Button } from 'primereact/button';
+import { Dialog } from 'primereact/dialog';
+import { useTis } from './TisProvider';
+import { CycleConfigForm, cycleConfigSummary } from './CycleConfigForm';
+
+export interface CycleStatusStripProps {
+    className?: string;
+    style?: React.CSSProperties;
+    /** Render nothing when the method declares no annotation columns.
+     *  Default true — an empty chip beside Start is just noise. */
+    hideWhenUnused?: boolean;
+}
+
+export const CycleStatusStrip: React.FC<CycleStatusStripProps> = ({
+    className, style, hideWhenUnused = true,
+}) => {
+    const tis = useTis();
+    const [open, setOpen] = useState(false);
+    const cfg = tis.cycleConfig;
+    const fields = tis.cycleConfigFields;
+
+    if (fields.length === 0 && hideWhenUnused) return null;
+
+    // Latched values are what the running cycle will actually record;
+    // pending values are what the next one will get.
+    const shown = cfg.latched ?? cfg.values;
+    const summary = cycleConfigSummary(fields, shown);
+    const incomplete = !cfg.ready;
+
+    return (
+        <>
+            <Button
+                className={className}
+                style={style}
+                text
+                severity={incomplete ? 'danger' : undefined}
+                icon={incomplete ? 'pi pi-exclamation-triangle' : 'pi pi-tag'}
+                // Not disabled and not silent: the operator can always open
+                // it, and when something is missing the chip says so in
+                // words rather than making them hunt for a red field.
+                label={incomplete
+                    ? `${summary}  — entry required`
+                    : summary}
+                aria-label="Cycle Configuration"
+                onClick={() => setOpen(true)}
+            />
+            <Dialog
+                header="Cycle Configuration"
+                visible={open}
+                onHide={() => setOpen(false)}
+                style={{ width: '34rem', maxWidth: '95vw' }}
+                modal
+                dismissableMask
+            >
+                <CycleConfigForm />
+            </Dialog>
+        </>
+    );
+};

package/src/components/tis/ResultHistoryTable.tsx

@@ -1,8 +1,10 @@
-import React, { useState, useEffect, useContext } from 'react';
+import React, { useState, useEffect, useContext, useRef } from 'react';
 import { DataTable } from 'primereact/datatable';
 import { Column } from 'primereact/column';
 import { Button } from 'primereact/button';
 import { Badge } from 'primereact/badge';
+import { Menu } from 'primereact/menu';
+import { confirmDialog } from 'primereact/confirmdialog';
 import { EventEmitterContext } from '../../core/EventEmitterContext';
 import { MessageType } from '../../hub/CommandMessage';
 import { useTis } from './TisProvider';
@@ -75,6 +77,11 @@ export const ResultHistoryTable: React.FC<ResultHistoryTableProps> = (props) =>
     const [downloading, setDownloading] = useState<InFlight | null>(null);
     const [projectBusy, setProjectBusy] = useState<ProjectDownloadKind | null>(null);
     const [excludingRunId, setExcludingRunId] = useState<string | null>(null);
+    // Per-row lifecycle menu (complete / abandon / reopen). One Menu instance is
+    // reused; `menuRow` is the row it was opened for.
+    const rowMenuRef = useRef<Menu>(null);
+    const [menuRow, setMenuRow] = useState<any>(null);
+    const [lifecycleBusy, setLifecycleBusy] = useState<string | null>(null);
     const { invoke } = useContext(EventEmitterContext);
 
     const loadTests = async () => {
@@ -176,6 +183,112 @@ export const ResultHistoryTable: React.FC<ResultHistoryTableProps> = (props) =>
     // kept on disk (not deleted) but dropped from avg/min/max/stddev/count
     // results for their sample group. The server recomputes + rebroadcasts
     // the sample summary on success.
+    /**
+     * Run-lifecycle action on one row: complete, abandon, or reopen.
+     *
+     * All three are RECORD operations — they change what the stored run says
+     * about itself, never what the machine is doing. Reopening makes a run the
+     * active one so the control program's next cycle appends to it; it does not
+     * command motion, and the machine still decides when to run. That
+     * distinction is why this is safe to expose in a browser: a click here can
+     * retarget where data lands, but cannot start a machine.
+     *
+     * `tis.finish_test` / `reset_test` / `resume_test` all take an explicit
+     * `run_id`, so the row's own run is addressed rather than "whatever is
+     * newest".
+     */
+    const handleLifecycle = async (
+        rowData: any,
+        action: 'complete' | 'abandon' | 'reopen',
+    ) => {
+        const runId = rowData?.run_id;
+        const rowMethodId = rowData?.method_id ?? methodId;
+        if (!runId || !rowMethodId || !projectId) return;
+        const topic =
+            action === 'complete' ? 'tis.finish_test'
+            : action === 'abandon' ? 'tis.reset_test'
+            : 'tis.resume_test';
+        setLifecycleBusy(runId);
+        try {
+            const resp: any = await invoke(topic as any, MessageType.Request, {
+                project_id: projectId, method_id: rowMethodId, run_id: runId,
+            } as any);
+            if (!resp?.success) {
+                // The most common rejection is reopening while another test is
+                // already open for this project+method — the server refuses so
+                // two runs can't both be "active".
+                alert(`Could not ${action} ${runId}` +
+                      (resp?.error_message ? `:\n\n${resp.error_message}` : ''));
+                return;
+            }
+            await loadTests();
+        } catch (err) {
+            console.error(`Failed to ${action} test`, err);
+            alert(`${action} failed: ${err instanceof Error ? err.message : String(err)}`);
+        } finally {
+            setLifecycleBusy(null);
+        }
+    };
+
+    /**
+     * Menu items for a row, gated on its lifecycle state:
+     *  - open (in_progress / paused) → Complete, Abandon
+     *  - completed but not finalized → Reopen (add more cycles under the same
+     *    Test ID — the multi-specimen case where a set turned out to be bigger)
+     *  - finalized (abandoned)       → nothing; `finalized` exists precisely to
+     *    stop a deliberately-abandoned run being resurrected.
+     */
+    const rowMenuItems = (rowData: any) => {
+        const status = rowData?.status;
+        const finalized = rowData?.finalized === true;
+        const isOpen = status === 'in_progress' || status === 'paused';
+        const items: any[] = [];
+
+        if (isOpen) {
+            items.push({
+                label: 'Complete Test',
+                icon: 'pi pi-check-circle',
+                command: () => handleLifecycle(rowData, 'complete'),
+            });
+            items.push({
+                label: 'Abandon Test',
+                icon: 'pi pi-ban',
+                command: () => confirmDialog({
+                    header: 'Abandon Test',
+                    message:
+                        `Mark ${rowData?.sample_id || rowData?.run_id} as abandoned? ` +
+                        `Recorded data is kept, but the test can no longer be reopened.`,
+                    icon: 'pi pi-exclamation-triangle',
+                    acceptClassName: 'p-button-danger',
+                    acceptLabel: 'Abandon',
+                    accept: () => handleLifecycle(rowData, 'abandon'),
+                }),
+            });
+        } else if (status === 'completed' && !finalized) {
+            items.push({
+                label: 'Reopen Test',
+                icon: 'pi pi-replay',
+                command: () => confirmDialog({
+                    header: 'Reopen Test',
+                    message:
+                        `Reopen ${rowData?.sample_id || rowData?.run_id} so new cycles are added to ` +
+                        `it? Cycle numbering continues from where it stopped. This changes where ` +
+                        `data is recorded — it does not start the machine.`,
+                    icon: 'pi pi-replay',
+                    acceptLabel: 'Reopen',
+                    accept: () => handleLifecycle(rowData, 'reopen'),
+                }),
+            });
+        } else {
+            items.push({
+                label: finalized ? 'Abandoned — cannot reopen' : 'No actions available',
+                icon: 'pi pi-info-circle',
+                disabled: true,
+            });
+        }
+        return items;
+    };
+
     const handleToggleExclude = async (rowData: any) => {
         const runId = rowData?.run_id;
         const rowMethodId = rowData?.method_id ?? methodId;
@@ -440,7 +553,34 @@ export const ResultHistoryTable: React.FC<ResultHistoryTableProps> = (props) =>
                         );
                     }}
                 />
+                {/* Thin per-row lifecycle menu. Kept narrow and iconic so it
+                    doesn't compete with the download actions. */}
+                <Column
+                    header=""
+                    style={{ width: '3rem' }}
+                    body={(rowData) => (
+                        <Button
+                            icon={
+                                lifecycleBusy === rowData.run_id
+                                    ? 'pi pi-spin pi-spinner'
+                                    : 'pi pi-ellipsis-v'
+                            }
+                            text
+                            rounded
+                            size="small"
+                            disabled={lifecycleBusy !== null}
+                            aria-label="Test actions"
+                            tooltip="Complete / abandon / reopen this test"
+                            tooltipOptions={{ position: 'left' }}
+                            onClick={(e) => {
+                                setMenuRow(rowData);
+                                rowMenuRef.current?.toggle(e);
+                            }}
+                        />
+                    )}
+                />
             </DataTable>
+            <Menu model={menuRow ? rowMenuItems(menuRow) : []} popup ref={rowMenuRef} />
         </div>
     );
 };

package/src/components/tis/ScienceTable.tsx

@@ -16,6 +16,7 @@
 import React from 'react';
 import { DataTable } from 'primereact/datatable';
 import { Column } from 'primereact/column';
+import { InputText } from 'primereact/inputtext';
 import type { ColumnBodyOptions } from 'primereact/column';
 import './ScienceTable.css';
 
@@ -32,6 +33,14 @@ export interface ScienceColumn {
     body?: (row: any) => React.ReactNode;
     /** Optional per-column style (e.g. minWidth). */
     style?: React.CSSProperties;
+    /**
+     * Operator-editable cell. Requires the table's `onCellEdit`. Intended for
+     * ANNOTATION columns only (a specimen or lot identifier noted against an
+     * automatically-captured row) — never for measured values, which the server
+     * refuses to rewrite anyway (`tis.update_cycle` only accepts cycle_fields
+     * declared `editable: true`).
+     */
+    editable?: boolean;
 }
 
 export interface ScienceTableProps {
@@ -49,6 +58,13 @@ export interface ScienceTableProps {
     scrollHeight?: string;
     /** Virtual-scroll row height in px. Default 38. */
     virtualItemSize?: number;
+    /**
+     * Commit handler for cells in columns marked `editable`. Called with the
+     * edited row, the column field and the new value. Without it, `editable`
+     * columns stay read-only — there is no local-only edit mode, because a value
+     * that looks saved but isn't is worse than one that can't be typed.
+     */
+    onCellEdit?: (row: any, field: string, value: any) => void | Promise<void>;
 }
 
 const HeaderCell: React.FC<{ column: ScienceColumn }> = ({ column }) => (
@@ -68,8 +84,12 @@ export const ScienceTable: React.FC<ScienceTableProps> = ({
     scrollable = false,
     scrollHeight,
     virtualItemSize = 38,
+    onCellEdit,
 }) => {
     const virtual = scrollable && !!scrollHeight;
+    // Cell edit mode is switched on only when a column asks for it AND a commit
+    // handler exists, so a plain report table keeps DataTable's read-only path.
+    const anyEditable = !!onCellEdit && columns.some((c) => c.editable);
     return (
         <div className="ac-science-table-wrap">
             {title != null && <div className="ac-science-table-title">{title}</div>}
@@ -81,6 +101,7 @@ export const ScienceTable: React.FC<ScienceTableProps> = ({
                     scrollHeight={scrollHeight}
                     virtualScrollerOptions={virtual ? { itemSize: virtualItemSize } : undefined}
                     emptyMessage={emptyMessage}
+                    editMode={anyEditable ? 'cell' : undefined}
                 >
                     {showIndex ? (
                         <Column
@@ -93,18 +114,56 @@ export const ScienceTable: React.FC<ScienceTableProps> = ({
                             body={(_data: any, options: ColumnBodyOptions) => options.rowIndex + 1}
                         />
                     ) : null}
-                    {columns.map((c) => (
-                        <Column
-                            key={c.field}
-                            field={c.field}
-                            header={<HeaderCell column={c} />}
-                            align={c.align ?? 'center'}
-                            alignHeader="center"
-                            style={c.style}
-                            bodyClassName="ac-sci-cell"
-                            body={c.body ? (row: any) => c.body!(row) : undefined}
-                        />
-                    ))}
+                    {columns.map((c) => {
+                        const cellEditable = !!onCellEdit && !!c.editable;
+                        return (
+                            <Column
+                                key={c.field}
+                                field={c.field}
+                                header={<HeaderCell column={c} />}
+                                align={c.align ?? 'center'}
+                                alignHeader="center"
+                                style={c.style}
+                                bodyClassName={
+                                    cellEditable ? 'ac-sci-cell ac-sci-cell-editable' : 'ac-sci-cell'
+                                }
+                                body={c.body ? (row: any) => c.body!(row) : undefined}
+                                editor={
+                                    cellEditable
+                                        ? (options: any) => (
+                                            <InputText
+                                                value={options.value ?? ''}
+                                                autoFocus
+                                                style={{ width: '100%' }}
+                                                onChange={(e) => options.editorCallback?.(e.target.value)}
+                                                onKeyDown={(e) => e.stopPropagation()}
+                                            />
+                                        )
+                                        : undefined
+                                }
+                                onCellEditComplete={
+                                    cellEditable
+                                        ? (e: any) => {
+                                            // Numeric annotation columns come back
+                                            // as a string from the text editor;
+                                            // coerce so the stored type matches the
+                                            // schema instead of silently turning a
+                                            // number column into strings.
+                                            const prev = e.rowData?.[c.field];
+                                            let next: any = e.newValue;
+                                            if (typeof prev === 'number' && next !== '' && next != null) {
+                                                const n = Number(next);
+                                                if (!Number.isNaN(n)) next = n;
+                                            }
+                                            if (next !== prev) {
+                                                void onCellEdit!(e.rowData, c.field, next);
+                                            }
+                                        }
+                                        : undefined
+                                }
+                            />
+                        );
+                    })}
                 </DataTable>
             </div>
         </div>