@adcops/autocore-react 3.3.75 → 3.3.79

package/src/components/tis/ProjectManager.tsx

@@ -0,0 +1,393 @@
+/*
+ * Copyright (C) 2026 Automated Design Corp. All Rights Reserved.
+ *
+ * <ProjectManager> — administrative panel for the active project.
+ *
+ *   - Lists every test (run) in the project with a per-row Delete button.
+ *   - One-shot "Delete Project" button that wipes the whole project tree
+ *     (with a confirmation prompt — this is destructive and can't be undone).
+ *   - "Download Archive" button that streams a ZIP of the project tree.
+ *   - "Server Disk Space" panel showing free / total bytes for the
+ *     filesystem hosting the TIS data directory.
+ *
+ * Mounts under the operator-facing Project tab, alongside <ProjectSelector>.
+ * Reads `selection.projectId` from <TisProvider> so it follows whatever
+ * project the operator has picked.
+ * 
+ * Requires that a <ConfirmDialog> instance be registered in web app somewhere.
+ */
+
+import React, { useCallback, useContext, useEffect, useState } from 'react';
+import { Button } from 'primereact/button';
+import { DataTable } from 'primereact/datatable';
+import { Column } from 'primereact/column';
+import { confirmDialog } from 'primereact/confirmdialog';
+import { ProgressBar } from 'primereact/progressbar';
+import { EventEmitterContext } from '../../core/EventEmitterContext';
+import { MessageType } from '../../hub/CommandMessage';
+import { useTis } from './TisProvider';
+
+export interface ProjectManagerProps {
+    /** Override the project scope. Defaults to `useTis().selection.projectId`. */
+    projectId?: string;
+}
+
+interface DiskUsage {
+    base_directory: string;
+    total_bytes: number;
+    free_bytes: number;
+    available_bytes: number;
+    used_bytes: number;
+}
+
+const formatBytes = (n: number): string => {
+    if (!Number.isFinite(n) || n <= 0) return '0 B';
+    const units = ['B', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB'];
+    let i = 0;
+    let v = n;
+    while (v >= 1024 && i < units.length - 1) { v /= 1024; i++; }
+    return `${v.toFixed(v >= 100 ? 0 : v >= 10 ? 1 : 2)} ${units[i]}`;
+};
+
+const formatDate = (s: string): string => {
+    if (!s) return '';
+    const d = new Date(s);
+    return Number.isNaN(d.getTime()) ? s : d.toLocaleString();
+};
+
+export const ProjectManager: React.FC<ProjectManagerProps> = (props) => {
+    const tis = useTis();
+    const projectId = props.projectId ?? tis.selection.projectId;
+    const { invoke } = useContext(EventEmitterContext);
+
+    const [tests, setTests] = useState<any[]>([]);
+    const [loading, setLoading] = useState(false);
+    const [deletingRunId, setDeletingRunId] = useState<string | null>(null);
+    const [deletingProject, setDeletingProject] = useState(false);
+    const [archiving, setArchiving] = useState(false);
+    const [disk, setDisk] = useState<DiskUsage | null>(null);
+    const [diskError, setDiskError] = useState<string>('');
+
+    const loadTests = useCallback(async () => {
+        if (!projectId) { setTests([]); return; }
+        setLoading(true);
+        try {
+            const resp: any = await invoke('tis.list_tests' as any, MessageType.Request, {
+                project_id: projectId,
+            } as any);
+            if (resp?.success && resp.data?.tests) {
+                setTests(resp.data.tests as any[]);
+            } else {
+                setTests([]);
+            }
+        } catch (e) {
+            console.error('[ProjectManager] tis.list_tests failed:', e);
+            setTests([]);
+        } finally {
+            setLoading(false);
+        }
+    }, [projectId, invoke]);
+
+    const loadDisk = useCallback(async () => {
+        try {
+            const resp: any = await invoke('tis.disk_usage' as any, MessageType.Request, {} as any);
+            if (resp?.success && resp.data) {
+                setDisk(resp.data as DiskUsage);
+                setDiskError('');
+            } else {
+                setDisk(null);
+                setDiskError(resp?.error_message ?? 'disk_usage failed');
+            }
+        } catch (e) {
+            setDisk(null);
+            setDiskError(e instanceof Error ? e.message : String(e));
+        }
+    }, [invoke]);
+
+    useEffect(() => { void loadTests(); }, [loadTests, tis.state.activeRunId]);
+    useEffect(() => { void loadDisk();  }, [loadDisk]);
+
+    const performDeleteTest = async (rowData: any) => {
+        const runId = rowData?.run_id;
+        const methodId = rowData?.method_id;
+        if (!projectId || !methodId || !runId) return;
+        setDeletingRunId(runId);
+        try {
+            const resp: any = await invoke('tis.delete_test' as any, MessageType.Request, {
+                project_id: projectId, method_id: methodId, run_id: runId,
+            } as any);
+            if (!resp?.success) {
+                alert(`Failed to delete test ${runId}` +
+                    (resp?.error_message ? `: ${resp.error_message}` : ''));
+                return;
+            }
+            await loadTests();
+            // Pinned selection may now point at a vanished run; clear it so
+            // sibling views fall back to the active scalars instead of
+            // staying parked on a deleted record.
+            if (tis.selection.runId === runId) {
+                tis.setSelection({ runId: null });
+            }
+        } catch (e) {
+            alert(`Delete failed: ${e instanceof Error ? e.message : String(e)}`);
+        } finally {
+            setDeletingRunId(null);
+        }
+    };
+
+    const confirmDeleteTest = (rowData: any) => {
+        const runId = rowData?.run_id ?? '';
+        const sampleId = rowData?.sample_id ?? '';
+        confirmDialog({
+            header: 'Delete test',
+            icon: 'pi pi-exclamation-triangle',
+            acceptLabel: 'Delete',
+            rejectLabel: 'Cancel',
+            acceptClassName: 'p-button-danger',
+            message: (
+                <div>
+                    <p style={{ marginTop: 0 }}>
+                        Permanently delete run <code>{runId}</code>
+                        {sampleId ? <> (sample <code>{sampleId}</code>)</> : null}?
+                    </p>
+                    <p style={{ marginBottom: 0, fontSize: '0.875rem', color: '#9ca3af' }}>
+                        Removes <code>test.json</code>, cycles, raw and filtered
+                        data for this run. This action cannot be undone.
+                    </p>
+                </div>
+            ),
+            accept: () => { void performDeleteTest(rowData); },
+        });
+    };
+
+    const performDeleteProject = async () => {
+        if (!projectId) return;
+        setDeletingProject(true);
+        try {
+            const resp: any = await invoke('tis.delete_project' as any, MessageType.Request, {
+                project_id: projectId,
+            } as any);
+            if (!resp?.success) {
+                alert(`Failed to delete project ${projectId}` +
+                    (resp?.error_message ? `: ${resp.error_message}` : ''));
+                return;
+            }
+            // Clear pins so nothing keeps trying to read this project's data.
+            tis.setSelection({ projectId: null, methodId: null, sampleId: null, runId: null });
+            await tis.refreshProjects();
+            await loadDisk();
+            setTests([]);
+        } catch (e) {
+            alert(`Delete failed: ${e instanceof Error ? e.message : String(e)}`);
+        } finally {
+            setDeletingProject(false);
+        }
+    };
+
+    const confirmDeleteProject = () => {
+        if (!projectId) return;
+        const n = tests.length;
+        confirmDialog({
+            header: 'Delete project',
+            icon: 'pi pi-exclamation-triangle',
+            acceptLabel: 'Delete Project',
+            rejectLabel: 'Cancel',
+            acceptClassName: 'p-button-danger',
+            message: (
+                <div>
+                    <p style={{ marginTop: 0 }}>
+                        Permanently delete project <code>{projectId}</code> and
+                        all <strong>{n}</strong> test{n === 1 ? '' : 's'} inside it?
+                    </p>
+                    <p style={{ marginBottom: 0, fontSize: '0.875rem', color: '#9ca3af' }}>
+                        This removes every method, run, cycle, and raw/filtered
+                        blob under the project. Consider downloading the
+                        archive first. This action cannot be undone.
+                    </p>
+                </div>
+            ),
+            accept: () => { void performDeleteProject(); },
+        });
+    };
+
+    const downloadArchive = async () => {
+        if (!projectId) return;
+        setArchiving(true);
+        try {
+            const resp: any = await invoke('tis.export_project_zip' as any, MessageType.Request, {
+                project_id: projectId,
+            } as any);
+            if (!resp?.success) {
+                alert(`Failed to build project archive` +
+                    (resp?.error_message ? `: ${resp.error_message}` : ''));
+                return;
+            }
+            const url = typeof resp.data?.download_url === 'string' ? resp.data.download_url : '';
+            if (!url) {
+                alert('Server did not return a download URL for the archive.');
+                return;
+            }
+            const a = document.createElement('a');
+            a.href = url;
+            a.download = typeof resp.data?.filename === 'string'
+                ? resp.data.filename
+                : `${projectId}_project_archive.zip`;
+            document.body.appendChild(a);
+            a.click();
+            a.remove();
+        } catch (e) {
+            alert(`Download failed: ${e instanceof Error ? e.message : String(e)}`);
+        } finally {
+            setArchiving(false);
+        }
+    };
+
+    const sampleIdOf = (row: any): string => {
+        const top = typeof row?.sample_id === 'string' ? row.sample_id : '';
+        if (top) return top;
+        const cfg = row?.config;
+        if (cfg && typeof cfg === 'object' && typeof cfg.sample_id === 'string') {
+            return cfg.sample_id;
+        }
+        return '';
+    };
+
+    const diskPercent = disk && disk.total_bytes > 0
+        ? Math.min(100, Math.round((disk.used_bytes / disk.total_bytes) * 100))
+        : 0;
+
+    return (
+        <div style={{ width: '100%', maxWidth: '100%', boxSizing: 'border-box' }}>
+
+            <div style={{
+                display: 'flex',
+                justifyContent: 'space-between',
+                alignItems: 'center',
+                marginBottom: '1rem',
+                gap: '0.5rem',
+                flexWrap: 'wrap',
+            }}>
+                <h3 style={{ margin: 0 }}>
+                    {projectId
+                        ? `Project Manager: ${projectId}`
+                        : 'Project Manager (no project selected)'}
+                </h3>
+                <div style={{ display: 'flex', gap: '0.4rem', alignItems: 'center', flexWrap: 'wrap' }}>
+                    <Button
+                        icon={archiving ? 'pi pi-spin pi-spinner' : 'pi pi-box'}
+                        label="Download Archive"
+                        size="small"
+                        outlined
+                        disabled={!projectId || archiving || deletingProject}
+                        onClick={downloadArchive}
+                        tooltip="Download a ZIP of the entire project directory"
+                        tooltipOptions={{ position: 'bottom' }}
+                    />
+                    <Button
+                        icon={deletingProject ? 'pi pi-spin pi-spinner' : 'pi pi-trash'}
+                        label="Delete Project"
+                        size="small"
+                        severity="danger"
+                        disabled={!projectId || deletingProject || archiving}
+                        onClick={confirmDeleteProject}
+                        tooltip="Permanently delete the project and every test inside it"
+                        tooltipOptions={{ position: 'bottom' }}
+                    />
+                    <Button
+                        icon="pi pi-refresh"
+                        label="Refresh"
+                        size="small"
+                        onClick={() => { void loadTests(); void loadDisk(); }}
+                        disabled={loading}
+                    />
+                </div>
+            </div>
+
+            {/* Server disk usage panel — visible regardless of project selection
+                so the operator can spot a near-full disk before staging a run. */}
+            <div style={{
+                marginBottom: '1rem',
+                padding: '0.75rem 1rem',
+                border: '1px solid #2a2a2a',
+                borderRadius: 4,
+                background: '#161616',
+            }}>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'baseline', flexWrap: 'wrap', gap: '0.5rem' }}>
+                    <strong>Server Disk Space</strong>
+                    {disk ? (
+                        <span style={{ fontSize: '0.875rem', color: '#9ca3af' }}>
+                            {formatBytes(disk.available_bytes)} free of {formatBytes(disk.total_bytes)}
+                            {' '}({100 - diskPercent}% available)
+                        </span>
+                    ) : diskError ? (
+                        <span style={{ fontSize: '0.875rem', color: '#f87171' }}>
+                            {diskError}
+                        </span>
+                    ) : (
+                        <span style={{ fontSize: '0.875rem', color: '#9ca3af' }}>Loading…</span>
+                    )}
+                </div>
+                {disk && (
+                    <>
+                        <ProgressBar
+                            value={diskPercent}
+                            showValue={false}
+                            style={{ height: '0.5rem', marginTop: '0.5rem' }}
+                            color={diskPercent >= 90 ? '#dc2626' : diskPercent >= 75 ? '#f59e0b' : undefined}
+                        />
+                        <div style={{ fontSize: '0.75rem', color: '#6b7280', marginTop: '0.4rem' }}>
+                            <code>{disk.base_directory}</code>
+                        </div>
+                    </>
+                )}
+            </div>
+
+            <DataTable
+                value={tests}
+                loading={loading}
+                paginator
+                rows={10}
+                emptyMessage={projectId ? 'No tests in this project.' : 'Select a project to manage.'}
+                scrollable
+                scrollHeight="flex"
+                tableStyle={{ minWidth: 0 }}
+                style={{ width: '100%' }}
+            >
+                <Column header="Sample ID" body={sampleIdOf}
+                    sortable
+                    sortFunction={(e) => {
+                        const copy = [...e.data];
+                        copy.sort((a, b) => sampleIdOf(a).localeCompare(sampleIdOf(b)) * (e.order ?? 1));
+                        return copy;
+                    }}
+                    style={{ minWidth: '8rem' }} />
+                <Column field="start_time" header="Date/Time" sortable
+                    body={(r) => formatDate(r.start_time)}
+                    style={{ minWidth: '12rem' }} />
+                <Column field="method_id" header="Test Method" sortable style={{ minWidth: '10rem' }} />
+                <Column field="run_id"    header="Run ID"      sortable style={{ minWidth: '12rem' }} />
+                <Column
+                    header="Action"
+                    style={{ width: '8rem' }}
+                    body={(rowData) => {
+                        const isBusy = deletingRunId === rowData.run_id;
+                        const anyBusy = deletingRunId !== null;
+                        return (
+                            <Button
+                                icon={isBusy ? 'pi pi-spin pi-spinner' : 'pi pi-trash'}
+                                label="Delete"
+                                size="small"
+                                severity="danger"
+                                outlined
+                                disabled={anyBusy || deletingProject}
+                                onClick={() => confirmDeleteTest(rowData)}
+                                tooltip="Permanently delete this test"
+                                tooltipOptions={{ position: 'left' }}
+                            />
+                        );
+                    }}
+                />
+            </DataTable>
+        </div>
+    );
+};