add new code to _app.tsx

Author: jeromehardaway

package-lock.json

@@ -60,6 +60,7 @@
     "@types/google.maps": "^3.58.1",
     "@types/jsonwebtoken": "^8.5.8",
     "@types/marked": "^4.0.3",
+    "@types/next-auth": "^3.15.0",
     "@types/node": "^18.0.0",
     "@types/react": "18.0.0",
     "@types/react-dom": "18.0.0",

package.json

@@ -1,7 +1,8 @@
 import { ElementType, useEffect } from "react";
 import { useRouter } from "next/router";
-import type { AppProps } from "next/app";
 import { SessionProvider } from "next-auth/react"; // Import SessionProvider
+import type { Session } from "next-auth"; // Import Session type
+import type { AppProps, NextPage } from "next"; // Import NextPage
 import SEO from "@components/seo/deafult-seo";
 import FallbackLayout from "@layout/fallback";
 import "@assets/css/font-awesome-pro.min.css";
@@ -14,11 +15,14 @@ import "@assets/css/globals.css";
 import { UIProvider } from "../contexts/ui-context";
 import { UserProvider } from "../contexts/user-context";
 
-interface CustomAppProps extends Omit<AppProps, "Component"> {
-    Component: AppProps["Component"] & { Layout: ElementType };
+// Extend AppProps with support for a Layout property
+interface CustomAppProps extends AppProps {
+    Component: NextPage & {
+        Layout?: ElementType; // Optional Layout property
+    };
     pageProps: {
+        session?: Session | null; // Explicitly type session
         [key: string]: unknown;
-        session?: unknown; // Add session type for NextAuth
     };
 }
 
@@ -38,7 +42,7 @@ const MyApp = ({ Component, pageProps }: CustomAppProps) => {
     });
 
     return (
-        <SessionProvider session={pageProps.session}> {/* Wrap everything in SessionProvider */}
+        <SessionProvider session={pageProps.session as Session | null}>
             <UIProvider>
                 <UserProvider>
                     <Layout {...layoutProps}>

src/pages/_app.tsx

@@ -33,15 +33,15 @@
       "@widgets/*": ["components/widgets/*"],
       "@fonts/*": ["public/fonts/*"]
     },
-    "types": ["google.maps"]  // Add this line
+    "types": ["google.maps", "next-auth"] // Add "next-auth" here
   },
   "include": [
-    "next-env.d.ts", 
-    "next.config.js", 
-    "src/**/*.ts", 
-    "src/**/*.tsx", 
-    "tailwind.config.js", 
-    "postcss.config.js", 
+    "next-env.d.ts",
+    "next.config.js",
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "tailwind.config.js",
+    "postcss.config.js",
     "next-sitemap.config.js"
   ],
   "exclude": ["node_modules"]

tsconfig.json

@@ -1949,6 +1949,13 @@
   "resolved" "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz"
   "version" "5.1.2"
 
+"@types/next-auth@^3.15.0":
+  "integrity" "sha512-ZVfejlu81YiIRX1m0iKAfvZ3nK7K9EyZWhNARNKsFop8kNAgEvMnlKpTpwN59xkK2OhyWLagPuiDAVBYSO9jSA=="
+  "resolved" "https://registry.npmjs.org/@types/next-auth/-/next-auth-3.15.0.tgz"
+  "version" "3.15.0"
+  dependencies:
+    "next-auth" "*"
+
 "@types/node-fetch@^2.6.4":
   "integrity" "sha512-1ZX9fcN4Rvkvgv4E6PAY5WXUFWFcRWxZa3EW83UjycOB9ljJCedb2CupIP4RZMEwF/M3eTcCihbBRgwtGbg5Rg=="
   "resolved" "https://registry.npmjs.org/@types/node-fetch/-/node-fetch-2.6.4.tgz"
@@ -4955,7 +4962,7 @@
   "resolved" "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz"
   "version" "0.6.3"
 
-"next-auth@^4.24.10":
+"next-auth@*", "next-auth@^4.24.10":
   "integrity" "sha512-8NGqiRO1GXBcVfV8tbbGcUgQkAGsX4GRzzXXea4lDikAsJtD5KiEY34bfhUOjHLvr6rT6afpcxw2H8EZqOV6aQ=="
   "resolved" "https://registry.npmjs.org/next-auth/-/next-auth-4.24.10.tgz"
   "version" "4.24.10"