9e5afc9d48
* fix rank tracking unranked filters * improve modal dismissal and range selection * refactor: create shared table component
48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
import { useMemo } from "react";
|
|
import {
|
|
AppDataTable,
|
|
useAppTable,
|
|
} from "@/client/components/table/AppDataTable";
|
|
import { EmptyTableState } from "./BacklinksPageEmptyTableState";
|
|
import { backlinksColumns } from "./BacklinksTableColumns";
|
|
import type { BacklinksOverviewData } from "./backlinksPageTypes";
|
|
import { groupBacklinksByDomain } from "./backlinksPageUtils";
|
|
|
|
export function BacklinksTable({
|
|
rows,
|
|
}: {
|
|
rows: BacklinksOverviewData["backlinks"];
|
|
}) {
|
|
const groupedData = useMemo(() => groupBacklinksByDomain(rows), [rows]);
|
|
|
|
const table = useAppTable({
|
|
data: groupedData,
|
|
columns: backlinksColumns,
|
|
initialState: {
|
|
sorting: [{ id: "firstSeen", desc: true }],
|
|
},
|
|
getSubRows: (row) => row.subRows,
|
|
withSorting: true,
|
|
withExpanded: true,
|
|
getRowCanExpand: (row) => row.depth === 0,
|
|
});
|
|
|
|
if (rows.length === 0) {
|
|
return <EmptyTableState label="No backlinks match this filter." />;
|
|
}
|
|
|
|
return (
|
|
<AppDataTable
|
|
table={table}
|
|
fixedLayout
|
|
getRowProps={(row) => ({
|
|
className:
|
|
row.depth === 0
|
|
? "cursor-pointer bg-base-200/50 transition-colors hover:bg-base-200/80"
|
|
: "bg-base-100",
|
|
onClick: row.depth === 0 ? row.getToggleExpandedHandler() : undefined,
|
|
})}
|
|
/>
|
|
);
|
|
}
|