Skip to content
Snippets Groups Projects
Commit b754a228 authored by abhimazu's avatar abhimazu
Browse files

Added collapsible table with scroll for model provenance

parent d3c7ea00
No related branches found
No related tags found
No related merge requests found
...@@ -66,13 +66,12 @@ export default function CurrentFoundationInfo({ ...@@ -66,13 +66,12 @@ export default function CurrentFoundationInfo({
fetchWithPost fetchWithPost
); );
const [huggingfaceData, setHugggingfaceData] = useState({}); const [huggingfaceData, setHugggingfaceData] = useState({});
const [showProvenance, setShowProvenance] = useState(false);
const huggingfaceId = experimentInfo?.config?.foundation; const huggingfaceId = experimentInfo?.config?.foundation;
// Get model ID from experimentInfo (either from model_id or id)
const modelId = experimentInfo?.model_id || experimentInfo?.id;
// Fetch provenance data from your GET endpoint using chatAPI.Endpoints.Models.ModelProvenance() // Fetch provenance data from your GET endpoint using chatAPI.Endpoints.Models.ModelProvenance()
const { data: provenance, error: provenanceError } = useSWR( const { data: provenance, error: provenanceError } = useSWR(
modelId ? chatAPI.Endpoints.Models.ModelProvenance(modelId) : null, chatAPI.Endpoints.Models.ModelProvenance(huggingfaceId),
fetcher fetcher
); );
...@@ -128,71 +127,94 @@ export default function CurrentFoundationInfo({ ...@@ -128,71 +127,94 @@ export default function CurrentFoundationInfo({
) )
)} )}
</tbody> </tbody>
</Table> </Table>
{/* Model Provenance Table */} {/* Model Provenance Collapsible */}
<Box mt={4}> <Box mt={4}>
<Typography level="h6" mb={1}> <Button
Model Provenance variant="soft"
</Typography> onClick={() => setShowProvenance((prev) => !prev)}
{provenance ? ( >
<Table id="model-provenance-table"> Model Provenance {showProvenance ? '' : ''}
<thead> </Button>
<tr> {showProvenance && (
<th>Job ID</th> <Box
<th>Base Model</th> sx={{
<th>Dataset</th> mt: 2,
<th>Params</th> overflow: 'auto',
<th>Output Model</th> maxHeight: 400,
<th>Evals</th> maxWidth: '100%',
</tr> border: '1px solid #ccc',
</thead> borderRadius: '4px',
<tbody> }}
{provenance.provenance_chain.map((row) => ( >
<tr key={row.job_id}> {provenance ? (
<td>{row.job_id}</td> <Table
<td>{row.train_model_name}</td> id="model-provenance-table"
<td>{row.dataset}</td> sx={{
<td> tableLayout: 'auto',
<Box> minWidth: 600, // Ensure horizontal scroll if needed
{Object.entries(row.parameters).map(([key, value]) => ( }}
<Typography key={key} level="body2"> >
{`${key}: ${value}`} <thead>
</Typography> <tr>
))} <th>Job ID</th>
</Box> <th>Base Model</th>
</td> <th>Dataset</th>
<td>{row.output_model}</td> <th>Params</th>
<td> <th>Output Model</th>
<Box> <th>Evals</th>
{row.evals && row.evals.length > 0 ? ( </tr>
row.evals.map((evalItem) => ( </thead>
<Tooltip <tbody>
key={evalItem.job_id} {provenance.provenance_chain.map((row) => (
title={ <tr key={row.job_id}>
<pre style={{ margin: 0 }}> <td>{row.job_id}</td>
{JSON.stringify(evalItem, null, 2)} <td>{row.input_model}</td>
</pre> <td>{row.dataset}</td>
} <td>
> <pre>{JSON.stringify(row.parameters, null, 2)}</pre>
<Typography level="body2" sx={{ cursor: 'pointer', mb: 0.5 }}> </td>
{evalItem.job_id} -{' '} <td>{row.output_model}</td>
{evalItem.template_name || evalItem.evaluator || 'Eval'} <td>
<Box>
{row.evals && row.evals.length > 0 ? (
row.evals.map((evalItem) => (
<Tooltip
key={evalItem.job_id}
title={
<pre style={{ margin: 0 }}>
{JSON.stringify(evalItem, null, 2)}
</pre>
}
>
<Typography
level="body2"
sx={{ cursor: 'pointer', mb: 0.5 }}
>
{evalItem.job_id} -{' '}
{evalItem.template_name ||
evalItem.evaluator ||
'Eval'}
</Typography>
</Tooltip>
))
) : (
<Typography level="body2">
No Evals
</Typography> </Typography>
</Tooltip> )}
)) </Box>
) : ( </td>
<Typography level="body2">No Evals</Typography> </tr>
)} ))}
</Box> </tbody>
</td> </Table>
</tr> ) : provenanceError ? (
))} <Typography>Error loading provenance</Typography>
</tbody> ) : (
</Table> <Typography>Loading Provenance...</Typography>
) : provenanceError ? ( )}
<Typography>Error loading provenance</Typography> </Box>
) : (
<Typography>Loading Provenance...</Typography>
)} )}
</Box> </Box>
</Box> </Box>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment