57 lines
1.9 KiB
JavaScript
57 lines
1.9 KiB
JavaScript
import React from 'react';
|
|
import ScreenerCanvas from './ScreenerCanvas';
|
|
import ResultTable from '../ResultTable';
|
|
import TelegramPreview from '../TelegramPreview';
|
|
import RunHistoryList from '../RunHistoryList';
|
|
|
|
export default function CanvasLayout({
|
|
meta, settings, setLocal, save, dirty,
|
|
result, running, previewHistory, runPreview, runSave, selectPreview,
|
|
runs, runs_loading, selectRun, selectedRun,
|
|
compareId, setCompareId,
|
|
}) {
|
|
const compareItem = previewHistory.find((p) => p.id === compareId);
|
|
const compareResult = compareItem?.result ?? null;
|
|
const activeResult = selectedRun || result;
|
|
|
|
return (
|
|
<div className="screener-canvas-layout">
|
|
<section className="screener-canvas-area">
|
|
<ScreenerCanvas
|
|
meta={meta}
|
|
settings={settings}
|
|
setLocal={setLocal}
|
|
result={activeResult}
|
|
running={running}
|
|
dirty={dirty}
|
|
onRunPreview={() => runPreview(settings)}
|
|
onRunSave={() => runSave(settings)}
|
|
onPersistSettings={save}
|
|
/>
|
|
</section>
|
|
<section className="screener-canvas-results">
|
|
<div className="screener-canvas-results-main">
|
|
<ResultTable
|
|
result={activeResult}
|
|
compareWith={compareResult}
|
|
compareLabel={compareItem ? new Date(compareItem.timestamp).toLocaleTimeString() : null}
|
|
/>
|
|
<TelegramPreview payload={activeResult?.telegram_payload} />
|
|
</div>
|
|
<aside className="screener-canvas-results-side">
|
|
<RunHistoryList
|
|
runs={runs}
|
|
loading={runs_loading}
|
|
onSelect={selectRun}
|
|
selectedId={selectedRun?.meta?.id}
|
|
previewHistory={previewHistory}
|
|
onSelectPreview={selectPreview}
|
|
onSetCompare={setCompareId}
|
|
compareId={compareId}
|
|
/>
|
|
</aside>
|
|
</section>
|
|
</div>
|
|
);
|
|
}
|