From 0d892aad126b10011fd3a8bdea52f2dfdfc41d09 Mon Sep 17 00:00:00 2001 From: Sam Becker Date: Mon, 15 Jan 2024 23:54:08 -0600 Subject: [PATCH] Use global state in MoreComponents for better forward/back UX --- src/app/layout.tsx | 45 +++++++++++++----------- src/components/AnimateItems.tsx | 2 +- src/components/MoreComponents.tsx | 52 +++++++++++++++++++--------- src/photo/MorePhotosLarge.tsx | 1 + src/photo/PhotoLink.tsx | 2 +- src/photo/PhotoLinks.tsx | 2 +- src/state/{index.ts => AppState.ts} | 0 src/state/AppStateProvider.tsx | 4 +-- src/state/MoreComponentsProvider.tsx | 42 ++++++++++++++++++++++ src/state/MoreComponentsState.ts | 50 ++++++++++++++++++++++++++ 10 files changed, 158 insertions(+), 42 deletions(-) rename src/state/{index.ts => AppState.ts} (100%) create mode 100644 src/state/MoreComponentsProvider.tsx create mode 100644 src/state/MoreComponentsState.ts diff --git a/src/app/layout.tsx b/src/app/layout.tsx index a278f0aa..3cd89156 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -3,7 +3,7 @@ import { SpeedInsights } from '@vercel/speed-insights/react'; import { clsx } from 'clsx/lite'; import { IBM_Plex_Mono } from 'next/font/google'; import { BASE_URL, SITE_DESCRIPTION, SITE_TITLE } from '@/site/config'; -import StateProvider from '@/state/AppStateProvider'; +import AppStateProvider from '@/state/AppStateProvider'; import ThemeProviderClient from '@/site/ThemeProviderClient'; import Nav from '@/site/Nav'; import ToasterWithThemes from '@/toast/ToasterWithThemes'; @@ -13,6 +13,7 @@ import { Suspense } from 'react'; import FooterClient from '@/site/FooterClient'; import NavClient from '@/site/NavClient'; import { Metadata } from 'next/types'; +import MoreComponentsProvider from '@/state/MoreComponentsProvider'; import '../site/globals.css'; @@ -72,27 +73,29 @@ export default function RootLayout({ suppressHydrationWarning > - - -
- }> -
- - + }> +