diff --git a/src/components/dashboard/PagesManager.tsx b/src/components/dashboard/PagesManager.tsx index 2f79ea04..7e80bf3b 100644 --- a/src/components/dashboard/PagesManager.tsx +++ b/src/components/dashboard/PagesManager.tsx @@ -68,7 +68,7 @@ export const PagesManager: React.FC<{ const pages = useGetPagesBySite({ type: isPost ? "post" : "page", site: subdomain!, - take: 1000, + take: 100, visibility, render: true, }) @@ -320,6 +320,8 @@ export const PagesManager: React.FC<{ ) + let currentLength = 0 + return (
@@ -371,82 +373,101 @@ export const PagesManager: React.FC<{
- {pages.data?.list.length === 0 && ( + {!pages.data?.pages?.[0].total && ( )} - {pages.data?.list?.map((page) => { - return ( - -
- {page.title ? ( -
- {page.title} -
- ) : ( -
- {page.summary?.content} -
- )} -
- - {getPageVisibility(page).toLowerCase()} - - · - - {getPageVisibility(page) === PageVisibilityEnum.Draft - ? formatDate(page.date_updated) - : formatDate(page.date_published)} - -
-
-
- - {({ open }: { open: boolean }) => ( - <> - - - - - {getPageMenuItems(page).map((item) => { - return ( - - - - ) - })} - - + {pages.data?.pages.map((page) => + page.list?.map((page) => { + currentLength++ + return ( + +
+ {page.title ? ( +
+ {page.title} +
+ ) : ( +
+ {page.summary?.content} +
)} -
-
- - ) - })} +
+ + {getPageVisibility(page).toLowerCase()} + + · + + {getPageVisibility(page) === PageVisibilityEnum.Draft + ? formatDate(page.date_updated) + : formatDate(page.date_published)} + +
+
+
+ + {({ open }: { open: boolean }) => ( + <> + + + + + {getPageMenuItems(page).map((item) => { + return ( + + + + ) + })} + + + )} + +
+ + ) + }), + )} + + {pages.hasNextPage && ( + + )} ) diff --git a/src/components/site/SiteArchives.tsx b/src/components/site/SiteArchives.tsx index b00c3c2e..7302ea21 100644 --- a/src/components/site/SiteArchives.tsx +++ b/src/components/site/SiteArchives.tsx @@ -4,58 +4,75 @@ import { formatDate } from "~/lib/date" import { EmptyState } from "../ui/EmptyState" import { Notes, Note } from "~/lib/types" import { UniLink } from "../ui/UniLink" +import { Button } from "~/components/ui/Button" export const SiteArchives: React.FC<{ - posts?: Notes title?: string showTags?: boolean -}> = ({ posts, title, showTags }) => { + postPages?: Notes[] + fetchNextPage: () => void + hasNextPage?: boolean + isFetchingNextPage?: boolean +}> = ({ + title, + showTags, + postPages, + fetchNextPage, + hasNextPage, + isFetchingNextPage, +}) => { + let currentLength = 0 + const groupedByYear = useMemo>(() => { const map = new Map() - if (posts) { - for (const post of posts.list) { - const year = formatDate(post.date_published, "YYYY") - const items = map.get(year) || [] - items.push(post) - map.set(year, items) + if (postPages?.length) { + for (const posts of postPages) { + for (const post of posts.list) { + const year = formatDate(post.date_published, "YYYY") + const items = map.get(year) || [] + items.push(post) + map.set(year, items) + } } } return map - }, [posts]) + }, [postPages]) const tags = useMemo>(() => { const result = new Map() - if (posts) { - for (const post of posts.list) { - post.tags?.forEach((tag) => { - if (tag !== "post" && tag !== "page") { - if (result.has(tag)) { - result.set(tag, result.get(tag) + 1) - } else { - result.set(tag, 1) + if (postPages?.length) { + for (const posts of postPages) { + for (const post of posts.list) { + post.tags?.forEach((tag) => { + if (tag !== "post" && tag !== "page") { + if (result.has(tag)) { + result.set(tag, result.get(tag) + 1) + } else { + result.set(tag, 1) + } } - } - }) + }) + } } } return result - }, [posts]) + }, [postPages]) - if (!posts) return null + if (!postPages?.length) return null return ( <>

{title || "Archives"}

- {posts.list.length === 0 && ( + {!postPages[0].total && (
)} - {posts.list.length > 0 && ( + {postPages[0].total && ( <> {showTags && tags.size > 0 && (
@@ -74,6 +91,7 @@ export const SiteArchives: React.FC<{ )}
{[...groupedByYear.keys()].map((year) => { + currentLength++ const posts = groupedByYear.get(year)! return (
@@ -97,6 +115,18 @@ export const SiteArchives: React.FC<{
) })} + {hasNextPage && ( + + )}
)} diff --git a/src/components/site/SiteHome.tsx b/src/components/site/SiteHome.tsx index c0dd902c..9cb54b9d 100644 --- a/src/components/site/SiteHome.tsx +++ b/src/components/site/SiteHome.tsx @@ -90,9 +90,9 @@ export const SiteHome: React.FC<{ onClick={fetchNextPage} isLoading={isFetchingNextPage} > - There are {postPages[0].total - currentLength} more{" "} - {postPages[0].total - currentLength > 1 ? "posts" : "post"}, click to - load more + There are {postPages[0].total - currentLength} more post + {postPages[0].total - currentLength > 1 ? "s" : ""}, click to load + more )} diff --git a/src/components/site/SiteLayout.server.tsx b/src/components/site/SiteLayout.server.tsx index 61cdb853..ddda1e64 100644 --- a/src/components/site/SiteLayout.server.tsx +++ b/src/components/site/SiteLayout.server.tsx @@ -12,6 +12,9 @@ import { notFound } from "~/lib/server-side-props" export const getServerSideProps = async ( ctx: any, queryClient: QueryClient, + options?: { + take?: number + }, ) => { const domainOrSubdomain = ctx.params!.site as string const pageSlug = ctx.params!.page as string @@ -53,6 +56,7 @@ export const getServerSideProps = async ( await prefetchGetPagesBySite( { site: domainOrSubdomain, + ...(options?.take && { take: options.take }), type: "post", visibility: PageVisibilityEnum.Published, render: true, diff --git a/src/pages/_site/[site]/archives.tsx b/src/pages/_site/[site]/archives.tsx index 4a1f7d32..334afaf8 100644 --- a/src/pages/_site/[site]/archives.tsx +++ b/src/pages/_site/[site]/archives.tsx @@ -13,11 +13,13 @@ export const getServerSideProps: GetServerSideProps = serverSidePropsHandler( async (ctx) => { const queryClient = new QueryClient() const domainOrSubdomain = ctx.params!.site as string - await getLayoutServerSideProps(ctx, queryClient) + await getLayoutServerSideProps(ctx, queryClient, { + take: 100, + }) return { props: { - dehydratedState: dehydrate(queryClient), + dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))), domainOrSubdomain, }, } @@ -33,13 +35,21 @@ function SiteArchivesPage({ }) { const posts = useGetPagesBySite({ site: domainOrSubdomain, - take: 1000, + take: 100, type: "post", visibility: PageVisibilityEnum.Published, render: true, }) - return + return ( + + ) } SiteArchivesPage.getLayout = (page: ReactElement) => { diff --git a/src/pages/_site/[site]/tag/[tag].tsx b/src/pages/_site/[site]/tag/[tag].tsx index 3fab51de..e4dc479a 100644 --- a/src/pages/_site/[site]/tag/[tag].tsx +++ b/src/pages/_site/[site]/tag/[tag].tsx @@ -15,11 +15,13 @@ export const getServerSideProps: GetServerSideProps = serverSidePropsHandler( const domainOrSubdomain = ctx.params!.site as string const tag = ctx.params!.tag as string - await getLayoutServerSideProps(ctx, queryClient) + await getLayoutServerSideProps(ctx, queryClient, { + take: 100, + }) return { props: { - dehydratedState: dehydrate(queryClient), + dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))), domainOrSubdomain, tag, }, @@ -38,14 +40,22 @@ function SiteTagPage({ }) { const posts = useGetPagesBySite({ site: domainOrSubdomain, - take: 1000, + take: 100, type: "post", visibility: PageVisibilityEnum.Published, render: true, tags: [tag], }) - return + return ( + + ) } SiteTagPage.getLayout = (page: ReactElement) => {