From a615447e394e592bdfa3ca60f5f21578dfbb1397 Mon Sep 17 00:00:00 2001
From: tanmay4l <tanmaydhobale@tanmays-MacBook-Air.local>
Date: Sat, 13 Jul 2024 15:23:52 +0530
Subject: [PATCH 1/3] fixed login

---
 middleware.ts                      |  23 +-
 next.config.js                     |   3 +
 package-lock.json                  | 302 +++--------
 package.json                       |   6 +-
 pages/TherapistApply/index.tsx     | 775 +++--------------------------
 pages/TherapistDashboard/index.tsx |  21 +-
 pages/api/auth/[...nextauth].ts    |  15 +-
 pages/api/therapists/register.ts   |   1 +
 yarn.lock                          | 103 ++--
 9 files changed, 186 insertions(+), 1063 deletions(-)

diff --git a/middleware.ts b/middleware.ts
index 1425506..bc7d47f 100644
--- a/middleware.ts
+++ b/middleware.ts
@@ -2,26 +2,31 @@ import { NextResponse } from "next/server";
 import type { NextRequest } from "next/server";
 import { getToken } from "next-auth/jwt";
 
+const protectedRoutes = ["/TherapistDashboard", "/TherapistApply"];
+
 export async function middleware(request: NextRequest) {
   const token = await getToken({
     req: request,
     secret: process.env.NEXTAUTH_SECRET,
   });
 
-  console.log("Middleware token:", token);
+  console.log("Middleware executed for path:", request.nextUrl.pathname);
+  console.log("Token:", token);
 
-  if (!token && request.nextUrl.pathname === "/TherapistDashboard") {
-    console.log("No token, redirecting to sign in");
-    const url = request.nextUrl.clone();
-    url.pathname = "/api/auth/signin";
-    url.searchParams.set("callbackUrl", request.url);
-    return NextResponse.redirect(url);
+  if (
+    !token &&
+    protectedRoutes.some((route) => request.nextUrl.pathname.startsWith(route))
+  ) {
+    console.log("Redirecting to signin page");
+    const signInUrl = new URL("/api/auth/signin", request.url);
+    signInUrl.searchParams.set("callbackUrl", request.url);
+    return NextResponse.redirect(signInUrl);
   }
 
-  console.log("Proceeding to next middleware or route handler");
+  console.log("Proceeding to next middleware/page");
   return NextResponse.next();
 }
 
 export const config = {
-  matcher: ["/TherapistDashboard"],
+  matcher: ["/TherapistDashboard/:path*", "/TherapistApply/:path*"],
 };
diff --git a/next.config.js b/next.config.js
index 24f224e..a6a6975 100644
--- a/next.config.js
+++ b/next.config.js
@@ -12,6 +12,9 @@ const nextConfig = {
     ],
   },
   reactStrictMode: true,
+  experimental: {
+    appDir: true,
+  },
   i18n: {
     locales: ["en"],
     defaultLocale: "en",
diff --git a/package-lock.json b/package-lock.json
index 0b56755..2c765a0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -51,7 +51,6 @@
         "remark-math": "^5.1.1",
         "strip-markdown": "^6.0.0",
         "thirdweb": "^5.19.1",
-        "typescript": "5.0.4",
         "ua-parser-js": "^1.0.35",
         "usehooks-ts": "^2.9.1"
       },
@@ -71,7 +70,8 @@
         "next-mdx-remote": "^4.4.1",
         "postcss": "^8.4.38",
         "prettier": "^2.8.7",
-        "tailwindcss": "^3.4.3"
+        "tailwindcss": "^3.4.3",
+        "typescript": "^5.5.3"
       }
     },
     "node_modules/@adraffy/ens-normalize": {
@@ -787,18 +787,6 @@
         "react-dom": ">=18"
       }
     },
-    "node_modules/@chakra-ui/modal/node_modules/aria-hidden": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.3.tgz",
-      "integrity": "sha512-xcLxITLe2HYa1cnYnwCjkOO1PqUHQpozB8x9AR0OgWN2woOBi5kSDVxKfd0b7sb1hw5qFeJhXm9H1nu3xSfLeQ==",
-      "license": "MIT",
-      "dependencies": {
-        "tslib": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@chakra-ui/next-js": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/@chakra-ui/next-js/-/next-js-2.1.2.tgz",
@@ -1666,18 +1654,6 @@
         "stylis": "4.1.3"
       }
     },
-    "node_modules/@emotion/babel-plugin/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/@emotion/cache": {
       "version": "11.10.7",
       "license": "MIT",
@@ -1736,18 +1712,6 @@
         }
       }
     },
-    "node_modules/@emotion/react/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/@emotion/serialize": {
       "version": "1.1.1",
       "license": "MIT",
@@ -1784,18 +1748,6 @@
         }
       }
     },
-    "node_modules/@emotion/styled/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/@emotion/styled/node_modules/@emotion/is-prop-valid": {
       "version": "1.2.0",
       "license": "MIT",
@@ -2417,9 +2369,10 @@
       }
     },
     "node_modules/@next/env": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/env/-/env-14.2.3.tgz",
-      "integrity": "sha512-W7fd7IbkfmeeY2gXrzJYDx8D2lWKbVoTIj1o1ScPHNzvp30s1AuoEFSdr39bC5sjxJaxTtq3OTCZboNp0lNWHA=="
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/env/-/env-14.2.5.tgz",
+      "integrity": "sha512-/zZGkrTOsraVfYjGP8uM0p6r0BDT6xWpkjdVbcz66PJVSpwXX3yNiRycxAuDfBKGWBrZBXRuK/YVlkNgxHGwmA==",
+      "license": "MIT"
     },
     "node_modules/@next/eslint-plugin-next": {
       "version": "13.3.0",
@@ -2431,12 +2384,13 @@
       }
     },
     "node_modules/@next/swc-darwin-arm64": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.3.tgz",
-      "integrity": "sha512-3pEYo/RaGqPP0YzwnlmPN2puaF2WMLM3apt5jLW2fFdXD9+pqcoTzRk+iZsf8ta7+quAe4Q6Ms0nR0SFGFdS1A==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.5.tgz",
+      "integrity": "sha512-/9zVxJ+K9lrzSGli1///ujyRfon/ZneeZ+v4ptpiPoOU+GKZnm8Wj8ELWU1Pm7GHltYRBklmXMTUqM/DqQ99FQ==",
       "cpu": [
         "arm64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
@@ -2446,12 +2400,13 @@
       }
     },
     "node_modules/@next/swc-darwin-x64": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.3.tgz",
-      "integrity": "sha512-6adp7waE6P1TYFSXpY366xwsOnEXM+y1kgRpjSRVI2CBDOcbRjsJ67Z6EgKIqWIue52d2q/Mx8g9MszARj8IEA==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.5.tgz",
+      "integrity": "sha512-vXHOPCwfDe9qLDuq7U1OYM2wUY+KQ4Ex6ozwsKxp26BlJ6XXbHleOUldenM67JRyBfVjv371oneEvYd3H2gNSA==",
       "cpu": [
         "x64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
@@ -2461,12 +2416,13 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-gnu": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.3.tgz",
-      "integrity": "sha512-cuzCE/1G0ZSnTAHJPUT1rPgQx1w5tzSX7POXSLaS7w2nIUJUD+e25QoXD/hMfxbsT9rslEXugWypJMILBj/QsA==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.5.tgz",
+      "integrity": "sha512-vlhB8wI+lj8q1ExFW8lbWutA4M2ZazQNvMWuEDqZcuJJc78iUnLdPPunBPX8rC4IgT6lIx/adB+Cwrl99MzNaA==",
       "cpu": [
         "arm64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -2476,12 +2432,13 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-musl": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.3.tgz",
-      "integrity": "sha512-0D4/oMM2Y9Ta3nGuCcQN8jjJjmDPYpHX9OJzqk42NZGJocU2MqhBq5tWkJrUQOQY9N+In9xOdymzapM09GeiZw==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.5.tgz",
+      "integrity": "sha512-NpDB9NUR2t0hXzJJwQSGu1IAOYybsfeB+LxpGsXrRIb7QOrYmidJz3shzY8cM6+rO4Aojuef0N/PEaX18pi9OA==",
       "cpu": [
         "arm64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -2491,12 +2448,13 @@
       }
     },
     "node_modules/@next/swc-linux-x64-gnu": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.3.tgz",
-      "integrity": "sha512-ENPiNnBNDInBLyUU5ii8PMQh+4XLr4pG51tOp6aJ9xqFQ2iRI6IH0Ds2yJkAzNV1CfyagcyzPfROMViS2wOZ9w==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.5.tgz",
+      "integrity": "sha512-8XFikMSxWleYNryWIjiCX+gU201YS+erTUidKdyOVYi5qUQo/gRxv/3N1oZFCgqpesN6FPeqGM72Zve+nReVXQ==",
       "cpu": [
         "x64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -2506,12 +2464,13 @@
       }
     },
     "node_modules/@next/swc-linux-x64-musl": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.3.tgz",
-      "integrity": "sha512-BTAbq0LnCbF5MtoM7I/9UeUu/8ZBY0i8SFjUMCbPDOLv+un67e2JgyN4pmgfXBwy/I+RHu8q+k+MCkDN6P9ViQ==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.5.tgz",
+      "integrity": "sha512-6QLwi7RaYiQDcRDSU/os40r5o06b5ue7Jsk5JgdRBGGp8l37RZEh9JsLSM8QF0YDsgcosSeHjglgqi25+m04IQ==",
       "cpu": [
         "x64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -2521,12 +2480,13 @@
       }
     },
     "node_modules/@next/swc-win32-arm64-msvc": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.3.tgz",
-      "integrity": "sha512-AEHIw/dhAMLNFJFJIJIyOFDzrzI5bAjI9J26gbO5xhAKHYTZ9Or04BesFPXiAYXDNdrwTP2dQceYA4dL1geu8A==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.5.tgz",
+      "integrity": "sha512-1GpG2VhbspO+aYoMOQPQiqc/tG3LzmsdBH0LhnDS3JrtDx2QmzXe0B6mSZZiN3Bq7IOMXxv1nlsjzoS1+9mzZw==",
       "cpu": [
         "arm64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
@@ -2536,12 +2496,13 @@
       }
     },
     "node_modules/@next/swc-win32-ia32-msvc": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.3.tgz",
-      "integrity": "sha512-vga40n1q6aYb0CLrM+eEmisfKCR45ixQYXuBXxOOmmoV8sYST9k7E3US32FsY+CkkF7NtzdcebiFT4CHuMSyZw==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.5.tgz",
+      "integrity": "sha512-Igh9ZlxwvCDsu6438FXlQTHlRno4gFpJzqPjSIBZooD22tKeI4fE/YMRoHVJHmrQ2P5YL1DoZ0qaOKkbeFWeMg==",
       "cpu": [
         "ia32"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
@@ -2551,12 +2512,13 @@
       }
     },
     "node_modules/@next/swc-win32-x64-msvc": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.3.tgz",
