forked from nihonium/nyanimedb
52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
import { ListView } from "../../components/ListView/ListView";
|
|
import { DefaultService } from "../../api/services/DefaultService";
|
|
import { TitleCardSquare } from "../../components/cards/TitleCardSquare";
|
|
import { TitleCardHorizontal } from "../../components/cards/TitleCardHorizontal";
|
|
import type { Title } from "../../api";
|
|
import { useState } from "react";
|
|
|
|
const PAGE_SIZE = 20;
|
|
export default function TitlesPage() {
|
|
const [search, setSearch] = useState("");
|
|
|
|
const loadTitles = async (cursor: string, limit: number) => {
|
|
const result = await DefaultService.getTitles(
|
|
cursor,
|
|
undefined,
|
|
true,
|
|
search,
|
|
undefined,
|
|
undefined,
|
|
undefined,
|
|
undefined,
|
|
limit,
|
|
undefined,
|
|
'all'
|
|
);
|
|
|
|
return {
|
|
items: result.data ?? [],
|
|
cursor: result.cursor ?? null,
|
|
};
|
|
};
|
|
|
|
return (
|
|
<div className="w-full min-h-screen bg-gray-50 p-6 text-black flex flex-col items-center">
|
|
|
|
<h1 className="text-4xl font-bold mb-6 text-center">Titles</h1>
|
|
|
|
<ListView<Title>
|
|
pageSize={PAGE_SIZE}
|
|
fetchItems={loadTitles}
|
|
searchPlaceholder="Search titles..."
|
|
renderItem={(title, layout) =>
|
|
layout === "square"
|
|
? <TitleCardSquare title={title} />
|
|
: <TitleCardHorizontal title={title} />
|
|
}
|
|
setSearch={setSearch}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
|