update nextjs to 13.4.7

app/gists/file-content.tsx

@@ -1,10 +1,10 @@
 import LinkAnchor from 'components/mdx/link-anchor';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { GistData } from 'lib/fetcher';
 import Link from 'next/link';
 import { memo } from 'react';
 import GistsCode from './gists-code';
+import { GistData } from 'types';
 
 dayjs.extend(relativeTime);
 
@@ -19,13 +19,13 @@ const FileContent = ({ gists }: Props) => {
         {gists.map((g) => (
           <div key={g.id}>
             {Object.keys(g.files).map((f) => (
-              <div key={g.files[f].raw_url} className="pb-4 ">
+              <div key={g.files[f]?.raw_url} className="pb-4 ">
                 {/* Username and file name */}
                 <h1 className="md:text-lg">
                   {g.login} /
                   <Link href={`/g/${g.id}`}>
                     <LinkAnchor external={false}>
-                      {g.files[f].filename}
+                      {g.files[f]?.filename}
                     </LinkAnchor>
                   </Link>
                 </h1>
@@ -36,7 +36,7 @@ const FileContent = ({ gists }: Props) => {
                 {/* Description */}
                 <p className="text-gray-500">{g.description}</p>
 
-                <GistsCode file={g.files[f]} />
+                {g.files[f] && <GistsCode file={g!.files[f]!} />}
               </div>
             ))}
           </div>

app/gists/layout.tsx

@@ -18,7 +18,6 @@ export default async function PageLayout({
       <main className="max-w-5xl px-4 mx-auto lg:px-0">
         <div className="md:flex">
           <Suspense fallback={<UserInfoLoading />}>
-            {/* @ts-expect-error Async Server Component */}
             <UserInfo />
           </Suspense>
 

lib/fetcher.ts

@@ -1,6 +1,7 @@
 import { Octokit } from 'octokit';
 import { cache } from 'react';
-import { GistsFile } from 'types';
+import { GistData, GistsFile, PageKeys, PageSize } from 'types';
+import {} from 'octokit/';
 
 const password = process.env.NEXT_PUBLIC_GITHUB_API;
 const host = process.env.NEXT_PUBLIC_GISTS_HOST ?? 'https://api.github.com';
@@ -14,23 +15,6 @@ const octokit = new Octokit({
 const linkMatch = /<(.*?)>/;
 const relMatch = /"(.*?)"/;
 
-export type GistData = {
-  id: string;
-  files: { [key: string]: GistsFile };
-  login: string;
-  updated_at: string;
-  description: string | null;
-};
-export type GetGists = {
-  /**
-   * { prev: null, next: '2', last: '5', first: null }
-   */
-  pageSize: pageSize;
-  gists: GistData[];
-};
-export type pageSize = { [key in PageKeys]: string | null };
-export type PageKeys = 'prev' | 'next' | 'last' | 'first';
-
 /**
  * Get all gists.
  * @returns
@@ -51,7 +35,7 @@ export const getGists = cache(async (page = 1, perPage = 10) => {
 
   if (!link) return null;
 
-  const pageSize: pageSize = {
+  const pageSize: PageSize = {
     prev: null,
     next: null,
     last: null,
@@ -77,10 +61,10 @@ export const getGists = cache(async (page = 1, perPage = 10) => {
     data.map(async (g) => {
       await Promise.all(
         Object.keys(g.files).map(async (f) => {
-          const url = g.files[f].raw_url;
+          const url = g.files[f]?.raw_url;
           if (!url) return;
           try {
-            g.files[f].content = await fetch(url).then((res) => res.text());
+            g.files[f]!.content = await fetch(url).then((res) => res.text());
           } catch (err) {
             console.log(err);
           }

package.json

@@ -14,54 +14,54 @@
     "pretty": "prettier --write \"./**/*.{js,jsx,ts,tsx,json,md,mdx,css}\" --ignore-unknown"
   },
   "dependencies": {
-    "@codesandbox/sandpack-react": "^2.6.4",
-    "@docsearch/css": "^3.3.4",
+    "@codesandbox/sandpack-react": "^2.6.9",
+    "@docsearch/css": "^3.5.1",
     "@docsearch/react": "3",
     "@giscus/react": "^2.2.8",
     "@mapbox/rehype-prism": "^0.8.0",
-    "@react-three/drei": "^9.68.3",
-    "@react-three/fiber": "^8.13.0",
-    "@tweenjs/tween.js": "^20.0.3",
-    "algoliasearch": "^4.17.0",
-    "dayjs": "^1.11.7",
-    "next": "13.4.2",
+    "@react-three/drei": "^9.77.3",
+    "@react-three/fiber": "^8.13.3",
+    "@tweenjs/tween.js": "^21.0.0",
+    "algoliasearch": "^4.18.0",
+    "dayjs": "^1.11.8",
+    "next": "13.4.7",
     "next-mdx-remote": "^4.4.1",
     "next-themes": "^0.2.1",
-    "octokit": "^2.0.14",
+    "octokit": "^2.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-icons": "^4.8.0",
+    "react-icons": "^4.10.1",
     "rehype-react": "^7.2.0",
     "rehype-slug": "^5.1.0",
     "remark-frontmatter": "^4.0.1",
     "remark-gfm": "^3.0.1",
-    "remark-parse": "^10.0.1",
+    "remark-parse": "^10.0.2",
     "remark-rehype": "^10.1.0",
     "sharp": "^0.32.1",
-    "three": "^0.152.2",
+    "three": "^0.153.0",
     "unified": "^10.1.2",
     "zustand": "^4.3.8"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
-    "@types/jest": "^29.5.1",
-    "@types/node": "20.1.5",
-    "@types/react": "18.2.6",
-    "@types/three": "^0.152.0",
+    "@types/jest": "^29.5.2",
+    "@types/node": "20.3.1",
+    "@types/react": "18.2.14",
+    "@types/three": "^0.152.1",
     "autoprefixer": "^10.4.14",
     "clsx": "^1.2.1",
     "cross-env": "^7.0.3",
-    "dotenv": "^16.0.3",
+    "dotenv": "^16.3.1",
     "encoding": "^0.1.13",
-    "eslint": "8.40.0",
-    "eslint-config-next": "13.4.2",
+    "eslint": "8.43.0",
+    "eslint-config-next": "13.4.7",
     "gray-matter": "^4.0.3",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
-    "postcss": "^8.4.23",
+    "postcss": "^8.4.24",
     "prettier": "^2.8.8",
     "tailwindcss": "^3.3.2",
-    "typescript": "5.0.4"
+    "typescript": "5.1.3"
   }
 }

types/index.ts

@@ -1,16 +1,3 @@
-import { GistData } from 'lib/fetcher';
-import { NextPage } from 'next';
-import { AppProps } from 'next/app';
-import { ReactElement } from 'react';
-
-export type NextPageWithLayout = {
-  getLayout(page: ReactElement): JSX.Element;
-} & NextPage;
-
-export type AppPropsWithLayout = AppProps & {
-  Component: NextPageWithLayout;
-};
-
 export interface MyMatters {
   title: string;
   date: string;
@@ -56,3 +43,20 @@ export interface SignalGist extends GistData {
   forks: any[];
   history: History[];
 }
+
+export type GistData = {
+  id: string;
+  files: { [key: string]: GistsFile | undefined };
+  login: string;
+  updated_at: string;
+  description: string | null;
+};
+export type GetGists = {
+  /**
+   * { prev: null, next: '2', last: '5', first: null }
+   */
+  pageSize: PageSize;
+  gists: GistData[];
+};
+export type PageSize = { [key in PageKeys]: string | null };
+export type PageKeys = 'prev' | 'next' | 'last' | 'first';