OpenNeo/impress-2020
OpenNeo/impress-2020
1
0
Fork 0
Code Pull requests Activity

[WIP] Migrate /modeling to Next.js routing

Browse source 
Mostly easy, but with a link we needed to migrate in the `ItemCard` component! (I see one in `SquareItemCard` too, but I'll wait until it comes up.)
This commit is contained in:
Emi Matchu 2022-09-14 19:52:10 -07:00
parent 296d641c03
commit 02af99dded
3 changed files with 27 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
pages/modeling.tsx Normal file
View file

@ -0,0 +1,5 @@
import ModelingPage from "../src/app/ModelingPage";
export default function ModelingPageWrapper() {
return <ModelingPage />;
}

6
src/app/App.js
View file

@ -20,7 +20,6 @@ const ItemTradesOfferingPage = loadable(() =>
const ItemTradesSeekingPage = loadable(() => const ItemTradesSeekingPage = loadable(() =>
import("./ItemTradesPage").then((m) => m.ItemTradesSeekingPage) import("./ItemTradesPage").then((m) => m.ItemTradesSeekingPage)
); );
const ModelingPage = loadable(() => import("./ModelingPage"));
const UserItemListsIndexPage = loadable(() => const UserItemListsIndexPage = loadable(() =>
import("./UserItemListsIndexPage") import("./UserItemListsIndexPage")
); );
@ -96,11 +95,6 @@ function App() {
<UserOutfitsPage /> <UserOutfitsPage />
</PageLayout> </PageLayout>
</Route> </Route>
<Route path="/modeling">
<PageLayout>
<ModelingPage />
</PageLayout>
</Route>
<Route path="/"> <Route path="/">
<PageLayout hideHomeLink> <PageLayout hideHomeLink>
<HomePage /> <HomePage />

43
src/app/components/ItemCard.js
View file

@ -17,7 +17,7 @@ import {
StarIcon, StarIcon,
} from "@chakra-ui/icons"; } from "@chakra-ui/icons";
import { HiSparkles } from "react-icons/hi"; import { HiSparkles } from "react-icons/hi";
import { Link } from "react-router-dom"; import Link from "next/link";
import SquareItemCard from "./SquareItemCard"; import SquareItemCard from "./SquareItemCard";
import { safeImageUrl, useCommonStyles } from "../util"; import { safeImageUrl, useCommonStyles } from "../util";
@ -30,26 +30,27 @@ function ItemCard({ item, badges, variant = "list", ...props }) {
return <SquareItemCard item={item} {...props} />; return <SquareItemCard item={item} {...props} />;
case "list": case "list":
return ( return (
<Box <Link href={`/items/${item.id}`} passHref>
as={Link} <Box
to={`/items/${item.id}`} as="a"
display="block" display="block"
p="2" p="2"
boxShadow="lg" boxShadow="lg"
borderRadius="lg" borderRadius="lg"
background={brightBackground} background={brightBackground}
transition="all 0.2s" transition="all 0.2s"
className="item-card" className="item-card"
width="100%" width="100%"
minWidth="0" minWidth="0"
{...props} {...props}
> >
<ItemCardContent <ItemCardContent
item={item} item={item}
badges={badges} badges={badges}
focusSelector=".item-card:hover &, .item-card:focus &" focusSelector=".item-card:hover &, .item-card:focus &"
/> />
</Box> </Box>
</Link>
); );
default: default:
throw new Error(`Unexpected ItemCard variant: ${variant}`); throw new Error(`Unexpected ItemCard variant: ${variant}`);