import EdgeItem from "@/app/[language]/etc/components/EdgeItem"; import { EtcAPIEdge } from "@/type/wwwAPI"; import { useTranslations } from "next-intl"; import ListGroup from "react-bootstrap/ListGroup"; import ListGroupItem from "react-bootstrap/ListGroupItem"; export default function TotalEdgesView({ totalEdges, }: { totalEdges: EtcAPIEdge[]; }) { const t = useTranslations(); return ( <ListGroup> <ListGroupItem>{t("etcTotalEdges")}</ListGroupItem> {totalEdges.map(({ edge, value }) => ( <ListGroupItem key={edge}> <EdgeItem edge={edge} text={t("avatarCountText", { avatarCount: value })} /> </ListGroupItem> ))} </ListGroup> ); }