From e80d8bf06b3a98cf4fc9555ce4942b96041d9588 Mon Sep 17 00:00:00 2001
From: Guillaume FORTAINE <guillaume.fortaine-ext@mousquetaires.com>
Date: Mon, 14 Nov 2022 01:22:08 +0100
Subject: [PATCH] feat: Add pagination and more button at the bottom

---
 app/item/[id]/page.js           |  19 +++++
 app/item/page.js                |  19 -----
 app/news/[page]/page.js         |  22 +++++
 app/page.js                     |  30 -------
 components/header.module.css    |  12 ++-
 components/nav.js               |  18 ++--
 components/nav.module.css       |   4 +-
 components/skeletons.module.css |   1 +
 components/stories.js           |  45 ++++++----
 components/stories.module.css   |   3 +-
 components/story.js             |  35 ++++----
 components/story.module.css     |  16 ++++
 lib/get-item.js                 |  36 ++++----
 next.config.js                  |  12 ++-
 package.json                    |   3 +-
 pnpm-lock.yaml                  | 147 +++++++++++++++-----------------
 16 files changed, 228 insertions(+), 194 deletions(-)
 create mode 100644 app/item/[id]/page.js
 delete mode 100644 app/item/page.js
 create mode 100644 app/news/[page]/page.js
 delete mode 100644 app/page.js

