50 lines
1.5 KiB
TypeScript

import { GetStaticProps } from "next";
import SubPanel from "components/Panels/SubPanel";
import ContentPanel from "components/Panels/ContentPanel";
import LibraryItemComponent from "components/Library/LibraryItemComponent";
import { applyCustomAppProps } from "pages/_app";
import { GetLibraryItemsPreviewQuery } from "graphql/operations-types";
import { getLibraryItemsPreview } from "graphql/operations";
type Props = {
libraryItems: GetLibraryItemsPreviewQuery;
};
applyCustomAppProps(Library, {
useSubPanel: true,
useContentPanel: true,
});
export default function Library(props: Props): JSX.Element {
console.log(props);
return (
<>
<SubPanel>
<h2>Library</h2>
<p>
A comprehensive list of all Yokoverse&rsquo;s side materials (books,
novellas, artbooks, stage plays, manga, drama CDs, and comics). For
each, we provide photos and/or scans of the content, information about
what it is, when and how it was released, size, initial price
</p>
<hr />
</SubPanel>
<ContentPanel>
{props.libraryItems.libraryItems?.data.map((item) => (
<LibraryItemComponent key={item.id} item={item} />
))}
</ContentPanel>
</>
);
}
export const getStaticProps: GetStaticProps = async (context) => {
return {
props: {
libraryItems: await getLibraryItemsPreview({language_code: context.locale}),
},
};
};