-      "integrity": "sha512-Q1/zm43RWynxrO7lW4ehciQVj+5ePBhOK+/K2P7pLFX3JaJ/IZVC69SHidrmZSOkqz7ECIOhhy7XhAFG4JYyHA==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.5.tgz",
+      "integrity": "sha512-tEQ7oinq1/CjSG9uSTerca3v4AZ+dFa+4Yu6ihaG8Ud8ddqLQgFGcnwYls13H5X5CPDPZJdYxyeMui6muOLd4g==",
       "cpu": [
         "x64"
       ],
+      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
@@ -5111,18 +5073,6 @@
         "npm": ">=6"
       }
     },
-    "node_modules/babel-plugin-macros/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/bail": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/bail/-/bail-2.0.2.tgz",
@@ -5594,10 +5544,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/call-bind/node_modules/function-bind": {
-      "version": "1.1.1",
-      "license": "MIT"
-    },
     "node_modules/callsites": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
@@ -7488,18 +7434,6 @@
         "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8"
       }
     },
-    "node_modules/eslint-plugin-jsx-a11y/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/eslint-plugin-react": {
       "version": "7.32.2",
       "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.32.2.tgz",
@@ -8357,10 +8291,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/get-intrinsic/node_modules/function-bind": {
-      "version": "1.1.1",
-      "license": "MIT"
-    },
     "node_modules/get-nonce": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/get-nonce/-/get-nonce-1.0.1.tgz",
@@ -8738,10 +8668,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/has/node_modules/function-bind": {
-      "version": "1.1.1",
-      "license": "MIT"
-    },
     "node_modules/hash-base": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.0.4.tgz",
@@ -12090,11 +12016,12 @@
       }
     },
     "node_modules/next": {
-      "version": "14.2.3",
-      "resolved": "https://registry.npmjs.org/next/-/next-14.2.3.tgz",
-      "integrity": "sha512-dowFkFTR8v79NPJO4QsBUtxv0g9BrS/phluVpMAt2ku7H+cbcBJlopXjkWlwxrk/xGqMemr7JkGPGemPrLLX7A==",
+      "version": "14.2.5",
+      "resolved": "https://registry.npmjs.org/next/-/next-14.2.5.tgz",
+      "integrity": "sha512-0f8aRfBVL+mpzfBjYfQuLWh2WyAwtJXCRfkPF4UJ5qd2YwrHczsrSzXU4tRMV0OAxR8ZJZWPFn6uhSC56UTsLA==",
+      "license": "MIT",
       "dependencies": {
-        "@next/env": "14.2.3",
+        "@next/env": "14.2.5",
         "@swc/helpers": "0.5.5",
         "busboy": "1.6.0",
         "caniuse-lite": "^1.0.30001579",
@@ -12109,15 +12036,15 @@
         "node": ">=18.17.0"
       },
       "optionalDependencies": {
-        "@next/swc-darwin-arm64": "14.2.3",
-        "@next/swc-darwin-x64": "14.2.3",
-        "@next/swc-linux-arm64-gnu": "14.2.3",
-        "@next/swc-linux-arm64-musl": "14.2.3",
-        "@next/swc-linux-x64-gnu": "14.2.3",
-        "@next/swc-linux-x64-musl": "14.2.3",
-        "@next/swc-win32-arm64-msvc": "14.2.3",
-        "@next/swc-win32-ia32-msvc": "14.2.3",
-        "@next/swc-win32-x64-msvc": "14.2.3"
+        "@next/swc-darwin-arm64": "14.2.5",
+        "@next/swc-darwin-x64": "14.2.5",
+        "@next/swc-linux-arm64-gnu": "14.2.5",
+        "@next/swc-linux-arm64-musl": "14.2.5",
+        "@next/swc-linux-x64-gnu": "14.2.5",
+        "@next/swc-linux-x64-musl": "14.2.5",
+        "@next/swc-win32-arm64-msvc": "14.2.5",
+        "@next/swc-win32-ia32-msvc": "14.2.5",
+        "@next/swc-win32-x64-msvc": "14.2.5"
       },
       "peerDependencies": {
         "@opentelemetry/api": "^1.1.0",
@@ -13726,18 +13653,6 @@
         "react": "^15.3.0 || ^16.0.0 || ^17.0.0 || ^18.0.0"
       }
     },
-    "node_modules/react-clientside-effect/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/react-dom": {
       "version": "18.2.0",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz",
@@ -13780,18 +13695,6 @@
         }
       }
     },
-    "node_modules/react-focus-lock/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/react-icons": {
       "version": "4.8.0",
       "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.8.0.tgz",
@@ -13968,6 +13871,7 @@
       "version": "0.13.11",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
       "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/regexp.prototype.flags": {
@@ -14805,12 +14709,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark-stringify/node_modules/mdast-util-to-markdown/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark-stringify/node_modules/mdast-util-to-string": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/mdast-util-to-string/-/mdast-util-to-string-4.0.0.tgz",
@@ -14936,12 +14834,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark-stringify/node_modules/unified/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark-stringify/node_modules/unist-util-is": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-6.0.0.tgz",
@@ -14955,12 +14847,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark-stringify/node_modules/unist-util-is/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark-stringify/node_modules/unist-util-stringify-position": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/unist-util-stringify-position/-/unist-util-stringify-position-4.0.0.tgz",
@@ -14974,12 +14860,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark-stringify/node_modules/unist-util-stringify-position/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark-stringify/node_modules/unist-util-visit": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/unist-util-visit/-/unist-util-visit-5.0.0.tgz",
@@ -15009,18 +14889,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark-stringify/node_modules/unist-util-visit-parents/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
-    "node_modules/remark-stringify/node_modules/unist-util-visit/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark-stringify/node_modules/vfile": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.1.tgz",
@@ -15050,18 +14918,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark-stringify/node_modules/vfile-message/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
-    "node_modules/remark-stringify/node_modules/vfile/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark/node_modules/@types/mdast": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-4.0.3.tgz",
@@ -15096,12 +14952,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark/node_modules/unified/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark/node_modules/unist-util-stringify-position": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/unist-util-stringify-position/-/unist-util-stringify-position-4.0.0.tgz",
@@ -15115,12 +14965,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark/node_modules/unist-util-stringify-position/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/remark/node_modules/vfile": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.1.tgz",
@@ -15150,18 +14994,6 @@
         "url": "https://opencollective.com/unified"
       }
     },
-    "node_modules/remark/node_modules/vfile-message/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
-    "node_modules/remark/node_modules/vfile/node_modules/@types/unist": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
-      "integrity": "sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==",
-      "license": "MIT"
-    },
     "node_modules/require-directory": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -16436,18 +16268,6 @@
         }
       }
     },
