{error}
}
+ {labels.map((_, i) => {data?.page === i + 1 && page === i + 1 &&
)}
+ {FEATURES_ENABLED &&
- Skip to main content
-
- } ;
+}
+
+
+function Slider({ node, change }) {
+ const dates = typeof node.min === 'string';
+ const numeric = value => dates ? Date.parse(value) / 86400000 : Number(value);
+ const output = value => dates ? new Date(value * 86400000).toISOString().slice(0, 10) : value;
+ const range = Array.isArray(node.value);
+ const [value, setValue] = useState(node.value);
+ useEffect(() => setValue(node.value), [node.value]);
+ const min = numeric(node.min), max = numeric(node.max);
+ const lower = range ? numeric(value[0]) : min, upper = range ? numeric(value[1]) : numeric(value);
+ function update(next, index) {
+ const result = range ? [...value] : output(next);
+ if (range) result[index] = output(index === 0 ? Math.min(next, upper) : Math.max(next, lower));
+ setValue(result);
+ }
+ function finish() {change(node.key, value);}
+ return ;
+}
+
+function ViewTabs({ node, values, change, action }) {
+ const strip=useRef(null);
+ const key = `_tabs:${node.labels[0]}`;
+ const active = Number(values[key] || 0);
+ const id = useId();
+ return
+
+ {heading.text}
+ ;
+}
+
+export function ViewNodes({ nodes = [], values = {}, change = (_key, _value) => {}, action = (_key) => {}, tireContext = null }) {
+ const context = tireContext || tireContextFrom(nodes);
+ const paired = new Set(nodes.map((_, index) => isTireChartPair(nodes, index) ? index : -1).filter(index => index >= 0));
+ return nodes.map((node, index) => {
+ if (paired.has(index - 1) || paired.has(index - 2)) return null;
+ const key = `${index}-${node.type}-${node.label || ''}`;
+ if (paired.has(index)) return ;
+ const children = () => ;
+ switch (node.type) {
+ case 'heading': {const Heading = /** @type {keyof import('react').JSX.IntrinsicElements} */ (`h${node.level}`); return {node.text} ;}
+ case 'markdown': return {node.text} ;
+ case 'caption': return {node.text} ;
+ case 'html': return ;
+ case 'text': case 'code': return
; + case 'image': return
;
+ case 'table': return {children()} ;
+ case 'checkbox': return ;
+ case 'select': return ;
+ case 'multiselect': return );
+ const input=screen.getByRole('spinbutton');
+ expect(input).toHaveValue(.25);
+ fireEvent.change(input,{target:{value:'2'}});fireEvent.keyDown(input,{key:'Enter'});
+ expect(change).toHaveBeenCalledWith('p',1);
+ expect(screen.getByRole('button',{name:'Increase Probability'})).toBeDisabled();
+ fireEvent.click(screen.getByRole('button',{name:'Decrease Probability'}));
+ expect(change).toHaveBeenLastCalledWith('p',.95);
+ });
+ it('uses the canonical option after a dependent selection changes',()=>{
+ const change=vi.fn();
+ render();
+ expect(screen.getByRole('combobox')).toHaveValue('"Monza"');
+ fireEvent.change(screen.getByRole('combobox'),{target:{value:'"Spa"'}});
+ expect(change).toHaveBeenCalledWith('race','Spa');
+ });
+ it('commits date ranges without converting them to local calendar dates',()=>{
+ const change=vi.fn();
+ render();
+ const slider=screen.getByRole('slider',{name:'Race Date minimum'});
+ fireEvent.change(slider,{target:{value:String(Date.parse('2021-02-03')/86400000)}});fireEvent.keyUp(slider,{key:'ArrowRight'});
+ expect(change).toHaveBeenCalledWith('date',['2021-02-03','2026-01-01']);
+ });
+ it('supports multiselect search, removal and clearing',()=>{
+ const change=vi.fn();
+ render();
+ fireEvent.focus(screen.getByRole('combobox'));fireEvent.change(screen.getByRole('combobox'),{target:{value:'3'}});fireEvent.keyDown(screen.getByRole('combobox'),{key:'Enter'});
+ expect(change).toHaveBeenCalledWith('q',[2,3]);
+ fireEvent.click(screen.getByRole('button',{name:'Remove 2'}));expect(change).toHaveBeenCalledWith('q',[]);
+ fireEvent.click(screen.getByRole('button',{name:'Clear Bins'}));expect(change).toHaveBeenLastCalledWith('q',[]);
+ });
+ it('uploads the CSV name and contents and supports removing it',async()=>{
+ const change=vi.fn();
+ render();
+ const file=new File(['a,b\n1,2\n'],'field.csv',{type:'text/csv'});
+ file.text=async()=> 'a,b\n1,2\n';
+ fireEvent.change(screen.getByLabelText('Field CSV'),{target:{files:[file]}});
+ await waitFor(()=>expect(change).toHaveBeenCalledWith('csv',{name:'field.csv',content:'a,b\n1,2\n'}));
+ fireEvent.click(screen.getByRole('button',{name:'Remove old.csv'}));expect(change).toHaveBeenLastCalledWith('csv',null);
+ });
+ it('keeps disabled actions disabled and preserves download bytes',()=>{
+ const action=vi.fn();
+ render();
+ fireEvent.click(screen.getByRole('button',{name:'Run'}));expect(action).not.toHaveBeenCalled();
+ expect(screen.getByRole('link',{name:'Export'})).toHaveAttribute('href','data:text/csv;base64,YWJj');
+ });
+});
diff --git a/fastapi_react/frontend/src/components/TabScroll.jsx b/fastapi_react/frontend/src/components/TabScroll.jsx
new file mode 100644
index 00000000..5ef57c20
--- /dev/null
+++ b/fastapi_react/frontend/src/components/TabScroll.jsx
@@ -0,0 +1,11 @@
+import {useEffect,useState} from 'react';
+export function TabScroll({target}) {
+ const [edges,setEdges]=useState({left:false,right:false});
+ useEffect(()=>{
+ const el=target.current;if(!el)return;
+ const update=()=>setEdges({left:el.scrollLeft>1,right:el.scrollLeft+el.clientWidth{resize.disconnect();el.removeEventListener('scroll',update);};
+ },[target]);
+ return <>{edges.left && }{edges.right && };
+}
diff --git a/fastapi_react/frontend/src/components/ViewTable.jsx b/fastapi_react/frontend/src/components/ViewTable.jsx
new file mode 100644
index 00000000..7efa3ad1
--- /dev/null
+++ b/fastapi_react/frontend/src/components/ViewTable.jsx
@@ -0,0 +1,100 @@
+import {useCallback, useEffect, useMemo, useRef, useState} from 'react';
+import DataEditor, {GridCellKind} from '@glideapps/glide-data-grid';
+import '@glideapps/glide-data-grid/dist/index.css';
+import {displayCell} from './Presentation';
+import {useTheme} from './useTheme';
+
+const empty=[];
+const quote=value=>{const text=value==null?'':String(value);return /[,"\r\n]/.test(text)?`"${text.replaceAll('"','""')}"`:text;};
+function csvValue(value,column){
+ if(value==null)return '';
+ if(column.kind==='CheckboxColumn')return Boolean(value);
+ if(column.kind==='DateColumn')return String(value).slice(0,10);
+ if(column.kind==='TimeColumn'){
+ const parts=String(value).split(':');
+ return `${parts[0].padStart(2,'0')}:${(parts[1] || '00').padStart(2,'0')}:${Number(parts[2] || 0).toFixed(3).padStart(6,'0')}`;
+ }
+ if(column.format==='%d' && typeof value==='number')return Math.trunc(value);
+ return value;
+}
+
+/** The same canvas grid used by the reference, including keyboard selection,
+ * copying ranges, search, scrolling, overlays and column resizing. */
+export function ViewTable({node}) {
+ const rows=node.rows || empty;
+ const columns=node.columns || empty;
+ const [sort,setSort]=useState(null);
+ const [widths,setWidths]=useState(/** @type {Record} */ ({}));
+ const [hidden,setHidden]=useState([]);
+ const [showColumns,setShowColumns]=useState(false);
+ const [showSearch,setShowSearch]=useState(false);
+ const [menu,setMenu]=useState(null);
+ const [pinned,setPinned]=useState([]);
+ const [formats,setFormats]=useState(/** @type {Record} */ ({}));
+ const outer=useRef(null);
+ useEffect(()=>{
+ if(!menu && !showColumns)return;
+ const close=event=>{if(event.type==='keydown' && event.key==='Escape' || event.type==='pointerdown' && !outer.current?.contains(event.target)){setMenu(null);setShowColumns(false);}};
+ document.addEventListener('pointerdown',close);document.addEventListener('keydown',close);
+ return()=>{document.removeEventListener('pointerdown',close);document.removeEventListener('keydown',close);};
+ },[menu,showColumns]);
+ const indices=useMemo(()=>{
+ const result=rows.map((_,i)=>i);
+ if(sort)result.sort((a,b)=>{
+ const x=rows[a][sort.column],y=rows[b][sort.column];
+ if(x==null || y==null)return x==null?(y==null?0:1):-1;
+ const cmp=typeof x==='number' && typeof y==='number'?x-y:String(x).localeCompare(String(y));
+ return sort.desc?-cmp:cmp;
+ });
+ return result;
+ },[rows,sort]);
+ const visible=useMemo(()=>columns.map((column,index)=>({column,index})).filter(c=>!hidden.includes(c.index)).sort((a,b)=>Number(pinned.includes(b.index))-Number(pinned.includes(a.index))),[columns,hidden,pinned]);
+ const gridColumns=useMemo(()=>{
+ const result=visible.map(({column,index})=>({id:String(index),title:column.label+(sort?.column===index?(sort.desc?' ↓':' ↑'):''),hasMenu:true,width:widths[index] || (typeof column.width==='number'?column.width:undefined)}));
+ if(!node.hide_index)result.unshift({id:'index',title:node.index_name || '',width:widths.index});
+ return result;
+ },[visible,widths,sort,node.hide_index,node.index_name]);
+ const dark=useTheme()==='dark';
+ const bg=dark?'#0e1117':'#fff',text=dark?'#fafafa':'#31333f';
+ /** @type {(cell: import('@glideapps/glide-data-grid').Item) => import('@glideapps/glide-data-grid').GridCell} */
+ const getCell=useCallback(([col,row])=>{
+ const rowIndex=indices[row];
+ if(rowIndex==null)return {kind:GridCellKind.Text,data:'',displayData:'',allowOverlay:false};
+ if(!node.hide_index && col===0)return {kind:GridCellKind.Text,data:String(node.index?.[rowIndex]??rowIndex),displayData:String(node.index?.[rowIndex]??rowIndex),allowOverlay:true,readonly:true,themeOverride:{bgCell:dark?'#262730':'#f7f9fc',textDark:dark?'#bfc2ce':'#808495'}};
+ const selected=visible[col-(node.hide_index?0:1)];
+ if(!selected)return {kind:GridCellKind.Text,data:'',displayData:'',allowOverlay:false};
+ const {column,index}=selected;
+ const value=rows[rowIndex][index],style=node.styles?.[rowIndex]?.[index];
+ const themeOverride={bgCell:style?.['background-color'] || bg,textDark:style?.color || text};
+ if(column.kind==='CheckboxColumn')return {kind:GridCellKind.Boolean,data:value==null?null:Boolean(value),allowOverlay:false,readonly:true,maxSize:16,themeOverride};
+ const displayData=displayCell(value,formats[index]?{...column,format:formats[index]}:column,node.display?.[rowIndex]?.[index]);
+ if(typeof value==='number')return {kind:GridCellKind.Number,data:value,displayData,allowOverlay:true,readonly:true,contentAlign:'right',themeOverride};
+ return {kind:GridCellKind.Text,data:value==null?'':String(value),displayData,allowOverlay:true,readonly:true,style:value==null?'faded':'normal',themeOverride};
+ },[indices,visible,node,rows,dark,bg,text,formats]);
+ function download(){
+ const header=visible.map(c=>quote(c.column.key));
+ if(!node.hide_index)header.unshift(quote(node.index_name || ''));
+ const lines=indices.map(i=>{
+ const values=visible.map(c=>quote(csvValue(rows[i][c.index],formats[c.index]?{...c.column,format:formats[c.index]}:c.column)));
+ if(!node.hide_index)values.unshift(quote(node.index?.[i]??i));
+ return values.join(',');
+ });
+ const csv='\ufeff'+[header.join(','),...lines].join('\r\n')+'\r\n';
+ const url=URL.createObjectURL(new Blob([csv],{type:'text/csv;charset=utf-8'}));
+ const link=document.createElement('a');link.href=url;link.download=`${new Date().toISOString().slice(0,16).replace(':','-')}_export.csv`;link.click();URL.revokeObjectURL(url);
+ }
+ const height=node.height || Math.min(400,(rows.length+1)*35+3);
+ const menuColumn=menu?columns[menu.index]:null;
+ const numeric=menuColumn?.kind==='NumberColumn';
+ return ;
+ function toggleComparison() {
+ setCompare(!compare);
+ if (compare) onSelectionChange?.([]);
+ }
+ return
+ : }
+ {compare && comparison && ;
+}
+
+function AccessibleTable({node}) {
+ const columns = node.columns, rows = node.rows;
+ const [selected, setSelected] = useState(() => columns.slice(0,8).map((_,i) => i));
+ const [query, setQuery] = useState(''), [page, setPage] = useState(0);
+ const visible = selected.filter(i => columns[i]);
+ const matches = useMemo(() => rows.map((_,i) => i).filter(i =>
+ !query || rows[i].some(value => String(value ?? 'None').toLowerCase().includes(query.toLowerCase()))
+ ), [rows,query]);
+ const pageCount = Math.max(1, Math.ceil(matches.length/50)), current = Math.min(page,pageCount-1);
+ function toggle(index) {setSelected(old => old.includes(index) ? old.filter(i => i !== index) : [...old,index].sort((a,b) => a-b));}
+ return );
+ fireEvent.click(screen.getByRole('button',{name:'Accessible table'}));
+ expect(screen.getAllByRole('cell',{name:'2026'})).toHaveLength(50);
+ fireEvent.click(screen.getByRole('button',{name:'Next rows'}));
+ expect(screen.getAllByRole('cell',{name:'2026'})).toHaveLength(20);
+ fireEvent.click(screen.getByRole('button',{name:'Compare drivers'}));
+ fireEvent.click(screen.getByRole('checkbox',{name:'Driver A'}));
+ expect(screen.getByRole('cell',{name:'2.00'})).toBeInTheDocument();
+});
+
+it('keeps the original interactive grid available with table tools enabled by default',() => {
+ render();
+ expect(screen.getByText('Original interactive grid')).toBeInTheDocument();
+ expect(screen.getByRole('button',{name:'Accessible table'})).toBeInTheDocument();
+});
+
+it('compares actual race tire metrics and synchronizes the linked chart selection without a row-count column',() => {
+ const onSelectionChange=vi.fn();
+ const node={hide_index:true,columns:[
+ {key:'Driver',label:'Driver'}, {key:'Avg Deg (s/lap)',label:'Avg Deg (s/lap)',kind:'NumberColumn'},
+ {key:'Start Compound',label:'Start Compound'}, {key:'Stints',label:'Stints',kind:'NumberColumn'},
+ {key:'Avg Stint (laps)',label:'Avg Stint (laps)',kind:'NumberColumn'},
+ ],rows:[['George Russell',-4.223,'MEDIUM',2,26.5],['Kimi Antonelli',-4.178,'SOFT',3,18],['Esteban Ocon',null,'HARD',2,26]]};
+ render();
+ fireEvent.click(screen.getByRole('button',{name:'Compare drivers'}));
+ expect(screen.getByText(/Race tire strategy — Canadian Grand Prix 2025/)).toHaveTextContent('chart below uses the same selected drivers');
+ expect(screen.queryByRole('columnheader',{name:'Sample rows'})).not.toBeInTheDocument();
+ expect(screen.queryByRole('columnheader',{name:'Records included'})).not.toBeInTheDocument();
+ for(const name of ['George Russell','Kimi Antonelli','Esteban Ocon'])fireEvent.click(screen.getByRole('checkbox',{name}));
+ expect(onSelectionChange).toHaveBeenLastCalledWith(['George Russell','Kimi Antonelli','Esteban Ocon']);
+ expect(screen.getByRole('status')).toHaveTextContent('Comparing 3 selected drivers');
+ const russell=screen.getByRole('rowheader',{name:'George Russell'}).closest('tr');
+ expect(within(russell).getByRole('cell',{name:'-4.223'})).toBeInTheDocument();
+ expect(within(russell).getByRole('cell',{name:'MEDIUM'})).toBeInTheDocument();
+ expect(within(screen.getByRole('rowheader',{name:'Esteban Ocon'}).closest('tr')).getByRole('cell',{name:'No data'})).toBeInTheDocument();
+ fireEvent.click(screen.getByRole('button',{name:'Compare drivers'}));
+ expect(onSelectionChange).toHaveBeenLastCalledWith([]);
+});
+
+it('uses existing seasonal race counts and tire averages instead of counting summary rows',() => {
+ const node={columns:[{key:'Driver',label:'Driver'},{key:'Avg Deg (s/lap)',label:'Avg Deg (s/lap)'},{key:'Races',label:'Races'}],rows:[['A',-.456,9],['B',-.123,8]]};
+ render();
+ expect(screen.queryByRole('button',{name:'Compare drivers'})).not.toBeInTheDocument();
+ rerender();
+ expect(screen.queryByRole('button',{name:'Compare drivers'})).not.toBeInTheDocument();
+});
+
+it('renders the saved-view tools and records a named preset',async() => {
+ render();
+ fireEvent.change(screen.getByRole('textbox',{name:'View name'}),{target:{value:'History'}});
+ fireEvent.click(screen.getByRole('button',{name:'Save view'}));
+ await waitFor(() => expect(readPresets()[0].name).toBe('History'));
+ expect(await screen.findByRole('status')).toHaveTextContent('View saved');
+});
+
+it('restores and deletes saved views and reports invalid names',async() => {
+ savePreset('Season',3,{range_filter_grandPrixYear:[2020,2026],bankroll:9000});
+ const restore = vi.fn();
+ render();
+ fireEvent.click(screen.getByRole('button',{name:'Save view'}));
+ expect(await screen.findByRole('alert')).toHaveTextContent('Enter a name');
+ fireEvent.change(screen.getByRole('combobox',{name:'Saved views'}),{target:{value:'Season'}});
+ fireEvent.click(screen.getByRole('button',{name:'Load view'}));
+ await waitFor(() => expect(restore).toHaveBeenCalledWith({version:1,page:3,name:'Season',values:{range_filter_grandPrixYear:[2020,2026]}}));
+ fireEvent.click(screen.getByRole('button',{name:'Delete view'}));
+ await waitFor(() => expect(readPresets()).toHaveLength(0));
+ expect(screen.getByRole('button',{name:'Load view'})).toBeDisabled();
+});
+
+it('supports section search, arrow selection, Enter navigation and focus return',async() => {
+ const navigate = vi.fn();
+ render();
+ await waitFor(() => expect(screen.getByRole('button',{name:'Download analysis context'})).toBeEnabled());
+ const trigger = screen.getByRole('button',{name:'Find section (Ctrl/⌘ K)'});
+ trigger.focus();fireEvent.keyDown(window,{key:'k',ctrlKey:true});
+ const search = screen.getByRole('textbox',{name:'Search sections'});
+ expect(search).toHaveFocus();
+ fireEvent.keyDown(search,{key:'ArrowDown'});
+ fireEvent.keyDown(search,{key:'Enter'});
+ expect(navigate).toHaveBeenCalledWith(1);
+ expect(trigger).toHaveFocus();
+ fireEvent.click(trigger);
+ fireEvent.change(search,{target:{value:'predictive'}});
+ fireEvent.keyDown(search,{key:'Enter'});
+ expect(navigate).toHaveBeenLastCalledWith(4);
+ fireEvent.click(trigger);
+ fireEvent.change(search,{target:{value:'unfindable'}});
+ expect(within(screen.getByRole('dialog')).queryAllByRole('button').map(button => button.textContent)).toEqual(['Close']);
+ fireEvent.click(screen.getByRole('button',{name:'Close'}));
+ expect(trigger).toHaveFocus();
+});
+
+it('opens the global section shortcut outside a collapsed tools drawer and restores external focus',async() => {
+ const navigate=vi.fn();
+ const {container}=render(<>);
+ const download = screen.getByRole('button',{name:'Download analysis context'});
+ expect(download).toBeDisabled();
+ fireEvent.click(await screen.findByRole('button',{name:'Retry source details'}));
+ await waitFor(() => expect(download).toBeEnabled());
+ fireEvent.click(download);
+ await waitFor(() => expect(click).toHaveBeenCalled());
+ const json = await new Promise(resolve => {const reader=new FileReader();reader.onload=()=>resolve(JSON.parse(String(reader.result)));reader.readAsText(exported);});
+ expect(json).toMatchObject({schema:'f1-analysis-context-v1',page:'Current Season',values:{filter_driver:'José'},provenance:source});
+ expect(Number.isNaN(Date.parse(json.exported_at))).toBe(false);
+ } finally {URL.createObjectURL=originalCreate;URL.revokeObjectURL=originalRevoke;}
+});
+
+it('searches hidden fields, preserves styled values and keeps row pages within matching rows',() => {
+ const columns=Array.from({length:9},(_,index)=>({key:'field'+index,label:'Field '+index,kind:index===0?'NumberColumn':'TextColumn'}));
+ const rows=Array.from({length:51},(_,index)=>[index,...Array(7).fill('visible'),index===50?'needle':'other']);
+ const node={hide_index:true,columns,rows,display:rows.map(()=>['styled number'])};
+ render();
+ fireEvent.click(screen.getByRole('button',{name:'Accessible table'}));
+ fireEvent.click(screen.getByRole('button',{name:'Next rows'}));
+ fireEvent.change(screen.getByRole('textbox',{name:'Search all fields'}),{target:{value:'needle'}});
+ expect(screen.getAllByRole('cell',{name:'styled number'})).toHaveLength(1);
+ expect(screen.getByText('Page 1 of 1',{exact:false})).toBeInTheDocument();
+ const fields = screen.getByText('Choose fields (8 of 9)');fireEvent.click(fields);
+ fireEvent.click(screen.getByRole('checkbox',{name:'Field 8 (field8)'}));
+ expect(screen.getByRole('cell',{name:'needle'})).toBeInTheDocument();
+ fireEvent.change(screen.getByRole('textbox',{name:'Search all fields'}),{target:{value:'absent'}});
+ expect(screen.getByRole('status')).toHaveTextContent('No rows match');
+ expect(screen.getByRole('button',{name:'Next rows'})).toBeDisabled();
+});
+
+it('blocks context export during requests and when source provenance differs from displayed results',async() => {
+ const props = {page:1,values:{},options:{design:true,cache:true},setOptions:vi.fn(),restore:vi.fn(),navigate:vi.fn(),analysisRevision:'old-data'};
+ const {rerender}=render();
+ await waitFor(() => expect(download).toBeEnabled());
+});
+
+it('compares four drivers with known-row DNF rates and drops drivers absent from updated rows',() => {
+ const columns=[{key:'driverName',label:'Driver'},{key:'resultsFinalPositionNumber',label:'Finish'},{key:'DNF',label:'DNF'}];
+ const rows=[['A',2,true],['A',4,false],['A',null,'unknown'],['A',null,null],['B',1,'FALSE'],['C',3,false],['D',5,false],['E',6,false]];
+ const {rerender}=render();
+ fireEvent.click(screen.getByRole('button',{name:'Compare drivers'}));
+ for(const name of ['A','B','C','D'])fireEvent.click(screen.getByRole('checkbox',{name}));
+ expect(screen.getByRole('checkbox',{name:'E'})).toBeDisabled();
+ const row=screen.getByRole('rowheader',{name:'A'}).closest('tr');
+ expect(within(row).getByRole('cell',{name:'3.00'})).toBeInTheDocument();
+ expect(within(row).getByRole('cell',{name:'50.0%'})).toBeInTheDocument();
+ expect(within(row).getByRole('cell',{name:'4'})).toBeInTheDocument();
+ rerender(row[0]!=='A')}}/>);
+ expect(screen.getByRole('checkbox',{name:'E'})).toBeEnabled();
+ expect(screen.queryByRole('rowheader',{name:'A'})).not.toBeInTheDocument();
+});
+
+it('keeps existing results and announces a longer calculation without speaking every second',() => {
+ vi.useFakeTimers();
+ const {rerender}=render(
+ }
+ {message && ;
+}
+
+function CommandPalette({navigate}) {
+ const dialog = useRef(null), returnFocus = useRef(null), label = useId();
+ const [open, setOpen] = useState(false), [query, setQuery] = useState(''), [selected, setSelected] = useState(0);
+ const matches = routes.map((name,index) => ({name,index})).filter(item => item.name.toLowerCase().includes(query.toLowerCase()));
+ useEffect(() => {
+ function key(event) {
+ if ((event.ctrlKey || event.metaKey) && !event.altKey && event.key.toLowerCase() === 'k') {
+ event.preventDefault();
+ if (!dialog.current?.open) returnFocus.current = document.activeElement;
+ setOpen(s => !s);
+ }
+ }
+ window.addEventListener('keydown', key); return () => window.removeEventListener('keydown', key);
+ }, []);
+ useEffect(() => {
+ if (open && !dialog.current.open) {dialog.current.showModal();dialog.current.querySelector('input')?.focus();}
+ else if (!open && dialog.current.open) {dialog.current.close();returnFocus.current?.focus();}
+ }, [open]);
+ const choose = index => {navigate(index);setOpen(false);setQuery('');setSelected(0);};
+ function keyboard(event) {
+ if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key) && matches.length) {
+ event.preventDefault();
+ setSelected(current => event.key === 'Home' ? 0 : event.key === 'End' ? matches.length - 1 :
+ (current + (event.key === 'ArrowDown' ? 1 : -1) + matches.length) % matches.length);
+ } else if (event.key === 'Enter' && matches[selected]) {event.preventDefault();choose(matches[selected].index);}
+ }
+ return <>
+
+ {createPortal(, document.body)}
+ ;
+}
+
+export function LoadingFeedback({busy, hasResults}) {
+ const [seconds, setSeconds] = useState(0);
+ useEffect(() => {
+ setSeconds(0);
+ if (!busy) return;
+ const start = Date.now(), timer = setInterval(() => setSeconds(Math.floor((Date.now()-start)/1000)), 1000);
+ return () => clearInterval(timer);
+ }, [busy]);
+ if (!busy) return null;
+ return );await open();token();
+ await act(async () => fireEvent.click(screen.getByRole('button', {name: 'Queue calculation'})));
+ await act(async () => fireEvent.click(screen.getByRole('button', {name: 'Cancel queued job'})));
+ expect(screen.getByRole('status')).toHaveTextContent('cancelled');
+ expect(jobFetch.mock.calls[1][1].method).toBe('DELETE');
+});
+
+it('offers status retry after failure and aborts an in-flight poll on unmount', async () => {
+ jobFetch.mockResolvedValueOnce(response({id: 'job-one', state: 'running'}))
+ .mockRejectedValueOnce(new Error('Connection lost'))
+ .mockImplementationOnce(() => new Promise(() => {}));
+ const view = render();await open();token();
+ await act(async () => fireEvent.click(screen.getByRole('button', {name: 'Queue calculation'})));
+ await act(() => vi.advanceTimersByTimeAsync(1000));
+ expect(screen.getByRole('alert')).toHaveTextContent('Connection lost');
+ fireEvent.click(screen.getByRole('button', {name: 'Retry job status'}));
+ await act(() => vi.advanceTimersByTimeAsync(1000));
+ const signal = jobFetch.mock.calls[2][1].signal;
+ view.unmount();
+ expect(signal.aborted).toBe(true);
+});
+
+it('submits, polls results and cancels locally without a token field or credential header', async () => {
+ fetch.mockImplementation((path, ...args) => path === '/api/enhancements/research-access'
+ ? Promise.resolve(response({mode: 'local', token_required: false})) : jobFetch(path, ...args));
+ jobFetch.mockResolvedValueOnce(response({id: 'local-one', state: 'queued'}))
+ .mockResolvedValueOnce(response({cancelled: true, job: {id: 'local-one', state: 'cancelled'}}))
+ .mockResolvedValueOnce(response({id: 'local-two', state: 'running'}))
+ .mockResolvedValueOnce(response({id: 'local-two', state: 'succeeded'}))
+ .mockResolvedValueOnce(response({source_revision: 'local-r1', nodes: [{type: 'heading', text: 'Local audit finished'}]}));
+ render();
+ await act(async () => {});
+ act(() => window.dispatchEvent(new CustomEvent('f1analysis:research-task', {detail: 'leakage-audit'})));
+ expect(screen.queryByLabelText('Administrator token')).not.toBeInTheDocument();
+ expect(screen.getByLabelText('Research task')).toHaveFocus();
+ expect(screen.getByRole('button', {name: 'Queue calculation'})).toBeEnabled();
+ expect(jobFetch).not.toHaveBeenCalled();
+ await act(async () => fireEvent.click(screen.getByRole('button', {name: 'Queue calculation'})));
+ await act(async () => fireEvent.click(screen.getByRole('button', {name: 'Cancel queued job'})));
+ expect(screen.getByRole('status')).toHaveTextContent('cancelled');
+ await act(async () => fireEvent.click(screen.getByRole('button', {name: 'Queue calculation'})));
+ await act(() => vi.advanceTimersByTimeAsync(1000));
+ expect(screen.getByText('Local audit finished')).toBeInTheDocument();
+ expect(jobFetch.mock.calls.every(([, options]) => !('X-F1-Admin-Token' in options.headers))).toBe(true);
+});
+
+it('fails closed while checking access and permits retry after a connection failure', async () => {
+ fetch.mockRejectedValueOnce(new Error('Connection lost'))
+ .mockResolvedValueOnce(response({mode: 'local', token_required: false}));
+ render();
+ fireEvent.click(screen.getByText('Research jobs'));
+ expect(screen.getByRole('button', {name: 'Queue calculation'})).toBeDisabled();
+ await act(async () => {});
+ expect(screen.getByRole('alert')).toHaveTextContent('Connection lost');
+ await act(async () => fireEvent.click(screen.getByRole('button', {name: 'Retry research access'})));
+ expect(screen.getByRole('button', {name: 'Queue calculation'})).toBeEnabled();
+ expect(jobFetch).not.toHaveBeenCalled();
+});
+
+it('aborts a pending access check on unmount', () => {
+ fetch.mockImplementation(() => new Promise(() => {}));
+ const view = render();
+ const signal = fetch.mock.calls[0][1].signal;
+ view.unmount();
+ expect(signal.aborted).toBe(true);
+});
+
+it('does not expose controls from output snapshots', () => {
+ expect(researchOutput([{type: 'tabs', children: [
+ {type: 'tab', hidden: true, children: [{type: 'heading', text: 'Hidden'}]},
+ {type: 'tab', children: [{type: 'button'}, {type: 'table', rows: []}]},
+ ]}])).toEqual([{type: 'table', rows: []}]);
+});
diff --git a/fastapi_react/frontend/src/enhancements/SafePlotlyChart.jsx b/fastapi_react/frontend/src/enhancements/SafePlotlyChart.jsx
new file mode 100644
index 00000000..98d3745c
--- /dev/null
+++ b/fastapi_react/frontend/src/enhancements/SafePlotlyChart.jsx
@@ -0,0 +1,25 @@
+import {useEffect,useRef,useState} from 'react';
+
+export function SafePlotlyChart({node}) {
+ const ref = useRef(null);
+ const [error,setError] = useState(null);
+ useEffect(() => {
+ const element = ref.current;
+ let chart, observer, disposed = false;
+ setError(null);
+ import('plotly.js-dist-min').then(async ({default:plotly}) => {
+ if (disposed) return;
+ chart = plotly;
+ await chart.newPlot(element,node.spec.data,{...node.spec.layout,autosize:true},{responsive:true});
+ if (disposed) {chart.purge(element);return;}
+ observer = new ResizeObserver(() => {
+ Promise.resolve().then(() => {if (!disposed) return chart.Plots.resize(element);}).catch(() => {});
+ });
+ observer.observe(element);
+ }).catch(err => {if (!disposed) setError(err.message);});
+ return () => {disposed=true;observer?.disconnect();if(chart)chart.purge(element);};
+ }, [node.spec]);
+ return );
+ await waitFor(() => expect(chart.newPlot).toHaveBeenCalledTimes(1));
+ expect(screen.getByRole('img',{name:'Finish distribution'})).toBeInTheDocument();
+ view.unmount();
+ expect(chart.purge).toHaveBeenCalled();
+ });
+
+ it('reports a failed chart without throwing a page error', async () => {
+ chart.newPlot.mockRejectedValueOnce(new Error('Invalid chart data'));
+ render();
+ expect(await screen.findByRole('alert')).toHaveTextContent('Chart unavailable: Invalid chart data');
+ });
+
+ it('disposes a chart that completes after its panel has already unmounted', async () => {
+ let finish;
+ chart.newPlot.mockImplementationOnce(() => new Promise(resolve => {finish = resolve;}));
+ const view = render();
+ await waitFor(() => expect(finish).toBeTypeOf('function'));
+ view.unmount();
+ finish();
+ await waitFor(() => expect(chart.purge).toHaveBeenCalled());
+ });
+ it('contains synchronous resize failures and ignores queued callbacks after disposal', async () => {
+ let resize;
+ const disconnect = vi.fn();
+ vi.stubGlobal('ResizeObserver',class {
+ constructor(callback) {resize = callback;}
+ observe() {}
+ disconnect() {disconnect();}
+ });
+ chart.Plots.resize.mockImplementation(() => {throw new Error('Container was resized');});
+ const view = render();
+ await waitFor(() => expect(resize).toBeTypeOf('function'));
+ await act(async () => {resize();});
+ expect(chart.Plots.resize).toHaveBeenCalledTimes(1);
+ view.unmount();
+ expect(disconnect).toHaveBeenCalled();
+ await act(async () => {resize();});
+ expect(chart.Plots.resize).toHaveBeenCalledTimes(1);
+ });
+});
diff --git a/fastapi_react/frontend/src/enhancements/enhancements-env.d.ts b/fastapi_react/frontend/src/enhancements/enhancements-env.d.ts
new file mode 100644
index 00000000..11f02fe2
--- /dev/null
+++ b/fastapi_react/frontend/src/enhancements/enhancements-env.d.ts
@@ -0,0 +1 @@
+/// > }} */ (
await api.post("/api/data-explorer/query", body)
);
@@ -131,7 +131,7 @@ export default function DataExplorer() {
-
-
-
- {toolOutput &&
- 
-
- F1 Races from 2016 to {new Date().getFullYear()}
-
-
-
-
+ function navigate(index) {
+ setPage(index + 1); setRequest(null);
+ location.hash = `/${encodeURIComponent(routes[index])}`;
+ window.scrollTo({top: 0});
+ }
+
+ useEffect(() => {
+ const active = navigation.current?.querySelector('[aria-selected="true"]');
+ if (active) {
+ const parent = navigation.current;
+ if (active.offsetLeft < parent.scrollLeft) parent.scrollLeft = active.offsetLeft;
+ else if (active.offsetLeft + active.offsetWidth > parent.scrollLeft + parent.clientWidth) parent.scrollLeft = active.offsetLeft + active.offsetWidth - parent.clientWidth;
+ }
+ }, [page]);
+
+ const sidebar = Boolean(values.filter_results_main) && !sidebarClosed;
+ const shell = (data?.shell || []).filter(node => ['heading', 'caption'].includes(node.type));
+ const act = key => {
+ const task = key === 'Run Leakage Audit' ? 'leakage-audit' : key === 'Run Bin Count Comparison' ? 'bin-comparison' : null;
+ if (FEATURES_ENABLED && task) {
+ window.dispatchEvent(new CustomEvent('f1analysis:research-task', {detail: task}));
+ return;
+ }
+ setRequest({key, id: Date.now()});
+ };
+
+ return
- {health?.status === "ok" ? "API connected" : "API…"}
- {health?.rss_mb ? `${health.rss_mb} MB RSS` : "checking"}
-
-
+ {event.preventDefault();document.getElementById('main-content')?.focus();}}>Skip to main content
+
;
}
diff --git a/fastapi_react/frontend/src/App.test.jsx b/fastapi_react/frontend/src/App.test.jsx
index 2a8586f3..c5c11c93 100644
--- a/fastapi_react/frontend/src/App.test.jsx
+++ b/fastapi_react/frontend/src/App.test.jsx
@@ -1,45 +1,79 @@
-import { fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { beforeEach, describe, expect, it, vi } from "vitest";
-import App from "./App";
-
-vi.mock("./api", () => ({
- api: { get: vi.fn().mockResolvedValue({ status: "ok", rss_mb: 120 }) },
-}));
-vi.mock("./pages/DataExplorer", () => ({ default: () =>
+ {values.filter_results_main && }
+
+ {settings && }
+
+ {sidebar && }
+
+ {FEATURES_ENABLED &&
+
+ {shell.length ?
-
-
-
+ {error && }
+ {busy && !FEATURES_ENABLED && Loading analysis…}
+
- );
+ Analysis tools
F1 Races from 2016 to {new Date().getFullYear()}
}Explorer page
})); -vi.mock("./pages/Analytics", () => ({ default: () =>Analytics page
})); -vi.mock("./pages/CurrentSeason", () => ({ default: () =>Season page
})); -vi.mock("./pages/NextRace", () => ({ default: () =>Next race page
})); -vi.mock("./pages/Models", () => ({ default: () =>Models page
})); -vi.mock("./pages/RawData", () => ({ default: () =>Raw data page
})); -vi.mock("./pages/BettingResearch", () => ({ default: () =>Betting page
})); - -describe("application shell", () => { - beforeEach(() => { - window.history.replaceState({}, "", "/"); - Object.defineProperty(window, "scrollTo", { configurable: true, value: vi.fn() }); - document.title = ""; - }); - - it("renders the reference brand, section navigation, and API status", async () => { - render({error &&
{showData && {error}
}
+
+
;
+}
+
+function NumberInput({ node, change }) {
+ const format = next => {const precision=/^%\.(\d+)f$/.exec(node.format || ''); return precision ? Number(next).toFixed(Number(precision[1])) : String(next);};
+ const [value, setValue] = useState(() => format(node.value));
+ useEffect(() => {const precision=/^%\.(\d+)f$/.exec(node.format || ''); setValue(precision ? Number(node.value).toFixed(Number(precision[1])) : String(node.value));}, [node.value,node.format]);
+ function save(next) {if (next === '' || !Number.isFinite(Number(next))) return; const n = Math.min(node.max ?? Infinity, Math.max(node.min ?? -Infinity, Number(next))); setValue(format(n)); if (n !== node.value) change(node.key, n);}
+ const id = useId();
+ return {range ? value[0] : value}{range && {value[1]}}
+
+ {range && update(Number(e.target.value), 0)} onPointerUp={finish} onKeyUp={finish} />}
+ update(Number(e.target.value), 1)} onPointerUp={finish} onKeyUp={finish} />
+
+ {node.min}{node.max}
+ setValue(e.target.value)} onBlur={() => save(value)} onKeyDown={e => {if (e.key === 'Enter') save(value);}} />
{node.labels.map((label, i) => )}
{active === i &&
)}{node.filename &&
;
+}
+
+function Expander({node,children}) {
+ const [open,setOpen]=useState(Boolean(node.expanded));
+ return {node.filename}
}{error && {error}}setOpen(e.currentTarget.open)}>
;
+}
+
+function MultiSelect({node,values,change}) {
+ const [open,setOpen]=useState(false),[search,setSearch]=useState('');
+ const selected=values[node.key] ?? node.value;
+ const id=useId();
+ return {node.label}
{children}
{selected.map(value=>{value})}setOpen(true)} onChange={e=>{setSearch(e.target.value);setOpen(true);}} onKeyDown={e=>{if(e.key==='Escape')setOpen(false);if(e.key==='Backspace' && !search && selected.length)change(node.key,selected.slice(0,-1));if(e.key==='Enter'){const option=node.options.find(v=>!selected.includes(v) && String(v).includes(search));if(option!==undefined){change(node.key,[...selected,option]);setSearch('');}e.preventDefault();}}}/>
{node.options.filter(v=>!selected.includes(v) && String(v).toLowerCase().includes(search.toLowerCase())).map(v=>)}
{drivers.length ? `Showing only ${drivers.length} selected driver${drivers.length === 1 ? '' : 's'}: ${drivers.join(', ')}.` : 'Showing all drivers.'} {scope}.
+{node.text};
+ case 'json': return {JSON.stringify(node.value, null, 2)};
+ case 'notice':
+ if (node.text === 'Research controls are disabled in hosted mode. Enable F1_RESEARCH_MODE=1 only for a trusted local/admin session; precomputed analyses remain available below.') return null;
+ return {node.icon && {node.icon}}{node.text}
;
+ case 'metric': return {node.label}{node.value}{node.delta != null && {node.delta}}
;
+ case 'divider': return ; + case 'image': return
`minmax(0, ${w}fr)`).join(' ')}}>{node.children.map((col, i) =>
;
+ case 'tabs': return
+ setShowSearch(false)} onHeaderMenuClick={(col,bounds)=>{const selected=visible[col-(node.hide_index?0:1)];if(selected)setMenu({index:selected.index,left:Math.max(0,Math.min(bounds.x-(outer.current?.getBoundingClientRect().x || 0),(outer.current?.clientWidth || 240)-240))});}} onColumnResize={(column,width)=>setWidths(old=>({...old,[column.id]:width}))} onColumnResizeEnd={(column,width)=>setWidths(old=>({...old,[column.id]:width}))} onHeaderClicked={col=>{const selected=visible[col-(node.hide_index?0:1)];if(selected)setSort(s=>s?.column===selected.index?(s.desc?null:{...s,desc:true}):{column:selected.index,desc:false});}} theme={{fontFamily:'Source Sans',baseFontStyle:'13px',headerFontStyle:'13px',cellHorizontalPadding:8,cellVerticalPadding:3,bgCell:bg,bgHeader:dark?'#262730':'#f7f9fc',bgHeaderHovered:dark?'#3a3d46':'#eff1f6',bgHeaderHasFocus:dark?'#3a3d46':'#eff1f6',textDark:text,textHeader:dark?'#bfc2ce':'#808495',textMedium:text,textLight:'#808495',borderColor:dark?'#3a3d46':'#e6e7eb',accentColor:'#ff4b4b',accentLight:dark?'#ff4b4b33':'#ff4b4b1a',accentFg:'#fff',headerBottomBorderColor:dark?'#3a3d46':'#d6d8df',roundingRadius:0}} />
+
;
+}
diff --git a/fastapi_react/frontend/src/components/useTheme.js b/fastapi_react/frontend/src/components/useTheme.js
new file mode 100644
index 00000000..9e7d9c3a
--- /dev/null
+++ b/fastapi_react/frontend/src/components/useTheme.js
@@ -0,0 +1,13 @@
+import {useEffect,useState} from 'react';
+
+export function useTheme() {
+ const [theme,setTheme]=useState(()=>document.documentElement.dataset.theme || 'light');
+ useEffect(()=>{
+ const update=()=>setTheme(document.documentElement.dataset.theme || 'light');
+ const observer=new MutationObserver(update);
+ observer.observe(document.documentElement,{attributes:true,attributeFilter:['data-theme']});
+ update();
+ return()=>observer.disconnect();
+ },[]);
+ return theme;
+}
diff --git a/fastapi_react/frontend/src/enhancements/EnhancedTable.jsx b/fastapi_react/frontend/src/enhancements/EnhancedTable.jsx
new file mode 100644
index 00000000..e9216f96
--- /dev/null
+++ b/fastapi_react/frontend/src/enhancements/EnhancedTable.jsx
@@ -0,0 +1,115 @@
+import {useEffect, useId, useMemo, useState} from 'react';
+import {ViewTable} from '../components/ViewTable';
+import {displayCell} from '../components/Presentation';
+
+const driverKeys = ['resultsDriverName','driverName','Driver'];
+const FEATURES_ENABLED = import.meta.env.VITE_F1_ENHANCEMENTS !== '0';
+const outcomeKeys = ['resultsStartingGridPositionNumber','resultsFinalPositionNumber','positionsGained','DNF'];
+const tireKeys = ['Avg Deg (s/lap)','Start Compound','Stints','Avg Stint (laps)','Max Stint (laps)','Avg Stints','Soft Lap %','Laps','Races'];
+const tireLabels = {'Avg Deg (s/lap)': 'Average tire degradation (s/lap)'};
+const knownDNF = value => [true, false, 1, 0, 'true', 'false', '1', '0'].includes(typeof value === 'string' ? value.trim().toLowerCase() : value);
+
+export function driverComparison(node) {
+ const driverIndex = node.columns.findIndex(column => driverKeys.includes(column.key));
+ if (driverIndex < 0) return null;
+ const choices = [...new Set(node.rows.map(row => row[driverIndex]).filter(value => typeof value === 'string' && value.trim()))].sort();
+ const tire = node.columns.some(column => column.key === 'Avg Deg (s/lap)');
+ const fields = (tire ? tireKeys : outcomeKeys).map(key => ({key, index: node.columns.findIndex(column => column.key === key)})).filter(field => field.index >= 0);
+ const useful = fields.some(field => node.rows.some(row => field.key === 'DNF' ? knownDNF(row[field.index]) : typeof row[field.index] === 'number' && Number.isFinite(row[field.index])));
+ if (choices.length < 2 || !useful) return null;
+ const counts = new Map();
+ for (const row of node.rows) counts.set(row[driverIndex], (counts.get(row[driverIndex]) || 0) + 1);
+ return {driverIndex, choices, fields, tire, singleRow: choices.every(driver => counts.get(driver) === 1)};
+}
+
+export function EnhancedTable({node, context = null, chartLinked = false, onSelectionChange = undefined}) {
+ const [mode, setMode] = useState('grid'), [compare, setCompare] = useState(false);
+ const comparisonId = useId();
+ const comparison = useMemo(() => driverComparison(node), [node]);
+ if (!FEATURES_ENABLED) return
+
+
+
+
+
+ {showColumns && {columns.map((col,i)=>)}
}
+ {menuColumn && {menuColumn.label}{numeric && }{rows.length.toLocaleString()} rows · {rows.filter(r=>r[menu.index]==null).length.toLocaleString()} missing · {new Set(rows.map(r=>r[menu.index])).size.toLocaleString()} unique
}
+
+
+
+ {comparison && }
+
+ {mode === 'grid' ?
+
+
+ {/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- A focusable overflow region lets keyboard users scroll wide tables. */}
+
+
+ {!matches.length &&
;
+}
+
+function DriverComparison({node, comparison, context, chartLinked, onSelectionChange}) {
+ const {driverIndex, choices, fields, tire, singleRow} = comparison;
+ const [drivers, setDrivers] = useState([]);
+ const selectedDrivers = useMemo(() => drivers.filter(driver => choices.includes(driver)), [drivers, choices]);
+ useEffect(() => {onSelectionChange?.(selectedDrivers);}, [selectedDrivers, onSelectionChange]);
+ const summaries = useMemo(() => selectedDrivers.map(driver => {
+ const sample = node.rows.filter(row => row[driverIndex] === driver);
+ return {driver,rows:sample.length,values:fields.map(field => {
+ const values = sample.map(row => row[field.index]);
+ if (singleRow) {
+ const value = values[0];
+ if (value == null) return 'No data';
+ if (field.key === 'DNF') return knownDNF(value) ? value === true || value === 1 || ['true', '1'].includes(String(value).trim().toLowerCase()) ? 'Yes' : 'No' : 'No data';
+ return displayCell(value, node.columns[field.index]);
+ }
+ if (field.key === 'DNF') {
+ const known = values.filter(knownDNF);
+ return known.length ? (100*known.filter(value => value === true || value === 1 || ['true', '1'].includes(String(value).trim().toLowerCase())).length/known.length).toFixed(1)+'%' : 'No data';
+ }
+ if (field.key === 'Start Compound') return [...new Set(values.filter(value => typeof value === 'string' && value.trim()))].join(', ') || 'No data';
+ const known = values.filter(v => typeof v === 'number' && Number.isFinite(v));
+ return known.length ? (known.reduce((a,b) => a+b,0)/known.length).toFixed(2) : 'No data';
+ })};
+ }), [selectedDrivers,node,driverIndex,fields,singleRow]);
+ const annual = tire && fields.some(field => field.key === 'Races');
+ const scope = tire ? annual ? `Season tire summaries${context?.year ? ' for ' + context.year : ''}` : `Race tire strategy${context?.event ? ' — ' + context.event : ''}${context?.year ? ' ' + context.year : ''}` : 'Current table and applied filters';
+ function fieldLabel(field) {
+ const label = tireLabels[field.key] || node.columns[field.index].label;
+ return singleRow || field.key === 'Start Compound' ? label : field.key === 'DNF' ? 'DNF rate among known records' : 'Mean ' + label;
+ }
+ return Choose fields ({visible.length} of {columns.length})
+{columns.map((column,index) => )}
+ | {node.index_name || 'Row'} | }{visible.map(index =>{columns[index].label} | )}
|---|---|
| {String(node.index?.[row] ?? row)} | } + {visible.map(index =>{displayCell(rows[row][index],columns[index],node.display?.[row]?.[index])} | )} +
No rows match this search.
} + +Use Interactive grid for the original sorting, selection, copying and full CSV export.
+
+
+
;
+}
diff --git a/fastapi_react/frontend/src/enhancements/Enhancements.test.jsx b/fastapi_react/frontend/src/enhancements/Enhancements.test.jsx
new file mode 100644
index 00000000..0d6b642b
--- /dev/null
+++ b/fastapi_react/frontend/src/enhancements/Enhancements.test.jsx
@@ -0,0 +1,270 @@
+import {act,fireEvent,render,screen,waitFor,within} from '@testing-library/react';
+import {afterAll,afterEach,beforeAll,beforeEach,expect,it,vi} from 'vitest';
+import {FeatureBar,LoadingFeedback,readOptions} from './FeatureBar';
+import {EnhancedTable} from './EnhancedTable';
+import {createViewClient} from './viewClient.js';
+import {hasUpload,readPresets,readSharedView,safeValues,savePreset,shareUrl} from './preferences.js';
+
+vi.mock('../components/ViewTable',()=>({ViewTable:()=> {tire ? 'Compare tire strategy' : 'Compare race results'}
+{scope}. {singleRow ? 'Compare the displayed values for each selected driver.' : 'Compare averages across the records included in this table.'} {chartLinked && 'The chart below uses the same selected drivers. Clear the selection to show all drivers again.'}
+ +{selectedDrivers.length ? `Comparing ${selectedDrivers.length} selected driver${selectedDrivers.length === 1 ? '' : 's'}: ${selectedDrivers.join(', ')}.` : 'Choose drivers above to see their comparison.'}
+ {/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- A focusable overflow region lets keyboard users scroll comparison columns. */} +| Driver | {!singleRow &&Records included | }{fields.map(f =>{fieldLabel(f)} | )}
|---|---|---|
| {summary.driver} | {!singleRow &&{summary.rows} | }{summary.values.map((value,i) =>{value} | )}
Original interactive grid
})); +const provenance = {revision:'abcdefghijklmno',build_revision:'test',dataset:{name:'data.parquet',modified_at:'today'},models:[]}; +const dialogMethods = ['showModal','close'].map(name => [name,Object.getOwnPropertyDescriptor(HTMLDialogElement.prototype,name)]); +beforeAll(() => { + Object.defineProperty(HTMLDialogElement.prototype,'showModal',{configurable:true,value(){this.setAttribute('open','');}}); + Object.defineProperty(HTMLDialogElement.prototype,'close',{configurable:true,value(){this.removeAttribute('open');this.dispatchEvent(new Event('close'));}}); +}); +afterAll(() => {for(const [name,descriptor] of dialogMethods) {if(descriptor)Object.defineProperty(HTMLDialogElement.prototype,name,descriptor);else delete HTMLDialogElement.prototype[name];}}); +beforeEach(() => { + localStorage.clear(); + vi.stubGlobal('fetch',vi.fn(async() => ({ok:true,json:async() => provenance}))); +}); +afterEach(() => {vi.useRealTimers();vi.restoreAllMocks();vi.unstubAllEnvs();vi.unstubAllGlobals();}); + +it('saves and shares Unicode filters while excluding private uploaded and financial values',() => { + const values = {filter_results_main:true,filter_driver:'José',range_filter_grandPrixYear:[2017,2026],f1bet_field_upload:{content:'private'},bankroll:5000}; + savePreset('Recent',2,values); + expect(readPresets()[0].values).toEqual(safeValues(values)); + expect(readSharedView(new URL(shareUrl(2,values,'http://localhost/')).hash).values).toEqual(safeValues(values)); + expect(hasUpload(values)).toBe(true); + expect(readOptions()).toEqual({design:true,cache:true}); + localStorage.setItem('f1analysis.enhancement-options','invalid'); + expect(readOptions().design).toBe(true); + localStorage.setItem('f1analysis.enhancement-options',JSON.stringify({design:false,cache:'false'})); + expect(readOptions()).toEqual({design:false,cache:true}); +}); + +it('deduplicates requests, invalidates changed revisions and bypasses action caching',async() => { + let revision = 'r1', posts = 0; + const fetcher = async url => { + if(url.endsWith('/status'))return {ok:true,json:async() => ({revision})}; + posts++;await new Promise(resolve => setTimeout(resolve,5)); + return {ok:true,json:async() => ({nodes:[],posts})}; + }; + const client = createViewClient({fetcher}), payload = {page:1,values:{}}; + await Promise.all([client.load(payload,{enabled:true}),client.load(payload,{enabled:true})]); + expect(posts).toBe(1); + await client.load(payload,{enabled:true});expect(posts).toBe(1); + revision='r2';await client.load(payload,{enabled:true});expect(posts).toBe(2); + await client.load({...payload,action:'explicit'},{enabled:true});expect(posts).toBe(3); + await client.load(payload,{enabled:true});expect(posts).toBe(4); +}); + +it('shows all-field semantic table paging and historical comparison without grouping years',() => { + const node = {hide_index:true,columns:[ + {key:'grandPrixYear',label:'Year',kind:'NumberColumn'}, + {key:'resultsDriverName',label:'Driver',kind:'TextColumn'}, + {key:'resultsFinalPositionNumber',label:'Finish',kind:'NumberColumn'}, + {key:'DNF',label:'DNF',kind:'CheckboxColumn'} + ],rows:Array.from({length:70},(_,i) => [2026,i%2 ? 'Driver A' : 'Driver B',i%2 ? 2 : 4,false])}; + render(Analysis tools
+
+
+
+
+
+
+
+
+
+
+
+
+ {provenanceState === 'loading' && Loading source details for context export.
} + {provenanceState === 'unavailable' &&Source details are unavailable. Context export needs the current data revision.
} + {staleProvenance &&Source data changed after this analysis. Refresh the analysis before exporting its context.
} + {provenance &&Data revision {provenance.revision.slice(0,12)} · artifact details
+Dataset: {provenance.dataset.name} · file updated {provenance.dataset.modified_at || 'unknown'}
+Build: {provenance.build_revision}. File revision tracks changes; model data hashes below come from existing manifests.
+ {provenance.models.map((model, i) =>{model.estimator || model.model_name} · {model.model_version || 'unversioned'} · trained {model.trained_at || 'unknown'} · training ends at {model.training_end_event || 'unknown'} · calibration {model.calibration_method || 'not recorded'}. {(model.notes || []).join(' ')}
)} +{message}
} + {error &&{error}
} +
+ {hasResults ? 'Updating analysis; existing results remain visible.' : 'Loading analysis.'}
+ {seconds >= 2 && }
+ {seconds >= 10 && This calculation is taking longer than usual.}
+
;
+}
diff --git a/fastapi_react/frontend/src/enhancements/ResearchJobs.jsx b/fastapi_react/frontend/src/enhancements/ResearchJobs.jsx
new file mode 100644
index 00000000..9e75da99
--- /dev/null
+++ b/fastapi_react/frontend/src/enhancements/ResearchJobs.jsx
@@ -0,0 +1,179 @@
+import {useCallback, useEffect, useRef, useState} from 'react';
+import {ViewNodes} from '../components/Presentation';
+
+const ROWS = 'Rows to read (0 = all)';
+const BINS = 'Select q values (number of bins)';
+const pending = job => ['queued', 'running'].includes(job?.state);
+const inputs = new Set(['button', 'checkbox', 'number', 'select', 'multiselect', 'slider', 'upload', 'text_input', 'text_area']);
+
+// Results are a snapshot: keep output and downloads, never resubmit page controls.
+export function researchOutput(nodes = []) {
+ return nodes.flatMap(node => {
+ if (node.hidden || inputs.has(node.type)) return [];
+ if (node.type === 'tabs' || node.type === 'tab') return researchOutput(node.children || []);
+ return [{...node, ...(node.children ? {children: researchOutput(node.children)} : {})}];
+ });
+}
+
+export function ResearchJobs({page, values = {}}) {
+ const [token, setToken] = useState('');
+ const [access, setAccess] = useState(null);
+ const [accessError, setAccessError] = useState('');
+ const [accessTick, setAccessTick] = useState(0);
+ const [task, setTask] = useState(page === 5 ? 'bin-comparison' : 'leakage-audit');
+ const [rows, setRows] = useState(Number.isInteger(values[ROWS]) && values[ROWS] > 0 ? values[ROWS] : 1000);
+ const [bins, setBins] = useState([2]);
+ const [job, setJob] = useState(null);
+ const [result, setResult] = useState(null);
+ const [error, setError] = useState('');
+ const [sending, setSending] = useState(false);
+ const [paused, setPaused] = useState(false);
+ const [tick, setTick] = useState(0);
+ const section = useRef(null), tokenInput = useRef(null), taskInput = useRef(null);
+ const operation = useRef(null), mounted = useRef(true);
+ const active = pending(job) || sending;
+ const relevant = page === 5 || page === 6 || Boolean(job);
+ const canRequest = Boolean(access && (!access.token_required || token));
+
+ useEffect(() => {
+ mounted.current = true;
+ return () => {mounted.current = false;operation.current?.abort();};
+ }, []);
+
+ useEffect(() => {
+ if (!relevant) return;
+ let disposed = false;
+ const controller = new AbortController();
+ const timer = setTimeout(() => controller.abort('timeout'), 30000);
+ setAccess(null);setAccessError('');
+ async function loadAccess() {
+ try {
+ const response = await fetch('/api/enhancements/research-access', {signal: controller.signal, cache: 'no-store'});
+ if (!response.ok) throw new Error('Research access could not be checked.');
+ const body = await response.json();
+ if (!['local', 'token'].includes(body.mode) || body.token_required !== (body.mode === 'token')) throw new Error('Research access could not be checked.');
+ if (!disposed) setAccess(body);
+ } catch (err) {
+ if (!disposed) setAccessError(controller.signal.reason === 'timeout' ? 'The server took too long to check research access.' : err.message || 'Research access is unavailable.');
+ } finally {clearTimeout(timer);}
+ }
+ loadAccess();
+ return () => {disposed = true;clearTimeout(timer);controller.abort();};
+ }, [relevant, accessTick]);
+
+ useEffect(() => {
+ function open(event) {
+ if (!['leakage-audit', 'bin-comparison'].includes(event.detail)) return;
+ if (!active) {
+ setTask(event.detail);
+ const q = values[BINS];
+ if (Array.isArray(q) && q.length && q.every(n => Number.isInteger(n) && n >= 2 && n <= 10)) setBins([...new Set(q)]);
+ const n = values[ROWS];
+ if (Number.isInteger(n) && n >= 1 && n <= 100000) setRows(n);
+ }
+ if (section.current) {
+ section.current.open = true;
+ section.current.scrollIntoView?.({block: 'center'});
+ }
+ (tokenInput.current || taskInput.current)?.focus();
+ }
+ window.addEventListener('f1analysis:research-task', open);
+ return () => window.removeEventListener('f1analysis:research-task', open);
+ }, [active, values]);
+
+ const call = useCallback(async (path, options, signal) => {
+ const response = await fetch('/api/enhancements/jobs' + path, {
+ ...options, signal, cache: 'no-store',
+ headers: {'Content-Type': 'application/json', ...(access?.token_required ? {'X-F1-Admin-Token': token} : {})},
+ });
+ const body = await response.json();
+ if (!response.ok) {
+ if ([403, 503].includes(response.status)) setAccessTick(n => n + 1);
+ throw new Error(typeof body.detail === 'string' ? body.detail : 'The research request could not complete.');
+ }
+ return body;
+ }, [token, access]);
+
+ // One outstanding operation at a time, with a timeout and unmount cancellation.
+ const request = useCallback(async (action, controller = new AbortController()) => {
+ operation.current = controller;
+ const timer = setTimeout(() => controller.abort('timeout'), 30000);
+ try {
+ return await action(controller.signal);
+ } catch (err) {
+ if (controller.signal.reason === 'timeout') throw new Error('The server took too long. Retry checking this job.');
+ throw err;
+ } finally {clearTimeout(timer);}
+ }, []);
+
+ useEffect(() => {
+ if (!job || !canRequest || paused || sending || !pending(job) && (job.state !== 'succeeded' || result)) return;
+ let disposed = false;
+ const controller = new AbortController();
+ const timer = setTimeout(async () => {
+ try {
+ const state = await request(signal => call('/' + job.id, {}, signal), controller);
+ if (disposed) return;
+ if (state.state === 'succeeded') {
+ const output = await request(signal => call('/' + job.id + '/result', {}, signal), controller);
+ if (disposed) return;
+ setResult(output);
+ }
+ if (state.state === 'failed') setError(state.error || 'The calculation failed. Submit a new job.');
+ setJob(state);
+ } catch (err) {
+ if (!disposed) {setError(err.message || 'The job status is unavailable.');setPaused(true);}
+ }
+ }, 1000);
+ return () => {disposed = true;clearTimeout(timer);controller.abort();};
+ }, [job, canRequest, paused, sending, result, tick, request, call]);
+
+ async function submit(event) {
+ event.preventDefault();
+ if (active || !canRequest) return;
+ operation.current?.abort();
+ setSending(true);setError('');setResult(null);setJob(null);setPaused(false);
+ const settings = task === 'leakage-audit' ? {[ROWS]: Number(rows)} : {[BINS]: bins};
+ try {
+ const next = await request(signal => call('', {method: 'POST', body: JSON.stringify({task, values: settings})}, signal));
+ if (mounted.current) setJob(next);
+ } catch (err) {if (mounted.current) setError(err.message || 'The job could not be queued.');}
+ finally {if (mounted.current) setSending(false);}
+ }
+
+ async function cancel() {
+ operation.current?.abort();
+ setSending(true);setError('');
+ try {
+ const response = await request(signal => call('/' + job.id, {method: 'DELETE'}, signal));
+ if (!mounted.current) return;
+ setJob(response.job || {...job, state: response.cancelled ? 'cancelled' : 'running'});
+ if (!response.cancelled) setError('The calculation has started. It will finish normally.');
+ } catch (err) {if (mounted.current) {setError(err.message);setPaused(true);}}
+ finally {if (mounted.current) setSending(false);}
+ }
+
+ function changeToken(value) {
+ operation.current?.abort();setToken(value);setError('');setResult(null);setPaused(false);
+ }
+
+ return
+
;
+}
diff --git a/fastapi_react/frontend/src/enhancements/ResearchJobs.test.jsx b/fastapi_react/frontend/src/enhancements/ResearchJobs.test.jsx
new file mode 100644
index 00000000..9427141a
--- /dev/null
+++ b/fastapi_react/frontend/src/enhancements/ResearchJobs.test.jsx
@@ -0,0 +1,125 @@
+import {act, fireEvent, render, screen} from '@testing-library/react';
+import {afterEach, beforeEach, expect, it, vi} from 'vitest';
+import {ResearchJobs, researchOutput} from './ResearchJobs';
+vi.mock('../components/Presentation', () => ({ViewNodes: ({nodes}) => {access?.token_required ? 'Administrator research jobs' : 'Research jobs'}
+Queue a calculation while continuing to browse. Only waiting jobs can be cancelled. Results are available for ten minutes after completion.
+ {!access && !accessError &&Checking research access…
} + {accessError && <>{accessError}
} + {access?.mode === 'local' &&Research tools are ready on this computer.
} + + {job &&Job {job.id}: {job.state}
} + {job?.state === 'running' &&The calculation is running. You can keep browsing.
} + {job?.state === 'queued' && } + {error &&{error}
} + {paused && job && } + {result &&Calculated with source revision {result.source_revision || job.revision || 'unavailable'}.
{nodes.map(node => node.text).join(' ')}
}));
+const response = body => ({ok: true, json: async () => body});
+let jobFetch;
+const open = async () => {
+ await act(async () => {});
+ fireEvent.click(screen.getByText('Administrator research jobs'));
+};
+const token = () => fireEvent.change(screen.getByLabelText('Administrator token'), {target: {value: 'memory-only-token'}});
+beforeEach(() => {
+ vi.useFakeTimers();jobFetch = vi.fn();
+ vi.stubGlobal('fetch', vi.fn((path, ...args) => path === '/api/enhancements/research-access'
+ ? Promise.resolve(response({mode: 'token', token_required: true})) : jobFetch(path, ...args)));
+});
+afterEach(() => {vi.useRealTimers();vi.unstubAllGlobals();});
+
+it('opens from an existing research action without running anything or retaining a token', async () => {
+ localStorage.clear();sessionStorage.clear();
+ render(
+ {error &&
;
+}
diff --git a/fastapi_react/frontend/src/enhancements/SafePlotlyChart.test.jsx b/fastapi_react/frontend/src/enhancements/SafePlotlyChart.test.jsx
new file mode 100644
index 00000000..74794dd5
--- /dev/null
+++ b/fastapi_react/frontend/src/enhancements/SafePlotlyChart.test.jsx
@@ -0,0 +1,57 @@
+import {act, render, screen, waitFor} from '@testing-library/react';
+import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest';
+import {SafePlotlyChart} from './SafePlotlyChart';
+
+const chart = vi.hoisted(() => ({newPlot:vi.fn(), purge:vi.fn(), Plots:{resize:vi.fn()}}));
+vi.mock('plotly.js-dist-min', () => ({default:chart}));
+const node = {label:'Finish distribution', spec:{data:[], layout:{}}};
+
+beforeEach(() => {
+ vi.clearAllMocks();
+ chart.newPlot.mockResolvedValue(undefined);
+});
+afterEach(() => vi.unstubAllGlobals());
+
+describe('asynchronous Plotly lifecycle', () => {
+ it('renders the chart and releases it when the panel is removed', async () => {
+ const view = render(Chart unavailable: {error}. Other analysis remains available.
}
+ Data Explorer
Filter and explore F1 race data from multiple perspectives.
{result.total.toLocaleString()} rows
+ {hasAppliedFilters && {result.total.toLocaleString()} rows
}
These controls mirror the Streamlit research tools but are disabled by default. Set ENABLE_EXPENSIVE_TOOLS=1 only on a test host.
-
Data & Debug Tools
Raw datasets plus the diagnostic and tuning utilities exposed by the Streamlit application.
Tab 6 START
+Data & Debug Tools
-
-
- {showDataset && <>
-
- {dataset && <>
-
+ {tab === "Raw Data" &&
+
+ {dataset && displaySchema && <>
+ }
+ }
+
+ {tab === "File Browser" &&
Rows {dataset.total ? datasetPage * datasetPageSize + 1 : 0}–{Math.min((datasetPage + 1) * datasetPageSize, dataset.total)} of {dataset.total.toLocaleString()}
-
-
-
-
- View the complete unfiltered dataset.
+ + {showDataset &&Total number of results: {dataset.total.toLocaleString()}
+
+
+
+
}
+
+
setQuery(e.target.value)} />
{shown.length === 0 ? (
diff --git a/fastapi_react/frontend/src/pages/RawData.test.jsx b/fastapi_react/frontend/src/pages/RawData.test.jsx
index 40d4fe13..aab3fcb5 100644
--- a/fastapi_react/frontend/src/pages/RawData.test.jsx
+++ b/fastapi_react/frontend/src/pages/RawData.test.jsx
@@ -26,10 +26,15 @@ describe('RawData page', () => {
});
}
if (url === '/api/health') return Promise.resolve({ status: 'ok' });
+ if (url === '/api/data-explorer/display-schema') {
+ return Promise.resolve({ columns: ['grandPrixYear'], labels: { grandPrixYear: 'Year' } });
+ }
return Promise.resolve({});
});
render("),
+ "status": status,
+ "header_ms": header_ms,
+ "duration_ms": round(1000 * (time.perf_counter() - start), 2),
+ "body_bytes": sent,
+ }
+ with self.lock:
+ self.records.append(record)
+ if self.emit_logs:
+ log.info("%s", json.dumps(record))
+
+
+def metrics_storage() -> tuple[deque[dict[str, Any]], Any]:
+ return deque(maxlen=500), threading.Lock()
+```
+
+## backend/app/enhancements/service.py
+
+[Editable source](../backend/app/enhancements/service.py) — SHA-256: `8dd9ee9459ea0d16158e161e11bad7f03eeeeb7a626ee104c4eda065c05419e7`
+
+```python
+from __future__ import annotations
+
+import hashlib
+import json
+import os
+import stat
+import threading
+import time
+from datetime import UTC, datetime
+from pathlib import Path
+from typing import Any
+
+from fastapi import APIRouter, Depends, FastAPI, HTTPException, Request
+from pydantic import BaseModel, ConfigDict, Field
+from starlette.responses import Response
+
+from app.config import DATA_DIR, REPO_ROOT
+from app.schemas import ViewRequest
+from app.services import analysis, data, presentation
+
+from .auth import authorize_research, research_access
+from .cache import ViewResponses
+from .jobs import BusyQueueError, Jobs
+from .metrics import RequestMetrics, metrics_storage
+
+ARTIFACT_SUFFIXES = frozenset(
+ {".csv", ".tsv", ".parquet", ".json", ".pkl", ".pickle", ".joblib", ".py", ".txt", ".html", ".png"}
+)
+
+
+def enabled(name: str, default: bool = True) -> bool:
+ return os.environ.get(name, "1" if default else "0").strip().lower() in {"1", "true", "yes"}
+
+
+class ArtifactChangedError(RuntimeError):
+ """No stable artifact revision was available while a response was rendered."""
+
+
+def artifact_revision(data_dir: Path, repo_root: Path) -> str:
+ """Stat identity, not content integrity; atomic publication must change mtime."""
+ roots = (data_dir, repo_root / "fastapi_react" / "backend" / "app")
+ paths: list[Path] = []
+ for root in roots:
+ if not root.is_dir():
+ continue
+ for directory, subdirectories, filenames in root.walk():
+ # FastF1's downloaded telemetry is not a presentation source. Avoid
+ # enumerating thousands of .ff1pkl blobs during every revision check.
+ subdirectories[:] = [name for name in subdirectories if name not in {"f1_cache", "__pycache__"}]
+ paths.extend(directory / name for name in filenames)
+ paths.extend((repo_root / "raceAnalysis.py", repo_root / "model_artifacts.py"))
+ paths.extend((repo_root / "f1bet").glob("*.py"))
+ inventory = []
+ for path in sorted(paths):
+ if path.suffix.lower() not in ARTIFACT_SUFFIXES:
+ continue
+ # Next Race writes these output downloads during every render. They are
+ # not inputs to the presentation; watching them would invalidate itself.
+ if path.parent == data_dir and path.match("predictions_*.csv"):
+ continue
+ try:
+ metadata = path.stat()
+ except FileNotFoundError:
+ # A file removed during enumeration will change the next identity.
+ continue
+ if not stat.S_ISREG(metadata.st_mode):
+ continue
+ inventory.append((str(path.relative_to(repo_root)), metadata.st_size, metadata.st_mtime_ns))
+ identity = [inventory, enabled("F1_USE_PARQUET")]
+ return hashlib.sha256(json.dumps(identity, separators=(",", ":")).encode()).hexdigest()
+
+
+def clear_source_caches() -> None:
+ # Shared Matplotlib state and model/data caches are only cleared between renders.
+ with presentation._RENDER_LOCK, presentation._LOCK, presentation._MODEL_LOCK:
+ presentation._CACHE.clear()
+ for module in (data, analysis):
+ for function in vars(module).values():
+ reset = getattr(function, "cache_clear", None)
+ if callable(reset):
+ reset()
+
+
+class JobRequest(BaseModel):
+ model_config = ConfigDict(extra="forbid")
+ task: str
+ values: dict[str, Any] = Field(default_factory=dict)
+
+
+def research_values(task: str, values: dict[str, Any]) -> dict[str, Any]:
+ """Only task parameters enter the worker, never arbitrary uploads or view state."""
+ if task == "leakage-audit":
+ key = "Rows to read (0 = all)"
+ rows = values.get(key, 1000)
+ if set(values) - {key} or type(rows) is not int or not 1 <= rows <= 100000:
+ raise ValueError("Choose an audit row limit from 1 through 100000.")
+ return {key: rows}
+ if task == "bin-comparison":
+ key = "Select q values (number of bins)"
+ bins = values.get(key, [2])
+ if (
+ set(values) - {key}
+ or not isinstance(bins, list)
+ or not 1 <= len(bins) <= 9
+ or any(type(q) is not int or not 2 <= q <= 10 for q in bins)
+ or len(set(bins)) != len(bins)
+ ):
+ raise ValueError("Choose one to nine distinct bin counts from 2 through 10.")
+ return {key: sorted(bins)}
+ raise ValueError("Unsupported research task.")
+
+
+def execute_research(task: str, context: dict[str, Any]) -> dict[str, Any]:
+ """Importable Windows-spawn worker using existing calculations outside HTTP rendering."""
+ revision = context["revision"]
+ if revision != artifact_revision(DATA_DIR, REPO_ROOT):
+ raise ArtifactChangedError("Artifacts changed after submission; submit a new job.")
+ values = research_values(task, context["values"])
+ clear_source_caches()
+ if task == "bin-comparison":
+ values["_tabs:📊 Model Performance"] = 6
+ result = presentation.render_view(5, values, "Run Bin Count Comparison")
+ else:
+ values["_tabs:Raw Data"] = 1
+ result = presentation.render_view(6, values, "Run Leakage Audit")
+ if revision != artifact_revision(DATA_DIR, REPO_ROOT):
+ raise ArtifactChangedError("Artifacts changed during calculation; submit a new job.")
+ return {**result, "source_revision": revision, "task": task}
+
+
+class Enhancements:
+ def __init__(self, *, poll_seconds: float = 1.0) -> None:
+ self.guard = threading.RLock()
+ self.revision = ""
+ self.checked = 0.0
+ self.poll_seconds = poll_seconds
+ # Resolve dynamically so tests and development instrumentation can wrap rendering.
+ self.responses = ViewResponses(
+ lambda page, values, action: presentation.render_view(page, values, action)
+ )
+ self.records, self.record_lock = metrics_storage()
+ self.jobs: Jobs | None = None
+ self.router = APIRouter(prefix="/api/enhancements", tags=["Analysis enhancements"])
+ self.router.add_api_route("/status", self.status, methods=["GET"])
+ self.router.add_api_route("/research-access", research_access, methods=["GET"])
+ protected = [Depends(authorize_research)]
+ self.router.add_api_route("/metrics", self.metrics, methods=["GET"], dependencies=protected)
+ self.router.add_api_route("/jobs", self.submit, methods=["POST"], status_code=202, dependencies=protected)
+ self.router.add_api_route("/jobs/{identity}", self.job_status, methods=["GET"], dependencies=protected)
+ self.router.add_api_route("/jobs/{identity}/result", self.job_result, methods=["GET"], dependencies=protected)
+ self.router.add_api_route("/jobs/{identity}", self.cancel, methods=["DELETE"], dependencies=protected)
+
+ def current_revision(self, *, force: bool = False) -> str:
+ with self.guard:
+ if force or not self.revision or time.monotonic() - self.checked >= self.poll_seconds:
+ revision = artifact_revision(DATA_DIR, REPO_ROOT)
+ if revision != self.revision:
+ clear_source_caches()
+ self.responses.clear()
+ self.revision = revision
+ self.checked = time.monotonic()
+ return self.revision
+
+ def refresh_sources(self) -> None:
+ """Shared API dependency: other data endpoints also observe artifact changes."""
+ self.current_revision()
+
+ def render(self, payload: ViewRequest, request: Request) -> Response:
+ if payload.action in {"Run Leakage Audit", "Run Bin Count Comparison"}:
+ raise HTTPException(409, "Use Research jobs to queue this calculation.")
+ # Keep revision checks and rendering together. Recheck the disk after rendering
+ # before retaining/returning a response. Never repeat an explicit action.
+ with self.guard:
+ for _attempt in range(2):
+ revision = self.current_revision(force=True)
+ result = self.responses.render(
+ payload.page,
+ payload.values,
+ payload.action,
+ revision,
+ request.headers.get("accept-encoding", ""),
+ enabled=enabled("F1_VIEW_RESPONSE_CACHE"),
+ )
+ if self.current_revision(force=True) == revision:
+ return result
+ if payload.action:
+ break
+ raise ArtifactChangedError("Source artifacts changed during analysis. Refresh and try again.")
+
+ def status(self) -> dict[str, Any]:
+ with self.guard:
+ revision = self.current_revision(force=True)
+ source = DATA_DIR / "f1ForAnalysis.parquet"
+ if not enabled("F1_USE_PARQUET") or not source.exists():
+ source = DATA_DIR / "f1ForAnalysis.csv"
+ try:
+ modified = datetime.fromtimestamp(source.stat().st_mtime, UTC).isoformat()
+ except FileNotFoundError:
+ modified = None
+ models = []
+ keys = (
+ "model_name",
+ "model_version",
+ "estimator",
+ "trained_at",
+ "training_end_event",
+ "training_start_event",
+ "calibration_method",
+ "data_sha256",
+ "schema_version",
+ "notes",
+ )
+ for path in sorted((DATA_DIR / "models").rglob("*manifest.json")):
+ try:
+ manifest = json.loads(path.read_text(encoding="utf-8"))
+ if not isinstance(manifest, dict):
+ raise TypeError("Expected a model manifest object")
+ models.append({key: manifest.get(key) for key in keys})
+ except (OSError, ValueError, TypeError):
+ models.append({"model_name": path.stem, "notes": ["Manifest could not be read."]})
+ return {
+ "revision": revision,
+ "build_revision": os.environ.get("F1_BUILD_REVISION", "local-working-tree"),
+ "dataset": {"name": source.name, "modified_at": modified},
+ "models": models,
+ }
+
+ def metrics(self) -> dict[str, Any]:
+ with self.record_lock, self.responses.lock:
+ return {"requests": list(self.records), "cache_bytes": self.responses.bytes}
+
+ def submit(self, payload: JobRequest) -> dict[str, Any]:
+ try:
+ values = research_values(payload.task, payload.values)
+ with self.guard:
+ revision = self.current_revision(force=True)
+ if self.jobs is None:
+ self.jobs = Jobs(execute_research)
+ identity = self.jobs.submit(payload.task, {"values": values, "revision": revision})
+ return self.jobs.status(identity)
+ except BusyQueueError as exc:
+ raise HTTPException(429, str(exc), headers={"Retry-After": "10"}) from exc
+ except (ValueError, TypeError) as exc:
+ raise HTTPException(400, str(exc)) from exc
+
+ def job_status(self, identity: str) -> dict[str, Any]:
+ try:
+ if self.jobs is None:
+ raise KeyError(identity)
+ return self.jobs.status(identity)
+ except KeyError as exc:
+ raise HTTPException(404, "Job not found or expired.") from exc
+
+ def job_result(self, identity: str) -> dict[str, Any]:
+ self.job_status(identity)
+ try:
+ if self.jobs is None:
+ raise KeyError(identity)
+ return self.jobs.result(identity)
+ except KeyError as exc:
+ raise HTTPException(404, "Job not found or expired.") from exc
+ except ValueError as exc:
+ raise HTTPException(409, str(exc)) from exc
+
+ def cancel(self, identity: str) -> dict[str, Any]:
+ self.job_status(identity)
+ try:
+ if self.jobs is None:
+ raise KeyError(identity)
+ cancelled = self.jobs.cancel(identity)
+ return {"cancelled": cancelled, "job": self.jobs.status(identity)}
+ except KeyError as exc:
+ raise HTTPException(404, "Job not found or expired.") from exc
+
+ def close(self) -> None:
+ if self.jobs is not None:
+ self.jobs.close()
+
+ def install(self, app: FastAPI) -> None:
+ app.include_router(self.router)
+ # Install last: timings and byte counts include routing, rendering and gzip.
+ app.add_middleware(
+ RequestMetrics, records=self.records, lock=self.record_lock, emit_logs=enabled("F1_REQUEST_LOGS")
+ )
+```
+
+## backend/app/enhancements/jobs.py
+
+[Editable source](../backend/app/enhancements/jobs.py) — SHA-256: `b3209f0ac3c039092c441f55079ddd3d2d4ccdae9bca5309b3da912333f129e8`
+
+```python
+from __future__ import annotations
+
+import gzip
+import json
+import logging
+import multiprocessing
+import threading
+import time
+import uuid
+from collections.abc import Callable
+from concurrent.futures import Future, ProcessPoolExecutor, ThreadPoolExecutor
+from typing import Any, cast
+
+log = logging.getLogger("f1.jobs")
+
+
+class BusyQueueError(Exception):
+ """No bounded queue slot is available."""
+
+
+class Jobs:
+ """One spawned calculation process; bounded state is local and non-durable."""
+
+ def __init__(
+ self,
+ execute: Callable[[str, dict[str, Any]], dict[str, Any]],
+ *,
+ limit: int = 8,
+ result_limit: int = 32 * 1024 * 1024,
+ ttl: float = 600,
+ ) -> None:
+ if limit < 1 or result_limit < 1 or ttl <= 0:
+ raise ValueError("Job limits must be positive.")
+ self.execute, self.limit, self.result_limit, self.ttl = execute, limit, result_limit, ttl
+ self.pool = ThreadPoolExecutor(max_workers=1, thread_name_prefix="f1-research")
+ self.worker = ProcessPoolExecutor(max_workers=1, mp_context=multiprocessing.get_context("spawn"))
+ self.lock = threading.RLock()
+ self.items: dict[str, dict[str, Any]] = {}
+ self.futures: dict[str, Future[None]] = {}
+ self.closed = False
+
+ def submit(self, task: str, values: dict[str, Any]) -> str:
+ # Serialization isolates caller mutation and bounds retained inputs.
+ text = json.dumps(values, allow_nan=False)
+ if len(text.encode()) > 64 * 1024:
+ raise ValueError("Research job inputs must be below 64 KiB.")
+ with self.lock:
+ self._expire()
+ if self.closed:
+ raise BusyQueueError("The local research queue is shutting down.")
+ if len(self.items) >= self.limit:
+ raise BusyQueueError("The local research queue is full; wait for completed results to expire.")
+ identity = uuid.uuid4().hex
+ self.items[identity] = {
+ "id": identity,
+ "task": task,
+ "state": "queued",
+ "created": time.time(),
+ "finished": None,
+ "revision": values.get("revision"),
+ }
+ self.futures[identity] = self.pool.submit(self._run, identity, task, json.loads(text))
+ return identity
+
+ def _expire(self) -> None:
+ now = time.time()
+ for identity, item in list(self.items.items()):
+ if item["finished"] is not None and now - item["finished"] > self.ttl:
+ self.items.pop(identity)
+ self.futures.pop(identity, None)
+
+ def _run(self, identity: str, task: str, values: dict[str, Any]) -> None:
+ with self.lock:
+ self.items[identity]["state"] = "running"
+ try:
+ result = self.worker.submit(self.execute, task, values).result()
+ if not isinstance(result, dict):
+ raise ValueError("Expected a research result object.")
+ body = json.dumps(result, allow_nan=False, separators=(",", ":")).encode()
+ if len(body) > self.result_limit:
+ raise ValueError("Research result exceeds the configured limit.")
+ compressed = gzip.compress(body, compresslevel=5)
+ if len(compressed) > self.result_limit:
+ raise ValueError("Compressed research result exceeds the configured limit.")
+ with self.lock:
+ self.items[identity].update(state="succeeded", body=compressed)
+ except Exception: # Record a worker failure without exposing data or killing the coordinator.
+ log.exception("Research job %s failed", identity)
+ with self.lock:
+ self.items[identity].update(
+ state="failed", error="Research calculation failed; see the server log using this job ID."
+ )
+ finally:
+ with self.lock:
+ self.items[identity]["finished"] = time.time()
+
+ def status(self, identity: str) -> dict[str, Any]:
+ with self.lock:
+ self._expire()
+ return {key: value for key, value in self.items[identity].items() if key != "body"}
+
+ def result(self, identity: str) -> dict[str, Any]:
+ with self.lock:
+ self._expire()
+ if self.items[identity]["state"] != "succeeded":
+ raise ValueError("The job has not completed successfully.")
+ body = self.items[identity]["body"]
+ return cast("dict[str, Any]", json.loads(gzip.decompress(body)))
+
+ def cancel(self, identity: str) -> bool:
+ with self.lock:
+ self._expire()
+ if self.items[identity]["state"] != "queued" or not self.futures[identity].cancel():
+ return False
+ self.items[identity].update(state="cancelled", finished=time.time())
+ return True
+
+ def close(self) -> None:
+ with self.lock:
+ if self.closed:
+ return
+ self.closed = True
+ for identity in list(self.items):
+ self.cancel(identity)
+ # Running calculations finish. Shutdown never kills a calculation midway.
+ self.pool.shutdown(wait=True, cancel_futures=True)
+ self.worker.shutdown(wait=True, cancel_futures=True)
+```
+
+## backend/app/services/presentation.py
+
+[Editable source](../backend/app/services/presentation.py) — SHA-256: `64c71f876247ca48a66b6121c1e4c76326c31ba6d1e7f453fcf3f2aca4292f58`
+
+```python
+"""Request-isolated Python view data for the native React interface.
+
+The offline-exported views call this small presentation protocol. It carries
+values, column configurations, charts and widget state, not Python objects or
+executable browser code. Prediction pages only load offline-trained artifacts;
+the explicit bin-count experiment retains the reference's opt-in computation.
+Administrative audit actions use the shared structured audit implementation.
+"""
+
+from __future__ import annotations
+
+import base64
+import copy
+import datetime as dt
+import hashlib
+import io
+import json
+import logging
+import pickle
+import threading
+from collections import OrderedDict
+from functools import wraps
+from pathlib import Path
+from typing import Any
+
+import matplotlib
+import numpy as np
+import pandas as pd
+
+matplotlib.use("Agg")
+
+from app.config import DATA_DIR, REPO_ROOT
+
+_CACHE: OrderedDict[Any, Any] = OrderedDict()
+_LOCK = threading.RLock()
+_MODEL_LOCK = threading.RLock()
+_RENDER_LOCK = threading.RLock()
+_VIEW_FILE = Path(__file__).with_name("reference_views.py")
+_CODE = compile(_VIEW_FILE.read_text(encoding="utf-8"), str(_VIEW_FILE), "exec")
+
+
+def scalar(value: Any) -> Any:
+ if value is None:
+ return None
+ if isinstance(value, (dt.datetime, dt.date, pd.Timestamp)):
+ return value.isoformat()
+ if isinstance(value, np.generic):
+ value = value.item()
+ if isinstance(value, float) and not np.isfinite(value):
+ return None
+ try:
+ if pd.isna(value):
+ return None
+ except (TypeError, ValueError):
+ pass
+ return value
+
+
+def clean(value: Any) -> Any:
+ if isinstance(value, dict):
+ return {str(k): clean(v) for k, v in value.items()}
+ if isinstance(value, (list, tuple, np.ndarray, pd.Index)):
+ return [clean(v) for v in value]
+ return scalar(value)
+
+
+def table_rows(frame: pd.DataFrame) -> list[list[Any]]:
+ """Normalize whole numeric columns without rounding values or visiting each cell.
+
+ Mixed/text/date columns retain scalar normalization. An object matrix keeps
+ Python integers, booleans and float precision when converted back to rows.
+ """
+ values = frame.to_numpy(dtype=object, copy=True)
+ for index, (_name, series) in enumerate(frame.items()):
+ if pd.api.types.is_numeric_dtype(series):
+ numeric = series.to_numpy(dtype=np.float64, na_value=np.nan)
+ values[~np.isfinite(numeric), index] = None
+ else:
+ values[:, index] = np.fromiter(
+ (scalar(value) for value in values[:, index]), dtype=object, count=len(frame)
+ )
+ rows: list[list[Any]] = values.tolist()
+ return rows
+
+
+class State(dict[str, Any]):
+ def __getattr__(self, key: str) -> Any:
+ return self.get(key)
+
+ def __setattr__(self, key: str, value: Any) -> None:
+ self[key] = value
+
+
+class ColumnConfig:
+ def __getattr__(self, kind: str) -> Any:
+ def column(label: str | None = None, **kwargs: Any) -> dict[str, Any]:
+ return {"label": label, "kind": kind, **clean(kwargs)}
+
+ return column
+
+
+class Container:
+ def __init__(self, ui: Presentation, node: dict[str, Any]):
+ self.ui = ui
+ self.node = node
+
+ def __enter__(self) -> Container:
+ self.ui.stack.append(self.node["children"])
+ self.ui.visibility.append(
+ True if self.node.get("sidebar") else self.ui.visible and not self.node.get("hidden", False)
+ )
+ return self
+
+ def __exit__(self, *_args: Any) -> None:
+ self.ui.stack.pop()
+ self.ui.visibility.pop()
+
+ def __getattr__(self, method: str) -> Any:
+ def call(*args: Any, **kwargs: Any) -> Any:
+ with self:
+ return getattr(self.ui, method)(*args, **kwargs)
+
+ return call
+
+
+class Presentation:
+ def __init__(self, page: int, values: dict[str, Any], action: str | None = None):
+ self.page = page
+ self.values = dict(values)
+ self.action = action
+ self.nodes: list[dict[str, Any]] = []
+ self.sidebar_nodes: list[dict[str, Any]] = []
+ self.stack = [self.nodes]
+ self.visibility = [True]
+ self.sidebar = Container(self, {"children": self.sidebar_nodes, "sidebar": True})
+ self.column_config = ColumnConfig()
+ self.session_state = State()
+ self.model_type = values.get("Select Model Type", "XGBoost")
+ self.namespace: dict[str, Any] = {}
+ self.widgets: dict[str, Any] = {}
+ self.root_tabs = False
+
+ @property
+ def visible(self) -> bool:
+ return self.visibility[-1]
+
+ def add(self, kind: str, **props: Any) -> dict[str, Any]:
+ node = {"type": kind, "id": f"n{len(self.stack[-1])}", **props}
+ if self.visible:
+ self.stack[-1].append(node)
+ return node
+
+ def group(self, kind: str, **props: Any) -> Container:
+ return Container(self, self.add(kind, children=[], **props))
+
+ def tabs(self, labels: list[str]) -> list[Container]:
+ root = not self.root_tabs
+ self.root_tabs = True
+ node = self.add("tabs", labels=labels, root=root, children=[])
+ selected = self.page - 1 if root else int(self.values.get("_tabs:" + labels[0], 0))
+ tabs = []
+ for i, label in enumerate(labels):
+ child = {"type": "tab", "label": label, "children": [], "index": i, "hidden": i != selected}
+ node["children"].append(child)
+ tabs.append(Container(self, child))
+ return tabs
+
+ def columns(self, widths: Any, **kwargs: Any) -> list[Container]:
+ widths = [1] * widths if isinstance(widths, int) else list(widths)
+ node = self.add("columns", widths=widths, children=[])
+ columns = []
+ for width in widths:
+ child = {"type": "column", "width": width, "children": []}
+ node["children"].append(child)
+ columns.append(Container(self, child))
+ return columns
+
+ def expander(self, label: str, expanded: bool = False, **kwargs: Any) -> Container:
+ return self.group("expander", label=label, expanded=expanded)
+
+ def spinner(self, *_args: Any, **_kwargs: Any) -> Container:
+ return Container(self, {"children": self.stack[-1]})
+
+ def set_page_config(self, **_kwargs: Any) -> None:
+ pass
+
+ def stop(self) -> None:
+ raise ValueError("The analysis could not load its required data.")
+
+ def title(self, text: str) -> None:
+ self.add("heading", text=text, level=1)
+
+ def header(self, text: str) -> None:
+ self.add("heading", text=text, level=2)
+
+ def subheader(self, text: str) -> None:
+ self.add("heading", text=text, level=3)
+
+ def caption(self, text: str) -> None:
+ self.add("caption", text=str(text))
+
+ def write(self, *args: Any, **_kwargs: Any) -> None:
+ for value in args:
+ if isinstance(value, pd.DataFrame):
+ self.dataframe(value)
+ elif isinstance(value, (dict, list, np.ndarray)):
+ self.json(value)
+ elif value is not None:
+ self.markdown(str(value))
+
+ def markdown(self, text: str, unsafe_allow_html: bool = False, **_kwargs: Any) -> None:
+ if "