import React, {useEffect, useState} from 'react'; import {List, ThemeIcon} from '@mantine/core'; import {CircleCheck} from 'tabler-icons-react'; import {ReportEntry, ReportIndex} from '../types'; function fetchIndex(basePath: string, setter: (data: any) => void) { return fetch( `${basePath}/index.json`, ) .then((res) => res.json()) .then((data) => { console.log("reportIndex", data); setter(data); }) .catch((e) => { console.error("failed to fetch index", e) }); } interface ReportNavigatorProps { onSelect: (reportEntry: ReportEntry) => void; } const ReportNavigator = (props: ReportNavigatorProps) => { const [isLoading, setLoading] = useState(false) const [reportIndex, setReportIndex] = useState({runs: []}); useEffect(() => { setLoading(true) fetchIndex('/output', setReportIndex).then(() => { setLoading(false); }) }, []); if (isLoading) { return
Loading...
; } if (reportIndex.runs.length == 0) { return
No back-test report data
} return
} > { reportIndex.runs.map((entry) => { return { if (props.onSelect) { props.onSelect(entry); } }}>
{entry.id}
}) }
; }; export default ReportNavigator;