-    "node_modules/thirdweb/node_modules/@babel/runtime": {
-      "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
-      "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
-      "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.13.11"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/thirdweb/node_modules/@emotion/babel-plugin": {
       "version": "11.11.0",
       "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.11.0.tgz",
@@ -16937,16 +16757,16 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz",
-      "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==",
+      "version": "5.5.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.3.tgz",
+      "integrity": "sha512-/hreyEujaB0w76zKo6717l3L0o/qEUtRgdvUBvlkhoWeOVMjMuHNHk0BRBzikzuGDqNmPQbg5ifMEqsHLiIUcQ==",
       "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
       },
       "engines": {
-        "node": ">=12.20"
+        "node": ">=14.17"
       }
     },
     "node_modules/ua-parser-js": {
diff --git a/package.json b/package.json
index a5aa2b0..60639e4 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "scripts": {
     "dev": "next dev",
-    "build": "next build",  
+    "build": "next build",
     "postbuild": "next-sitemap",
     "start": "next start",
     "lint": "next lint",
@@ -55,7 +55,6 @@
     "remark-math": "^5.1.1",
     "strip-markdown": "^6.0.0",
     "thirdweb": "^5.19.1",
-    "typescript": "5.0.4",
     "ua-parser-js": "^1.0.35",
     "usehooks-ts": "^2.9.1"
   },
@@ -75,7 +74,8 @@
     "next-mdx-remote": "^4.4.1",
     "postcss": "^8.4.38",
     "prettier": "^2.8.7",
-    "tailwindcss": "^3.4.3"
+    "tailwindcss": "^3.4.3",
+    "typescript": "^5.5.3"
   },
   "lint-staged": {
     "*.{js,css,md}": "prettier --write"
diff --git a/pages/TherapistApply/index.tsx b/pages/TherapistApply/index.tsx
index bdc10fb..4cf55b2 100644
--- a/pages/TherapistApply/index.tsx
+++ b/pages/TherapistApply/index.tsx
@@ -1,213 +1,72 @@
 import { GetServerSideProps } from "next";
 import { getSession, useSession } from "next-auth/react";
-import prisma from "../../db/db";
-import { Therapist, Specialization, TherapistType } from "@prisma/client";
-import { useState, useEffect } from "react";
-import {
-  ArrowButton,
-  Box,
-  Container,
-  Input,
-  Radio,
-  RadioGroup,
-  ShadowBox,
-  Stack,
-  Text,
-  Textarea,
-  Checkbox,
-} from "@/lib/ui";
-import Image from "next/image";
-import Logo from "../../public/images/logo.png";
+import prisma from "@/db/db";
+import { Therapist } from "@prisma/client";
+import { useEffect, useState } from "react";
 import { useRouter } from "next/router";
 
-type TherapistWithRelations = Therapist & {
-  specializations: Specialization[];
-  certifications: {
-    name: string;
-    issuedAt: Date;
-    expiresAt: Date | null;
-    issuedBy: string;
-  }[];
-  education: {
-    institution: string;
-    degree: string;
-    fieldOfStudy: string;
-    startDate: Date;
-    endDate: Date | null;
-    grade: number | null;
-  }[];
-  workExperience: {
-    company: string;
-    position: string;
-    startDate: Date;
-    endDate: Date | null;
-    description: string | null;
-  }[];
-};
-
 interface TherapistApplyProps {
-  therapist: TherapistWithRelations | null;
-}
-
-interface FormData {
-  type: TherapistType;
-  fullName: string;
-  dateOfBirth: string;
-  gender: string;
-  currentLocation: string;
-  languages: string[];
-  hoursAvailable: number;
-  experienceYears: number;
-  specializations: string[];
-  heardFrom: string;
-  workingElsewhere: boolean;
-  whyJoining: string;
-  linkedinProfile: string;
-  referredBy: string;
-  longBio: string;
-  certifications: Array<{
-    name: string;
-    issuedAt: string;
-    expiresAt: string;
-    issuedBy: string;
-  }>;
-  education: Array<{
-    institution: string;
-    degree: string;
-    fieldOfStudy: string;
-    startDate: string;
-    endDate: string;
-    grade: number | null;
-  }>;
-  workExperience: Array<{
-    company: string;
-    position: string;
-    startDate: string;
-    endDate: string;
-    description: string;
-  }>;
+  therapist:
+    | (Omit<Therapist, "dateOfBirth"> & { dateOfBirth: string | null })
+    | null;
 }
 
 export default function TherapistApply({ therapist }: TherapistApplyProps) {
   const { data: session, status } = useSession();
   const router = useRouter();
+  const [formData, setFormData] = useState({
+    // ... your existing formData initialization
+    dateOfBirth: "", // Adjust based on your form requirements
+  });
 
   useEffect(() => {
     if (status === "unauthenticated") {
-      router.push("/api/auth/signin?callbackUrl=/TherapistApply");
+      router.push("/");
     }
   }, [status, router]);
 
-  const [formData, setFormData] = useState<FormData>({
-    type: TherapistType.PROFESSIONAL,
-    fullName: "",
-    dateOfBirth: "",
-    gender: "",
-    currentLocation: "",
-    languages: [],
-    hoursAvailable: 0,
-    experienceYears: 0,
-    specializations: [],
-    heardFrom: "",
-    workingElsewhere: false,
-    whyJoining: "",
-    linkedinProfile: "",
-    referredBy: "",
-    longBio: "",
-    certifications: [{ name: "", issuedAt: "", expiresAt: "", issuedBy: "" }],
-    education: [
-      {
-        institution: "",
-        degree: "",
-        fieldOfStudy: "",
-        startDate: "",
-        endDate: "",
-        grade: null,
-      },
-    ],
-    workExperience: [
-      {
-        company: "",
-        position: "",
-        startDate: "",
-        endDate: "",
-        description: "",
-      },
-    ],
-  });
+  useEffect(() => {
+    if (therapist && therapist.dateOfBirth) {
+      setFormData((prev) => ({
+        ...prev,
+        dateOfBirth: new Date(therapist.dateOfBirth)
+          .toISOString()
+          .split("T")[0],
+      }));
+    }
+  }, [therapist]);
 
   const handleChange = (
-    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
-  ) => {
-    const { name, value, type } = e.target;
-    setFormData((prev) => ({
-      ...prev,
-      [name]:
-        type === "checkbox" ? (e.target as HTMLInputElement).checked : value,
-    }));
-  };
-
-  const handleArrayChange = (
-    index: number,
-    field: keyof FormData,
-    subfield: string,
-    value: string | number
+    e: React.ChangeEvent<
+      HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement
+    >
   ) => {
+    const { name, value } = e.target;
     setFormData((prev) => ({
       ...prev,
-      [field]: (prev[field] as any[]).map((item, i) =>
-        i === index ? { ...item, [subfield]: value } : item
-      ),
-    }));
-  };
-
-  const removeArrayItem = (field: keyof FormData, index: number) => {
-    setFormData((prev) => ({
-      ...prev,
-      [field]: (prev[field] as any[]).filter((_, i) => i !== index),
-    }));
-  };
-  const addArrayItem = (field: keyof FormData) => {
-    setFormData((prev) => ({
-      ...prev,
-      [field]: [...(prev[field] as any[]), {}],
+      [name]: value,
     }));
   };
 
-  const handleSubmit = async (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
-    if (!session) {
-      console.error("No session found");
-      return;
-    }
+
     try {
       const response = await fetch("/api/therapists/register", {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
         },
-        body: JSON.stringify({
-          ...formData,
-          certifications: formData.certifications.filter(
-            (cert) => cert.name && cert.issuedAt
-          ),
-          education: formData.education.filter(
-            (edu) => edu.institution && edu.startDate
-          ),
-          workExperience: formData.workExperience.filter(
-            (exp) => exp.company && exp.startDate
-          ),
-        }),
+        body: JSON.stringify(formData),
       });
+
       if (response.ok) {
         router.push("/TherapistDashboard");
-        window.location.href = "/TherapistDashboard";
       } else {
-        const errorData = await response.json();
-        console.error("Failed to register therapist:", errorData.message);
+        console.error("Failed to register therapist:", response.statusText);
       }
     } catch (error) {
-      console.error("Error:", error);
+      console.error("Error registering therapist:", error);
     }
   };
 
@@ -215,544 +74,18 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
     return <div>Loading...</div>;
   }
 
+  if (!session) {
+    return <div>Please sign in to apply as a therapist.</div>;
+  }
+
   if (therapist) {
-    // ... (existing code for displaying therapist info)
+    return <div>You have already applied as a therapist.</div>;
   }
 
   return (
-    <div className="flex justify-center">
-      <Box pl={{ base: 0, md: 8, lg: 3, xl: 20 }}>
-        <Container
-          maxW={"container.2xl"}
-          py={{ base: "4rem", md: "8rem", lg: "9rem" }}
-        >
-          <Box mb={8}>
-            <Box maxW={{ base: "100%", md: "450px" }}>
-              <ShadowBox p={12}>
-                <Box mb={15}>
-                  <Image
-                    src={Logo}
-                    className="mb-15"
-                    alt="depressionhub"
-                    width={400}
-                    height={100}
-                  />
-                  <form onSubmit={handleSubmit}>
-                    <Text className="">Please enter your Full Name</Text>
-                    <Input
-                      name="fullName"
-                      value={formData.fullName}
-                      onChange={handleChange}
-                      placeholder="Full Name"
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">Please choose your profession</Text>
-                    <RadioGroup
-                      onChange={(value) =>
-                        setFormData((prev) => ({
-                          ...prev,
-                          type: value as TherapistType,
-                        }))
-                      }
-                      value={formData.type}
-                    >
-                      <Stack direction="column">
-                        <Radio value={TherapistType.PROFESSIONAL} size="sm">
-                          Professional
-                        </Radio>
-                        <Radio value={TherapistType.STUDENT} size="sm">
-                          Student
-                        </Radio>
-                      </Stack>
-                    </RadioGroup>
-                    <Text className="mt-4">Date of Birth</Text>
-                    <Input
-                      name="dateOfBirth"
-                      type="date"
-                      value={formData.dateOfBirth}
-                      onChange={handleChange}
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">Gender</Text>
-                    <Input
-                      name="gender"
-                      value={formData.gender}
-                      onChange={handleChange}
-                      placeholder="Gender"
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">Current Location</Text>
-                    <Input
-                      name="currentLocation"
-                      value={formData.currentLocation}
-                      onChange={handleChange}
-                      placeholder="Current Location"
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">Languages (comma-separated)</Text>
-                    <Input
-                      name="languages"
-                      value={formData.languages.join(",")}
-                      onChange={(e) =>
-                        setFormData((prev) => ({
-                          ...prev,
-                          languages: e.target.value
-                            .split(",")
-                            .map((lang) => lang.trim()),
-                        }))
-                      }
-                      placeholder="Languages"
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">Hours Available</Text>
-                    <Input
-                      name="hoursAvailable"
-                      type="number"
-                      value={formData.hoursAvailable}
-                      onChange={handleChange}
-                      placeholder="Hours Available"
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">Years of Experience</Text>
-                    <Input
-                      name="experienceYears"
-                      type="number"
-                      value={formData.experienceYears}
-                      onChange={handleChange}
-                      placeholder="Years of Experience"
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">
-                      Specializations (comma-separated)
-                    </Text>
-                    <Input
-                      name="specializations"
-                      value={formData.specializations.join(",")}
-                      onChange={(e) =>
-                        setFormData((prev) => ({
-                          ...prev,
-                          specializations: e.target.value
-                            .split(",")
-                            .map((spec) => spec.trim()),
-                        }))
-                      }
-                      placeholder="Specializations"
-                      required
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">How did you hear about us?</Text>
-                    <Input
-                      name="heardFrom"
-                      value={formData.heardFrom}
-                      onChange={handleChange}
-                      placeholder="How did you hear about us?"
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Text className="mt-4">Are you working elsewhere?</Text>
-                    <Checkbox
-                      name="workingElsewhere"
-                      isChecked={formData.workingElsewhere}
-                      onChange={(e) =>
-                        setFormData((prev) => ({
-                          ...prev,
-                          workingElsewhere: e.target.checked,
-                        }))
-                      }
-                    >
-                      Yes, Im working elsewhere
-                    </Checkbox>
-                    <Checkbox
-                      name="workingElsewhere"
-                      isChecked={formData.workingElsewhere}
-                      onChange={(e) =>
-                        setFormData((prev) => ({
-                          ...prev,
-                          workingElsewhere: e.target.checked,
-                        }))
-                      }
-                    >
-                      No, Im not working
-                    </Checkbox>
-                    <Box
-                      border="1px"
-                      borderColor="gray.200"
-                      borderRadius="md"
-                      p={5}
-                      boxShadow="sm"
-                      mt={4}
-                    >
-                      <Text mb={2}>Why are you joining?</Text>
-                      <Textarea
-                        name="whyJoining"
-                        value={formData.whyJoining}
-                        onChange={handleChange}
-                        placeholder="Why are you joining?"
-                        size="sm"
-                        className="w-full"
-                        variant="flushed"
-                      />
-                    </Box>
-                    <Text className="mt-4">LinkedIn Profile</Text>
-                    <Input
-                      name="linkedinProfile"
-                      value={formData.linkedinProfile}
-                      onChange={handleChange}
-                      placeholder="LinkedIn Profile URL"
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-
-                    <Text className="mt-4">Referred By</Text>
-                    <Input
-                      name="referredBy"
-                      value={formData.referredBy}
-                      onChange={handleChange}
-                      placeholder="Referred By"
-                      size="sm"
-                      className="w-full"
-                      variant="flushed"
-                    />
-                    <Box
-                      border="1px"
-                      borderColor="gray.200"
-                      borderRadius="md"
-                      p={4}
-                      boxShadow="sm"
-                      mt={4}
-                    >
-                      <Text className="mt-4">Long Bio</Text>
-                      <Textarea
-                        name="longBio"
-                        value={formData.longBio}
-                        onChange={handleChange}
-                        placeholder="Long Bio"
-                        size="sm"
-                        className="w-full"
-                        variant="flushed"
-                      />
-                    </Box>
-                    {/* Certifications
-                    <Text className="mt-4">Certifications</Text>
-                    {formData.certifications.map((cert, index) => (
-                      <Box key={index} mb={4}>
-                        <Input
-                          placeholder="Certification Name"
-                          value={cert.name}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "certifications",
-                              "name",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          type="date"
-                          placeholder="Issued At"
-                          value={cert.issuedAt}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "certifications",
-                              "issuedAt",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          type="date"
-                          placeholder="Expires At"
-                          value={cert.expiresAt}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "certifications",
-                              "expiresAt",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          placeholder="Issued By"
-                          value={cert.issuedBy}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "certifications",
-                              "issuedBy",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                      </Box>
-                    ))}
-                    <ArrowButton
-                      onClick={() => addArrayItem("certifications")}
-                      size="sm"
-                    >
-                      Add Certification
-                    </ArrowButton> */}
-
-                    {/* Education */}
-                    <Text className="mt-4">Education</Text>
-                    {formData.education.map((edu, index) => (
-                      <Box key={index} mb={4}>
-                        <Input
-                          placeholder="Institution"
-                          value={edu.institution}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "education",
-                              "institution",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          placeholder="Degree"
-                          value={edu.degree}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "education",
-                              "degree",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          placeholder="Field of Study"
-                          value={edu.fieldOfStudy}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "education",
-                              "fieldOfStudy",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          type="date"
-                          placeholder="Start Date"
-                          value={edu.startDate}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "education",
-                              "startDate",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          type="date"
-                          placeholder="End Date"
-                          value={edu.endDate}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "education",
-                              "endDate",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          type="number"
-                          step="0.1"
-                          placeholder="Grade"
-                          value={edu.grade || ""}
-                          onChange={(e) => {
-                            const value = parseFloat(e.target.value);
-                            if (!isNaN(value) && value >= 0) {
-                              handleArrayChange(
-                                index,
-                                "education",
-                                "grade",
-                                value
-                              );
-                            }
-                          }}
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <ArrowButton
-                          onClick={() => removeArrayItem("education", index)}
-                          size="sm"
-                        >
-                          Remove Education
-                        </ArrowButton>
-                      </Box>
-                    ))}
-                    <ArrowButton
-                      onClick={() => addArrayItem("education")}
-                      size="sm"
-                    >
-                      Add Education
-                    </ArrowButton>
-
-                    {/* Work Experience */}
-                    <Text className="mt-4">Work Experience</Text>
-                    {formData.workExperience.map((exp, index) => (
-                      <Box key={index} mb={4}>
-                        <Input
-                          placeholder="Company"
-                          value={exp.company}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "workExperience",
-                              "company",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          placeholder="Position"
-                          value={exp.position}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "workExperience",
-                              "position",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          type="date"
-                          placeholder="Start Date"
-                          value={exp.startDate}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "workExperience",
-                              "startDate",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Input
-                          type="date"
-                          placeholder="End Date"
-                          value={exp.endDate}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "workExperience",
-                              "endDate",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                        <Textarea
-                          placeholder="Description"
-                          value={exp.description}
-                          onChange={(e) =>
-                            handleArrayChange(
-                              index,
-                              "workExperience",
-                              "description",
-                              e.target.value
-                            )
-                          }
-                          size="sm"
-                          className="w-full mb-2"
-                          variant="flushed"
-                        />
-                      </Box>
-                    ))}
-                    <ArrowButton
-                      onClick={() => addArrayItem("workExperience")}
-                      size="sm"
-                    >
-                      Add Work Experience
-                    </ArrowButton>
-                    <div className="flex justify-center">
-                      <ArrowButton
-                        className="mt-10 flex justify-center"
-                        size="sm"
-                        type="submit"
-                      >
-                        Register as Therapist
-                      </ArrowButton>
-                    </div>
-                  </form>
-                </Box>
-              </ShadowBox>
-            </Box>
-          </Box>
-        </Container>
-      </Box>
+    <div>
+      <h1>Apply as a Therapist</h1>
+      <form onSubmit={handleSubmit}>{/* Your form inputs */}</form>
     </div>
   );
 }
