app/src/pages/expression-sets/index.tsx

41 lines
1.1 KiB
TypeScript

import type { NextPage } from "next";
import Link from "next/link";
import { ExpressionSetCard } from "../../components/ExpressionSetCard";
import { Page } from "../../components/Page";
import { useExpressionData } from "../../hooks/useExpressionData";
const ExpressionSetListPage: NextPage = () => {
const { expression_sets, expression_to_expression_set } = useExpressionData();
return (
<Page>
<div className="content-list">
{expression_sets.map(({ id, name, description }) => (
<Link
key={id}
href={{
pathname: "/expression-sets/details",
query: { "set-id": id },
}}
passHref
>
<a>
<ExpressionSetCard
name={name}
description={description}
word_count={
expression_to_expression_set.filter(
(item) => item.expression_set_id === id
).length
}
/>
</a>
</Link>
))}
</div>
</Page>
);
};
export default ExpressionSetListPage;