diff --git a/app/item/[id]/page.js b/app/item/[id]/page.js
new file mode 100644
index 0000000..98901e8
--- /dev/null
+++ b/app/item/[id]/page.js
@@ -0,0 +1,19 @@
+import { notFound } from 'next/navigation';
+import Item from '../../../components/item';
+
+// Utils
+import fetchData from '../../../lib/fetch-data';
+import { transform } from '../../../lib/get-item';
+
+export default async function ItemPage({ params }) {
+  const { id } = params;
+
+  if (!id) {
+    notFound();
+  }
+
+  const data = await fetchData(`item/${id}`);
+  const story = transform(data);
+
+  return <Item story={story} />;
+}
\ No newline at end of file
diff --git a/app/item/page.js b/app/item/page.js
deleted file mode 100644
index 0954f3b..0000000
--- a/app/item/page.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import { notFound } from 'next/navigation';
-import Item from '../../components/item';
-
-// Utils
-import fetchData from '../../lib/fetch-data';
-import { transform } from '../../lib/get-item';
-
-export default async function ItemPage({ searchParams }) {
-  const { id } = searchParams;
-  if (!id) {
-    notFound();
-  }
-
-  const data = await fetchData(`item/${id}`);
-  const story = transform(data);
-  return <Item story={story} />;
-}
-
-export const revalidate = 0;
\ No newline at end of file
diff --git a/app/news/[page]/page.js b/app/news/[page]/page.js
new file mode 100644
index 0000000..487a990
--- /dev/null
+++ b/app/news/[page]/page.js
@@ -0,0 +1,22 @@
+// Server Components
+import SystemInfo from '../../../components/server-info'
+
+// Client Components
+import Stories from '../../../components/stories'
+import Footer from '../../../components/footer'
+
+// Utils
+import fetchData from '../../../lib/fetch-data'
+
+export default async function RSCPage({ params }) {
+  const { page } = params;
+  const storyIds = await fetchData('topstories')
+
+  return (
+    <>
+      <Stories page={page} storyIds={storyIds} />
+      <Footer />
+      <SystemInfo />
+    </>
+  )
+}
diff --git a/app/page.js b/app/page.js
deleted file mode 100644
index 33fad0d..0000000
--- a/app/page.js
+++ /dev/null
@@ -1,30 +0,0 @@
-// Server Components
-import SystemInfo from '../components/server-info';
-
-// Client Components
-import Story from '../components/story';
-import Footer from '../components/footer';
-
-// Utils
-import fetchData from '../lib/fetch-data';
-import { transform } from '../lib/get-item';
-
-async function StoryWithData({ id }) {
-  const data = await fetchData(`item/${id}`);
-  const story = transform(data);
-  return <Story {...story} />;
-}
-
-export default async function RSCPage() {
-  const storyIds = await fetchData('topstories');
-
-  return (
-    <>
-      {storyIds.slice(0, 30).map((id) => {
-        return <StoryWithData id={id} key={id} />;
-      })}
-      <Footer />
-      <SystemInfo />
-    </>
-  );
-}
diff --git a/components/header.module.css b/components/header.module.css
index 419622b..f31de5c 100644
--- a/components/header.module.css
+++ b/components/header.module.css
@@ -10,7 +10,9 @@
 }
 
 .left {
-  flex: 9;
+  display: grid;
+  grid-auto-flow: column;
+  align-items: center;
 }
 
 .right {
@@ -31,8 +33,7 @@
 a.login {
   padding: 10px;
   display: inline-block;
-  font-size: 11px;
-  text-transform: uppercase;
+  font-size: 10pt;
   text-decoration: none;
   color: #000;
 }
@@ -47,6 +48,10 @@ a.login {
 }
 
 @media (max-width: 750px) {
+  .left {
+    grid-auto-flow: row;
+  }
+
   .site-title {
     font-size: 16px;
     padding-bottom: 0;
@@ -58,5 +63,6 @@ a.login {
 
   .nav {
     display: block;
+    margin-left: 10px;
   }
 }
diff --git a/components/nav.js b/components/nav.js
index 3c93c72..3d51e4c 100644
--- a/components/nav.js
+++ b/components/nav.js
@@ -3,11 +3,19 @@ import styles from './nav.module.css'
 export default function Nav() {
   return (
     <ul className={styles['nav-ul']}>
-      <Item href="/">new</Item>
-      <Item href="/">show</Item>
-      <Item href="/">ask</Item>
-      <Item href="/">jobs</Item>
-      <Item href="/">submit</Item>
+      <Item href="/newest">new</Item>
+      {" | "}
+      <Item href="/front">past</Item>
+      {" | "}
+      <Item href="/newcomments">show</Item>
+      {" | "}
+      <Item href="/ask">ask</Item>
+      {" | "}
+      <Item href="/show">show</Item>
+      {" | "}
+      <Item href="/jobs">jobs</Item>
+      {" | "}
+      <Item href="/submit">submit</Item>
     </ul>
   )
 }
diff --git a/components/nav.module.css b/components/nav.module.css
index 2fe5359..2a6bedb 100644
--- a/components/nav.module.css
+++ b/components/nav.module.css
@@ -8,9 +8,7 @@
 
 .nav-ul li a {
   display: inline-block;
-  padding: 10px;
-  font-size: 11px;
-  text-transform: uppercase;
+  font-size: 10pt;
   text-decoration: none;
   color: #000;
 }
diff --git a/components/skeletons.module.css b/components/skeletons.module.css
index 3f6fcba..9bf0e5f 100644
--- a/components/skeletons.module.css
+++ b/components/skeletons.module.css
@@ -1,6 +1,7 @@
 .item-skeleton {
   margin: 5px 0;
   overflow: hidden;
+  flex: 100 1;
 }
 
 .item-skeleton:before,
diff --git a/components/stories.js b/components/stories.js
index 7714bc0..45da083 100644
--- a/components/stories.js
+++ b/components/stories.js
@@ -1,22 +1,35 @@
-import Story from './story'
 import Link from 'next/link'
+import Story from './story'
+
+import fetchData from '../lib/fetch-data'
+import { transform } from '../lib/get-item'
 
 import styles from './stories.module.css'
 
-export default ({ stories, page = 1, offset = null }) => (
-  <div>
-    {stories.map((story, i) => (
-      <div key={story.id} className={styles.item}>
-        {null != offset ? (
-          <span className={styles.count}>{i + offset + 1}</span>
-        ) : null}
-        <div className={styles.story}>
-          <Story {...story} />
+async function StoryWithData({ id }) {
+  const data = await fetchData(`item/${id}`)
+  const story = transform(data)
+
+  return <Story {...story} />
+}
+
+export default async function Stories({ storyIds, page = 1 }) {
+  const limit = 30
+  const offset = (page - 1) * limit
+
+  return (
+    <div>
+      {storyIds.slice(offset, offset + limit).map((id, i) => (
+        <div key={id} className={styles.item}>
+          {null != offset ? (
+            <span className={styles.count}>{i + offset + 1}</span>
+          ) : null}
+          <StoryWithData id={id} key={id} />
         </div>
+      ))}
+      <div className={styles.footer}>
+        <Link href={`/news/${+page + 1}`}>More</Link>
       </div>
-    ))}
-    <footer className={styles.footer}>
-      <Link href={`/news?p=${page + 1}`}>More</Link>
-    </footer>
-  </div>
-)
+    </div>
+  )
+}
diff --git a/components/stories.module.css b/components/stories.module.css
index 6a80583..d518973 100644
--- a/components/stories.module.css
+++ b/components/stories.module.css
@@ -6,7 +6,6 @@
 .count {
   flex-basis: auto;
   flex-grow: 1;
-  vertical-align: top;
   font-size: 14px;
   padding-right: 5px;
   display: block;
@@ -24,7 +23,7 @@
 }
 
 .footer {
-  padding: 10px 0 40px 30px;
+  padding: 10px 0 0 32px;
 }
 
 .footer a {
diff --git a/components/story.js b/components/story.js
index ac2b69a..4a2f743 100644
--- a/components/story.js
+++ b/components/story.js
@@ -1,10 +1,10 @@
-'use client';
+'use client'
 
-import { useState } from 'react';
+import { useState } from 'react'
 
-import timeAgo from '../lib/time-ago';
+import timeAgo from '../lib/time-ago'
 
-import styles from './story.module.css';
+import styles from './story.module.css'
 
 export default function Story({
   id,
@@ -13,21 +13,16 @@ export default function Story({
   url,
   user,
   score,
-  commentsCount,
+  commentsCount
 }) {
-  const { host } = url ? new URL(url) : { host: '#' };
-  const [voted, setVoted] = useState(false);
+  const { host } = url ? new URL(url) : { host: '#' }
+  const [voted, setVoted] = useState(false)
 
   return (
-    <div style={{ margin: '5px 0' }}>
+    <div className={styles.story}>
       <div className={styles.title}>
         <span
-          style={{
-            cursor: 'pointer',
-            fontFamily: 'sans-serif',
-            marginRight: 5,
-            color: voted ? '#ffa52a' : '#ccc',
-          }}
+          className={voted ? styles['votearrow--voted'] : styles.votearrow}
           onClick={() => setVoted(!voted)}
         >
           &#9650;
@@ -35,23 +30,25 @@ export default function Story({
         <a href={url}>{title}</a>
         {url && (
           <span className={styles.source}>
+            {' ('}
             <a href={`http://${host}`}>{host.replace(/^www\./, '')}</a>
+            {')'}
           </span>
         )}
       </div>
       <div className={styles.meta}>
         {score} {plural(score, 'point')} by{' '}
-        <a href={`/user?id=${user}`}>{user}</a>{' '}
-        <a href={`/item?id=${id}`}>
+        <a href={`/user/${user}`}>{user}</a>{' '}
+        <a href={`/item/${id}`}>
           {timeAgo(new Date(date)) /* note: we re-hydrate due to ssr */} ago
         </a>{' '}
         |{' '}
-        <a href={`/item?id=${id}`}>
+        <a href={`/item/${id}`}>
           {commentsCount} {plural(commentsCount, 'comment')}
         </a>
       </div>
     </div>
-  );
+  )
 }
 
-const plural = (n, s) => s + (n === 0 || n > 1 ? 's' : '');
+const plural = (n, s) => s + (n === 0 || n > 1 ? 's' : '')
diff --git a/components/story.module.css b/components/story.module.css
index 92fa9a3..75d34ea 100644
--- a/components/story.module.css
+++ b/components/story.module.css
@@ -1,8 +1,24 @@
+.story {
+  flex: 100 1;
+  display: inline-block;
+}
+
 .title {
   font-size: 15px;
   margin-bottom: 3px;
 }
 
+.votearrow {
+  cursor: pointer;
+  font-family: sans-serif;
+  color: #ccc;
+}
+
+.votearrow--voted {
+  composes: votearrow;
+  color: #ffa52a
+}
+
 .title > a {
   color: #000;
   text-decoration: none;
diff --git a/lib/get-item.js b/lib/get-item.js
index e348f05..16d2754 100644
--- a/lib/get-item.js
+++ b/lib/get-item.js
@@ -1,25 +1,29 @@
-import fetchData from './fetch-data';
+import fetchData from './fetch-data'
 
 export default async function (id) {
-  const val = await fetchData(`item/${id}`);
+  const val = await fetchData(`item/${id}`)
   if (val) {
-    return transform(val);
+    return transform(val)
   } else {
-    return null;
+    return null
   }
 }
 
 export function transform(val) {
-  return {
-    id: val.id,
-    url: val.url || '',
-    user: val.by,
-    // time is seconds since epoch, not ms
-    date: new Date(val.time * 1000).getTime() || 0,
-    // sometimes `kids` is `undefined`
-    comments: val.kids || [],
-    commentsCount: val.descendants || 0,
-    score: val.score,
-    title: val.title,
-  };
+  if (val) {
+    return {
+      id: val.id,
+      url: val.url || '',
+      user: val.by,
+      // time is seconds since epoch, not ms
+      date: new Date(val.time * 1000).getTime() || 0,
+      // sometimes `kids` is `undefined`
+      comments: val.kids || [],
+      commentsCount: val.descendants || 0,
+      score: val.score,
+      title: val.title
+    }
+  } else {
+    return null
+  }
 }
diff --git a/next.config.js b/next.config.js
index ed0e878..6f1d07e 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,5 +1,13 @@
 module.exports = {
   experimental: {
-    appDir: true,
+    appDir: true
   },
-};
+  async rewrites() {
+    return [
+      {
+        source: '/',
+        destination: '/news/1'
+      }
+    ]
+  }
+}
diff --git a/package.json b/package.json
index 9f9cdee..57ebe11 100644
--- a/package.json
+++ b/package.json
@@ -1,4 +1,5 @@
 {
+  "packageManager": "pnpm@7.15.0",
   "scripts": {
     "dev": "next dev",
     "build": "next build",
@@ -6,7 +7,7 @@
   },
   "dependencies": {
     "ms": "2.1.3",
-    "next": "^13.0.3",
+    "next": "^13.1.0",
     "react": "^18.3.0-next",
     "react-dom": "^18.3.0-next"
   },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b2cc13e..239501b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -2,24 +2,24 @@ lockfileVersion: 5.4
 
 specifiers:
   ms: 2.1.3
-  next: ^13.0.3
+  next: ^13.1.0
   react: ^18.3.0-next
   react-dom: ^18.3.0-next
 
 dependencies:
   ms: 2.1.3
-  next: 13.0.3_d6rcamawdo45avnz6jxiy6p4si
-  react: 18.3.0-next-fecc288b7-20221025
-  react-dom: 18.3.0-next-fecc288b7-20221025_cb5ruxkz3bqlxwvs2j6rdcpmja
+  next: 13.1.0_zqregvc5b5zp3p4caivl4eqniq
+  react: 18.3.0-next-5fcf1a4b4-20221221
+  react-dom: 18.3.0-next-5fcf1a4b4-20221221_djgvdp5ul6h7czq567rw76bfri
 
 packages:
 
-  /@next/env/13.0.3:
-    resolution: {integrity: sha512-/4WzeG61Ot/PxsghXkSqQJ6UohFfwXoZ3dtsypmR9EBP+OIax9JRq0trq8Z/LCT9Aq4JbihVkaazRWguORjTAw==}
+  /@next/env/13.1.0:
+    resolution: {integrity: sha512-6iNixFzCndH+Bl4FetQzOMjxCJqg8fs0LAlZviig1K6mIjOWH2m2oPcHcOg1Ta5VCe7Bx5KG1Hs+NrWDUkBt9A==}
     dev: false
 
-  /@next/swc-android-arm-eabi/13.0.3:
-    resolution: {integrity: sha512-uxfUoj65CdFc1gX2q7GtBX3DhKv9Kn343LMqGNvXyuTpYTGMmIiVY7b9yF8oLWRV0gVKqhZBZifUmoPE8SJU6Q==}
+  /@next/swc-android-arm-eabi/13.1.0:
+    resolution: {integrity: sha512-ANBZZRjZBV+Sii11ZVxbxSvfIi6dZwu4w+XnJBDmz+0/wtAigpjYWyMkuWZ/RCD7INdusOlU4EgJ99WzWGIDjA==}
     engines: {node: '>= 10'}
     cpu: [arm]
     os: [android]
@@ -27,8 +27,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-android-arm64/13.0.3:
-    resolution: {integrity: sha512-t2k+WDfg7Cq2z/EnalKGsd/9E5F4Hdo1xu+UzZXYDpKUI9zgE6Bz8ajQb8m8txv3qOaWdKuDa5j5ziq9Acd1Xw==}
+  /@next/swc-android-arm64/13.1.0:
+    resolution: {integrity: sha512-nPwbkS3aZjCIe61wztgjXjIeylijOP8uGtDGjjJVUF3B/5GLVx3ngZu6tjPTMEgaLM0u//HuGK+aZolWUQWE4g==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [android]
@@ -36,8 +36,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-darwin-arm64/13.0.3:
-    resolution: {integrity: sha512-wV6j6SZ1bc/YHOLCLk9JVqaZTCCey6HBV7inl2DriHsHqIcO6F3+QiYf0KXwRP9BE0GSZZrYd5mZQm2JPTHdJA==}
+  /@next/swc-darwin-arm64/13.1.0:
+    resolution: {integrity: sha512-0hUydiAW18jK2uGPnZRdnRQtdB/3ZoPo84A6zH7MJHxAWw9lzVsv3kMg9kgVBBlrivzqdNN8rdgA+eYNxzXU9w==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [darwin]
@@ -45,8 +45,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-darwin-x64/13.0.3:
-    resolution: {integrity: sha512-jaI2CMuYWvUtRixV3AIjUhnxUDU1FKOR+8hADMhYt3Yz+pCKuj4RZ0n0nY5qUf3qT1AtvnJXEgyatSFJhSp/wQ==}
+  /@next/swc-darwin-x64/13.1.0:
+    resolution: {integrity: sha512-3S3iQqJIysklj0Q9gnanuYMzF8H9p+fUVhvSHxVVLcKH4HsE8EGddNkXsaOyznL1kC6vGKw7h6uz1ojaXEafCA==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [darwin]
@@ -54,8 +54,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-freebsd-x64/13.0.3:
-    resolution: {integrity: sha512-nbyT0toBTJrcj5TCB9pVnQpGJ3utGyQj4CWegZs1ulaeUQ5Z7CS/qt8nRyYyOKYHtOdSCJ9Nw5F/RgKNkdpOdw==}
+  /@next/swc-freebsd-x64/13.1.0:
+    resolution: {integrity: sha512-wAgzwm/em48GIuWq3OYr0BpncMy7c+UA3hsyX+xKh/vb/sOIpQly7JTa+GNdk17s7kprhMfsgzPG3da36NLpkA==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [freebsd]
@@ -63,8 +63,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-arm-gnueabihf/13.0.3:
-    resolution: {integrity: sha512-1naLxYvRUQCoFCU1nMkcQueRc0Iux9xBv1L5pzH2ejtIWFg8BrSgyuluJG4nyAhFCx4WG863IEIkAaefOowVdA==}
+  /@next/swc-linux-arm-gnueabihf/13.1.0:
+    resolution: {integrity: sha512-Cr2hzL7ad+4nj9KrR1Cz1RDcsWa61X6I7gc6PToRYIY4gL480Sijq19xo7dlXQPnr1viVzbNiNnNXZASHv7uvw==}
     engines: {node: '>= 10'}
     cpu: [arm]
     os: [linux]
@@ -72,8 +72,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-arm64-gnu/13.0.3:
-    resolution: {integrity: sha512-3Z4A8JkuGWpMVbUhUPQInK/SLY+kijTT78Q/NZCrhLlyvwrVxaQALJNlXzxDLraUgv4oVH0Wz/FIw1W9PUUhxA==}
+  /@next/swc-linux-arm64-gnu/13.1.0:
+    resolution: {integrity: sha512-EjCIKfeZB9h72evL2yGNwBvE5Im96Zn7o2zxImlvCiUYb/xXDqn4hzhck035BSP3g3sGDLfijFTE1wKRyXIk4w==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
@@ -81,8 +81,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-arm64-musl/13.0.3:
-    resolution: {integrity: sha512-MoYe9SM40UaunTjC+01c9OILLH3uSoeri58kDMu3KF/EFEvn1LZ6ODeDj+SLGlAc95wn46hrRJS2BPmDDE+jFQ==}
+  /@next/swc-linux-arm64-musl/13.1.0:
+    resolution: {integrity: sha512-WAsZtCtPXlz/7/bnW9ryw856xEun+c6xSwZwbcvrMxtcSiW3z0LD91Nsj3AkexsjRtBjeEpNeVtDExqF2VKKSA==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
@@ -90,8 +90,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-x64-gnu/13.0.3:
-    resolution: {integrity: sha512-z22T5WGnRanjLMXdF0NaNjSpBlEzzY43t5Ysp3nW1oI6gOkub6WdQNZeHIY7A2JwkgSWZmtjLtf+Fzzz38LHeQ==}
+  /@next/swc-linux-x64-gnu/13.1.0:
+    resolution: {integrity: sha512-Tjd5gieI3X9vPce5yF+GsQxOl0jwUkyOrTR1g5PQr+bT/9Qos/yPL48H1L5ayEp0hxgLVPW7skGal7lVnAoVEQ==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
@@ -99,8 +99,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-x64-musl/13.0.3:
-    resolution: {integrity: sha512-ZOMT7zjBFmkusAtr47k8xs/oTLsNlTH6xvYb+iux7yly2hZGwhfBLzPGBsbeMZukZ96IphJTagT+C033s6LNVA==}
+  /@next/swc-linux-x64-musl/13.1.0:
+    resolution: {integrity: sha512-H9UMEQv40e9pkgdX4mCms0dDf2dimmZ6WXhDTWF/yIh9icgcsHaP73BJ9IFlgvh80wLiUgWZ3LAX4vXnXzidmg==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
@@ -108,8 +108,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-win32-arm64-msvc/13.0.3:
-    resolution: {integrity: sha512-Q4BM16Djl+Oah9UdGrvjFYgoftYB2jNd+rtRGPX5Mmxo09Ry/KiLbOZnoUyoIxKc1xPyfqMXuaVsAFQLYs0KEQ==}
+  /@next/swc-win32-arm64-msvc/13.1.0:
+    resolution: {integrity: sha512-LFFIKjW/cPl4wvG8HF/6oYPJZ+Jy32G3FUflC8UW1Od6W9yOSEvadhk9fMyDZN4cgsNOcVc3uVSMpcuuCpbDGw==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [win32]
@@ -117,8 +117,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-win32-ia32-msvc/13.0.3:
-    resolution: {integrity: sha512-Sa8yGkNeRUsic8Qjf7MLIAfP0p0+einK/wIqJ8UO1y76j+8rRQu42AMs5H4Ax1fm9GEYq6I8njHtY59TVpTtGQ==}
+  /@next/swc-win32-ia32-msvc/13.1.0:
+    resolution: {integrity: sha512-MBLaoHZSenMdxhB3Ww1VNEhjyPT3uLjzAi5Ygk48LLLbOGu5KxQolhINRrqGuJWqJRNWSJ9JSFBfJrZwQzrUew==}
     engines: {node: '>= 10'}
     cpu: [ia32]
     os: [win32]
@@ -126,8 +126,8 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-win32-x64-msvc/13.0.3:
-    resolution: {integrity: sha512-IAptmSqA7k4tQzaw2NAkoEjj3+Dz9ceuvlEHwYh770MMDL4V0ku2m+UHrmn5HUCEDHhgwwjg2nyf6728q2jr1w==}
+  /@next/swc-win32-x64-msvc/13.1.0:
+    resolution: {integrity: sha512-fFTfIQvnmpbKoyh4v3ezlGqtERlgc2Sx8qJwPuYqoVi0V08wCx9wp2Iq1CINxP3UMHkEeNX7gYpDOd+9Cw9EiQ==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [win32]
@@ -135,14 +135,14 @@ packages:
     dev: false
     optional: true
 
-  /@swc/helpers/0.4.11:
-    resolution: {integrity: sha512-rEUrBSGIoSFuYxwBYtlUFMlE2CwGhmW+w9355/5oduSw8e5h2+Tj4UrAGNNgP9915++wj5vkQo0UuOBqOAq4nw==}
+  /@swc/helpers/0.4.14:
+    resolution: {integrity: sha512-4C7nX/dvpzB7za4Ql9K81xK3HPxCpHMgwTZVyf+9JQ6VUbn9jjZVN7/Nkdz/Ugzs2CSjqnL/UPXroiVBVHUWUw==}
     dependencies:
       tslib: 2.4.1
     dev: false
 
-  /caniuse-lite/1.0.30001431:
-    resolution: {integrity: sha512-zBUoFU0ZcxpvSt9IU66dXVT/3ctO1cy4y9cscs1szkPlcWb6pasYM144GqrUygUbT+k7cmUCW61cvskjcv0enQ==}
+  /caniuse-lite/1.0.30001441:
+    resolution: {integrity: sha512-OyxRR4Vof59I3yGWXws6i908EtGbMzVUi3ganaZQHmydk1iwDhRnvaPG2WaR0KcqrDFKrxVZHULT396LEPhXfg==}
     dev: false
 
   /client-only/0.0.1:
@@ -170,8 +170,8 @@ packages:
     hasBin: true
     dev: false
 
-  /next/13.0.3_d6rcamawdo45avnz6jxiy6p4si:
-    resolution: {integrity: sha512-rFQeepcenRxKzeKlh1CsmEnxsJwhIERtbUjmYnKZyDInZsU06lvaGw5DT44rlNp1Rv2MT/e9vffZ8vK+ytwXHA==}
+  /next/13.1.0_zqregvc5b5zp3p4caivl4eqniq:
+    resolution: {integrity: sha512-lQMZH1V94L5IL/WaihQkTYabSY73aqgrkGPJB5uz+2O3ES4I3losV/maXLY7l7x5e+oNyE9N81upNQ8uRsR5/A==}
     engines: {node: '>=14.6.0'}
     hasBin: true
     peerDependencies:
@@ -188,28 +188,27 @@ packages:
       sass:
         optional: true
     dependencies:
-      '@next/env': 13.0.3
-      '@swc/helpers': 0.4.11
-      caniuse-lite: 1.0.30001431
+      '@next/env': 13.1.0
+      '@swc/helpers': 0.4.14
+      caniuse-lite: 1.0.30001441
       postcss: 8.4.14
-      react: 18.3.0-next-fecc288b7-20221025
-      react-dom: 18.3.0-next-fecc288b7-20221025_cb5ruxkz3bqlxwvs2j6rdcpmja
-      styled-jsx: 5.1.0_cb5ruxkz3bqlxwvs2j6rdcpmja
-      use-sync-external-store: 1.2.0_cb5ruxkz3bqlxwvs2j6rdcpmja
+      react: 18.3.0-next-5fcf1a4b4-20221221
+      react-dom: 18.3.0-next-5fcf1a4b4-20221221_djgvdp5ul6h7czq567rw76bfri
+      styled-jsx: 5.1.1_djgvdp5ul6h7czq567rw76bfri
     optionalDependencies:
-      '@next/swc-android-arm-eabi': 13.0.3
-      '@next/swc-android-arm64': 13.0.3
-      '@next/swc-darwin-arm64': 13.0.3
-      '@next/swc-darwin-x64': 13.0.3
-      '@next/swc-freebsd-x64': 13.0.3
-      '@next/swc-linux-arm-gnueabihf': 13.0.3
-      '@next/swc-linux-arm64-gnu': 13.0.3
-      '@next/swc-linux-arm64-musl': 13.0.3
-      '@next/swc-linux-x64-gnu': 13.0.3
-      '@next/swc-linux-x64-musl': 13.0.3
-      '@next/swc-win32-arm64-msvc': 13.0.3
-      '@next/swc-win32-ia32-msvc': 13.0.3
-      '@next/swc-win32-x64-msvc': 13.0.3
+      '@next/swc-android-arm-eabi': 13.1.0
+      '@next/swc-android-arm64': 13.1.0
+      '@next/swc-darwin-arm64': 13.1.0
+      '@next/swc-darwin-x64': 13.1.0
+      '@next/swc-freebsd-x64': 13.1.0
+      '@next/swc-linux-arm-gnueabihf': 13.1.0
+      '@next/swc-linux-arm64-gnu': 13.1.0
+      '@next/swc-linux-arm64-musl': 13.1.0
+      '@next/swc-linux-x64-gnu': 13.1.0
+      '@next/swc-linux-x64-musl': 13.1.0
+      '@next/swc-win32-arm64-msvc': 13.1.0
+      '@next/swc-win32-ia32-msvc': 13.1.0
+      '@next/swc-win32-x64-msvc': 13.1.0
     transitivePeerDependencies:
       - '@babel/core'
       - babel-plugin-macros
@@ -228,25 +227,25 @@ packages:
       source-map-js: 1.0.2
     dev: false
 
-  /react-dom/18.3.0-next-fecc288b7-20221025_cb5ruxkz3bqlxwvs2j6rdcpmja:
-    resolution: {integrity: sha512-EczZNIcOXzLFyPhSXpplVFekfUvbtHRC68TVAPfCopn8YxjMg2ROVgYs1VdSnEu2JlXKvpeIbjexAuhDprsp/A==}
+  /react-dom/18.3.0-next-5fcf1a4b4-20221221_djgvdp5ul6h7czq567rw76bfri:
+    resolution: {integrity: sha512-IHSe89uJ0ff2yTnLXO6k/hhUIHpF2kZR/kKEIgXd4a3hicL6Uozd6w9WXZUZj/C1yTbE5q1WoukJPt+2Q6VSOA==}
     peerDependencies:
-      react: 18.3.0-next-fecc288b7-20221025
+      react: 18.3.0-next-5fcf1a4b4-20221221
     dependencies:
       loose-envify: 1.4.0
-      react: 18.3.0-next-fecc288b7-20221025
-      scheduler: 0.24.0-next-fecc288b7-20221025
+      react: 18.3.0-next-5fcf1a4b4-20221221
+      scheduler: 0.24.0-next-5fcf1a4b4-20221221
     dev: false
 
-  /react/18.3.0-next-fecc288b7-20221025:
-    resolution: {integrity: sha512-lKvCNWRO9XPy8q7hLd0ODK/4Oqr54r3Vr49Y7EyNBz/kfsmNT6Vx0F69KRz/eGcbt1XDvtbA7KZd+mh8w3wONQ==}
+  /react/18.3.0-next-5fcf1a4b4-20221221:
+    resolution: {integrity: sha512-uKtVVRTRMx5tVRnx/vxZlzrjfKwjWEmBPY3vxi/tVDGIDJRO1ewNZPKJqsl4ECGk9aaTGiPxc3HpKOkqXadhiw==}
     engines: {node: '>=0.10.0'}
     dependencies:
       loose-envify: 1.4.0
     dev: false
 
-  /scheduler/0.24.0-next-fecc288b7-20221025:
-    resolution: {integrity: sha512-D2r7z/2EbRXXz4k8XRQab2l71zARIwmZzLLGPAM936/dW1iF835+FMwnOe4Iep96vNJAdQavqJBP4Fm+/MadsQ==}
+  /scheduler/0.24.0-next-5fcf1a4b4-20221221:
+    resolution: {integrity: sha512-T5aoaBiswyQLpjlXuY6FNbhcCB6XdZoLJ5Y3kRXhlfRYU2r+omaHCnDxYU6y1lCfr7a/ZK3ABxVUs+nTpb20Jg==}
     dependencies:
       loose-envify: 1.4.0
     dev: false
@@ -256,8 +255,8 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: false
 
-  /styled-jsx/5.1.0_cb5ruxkz3bqlxwvs2j6rdcpmja:
-    resolution: {integrity: sha512-/iHaRJt9U7T+5tp6TRelLnqBqiaIT0HsO0+vgyj8hK2KUk7aejFqRrumqPUlAqDwAj8IbS/1hk3IhBAAK/FCUQ==}
+  /styled-jsx/5.1.1_djgvdp5ul6h7czq567rw76bfri:
+    resolution: {integrity: sha512-pW7uC1l4mBZ8ugbiZrcIsiIvVx1UmTfw7UkC3Um2tmfUq9Bhk8IiyEIPl6F8agHgjzku6j0xQEZbfA5uSgSaCw==}
     engines: {node: '>= 12.0.0'}
     peerDependencies:
       '@babel/core': '*'
@@ -270,17 +269,9 @@ packages:
         optional: true
     dependencies:
       client-only: 0.0.1
-      react: 18.3.0-next-fecc288b7-20221025
+      react: 18.3.0-next-5fcf1a4b4-20221221
     dev: false
 
   /tslib/2.4.1:
     resolution: {integrity: sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==}
     dev: false
-
-  /use-sync-external-store/1.2.0_cb5ruxkz3bqlxwvs2j6rdcpmja:
-    resolution: {integrity: sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0 || ^18.0.0
-    dependencies:
-      react: 18.3.0-next-fecc288b7-20221025
-    dev: false