@@ -761,25 +94,31 @@ export const getServerSideProps: GetServerSideProps<
   TherapistApplyProps
 > = async (context) => {
   const session = await getSession(context);
-  if (!session?.user?.id) {
-    return {
-      props: { therapist: null },
-    };
+
+  if (!session || !session.user || !session.user.id) {
+    return { props: { therapist: null } };
   }
 
   const therapist = await prisma.therapist.findUnique({
     where: { userId: session.user.id },
-    include: {
-      specializations: true,
-      certifications: true,
-      education: true,
-      workExperience: true,
-    },
   });
 
+  if (therapist) {
+    return {
+      props: {
+        therapist: {
+          ...therapist,
+          dateOfBirth: therapist.dateOfBirth
+            ? therapist.dateOfBirth.toISOString()
+            : null,
+        },
+      },
+    };
+  }
+
   return {
     props: {
-      therapist: therapist ? JSON.parse(JSON.stringify(therapist)) : null,
+      therapist: null,
     },
   };
 };
diff --git a/pages/TherapistDashboard/index.tsx b/pages/TherapistDashboard/index.tsx
index d48548a..681ac23 100644
--- a/pages/TherapistDashboard/index.tsx
+++ b/pages/TherapistDashboard/index.tsx
@@ -5,9 +5,9 @@ import { Therapist, Specialization } from "@prisma/client";
 import { useEffect } from "react";
 import { useRouter } from "next/router";
 
-type TherapistWithSpecializations = Therapist & {
+interface TherapistWithSpecializations extends Therapist {
   specializations: Specialization[];
-};
+}
 
 interface TherapistDashboardProps {
   therapist: TherapistWithSpecializations | null;
@@ -19,12 +19,8 @@ export default function TherapistDashboard({
   const { data: session, status } = useSession();
   const router = useRouter();
 
-  console.log("Session status:", status);
-  console.log("Session data:", session);
-
   useEffect(() => {
     if (status === "unauthenticated") {
-      console.log("Redirecting to sign in...");
       signIn(undefined, { callbackUrl: router.asPath });
     }
   }, [status, router]);
@@ -61,12 +57,14 @@ export const getServerSideProps: GetServerSideProps<
 > = async (context) => {
   const session = await getSession(context);
 
-  console.log("Session in getServerSideProps:", session);
-
   if (!session || !session.user || !session.user.id) {
-    console.log("No session or user ID, returning null therapist");
     return {
-      props: { therapist: null },
+      redirect: {
+        destination:
+          "/api/auth/signin?callbackUrl=" +
+          encodeURIComponent(context.resolvedUrl),
+        permanent: false,
+      },
     };
   }
 
@@ -75,10 +73,7 @@ export const getServerSideProps: GetServerSideProps<
     include: { specializations: true },
   });
 
-  console.log("Therapist found:", therapist ? "Yes" : "No");
-
   if (!therapist) {
-    console.log("No therapist, redirecting to TherapistApply");
     return {
       redirect: {
         destination: "/TherapistApply",
diff --git a/pages/api/auth/[...nextauth].ts b/pages/api/auth/[...nextauth].ts
index e538cd9..a1d2a83 100644
--- a/pages/api/auth/[...nextauth].ts
+++ b/pages/api/auth/[...nextauth].ts
@@ -12,18 +12,23 @@ export const authOptions: NextAuthOptions = {
       clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
     }),
   ],
-  secret: process.env.NEXTAUTH_SECRET || "secret",
+  secret: process.env.NEXTAUTH_SECRET,
   callbacks: {
     async jwt({ token, user, account }) {
-      console.log("JWT callback", { token, user, account });
+      console.log("JWT Callback - Token:", token);
+      console.log("JWT Callback - User:", user);
+      console.log("JWT Callback - Account:", account);
+
       if (account && user) {
         token.accessToken = account.access_token;
         token.id = user.id;
       }
       return token;
     },
-    async session({ session, token, user }) {
-      console.log("Session callback", { session, token, user });
+    async session({ session, token }) {
+      console.log("Session Callback - Session:", session);
+      console.log("Session Callback - Token:", token);
+
       if (token) {
         session.accessToken = token.accessToken as string;
         if (session.user) {
@@ -34,7 +39,7 @@ export const authOptions: NextAuthOptions = {
     },
   },
   session: { strategy: "jwt" as SessionStrategy },
-  debug: true, // Enable debug messages
+  debug: true,
 };
 
 export default NextAuth(authOptions);
diff --git a/pages/api/therapists/register.ts b/pages/api/therapists/register.ts
index 75317b6..7fb847b 100644
--- a/pages/api/therapists/register.ts
+++ b/pages/api/therapists/register.ts
@@ -12,6 +12,7 @@ export default async function handler(
   }
 
   const session = await getServerSession(req, res, authOptions);
+
   if (!session?.user?.id) {
     return res.status(401).json({ message: "Unauthorized" });
   }
diff --git a/yarn.lock b/yarn.lock
index 5edbc5f..2690ee2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -55,48 +55,13 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
-"@babel/runtime@^7.0.0":
-  version "7.21.0"
-  resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz"
-  integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
-  dependencies:
-    regenerator-runtime "^0.13.11"
-
-"@babel/runtime@^7.12.13":
-  version "7.21.0"
-  resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz"
-  integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
-  dependencies:
-    regenerator-runtime "^0.13.11"
-
-"@babel/runtime@^7.12.5":
-  version "7.21.0"
-  resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz"
-  integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
-  dependencies:
-    regenerator-runtime "^0.13.11"
-
-"@babel/runtime@^7.13.10", "@babel/runtime@^7.20.13":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.12.13", "@babel/runtime@^7.12.5", "@babel/runtime@^7.13.10", "@babel/runtime@^7.18.3", "@babel/runtime@^7.20.13", "@babel/runtime@^7.20.7":
   version "7.24.5"
   resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.5.tgz"
   integrity sha512-Nms86NXrsaeU9vbBJKni6gXiEXZ4CVpYVzEjDH9Sb8vmZ3UljyA1GSOJl/6LGPO8EHLuSF9H+IxNXHPX8QHJ4g==
   dependencies:
     regenerator-runtime "^0.14.0"
 
-"@babel/runtime@^7.18.3":
-  version "7.21.0"
-  resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz"
-  integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
-  dependencies:
-    regenerator-runtime "^0.13.11"
-
-"@babel/runtime@^7.20.7":
-  version "7.21.0"
-  resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz"
-  integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
-  dependencies:
-    regenerator-runtime "^0.13.11"
-
 "@babel/types@^7.21.4":
   version "7.21.4"
   dependencies:
@@ -1500,10 +1465,10 @@
     "@motionone/dom" "^10.16.4"
     tslib "^2.3.1"
 
-"@next/env@*", "@next/env@14.2.3":
-  version "14.2.3"
-  resolved "https://registry.npmjs.org/@next/env/-/env-14.2.3.tgz"
-  integrity sha512-W7fd7IbkfmeeY2gXrzJYDx8D2lWKbVoTIj1o1ScPHNzvp30s1AuoEFSdr39bC5sjxJaxTtq3OTCZboNp0lNWHA==
+"@next/env@*", "@next/env@14.2.5":
+  version "14.2.5"
+  resolved "https://registry.npmjs.org/@next/env/-/env-14.2.5.tgz"
+  integrity sha512-/zZGkrTOsraVfYjGP8uM0p6r0BDT6xWpkjdVbcz66PJVSpwXX3yNiRycxAuDfBKGWBrZBXRuK/YVlkNgxHGwmA==
 
 "@next/eslint-plugin-next@13.3.0":
   version "13.3.0"
@@ -1512,10 +1477,10 @@
   dependencies:
     glob "7.1.7"
 
-"@next/swc-darwin-arm64@14.2.3":
-  version "14.2.3"
-  resolved "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.3.tgz"
-  integrity sha512-3pEYo/RaGqPP0YzwnlmPN2puaF2WMLM3apt5jLW2fFdXD9+pqcoTzRk+iZsf8ta7+quAe4Q6Ms0nR0SFGFdS1A==
+"@next/swc-darwin-arm64@14.2.5":
+  version "14.2.5"
+  resolved "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.5.tgz"
+  integrity sha512-/9zVxJ+K9lrzSGli1///ujyRfon/ZneeZ+v4ptpiPoOU+GKZnm8Wj8ELWU1Pm7GHltYRBklmXMTUqM/DqQ99FQ==
 
 "@noble/curves@~1.2.0", "@noble/curves@1.2.0":
   version "1.2.0"
@@ -2870,20 +2835,13 @@ argparse@^2.0.1:
   resolved "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
-aria-hidden@^1.1.1:
+aria-hidden@^1.1.1, aria-hidden@^1.2.2:
   version "1.2.4"
   resolved "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.4.tgz"
   integrity sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==
   dependencies:
     tslib "^2.0.0"
 
-aria-hidden@^1.2.2:
-  version "1.2.3"
-  resolved "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.3.tgz"
-  integrity sha512-xcLxITLe2HYa1cnYnwCjkOO1PqUHQpozB8x9AR0OgWN2woOBi5kSDVxKfd0b7sb1hw5qFeJhXm9H1nu3xSfLeQ==
-  dependencies:
-    tslib "^2.0.0"
-
 aria-query@^5.1.3:
   version "5.1.3"
   resolved "https://registry.npmjs.org/aria-query/-/aria-query-5.1.3.tgz"
@@ -4869,10 +4827,7 @@ fsevents@^2.3.2, fsevents@~2.3.2:
   resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz"
   integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
 
-function-bind@^1.1.1:
-  version "1.1.1"
-
-function-bind@^1.1.2:
+function-bind@^1.1.1, function-bind@^1.1.2:
   version "1.1.2"
   resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz"
   integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
@@ -7375,11 +7330,11 @@ next-sitemap@^4.0.9:
     minimist "^1.2.8"
 
 next@*, "next@^12.2.5 || ^13 || ^14", next@^14.2.3, next@>=11.0.0, next@>=13:
-  version "14.2.3"
-  resolved "https://registry.npmjs.org/next/-/next-14.2.3.tgz"
-  integrity sha512-dowFkFTR8v79NPJO4QsBUtxv0g9BrS/phluVpMAt2ku7H+cbcBJlopXjkWlwxrk/xGqMemr7JkGPGemPrLLX7A==
+  version "14.2.5"
+  resolved "https://registry.npmjs.org/next/-/next-14.2.5.tgz"
+  integrity sha512-0f8aRfBVL+mpzfBjYfQuLWh2WyAwtJXCRfkPF4UJ5qd2YwrHczsrSzXU4tRMV0OAxR8ZJZWPFn6uhSC56UTsLA==
   dependencies:
-    "@next/env" "14.2.3"
+    "@next/env" "14.2.5"
     "@swc/helpers" "0.5.5"
     busboy "1.6.0"
     caniuse-lite "^1.0.30001579"
@@ -7387,15 +7342,15 @@ next@*, "next@^12.2.5 || ^13 || ^14", next@^14.2.3, next@>=11.0.0, next@>=13:
     postcss "8.4.31"
     styled-jsx "5.1.1"
   optionalDependencies:
-    "@next/swc-darwin-arm64" "14.2.3"
-    "@next/swc-darwin-x64" "14.2.3"
-    "@next/swc-linux-arm64-gnu" "14.2.3"
-    "@next/swc-linux-arm64-musl" "14.2.3"
-    "@next/swc-linux-x64-gnu" "14.2.3"
-    "@next/swc-linux-x64-musl" "14.2.3"
-    "@next/swc-win32-arm64-msvc" "14.2.3"
-    "@next/swc-win32-ia32-msvc" "14.2.3"
-    "@next/swc-win32-x64-msvc" "14.2.3"
+    "@next/swc-darwin-arm64" "14.2.5"
+    "@next/swc-darwin-x64" "14.2.5"
+    "@next/swc-linux-arm64-gnu" "14.2.5"
+    "@next/swc-linux-arm64-musl" "14.2.5"
+    "@next/swc-linux-x64-gnu" "14.2.5"
+    "@next/swc-linux-x64-musl" "14.2.5"
+    "@next/swc-win32-arm64-msvc" "14.2.5"
+    "@next/swc-win32-ia32-msvc" "14.2.5"
+    "@next/swc-win32-x64-msvc" "14.2.5"
 
 nextjs-google-analytics@^2.3.3:
   version "2.3.3"
@@ -8397,7 +8352,7 @@ real-require@^0.1.0:
   resolved "https://registry.npmjs.org/real-require/-/real-require-0.1.0.tgz"
   integrity sha512-r/H9MzAWtrv8aSVjPCMFpDMl5q66GqtmmRkRjpHTsp4zBAa+snZyiQNlMONiUmEJcsnaw0wCauJ2GWODr/aFkg==
 
-regenerator-runtime@^0.13.11, regenerator-runtime@^0.13.7:
+regenerator-runtime@^0.13.7:
   version "0.13.11"
   resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz"
   integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
@@ -9486,10 +9441,10 @@ typedarray-to-buffer@^3.1.5:
   dependencies:
     is-typedarray "^1.0.0"
 
-"typescript@^4.7 || 5", "typescript@>= 4.3", typescript@>=2.7, "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta", typescript@>=3.3.1, typescript@>=5.0.4, typescript@5.0.4:
-  version "5.0.4"
-  resolved "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz"
-  integrity sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==
+"typescript@^4.7 || 5", typescript@^5.5.3, "typescript@>= 4.3", typescript@>=2.7, "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta", typescript@>=3.3.1, typescript@>=5.0.4:
+  version "5.5.3"
+  resolved "https://registry.npmjs.org/typescript/-/typescript-5.5.3.tgz"
+  integrity sha512-/hreyEujaB0w76zKo6717l3L0o/qEUtRgdvUBvlkhoWeOVMjMuHNHk0BRBzikzuGDqNmPQbg5ifMEqsHLiIUcQ==
 
 ua-parser-js@^1.0.35:
   version "1.0.35"

From 8f3d8759c0391af188798f4287a8bdb16161a78f Mon Sep 17 00:00:00 2001
From: tanmay4l <tanmaydhobale@tanmays-MacBook-Air.local>
Date: Sat, 13 Jul 2024 16:56:59 +0530
Subject: [PATCH 2/3] fixed

---
 pages/TherapistApply/index.tsx   | 565 +++++++++++++++++++++++++++++--
 pages/api/therapists/register.ts |  19 +-
 2 files changed, 544 insertions(+), 40 deletions(-)

diff --git a/pages/TherapistApply/index.tsx b/pages/TherapistApply/index.tsx
index 4cf55b2..3464561 100644
--- a/pages/TherapistApply/index.tsx
+++ b/pages/TherapistApply/index.tsx
@@ -5,18 +5,60 @@ import { Therapist } from "@prisma/client";
 import { useEffect, useState } from "react";
 import { useRouter } from "next/router";
 
+interface SerializedTherapist extends Omit<Therapist, "dateOfBirth"> {
+  dateOfBirth: string | null;
+}
+
 interface TherapistApplyProps {
-  therapist:
-    | (Omit<Therapist, "dateOfBirth"> & { dateOfBirth: string | null })
-    | null;
+  therapist: SerializedTherapist | null;
 }
 
 export default function TherapistApply({ therapist }: TherapistApplyProps) {
   const { data: session, status } = useSession();
   const router = useRouter();
   const [formData, setFormData] = useState({
-    // ... your existing formData initialization
-    dateOfBirth: "", // Adjust based on your form requirements
+    type: "",
+    fullName: "",
+    dateOfBirth: "",
+    gender: "",
+    currentLocation: "",
+    languages: "",
+    hoursAvailable: "",
+    experienceYears: "",
+    specializations: "",
+    heardFrom: "",
+    workingElsewhere: "",
+    whyJoining: "",
+    linkedinProfile: "",
+    referredBy: "",
+    longBio: "",
+    certifications: [
+      {
+        name: "",
+        issuedAt: "",
+        expiresAt: "",
+        issuedBy: "",
+      },
+    ],
+    education: [
+      {
+        institution: "",
+        degree: "",
+        fieldOfStudy: "",
+        startDate: "",
+        endDate: "",
+        grade: "",
+      },
+    ],
+    workExperience: [
+      {
+        company: "",
+        position: "",
+        startDate: "",
+        endDate: "",
+        description: "",
+      },
+    ],
   });
 
   useEffect(() => {
@@ -25,17 +67,6 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
     }
   }, [status, router]);
 
-  useEffect(() => {
-    if (therapist && therapist.dateOfBirth) {
-      setFormData((prev) => ({
-        ...prev,
-        dateOfBirth: new Date(therapist.dateOfBirth)
-          .toISOString()
-          .split("T")[0],
-      }));
-    }
-  }, [therapist]);
-
   const handleChange = (
     e: React.ChangeEvent<
       HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement
@@ -48,6 +79,45 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
     }));
   };
 
+  const handleCertificationChange = (
+    index: number,
+    e: React.ChangeEvent<HTMLInputElement>
+  ) => {
+    const { name, value } = e.target;
+    setFormData((prev) => ({
+      ...prev,
+      certifications: prev.certifications.map((cert, i) =>
+        i === index ? { ...cert, [name]: value } : cert
+      ),
+    }));
+  };
+
+  const handleEducationChange = (
+    index: number,
+    e: React.ChangeEvent<HTMLInputElement>
+  ) => {
+    const { name, value } = e.target;
+    setFormData((prev) => ({
+      ...prev,
+      education: prev.education.map((edu, i) =>
+        i === index ? { ...edu, [name]: value } : edu
+      ),
+    }));
+  };
+
+  const handleWorkExperienceChange = (
+    index: number,
+    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
+  ) => {
+    const { name, value } = e.target;
+    setFormData((prev) => ({
+      ...prev,
+      workExperience: prev.workExperience.map((exp, i) =>
+        i === index ? { ...exp, [name]: value } : exp
+      ),
+    }));
+  };
+
   const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
@@ -79,13 +149,452 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
   }
 
   if (therapist) {
-    return <div>You have already applied as a therapist.</div>;
+    return <div>You have already submitted an application as a therapist.</div>;
   }
 
   return (
     <div>
       <h1>Apply as a Therapist</h1>
-      <form onSubmit={handleSubmit}>{/* Your form inputs */}</form>
+      <form onSubmit={handleSubmit}>
+        <div className="form-section">
+          <h2>Basic Information</h2>
+          <label>
+            Type:
+            <select
+              name="type"
+              value={formData.type}
+              onChange={handleChange}
+              required
+            >
+              <option value="">Select</option>
+              <option value="PROFESSIONAL">Professional</option>
+              <option value="STUDENT">Student</option>
+            </select>
+          </label>
+          <label>
+            Full Name:
+            <input
+              type="text"
+              name="fullName"
+              value={formData.fullName}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Date of Birth:
+            <input
+              type="date"
+              name="dateOfBirth"
+              value={formData.dateOfBirth}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Gender:
+            <select
+              name="gender"
+              value={formData.gender}
+              onChange={handleChange}
+              required
+            >
+              <option value="">Select</option>
+              <option value="male">Male</option>
+              <option value="female">Female</option>
+              <option value="other">Other</option>
+            </select>
+          </label>
+          <label>
+            Current Location:
+            <input
+              type="text"
+              name="currentLocation"
+              value={formData.currentLocation}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Languages Spoken:
+            <input
+              type="text"
+              name="languages"
+              value={formData.languages}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Hours Available:
+            <input
+              type="number"
+              name="hoursAvailable"
+              value={formData.hoursAvailable}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Experience (Years):
+            <input
+              type="number"
+              name="experienceYears"
+              value={formData.experienceYears}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Specializations (comma separated):
+            <input
+              type="text"
+              name="specializations"
+              value={formData.specializations}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Heard From:
+            <input
+              type="text"
+              name="heardFrom"
+              value={formData.heardFrom}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            Working Elsewhere:
+            <select
+              name="workingElsewhere"
+              value={formData.workingElsewhere}
+              onChange={handleChange}
+              required
+            >
+              <option value="">Select</option>
+              <option value="true">Yes</option>
+              <option value="false">No</option>
+            </select>
+          </label>
+          <label>
+            Why Joining:
+            <textarea
+              name="whyJoining"
+              value={formData.whyJoining}
+              onChange={handleChange}
+              required
+            />
+          </label>
+          <label>
+            LinkedIn Profile:
+            <input
+              type="text"
+              name="linkedinProfile"
+              value={formData.linkedinProfile}
+              onChange={handleChange}
+            />
+          </label>
+          <label>
+            Referred By:
+            <input
+              type="text"
+              name="referredBy"
+              value={formData.referredBy}
+              onChange={handleChange}
+            />
+          </label>
+          <label>
+            Long Bio:
+            <textarea
+              name="longBio"
+              value={formData.longBio}
+              onChange={handleChange}
+              required
+            />
+          </label>
+        </div>
+
+        <div className="form-section">
+          <h2>Certifications</h2>
+          {formData.certifications.map((cert, index) => (
+            <div key={index} className="sub-section">
+              <label>
+                Name:
+                <input
+                  type="text"
+                  name="name"
+                  value={cert.name}
+                  onChange={(e) => handleCertificationChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                Issued At:
+                <input
+                  type="date"
+                  name="issuedAt"
+                  value={cert.issuedAt}
+                  onChange={(e) => handleCertificationChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                Expires At:
+                <input
+                  type="date"
+                  name="expiresAt"
+                  value={cert.expiresAt}
+                  onChange={(e) => handleCertificationChange(index, e)}
+                />
+              </label>
+              <label>
+                Issued By:
+                <input
+                  type="text"
+                  name="issuedBy"
+                  value={cert.issuedBy}
+                  onChange={(e) => handleCertificationChange(index, e)}
+                  required
+                />
+              </label>
+            </div>
+          ))}
+          <button
+            type="button"
+            onClick={() =>
+              setFormData((prev) => ({
+                ...prev,
+                certifications: [
+                  ...prev.certifications,
+                  {
+                    name: "",
+                    issuedAt: "",
+                    expiresAt: "",
+                    issuedBy: "",
+                  },
+                ],
+              }))
+            }
+          >
+            Add Certification
+          </button>
+        </div>
+
+        <div className="form-section">
+          <h2>Education</h2>
+          {formData.education.map((edu, index) => (
+            <div key={index} className="sub-section">
+              <label>
+                Institution:
+                <input
+                  type="text"
+                  name="institution"
+                  value={edu.institution}
+                  onChange={(e) => handleEducationChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                Degree:
+                <input
+                  type="text"
+                  name="degree"
+                  value={edu.degree}
+                  onChange={(e) => handleEducationChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                Field of Study:
+                <input
+                  type="text"
+                  name="fieldOfStudy"
+                  value={edu.fieldOfStudy}
+                  onChange={(e) => handleEducationChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                Start Date:
+                <input
+                  type="date"
+                  name="startDate"
+                  value={edu.startDate}
+                  onChange={(e) => handleEducationChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                End Date:
+                <input
+                  type="date"
+                  name="endDate"
+                  value={edu.endDate}
+                  onChange={(e) => handleEducationChange(index, e)}
+                />
+              </label>
+              <label>
+                Grade:
+                <input
+                  type="text"
+                  name="grade"
+                  value={edu.grade}
+                  onChange={(e) => handleEducationChange(index, e)}
+                />
+              </label>
+            </div>
+          ))}
+          <button
+            type="button"
+            onClick={() =>
+              setFormData((prev) => ({
+                ...prev,
+                education: [
+                  ...prev.education,
+                  {
+                    institution: "",
+                    degree: "",
+                    fieldOfStudy: "",
+                    startDate: "",
+                    endDate: "",
+                    grade: "",
+                  },
+                ],
+              }))
+            }
+          >
+            Add Education
+          </button>
+        </div>
+
+        <div className="form-section">
+          <h2>Work Experience</h2>
+          {formData.workExperience.map((exp, index) => (
+            <div key={index} className="sub-section">
+              <label>
+                Company:
+                <input
+                  type="text"
+                  name="company"
+                  value={exp.company}
+                  onChange={(e) => handleWorkExperienceChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                Position:
+                <input
+                  type="text"
+                  name="position"
+                  value={exp.position}
+                  onChange={(e) => handleWorkExperienceChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                Start Date:
+                <input
+                  type="date"
+                  name="startDate"
+                  value={exp.startDate}
+                  onChange={(e) => handleWorkExperienceChange(index, e)}
+                  required
+                />
+              </label>
+              <label>
+                End Date:
+                <input
+                  type="date"
+                  name="endDate"
+                  value={exp.endDate}
+                  onChange={(e) => handleWorkExperienceChange(index, e)}
+                />
+              </label>
+              <label>
+                Description:
+                <textarea
+                  name="description"
+                  value={exp.description}
+                  onChange={(e) => handleWorkExperienceChange(index, e)}
+                />
+              </label>
+            </div>
+          ))}
+          <button
+            type="button"
+            onClick={() =>
+              setFormData((prev) => ({
+                ...prev,
+                workExperience: [
+                  ...prev.workExperience,
+                  {
+                    company: "",
+                    position: "",
+                    startDate: "",
+                    endDate: "",
+                    description: "",
+                  },
+                ],
+              }))
+            }
+          >
+            Add Work Experience
+          </button>
+        </div>
+
+        <button type="submit">Submit Application</button>
+      </form>
+      <style jsx>{`
+        .form-section {
+          margin-bottom: 20px;
+          padding: 10px;
+          border: 1px solid #ddd;
+          border-radius: 5px;
+        }
+
+        .form-section h2 {
+          margin-top: 0;
+        }
+
+        .sub-section {
+          margin-bottom: 10px;
+        }
+
+        label {
+          display: block;
+          margin-bottom: 10px;
+        }
+
+        input[type="text"],
+        input[type="date"],
+        input[type="number"],
+        select,
+        textarea {
+          width: 100%;
+          padding: 8px;
+          margin-top: 5px;
+          margin-bottom: 10px;
+          border: 1px solid #ddd;
+          border-radius: 4px;
+        }
+
+        button {
+          display: inline-block;
+          padding: 10px 20px;
+          font-size: 16px;
+          color: #fff;
+          background-color: #0070f3;
+          border: none;
+          border-radius: 5px;
+          cursor: pointer;
+        }
+
+        button:hover {
+          background-color: #005bb5;
+        }
+      `}</style>
     </div>
   );
 }
@@ -103,22 +612,16 @@ export const getServerSideProps: GetServerSideProps<
     where: { userId: session.user.id },
   });
 
-  if (therapist) {
-    return {
-      props: {
-        therapist: {
-          ...therapist,
-          dateOfBirth: therapist.dateOfBirth
-            ? therapist.dateOfBirth.toISOString()
-            : null,
-        },
-      },
-    };
-  }
+  const serializedTherapist: SerializedTherapist | null = therapist
+    ? {
+        ...therapist,
+        dateOfBirth: therapist.dateOfBirth?.toISOString() || null,
+      }
+    : null;
 
   return {
     props: {
-      therapist: null,
+      therapist: serializedTherapist,
     },
   };
 };
diff --git a/pages/api/therapists/register.ts b/pages/api/therapists/register.ts
index 7fb847b..ee58965 100644
--- a/pages/api/therapists/register.ts
+++ b/pages/api/therapists/register.ts
@@ -26,18 +26,20 @@ export default async function handler(
     languages,
     hoursAvailable,
     experienceYears,
-    specializations,
+    specializations = [],
     heardFrom,
     workingElsewhere,
     whyJoining,
     linkedinProfile,
     referredBy,
     longBio,
-    certifications,
-    education,
-    workExperience,
+    certifications = [],
+    education = [],
+    workExperience = [],
   } = req.body;
-
+  const specializationArray = Array.isArray(specializations)
+    ? specializations
+    : [];
   try {
     const therapistData = {
       userId: session.user.id,
@@ -46,7 +48,7 @@ export default async function handler(
       dateOfBirth: new Date(dateOfBirth),
       gender,
       currentLocation,
-      languages,
+      languages: languages.split(",").map((lang: string) => lang.trim()),
       hoursAvailable: Number(hoursAvailable),
       experienceYears: Number(experienceYears),
       heardFrom,
@@ -56,9 +58,8 @@ export default async function handler(
       referredBy,
       longBio,
       specializations: {
-        connectOrCreate: specializations.map((name: string) => ({
-          where: { name: name.trim() },
-          create: { name: name.trim() },
+        create: specializationArray.map((spec: any) => ({
+          name: spec.name,
         })),
       },
       certifications: {

From f1415fc9a846a8e38eecd0c07b0337f717f99740 Mon Sep 17 00:00:00 2001
From: tanmay4l <tanmaydhobale@tanmays-MacBook-Air.local>
Date: Sat, 13 Jul 2024 20:44:14 +0530
Subject: [PATCH 3/3] fixed

---
 pages/TherapistApply/index.tsx | 1021 ++++++++++++++++++--------------
 1 file changed, 566 insertions(+), 455 deletions(-)

diff --git a/pages/TherapistApply/index.tsx b/pages/TherapistApply/index.tsx
index 3464561..81fb13e 100644
--- a/pages/TherapistApply/index.tsx
+++ b/pages/TherapistApply/index.tsx
@@ -4,6 +4,18 @@ import prisma from "@/db/db";
 import { Therapist } from "@prisma/client";
 import { useEffect, useState } from "react";
 import { useRouter } from "next/router";
+import {
+  ArrowButton,
+  Box,
+  Container,
+  Input,
+  Radio,
+  RadioGroup,
+  ShadowBox,
+  Stack,
+  Text,
+  Textarea,
+} from "@/lib/ui";
 
 interface SerializedTherapist extends Omit<Therapist, "dateOfBirth"> {
   dateOfBirth: string | null;
@@ -15,6 +27,7 @@ interface TherapistApplyProps {
 
 export default function TherapistApply({ therapist }: TherapistApplyProps) {
   const { data: session, status } = useSession();
+  const [isSubmitted, setIsSubmitted] = useState(false);
   const router = useRouter();
   const [formData, setFormData] = useState({
     type: "",
@@ -32,14 +45,6 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
     linkedinProfile: "",
     referredBy: "",
     longBio: "",
-    certifications: [
-      {
-        name: "",
-        issuedAt: "",
-        expiresAt: "",
-        issuedBy: "",
-      },
-    ],
     education: [
       {
         institution: "",
@@ -67,36 +72,18 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
     }
   }, [status, router]);
 
-  const handleChange = (
-    e: React.ChangeEvent<
-      HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement
-    >
-  ) => {
-    const { name, value } = e.target;
+  const handleChange = (name: string, value: string) => {
     setFormData((prev) => ({
       ...prev,
       [name]: value,
     }));
   };
 
-  const handleCertificationChange = (
-    index: number,
-    e: React.ChangeEvent<HTMLInputElement>
-  ) => {
-    const { name, value } = e.target;
-    setFormData((prev) => ({
-      ...prev,
-      certifications: prev.certifications.map((cert, i) =>
-        i === index ? { ...cert, [name]: value } : cert
-      ),
-    }));
-  };
-
   const handleEducationChange = (
     index: number,
-    e: React.ChangeEvent<HTMLInputElement>
+    name: string,
+    value: string
   ) => {
-    const { name, value } = e.target;
     setFormData((prev) => ({
       ...prev,
       education: prev.education.map((edu, i) =>
@@ -107,9 +94,9 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
 
   const handleWorkExperienceChange = (
     index: number,
-    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
+    name: string,
+    value: string
   ) => {
-    const { name, value } = e.target;
     setFormData((prev) => ({
       ...prev,
       workExperience: prev.workExperience.map((exp, i) =>
@@ -131,6 +118,7 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
       });
 
       if (response.ok) {
+        setIsSubmitted(true);
         router.push("/TherapistDashboard");
       } else {
         console.error("Failed to register therapist:", response.statusText);
@@ -141,461 +129,584 @@ export default function TherapistApply({ therapist }: TherapistApplyProps) {
   };
 
   if (status === "loading") {
-    return <div>Loading...</div>;
+    return <Text>Loading...</Text>;
   }
 
   if (!session) {
-    return <div>Please sign in to apply as a therapist.</div>;
+    return <Text>Please sign in to apply as a therapist.</Text>;
   }
 
   if (therapist) {
-    return <div>You have already submitted an application as a therapist.</div>;
+    return (
+      <Text>You have already submitted an application as a therapist.</Text>
+    );
   }
 
   return (
-    <div>
-      <h1>Apply as a Therapist</h1>
-      <form onSubmit={handleSubmit}>
-        <div className="form-section">
-          <h2>Basic Information</h2>
-          <label>
-            Type:
-            <select
-              name="type"
-              value={formData.type}
-              onChange={handleChange}
-              required
-            >
-              <option value="">Select</option>
-              <option value="PROFESSIONAL">Professional</option>
-              <option value="STUDENT">Student</option>
-            </select>
-          </label>
-          <label>
-            Full Name:
-            <input
-              type="text"
-              name="fullName"
-              value={formData.fullName}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Date of Birth:
-            <input
-              type="date"
-              name="dateOfBirth"
-              value={formData.dateOfBirth}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Gender:
-            <select
-              name="gender"
-              value={formData.gender}
-              onChange={handleChange}
-              required
-            >
-              <option value="">Select</option>
-              <option value="male">Male</option>
-              <option value="female">Female</option>
-              <option value="other">Other</option>
-            </select>
-          </label>
-          <label>
-            Current Location:
-            <input
-              type="text"
-              name="currentLocation"
-              value={formData.currentLocation}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Languages Spoken:
-            <input
-              type="text"
-              name="languages"
-              value={formData.languages}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Hours Available:
-            <input
-              type="number"
-              name="hoursAvailable"
-              value={formData.hoursAvailable}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Experience (Years):
-            <input
-              type="number"
-              name="experienceYears"
-              value={formData.experienceYears}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Specializations (comma separated):
-            <input
-              type="text"
-              name="specializations"
-              value={formData.specializations}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Heard From:
-            <input
-              type="text"
-              name="heardFrom"
-              value={formData.heardFrom}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            Working Elsewhere:
-            <select
-              name="workingElsewhere"
-              value={formData.workingElsewhere}
-              onChange={handleChange}
-              required
-            >
-              <option value="">Select</option>
-              <option value="true">Yes</option>
-              <option value="false">No</option>
-            </select>
-          </label>
-          <label>
-            Why Joining:
-            <textarea
-              name="whyJoining"
-              value={formData.whyJoining}
-              onChange={handleChange}
-              required
-            />
-          </label>
-          <label>
-            LinkedIn Profile:
-            <input
-              type="text"
-              name="linkedinProfile"
-              value={formData.linkedinProfile}
-              onChange={handleChange}
-            />
-          </label>
-          <label>
-            Referred By:
-            <input
-              type="text"
-              name="referredBy"
-              value={formData.referredBy}
-              onChange={handleChange}
-            />
-          </label>
-          <label>
-            Long Bio:
-            <textarea
-              name="longBio"
-              value={formData.longBio}
-              onChange={handleChange}
-              required
-            />
-          </label>
-        </div>
-
-        <div className="form-section">
-          <h2>Certifications</h2>
-          {formData.certifications.map((cert, index) => (
-            <div key={index} className="sub-section">
-              <label>
-                Name:
-                <input
-                  type="text"
-                  name="name"
-                  value={cert.name}
-                  onChange={(e) => handleCertificationChange(index, e)}
+    <Container maxWidth="800px" margin="0 auto">
+      <Box padding="2rem">
+        <Text as="h1" fontSize="2xl" fontWeight="bold" marginBottom="2rem">
+          Apply as a Therapist
+        </Text>
+        <form onSubmit={handleSubmit}>
+          <ShadowBox marginBottom="2rem">
+            <Text as="h2" fontSize="xl" fontWeight="bold" marginBottom="1rem">
+              Basic Information
+            </Text>
+            <Stack spacing="1rem">
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="type"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Type:
+                </Text>
+                <select
+                  id="type"
+                  name="type"
+                  value={formData.type}
+                  onChange={(e) => handleChange("type", e.target.value)}
                   required
-                />
-              </label>
-              <label>
-                Issued At:
-                <input
-                  type="date"
-                  name="issuedAt"
-                  value={cert.issuedAt}
-                  onChange={(e) => handleCertificationChange(index, e)}
+                  className="border rounded p-2"
+                >
+                  <option value="">Select</option>
+                  <option value="PROFESSIONAL">Professional</option>
+                  <option value="STUDENT">Student</option>
+                </select>
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="fullName"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Full Name
+                </Text>
+                <Input
+                  id="fullName"
+                  name="fullName"
+                  value={formData.fullName}
+                  onChange={(e) => handleChange("fullName", e.target.value)}
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                Expires At:
-                <input
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="dateOfBirth"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Date of Birth
+                </Text>
+                <Input
+                  id="dateOfBirth"
+                  name="dateOfBirth"
                   type="date"
-                  name="expiresAt"
-                  value={cert.expiresAt}
-                  onChange={(e) => handleCertificationChange(index, e)}
-                />
-              </label>
-              <label>
-                Issued By:
-                <input
-                  type="text"
-                  name="issuedBy"
-                  value={cert.issuedBy}
-                  onChange={(e) => handleCertificationChange(index, e)}
+                  value={formData.dateOfBirth}
+                  onChange={(e) => handleChange("dateOfBirth", e.target.value)}
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-            </div>
-          ))}
-          <button
-            type="button"
-            onClick={() =>
-              setFormData((prev) => ({
-                ...prev,
-                certifications: [
-                  ...prev.certifications,
-                  {
-                    name: "",
-                    issuedAt: "",
-                    expiresAt: "",
-                    issuedBy: "",
-                  },
-                ],
-              }))
-            }
-          >
-            Add Certification
-          </button>
-        </div>
-
-        <div className="form-section">
-          <h2>Education</h2>
-          {formData.education.map((edu, index) => (
-            <div key={index} className="sub-section">
-              <label>
-                Institution:
-                <input
-                  type="text"
-                  name="institution"
-                  value={edu.institution}
-                  onChange={(e) => handleEducationChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="gender"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Gender
+                </Text>
+                <RadioGroup
+                  id="gender"
+                  name="gender"
+                  value={formData.gender}
+                  onChange={(e) => handleChange("gender", e)}
+                  className="flex space-x-4"
+                >
+                  <Radio value="male">Male</Radio>
+                  <Radio value="female">Female</Radio>
+                  <Radio value="other">Other</Radio>
+                </RadioGroup>
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="languages"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Languages Spoken
+                </Text>
+                <Input
+                  id="languages"
+                  name="languages"
+                  value={formData.languages}
+                  onChange={(e) => handleChange("languages", e.target.value)}
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                Degree:
-                <input
-                  type="text"
-                  name="degree"
-                  value={edu.degree}
-                  onChange={(e) => handleEducationChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="hoursAvailable"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Hours Available
+                </Text>
+                <Input
+                  id="hoursAvailable"
+                  name="hoursAvailable"
+                  type="number"
+                  onChange={(e) =>
+                    handleChange("hoursAvailable", e.target.value)
+                  }
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                Field of Study:
-                <input
-                  type="text"
-                  name="fieldOfStudy"
-                  value={edu.fieldOfStudy}
-                  onChange={(e) => handleEducationChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="experienceYears"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Experience (Years)
+                </Text>
+                <Input
+                  id="experienceYears"
+                  name="experienceYears"
+                  type="number"
+                  value={formData.experienceYears}
+                  onChange={(e) =>
+                    handleChange("experienceYears", e.target.value)
+                  }
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                Start Date:
-                <input
-                  type="date"
-                  name="startDate"
-                  value={edu.startDate}
-                  onChange={(e) => handleEducationChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="specializations"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Specializations (comma separated)
+                </Text>
+                <Input
+                  id="specializations"
+                  name="specializations"
+                  value={formData.specializations}
+                  onChange={(e) =>
+                    handleChange("specializations", e.target.value)
+                  }
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                End Date:
-                <input
-                  type="date"
-                  name="endDate"
-                  value={edu.endDate}
-                  onChange={(e) => handleEducationChange(index, e)}
-                />
-              </label>
-              <label>
-                Grade:
-                <input
-                  type="text"
-                  name="grade"
-                  value={edu.grade}
-                  onChange={(e) => handleEducationChange(index, e)}
-                />
-              </label>
-            </div>
-          ))}
-          <button
-            type="button"
-            onClick={() =>
-              setFormData((prev) => ({
-                ...prev,
-                education: [
-                  ...prev.education,
-                  {
-                    institution: "",
-                    degree: "",
-                    fieldOfStudy: "",
-                    startDate: "",
-                    endDate: "",
-                    grade: "",
-                  },
-                ],
-              }))
-            }
-          >
-            Add Education
-          </button>
-        </div>
-
-        <div className="form-section">
-          <h2>Work Experience</h2>
-          {formData.workExperience.map((exp, index) => (
-            <div key={index} className="sub-section">
-              <label>
-                Company:
-                <input
-                  type="text"
-                  name="company"
-                  value={exp.company}
-                  onChange={(e) => handleWorkExperienceChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="heardFrom"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Heard From
+                </Text>
+                <Input
+                  id="heardFrom"
+                  name="heardFrom"
+                  value={formData.heardFrom}
+                  onChange={(e) => handleChange("heardFrom", e.target.value)}
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                Position:
-                <input
-                  type="text"
-                  name="position"
-                  value={exp.position}
-                  onChange={(e) => handleWorkExperienceChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="workingElsewhere"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Working Elsewhere:
+                </Text>
+                <select
+                  id="workingElsewhere"
+                  name="workingElsewhere"
+                  value={formData.workingElsewhere}
+                  onChange={(e) =>
+                    handleChange("workingElsewhere", e.target.value)
+                  }
                   required
+                  className="border rounded p-2"
+                >
+                  <option value="">Select</option>
+                  <option value="yes">Yes</option>
+                  <option value="no">No</option>
+                </select>
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="whyJoining"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Why Joining?
+                </Text>
+                <Textarea
+                  id="whyJoining"
+                  name="whyJoining"
+                  value={formData.whyJoining}
+                  onChange={(e) => handleChange("whyJoining", e.target.value)}
+                  required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                Start Date:
-                <input
-                  type="date"
-                  name="startDate"
-                  value={exp.startDate}
-                  onChange={(e) => handleWorkExperienceChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="linkedinProfile"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  LinkedIn Profile
+                </Text>
+                <Input
+                  id="linkedinProfile"
+                  name="linkedinProfile"
+                  value={formData.linkedinProfile}
+                  onChange={(e) =>
+                    handleChange("linkedinProfile", e.target.value)
+                  }
                   required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                End Date:
-                <input
-                  type="date"
-                  name="endDate"
-                  value={exp.endDate}
-                  onChange={(e) => handleWorkExperienceChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="referredBy"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Referred By
+                </Text>
+                <Input
+                  id="referredBy"
+                  name="referredBy"
+                  value={formData.referredBy}
+                  onChange={(e) => handleChange("referredBy", e.target.value)}
+                  required
+                  className="border rounded p-2"
                 />
-              </label>
-              <label>
-                Description:
-                <textarea
-                  name="description"
-                  value={exp.description}
-                  onChange={(e) => handleWorkExperienceChange(index, e)}
+              </Box>
+              <Box>
+                <Text
+                  as="label"
+                  htmlFor="longBio"
+                  marginBottom="0.5rem"
+                  display="block"
+                >
+                  Long Bio
+                </Text>
+                <Textarea
+                  id="longBio"
+                  name="longBio"
+                  value={formData.longBio}
+                  onChange={(e) => handleChange("longBio", e.target.value)}
+                  required
+                  className="border rounded p-2"
                 />
-              </label>
-            </div>
-          ))}
-          <button
-            type="button"
-            onClick={() =>
-              setFormData((prev) => ({
-                ...prev,
-                workExperience: [
-                  ...prev.workExperience,
-                  {
-                    company: "",
-                    position: "",
-                    startDate: "",
-                    endDate: "",
-                    description: "",
-                  },
-                ],
-              }))
-            }
-          >
-            Add Work Experience
-          </button>
-        </div>
-
-        <button type="submit">Submit Application</button>
-      </form>
-      <style jsx>{`
-        .form-section {
-          margin-bottom: 20px;
-          padding: 10px;
-          border: 1px solid #ddd;
-          border-radius: 5px;
-        }
-
-        .form-section h2 {
-          margin-top: 0;
-        }
-
-        .sub-section {
-          margin-bottom: 10px;
-        }
-
-        label {
-          display: block;
-          margin-bottom: 10px;
-        }
-
-        input[type="text"],
-        input[type="date"],
-        input[type="number"],
-        select,
-        textarea {
-          width: 100%;
-          padding: 8px;
-          margin-top: 5px;
-          margin-bottom: 10px;
-          border: 1px solid #ddd;
-          border-radius: 4px;
-        }
-
-        button {
-          display: inline-block;
-          padding: 10px 20px;
-          font-size: 16px;
-          color: #fff;
-          background-color: #0070f3;
-          border: none;
-          border-radius: 5px;
-          cursor: pointer;
-        }
-
-        button:hover {
-          background-color: #005bb5;
-        }
-      `}</style>
-    </div>
+              </Box>
+            </Stack>
+          </ShadowBox>
+          <ShadowBox marginBottom="2rem">
+            <Text as="h2" fontSize="xl" fontWeight="bold" marginBottom="1rem">
+              Education
+            </Text>
+            {formData.education.map((education, index) => (
+              <Stack spacing="1rem" key={index}>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`institution-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Institution
+                  </Text>
+                  <Input
+                    id={`institution-${index}`}
+                    name={`institution-${index}`}
+                    value={education.institution}
+                    onChange={(e) =>
+                      handleEducationChange(
+                        index,
+                        "institution",
+                        e.target.value
+                      )
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`degree-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Degree
+                  </Text>
+                  <Input
+                    id={`degree-${index}`}
+                    name={`degree-${index}`}
+                    value={education.degree}
+                    onChange={(e) =>
+                      handleEducationChange(index, "degree", e.target.value)
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`fieldOfStudy-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Field of Study
+                  </Text>
+                  <Input
+                    id={`fieldOfStudy-${index}`}
+                    name={`fieldOfStudy-${index}`}
+                    value={education.fieldOfStudy}
+                    onChange={(e) =>
+                      handleEducationChange(
+                        index,
+                        "fieldOfStudy",
+                        e.target.value
+                      )
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`startDate-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Start Date
+                  </Text>
+                  <Input
+                    id={`startDate-${index}`}
+                    name={`startDate-${index}`}
+                    type="date"
+                    value={education.startDate}
+                    onChange={(e) =>
+                      handleEducationChange(index, "startDate", e.target.value)
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`endDate-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    End Date
+                  </Text>
+                  <Input
+                    id={`endDate-${index}`}
+                    name={`endDate-${index}`}
+                    type="date"
+                    value={education.endDate}
+                    onChange={(e) =>
+                      handleEducationChange(index, "endDate", e.target.value)
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`grade-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Grade
+                  </Text>
+                  <Input
+                    id={`grade-${index}`}
+                    name={`grade-${index}`}
+                    value={education.grade}
+                    onChange={(e) =>
+                      handleEducationChange(index, "grade", e.target.value)
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+              </Stack>
+            ))}
+          </ShadowBox>
+          <ShadowBox marginBottom="2rem">
+            <Text as="h2" fontSize="xl" fontWeight="bold" marginBottom="1rem">
+              Work Experience
+            </Text>
+            {formData.workExperience.map((work, index) => (
+              <Stack spacing="1rem" key={index}>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`company-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Company
+                  </Text>
+                  <Input
+                    id={`company-${index}`}
+                    name={`company-${index}`}
+                    value={work.company}
+                    onChange={(e) =>
+                      handleWorkExperienceChange(
+                        index,
+                        "company",
+                        e.target.value
+                      )
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`position-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Position
+                  </Text>
+                  <Input
+                    id={`position-${index}`}
+                    name={`position-${index}`}
+                    value={work.position}
+                    onChange={(e) =>
+                      handleWorkExperienceChange(
+                        index,
+                        "position",
+                        e.target.value
+                      )
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`startDate-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Start Date
+                  </Text>
+                  <Input
+                    id={`startDate-${index}`}
+                    name={`startDate-${index}`}
+                    type="date"
+                    value={work.startDate}
+                    onChange={(e) =>
+                      handleWorkExperienceChange(
+                        index,
+                        "startDate",
+                        e.target.value
+                      )
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`endDate-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    End Date
+                  </Text>
+                  <Input
+                    id={`endDate-${index}`}
+                    name={`endDate-${index}`}
+                    type="date"
+                    value={work.endDate}
+                    onChange={(e) =>
+                      handleWorkExperienceChange(
+                        index,
+                        "endDate",
+                        e.target.value
+                      )
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+                <Box>
+                  <Text
+                    as="label"
+                    htmlFor={`description-${index}`}
+                    marginBottom="0.5rem"
+                    display="block"
+                  >
+                    Description
+                  </Text>
+                  <Textarea
+                    id={`description-${index}`}
+                    name={`description-${index}`}
+                    value={work.description}
+                    onChange={(e) =>
+                      handleWorkExperienceChange(
+                        index,
+                        "description",
+                        e.target.value
+                      )
+                    }
+                    required
+                    className="border rounded p-2"
+                  />
+                </Box>
+              </Stack>
+            ))}
+          </ShadowBox>
+          <ArrowButton type="submit" className="bg-blue-500 text-white">
+            Submit
+          </ArrowButton>
+        </form>
+      </Box>
+    </Container>
   );
 }