Use new page title syntax for list pages

I'm not gonna do SSR here, the pages aren't really designed for partial loading state yet. It could be done, but I'm too sleepy! And it's too much refactor at once.
This commit is contained in:
Emi Matchu 2022-09-15 03:38:42 -07:00
parent 70fc8cdefe
commit e42f39f49b
2 changed files with 181 additions and 170 deletions

View file

@ -31,13 +31,14 @@ import {
WindowScroller,
} from "react-virtualized";
import { Heading1, Heading3, MajorErrorMessage, usePageTitle } from "./util";
import { Heading1, Heading3, MajorErrorMessage } from "./util";
import HangerSpinner from "./components/HangerSpinner";
import MarkdownAndSafeHTML from "./components/MarkdownAndSafeHTML";
import ItemCard from "./components/ItemCard";
import useCurrentUser from "./components/useCurrentUser";
import useSupport from "./WardrobePage/support/useSupport";
import WIPCallout from "./components/WIPCallout";
import Head from "next/head";
function UserItemListPage() {
const { query } = useRouter();
@ -74,8 +75,6 @@ function UserItemListPage() {
const closetList = data?.closetList;
usePageTitle(closetList?.name);
if (loading) {
return (
<Center>
@ -111,6 +110,12 @@ function UserItemListPage() {
}
return (
<>
<Head>
{closetList?.name && (
<title>{closetList?.name} | Dress to Impress</title>
)}
</Head>
<Box>
<Breadcrumb
fontSize="sm"
@ -140,6 +145,7 @@ function UserItemListPage() {
headingVariant="top-level"
/>
</Box>
</>
);
}

View file

@ -33,11 +33,12 @@ import { useRouter } from "next/router";
import { useQuery, useLazyQuery, useMutation } from "@apollo/client";
import HangerSpinner from "./components/HangerSpinner";
import { Heading1, Heading2, usePageTitle } from "./util";
import { Heading1, Heading2 } from "./util";
import SupportOnly from "./WardrobePage/support/SupportOnly";
import useSupport from "./WardrobePage/support/useSupport";
import useCurrentUser from "./components/useCurrentUser";
import { ClosetList, NeopetsStarIcon } from "./UserItemListPage";
import Head from "next/head";
const BadgeButton = React.forwardRef((props, ref) => (
<Badge as="button" ref={ref} {...props} />
@ -90,7 +91,6 @@ function UserItemListsIndexPage() {
} else {
pageTitleText = null;
}
usePageTitle(pageTitleText);
if (loading) {
return (
@ -151,6 +151,10 @@ function UserItemListsIndexPage() {
).size;
return (
<>
<Head>
<title>{pageTitleText} | Dress to Impress</title>
</Head>
<ClassNames>
{({ css }) => (
<Box>
@ -311,6 +315,7 @@ function UserItemListsIndexPage() {
</Box>
)}
</ClassNames>
</>
);
}