Skip to content

Commit

Permalink
fixed margin
Browse files Browse the repository at this point in the history
  • Loading branch information
@farzaank
farzaank committed Nov 1, 2023
1 parent 444760a commit 9fffaad
Show file tree
Hide file tree
Showing 2 changed files with 109 additions and 109 deletions.
2 changes: 1 addition & 1 deletion src/helm-frontend/src/routes/Landing.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ export default function LegacyLanding() {
</li>
</ol>
</div>
<div className="container">
<div className="container mx-auto">
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8">
<ModelsList models={schema.models} />
<ScenariosList runGroups={schema.run_groups} />
Expand Down
216 changes: 108 additions & 108 deletions src/helm-frontend/src/routes/Scenarios.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,119 +8,119 @@ import Link from "@/components/Link";
import Loading from "@/components/Loading";

export default function Scenarios() {
const [runGroups, setRunGroups] = useState<RunGroup[]>([] as RunGroup[]);
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any
const legacyRelease = (window as any).LEGACY_RELEASE;
const [runGroups, setRunGroups] = useState<RunGroup[]>([] as RunGroup[]);
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any
const legacyRelease = (window as any).LEGACY_RELEASE;

useEffect(() => {
const controller = new AbortController();
async function fetchData() {
const schema = await getSchema(controller.signal);
/**
* Currently just filtering out on a couple
* falsey values. This can likely be more robust
*/
setRunGroups(
schema.run_groups.filter(
(runGroup) =>
!runGroup.todo &&
runGroup.taxonomy &&
!runGroup.display_name.includes("CLEVA")
)
);
}
void fetchData();
useEffect(() => {
const controller = new AbortController();
async function fetchData() {
const schema = await getSchema(controller.signal);
/**
* Currently just filtering out on a couple
* falsey values. This can likely be more robust
*/
setRunGroups(
schema.run_groups.filter(
(runGroup) =>
!runGroup.todo &&
runGroup.taxonomy &&
!runGroup.display_name.includes("CLEVA"),
),
);
}
void fetchData();

return () => controller.abort();
}, []);
return () => controller.abort();
}, []);

const taskBuckets = Object.values(
runGroups.reduce(
(acc, runGroup) => {
const task = runGroup.taxonomy?.task || "Unknown";
if (acc[task] === undefined) {
acc[task] = {
name: task,
value: 1,
};
const taskBuckets = Object.values(
runGroups.reduce(
(acc, runGroup) => {
const task = runGroup.taxonomy?.task || "Unknown";
if (acc[task] === undefined) {
acc[task] = {
name: task,
value: 1,
};

return acc;
}
return acc;
}

acc[task].value += 1;
return acc;
},
{} as Record<string, { name: string; value: number }>
)
);
acc[task].value += 1;
return acc;
},
{} as Record<string, { name: string; value: number }>,
),
);

if (runGroups.length === 0) {
return <Loading />;
}
if (runGroups.length === 0) {
return <Loading />;
}

return (
<>
<PageTitle
title="Scenarios"
subtitle="Scenarios offer a broad coverage of diverse language-related tasks, helping to identify gaps in the model's capabilities. They aid in the standardization of model evaluation by creating a consistent benchmark, thereby ensuring fair and controlled comparisons across various models."
/>
<div className="overflow-x-auto mt-12">
<table className="table">
<thead>
<tr>
<th>Scenario</th>
<th>Task</th>
<th>What</th>
<th>Who</th>
<th>When</th>
<th>Language</th>
<th>Description</th>
</tr>
</thead>
<tbody>
{runGroups.map((runGroup) => (
<tr>
<td>
<Link to={`/${legacyRelease}/groups/${runGroup.name}`}>
<span className="text-lg">{runGroup.display_name}</span>
</Link>
<span className="block">{runGroup.name}</span>
</td>
<td>{runGroup.taxonomy?.task || ""}</td>
<td>{runGroup.taxonomy?.what || ""}</td>
<td>{runGroup.taxonomy?.who || ""}</td>
<td>{runGroup.taxonomy?.when || ""}</td>
<td>{runGroup.taxonomy?.language || ""}</td>
<td>
<MarkdownValue value={runGroup.description} />
</td>
</tr>
))}
</tbody>
</table>
<PageTitle
title="Analysis"
subtitle="Scenarios offer a broad coverage of diverse language-related tasks, helping to identify gaps in the model's capabilities. They aid in the standardization of model evaluation by creating a consistent benchmark, thereby ensuring fair and controlled comparisons across various models."
/>
<div className="grid md:grid-cols-4 gap-8">
<Card className="flex flex-col">
<Text>Total Scenarios</Text>
<Metric className="mx-auto my-6 md:mt-16 !text-[72px] md:!text-[96px]">
{runGroups.length}
</Metric>
</Card>
<Card className="col-span-3">
<div className="grid md:grid-cols-2 gap-x-12">
<BarList
data={taskBuckets.slice(0, Math.floor(taskBuckets.length / 2))}
/>
<BarList
data={taskBuckets.slice(Math.ceil(taskBuckets.length / 2))}
/>
</div>
</Card>
</div>
</div>
</>
);
return (
<>
<PageTitle
title="Scenarios"
subtitle="Scenarios offer a broad coverage of diverse language-related tasks, helping to identify gaps in the model's capabilities. They aid in the standardization of model evaluation by creating a consistent benchmark, thereby ensuring fair and controlled comparisons across various models."
/>
<div className="overflow-x-auto mt-12">
<table className="table">
<thead>
<tr>
<th>Scenario</th>
<th>Task</th>
<th>What</th>
<th>Who</th>
<th>When</th>
<th>Language</th>
<th>Description</th>
</tr>
</thead>
<tbody>
{runGroups.map((runGroup) => (
<tr>
<td>
<Link to={`/${legacyRelease}/groups/${runGroup.name}`}>
<span className="text-lg">{runGroup.display_name}</span>
</Link>
<span className="block">{runGroup.name}</span>
</td>
<td>{runGroup.taxonomy?.task || ""}</td>
<td>{runGroup.taxonomy?.what || ""}</td>
<td>{runGroup.taxonomy?.who || ""}</td>
<td>{runGroup.taxonomy?.when || ""}</td>
<td>{runGroup.taxonomy?.language || ""}</td>
<td>
<MarkdownValue value={runGroup.description} />
</td>
</tr>
))}
</tbody>
</table>
<PageTitle
title="Analysis"
subtitle="Scenarios offer a broad coverage of diverse language-related tasks, helping to identify gaps in the model's capabilities. They aid in the standardization of model evaluation by creating a consistent benchmark, thereby ensuring fair and controlled comparisons across various models."
/>
<div className="grid md:grid-cols-4 gap-8">
<Card className="flex flex-col">
<Text>Total Scenarios</Text>
<Metric className="mx-auto my-6 md:mt-16 !text-[72px] md:!text-[96px]">
{runGroups.length}
</Metric>
</Card>
<Card className="col-span-3">
<div className="grid md:grid-cols-2 gap-x-12">
<BarList
data={taskBuckets.slice(0, Math.floor(taskBuckets.length / 2))}
/>
<BarList
data={taskBuckets.slice(Math.ceil(taskBuckets.length / 2))}
/>
</div>
</Card>
</div>
</div>
</>
);
}

0 comments on commit 9fffaad

Please sign in to comment.