From 1157b77835a25d62e37b61ea348b082bc2b53b68 Mon Sep 17 00:00:00 2001
From: swve <bdswve@gmail.com>
Date: Mon, 13 Mar 2023 22:22:03 +0100
Subject: [PATCH] feat: add profile settings page

---
 .../{ => (withmenu)}/activity/page.tsx        |   0
 .../{ => (withmenu)}/collections/new/page.tsx |   0
 .../{ => (withmenu)}/collections/page.tsx     |   0
 .../course/[courseid]/edit/page.tsx           |   0
 .../[courseid]/lecture/[lectureid]/page.tsx   |   0
 .../course/[courseid]/page.tsx                |   0
 .../{ => (withmenu)}/courses/new/page.tsx     |   0
 .../{ => (withmenu)}/courses/page.tsx         |   6 +-
 .../app/_orgs/[orgslug]/(withmenu)/layout.tsx |  15 +
 front/app/_orgs/[orgslug]/layout.tsx          |   1 -
 .../settings/account/profile/page.tsx         |  52 +++
 front/app/_orgs/[orgslug]/settings/head.tsx   |  15 +
 front/app/_orgs/[orgslug]/settings/layout.tsx |  88 +++++
 front/app/_orgs/[orgslug]/settings/page.tsx   |   9 +
 front/components/UI/Elements/Menu.tsx         |   2 +-
 front/package-lock.json                       | 360 ++++++++++++------
 front/package.json                            |   4 +-
 front/services/settings/profile.ts            |  15 +
 front/styles/globals.css                      |   4 +-
 src/routers/users.py                          |   2 +-
 src/services/users.py                         |  17 +-
 21 files changed, 456 insertions(+), 134 deletions(-)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/activity/page.tsx (100%)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/collections/new/page.tsx (100%)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/collections/page.tsx (100%)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/course/[courseid]/edit/page.tsx (100%)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/course/[courseid]/lecture/[lectureid]/page.tsx (100%)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/course/[courseid]/page.tsx (100%)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/courses/new/page.tsx (100%)
 rename front/app/_orgs/[orgslug]/{ => (withmenu)}/courses/page.tsx (92%)
 create mode 100644 front/app/_orgs/[orgslug]/(withmenu)/layout.tsx
 create mode 100644 front/app/_orgs/[orgslug]/settings/account/profile/page.tsx
 create mode 100644 front/app/_orgs/[orgslug]/settings/head.tsx
 create mode 100644 front/app/_orgs/[orgslug]/settings/layout.tsx
 create mode 100644 front/app/_orgs/[orgslug]/settings/page.tsx
 create mode 100644 front/services/settings/profile.ts

diff --git a/front/app/_orgs/[orgslug]/activity/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/activity/page.tsx
similarity index 100%
rename from front/app/_orgs/[orgslug]/activity/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/activity/page.tsx
diff --git a/front/app/_orgs/[orgslug]/collections/new/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/collections/new/page.tsx
similarity index 100%
rename from front/app/_orgs/[orgslug]/collections/new/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/collections/new/page.tsx
diff --git a/front/app/_orgs/[orgslug]/collections/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/collections/page.tsx
similarity index 100%
rename from front/app/_orgs/[orgslug]/collections/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/collections/page.tsx
diff --git a/front/app/_orgs/[orgslug]/course/[courseid]/edit/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/edit/page.tsx
similarity index 100%
rename from front/app/_orgs/[orgslug]/course/[courseid]/edit/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/edit/page.tsx
diff --git a/front/app/_orgs/[orgslug]/course/[courseid]/lecture/[lectureid]/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/lecture/[lectureid]/page.tsx
similarity index 100%
rename from front/app/_orgs/[orgslug]/course/[courseid]/lecture/[lectureid]/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/lecture/[lectureid]/page.tsx
diff --git a/front/app/_orgs/[orgslug]/course/[courseid]/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/page.tsx
similarity index 100%
rename from front/app/_orgs/[orgslug]/course/[courseid]/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/page.tsx
diff --git a/front/app/_orgs/[orgslug]/courses/new/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/courses/new/page.tsx
similarity index 100%
rename from front/app/_orgs/[orgslug]/courses/new/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/courses/new/page.tsx
diff --git a/front/app/_orgs/[orgslug]/courses/page.tsx b/front/app/_orgs/[orgslug]/(withmenu)/courses/page.tsx
similarity index 92%
rename from front/app/_orgs/[orgslug]/courses/page.tsx
rename to front/app/_orgs/[orgslug]/(withmenu)/courses/page.tsx
index 153e702a..b661d16f 100644
--- a/front/app/_orgs/[orgslug]/courses/page.tsx
+++ b/front/app/_orgs/[orgslug]/(withmenu)/courses/page.tsx
@@ -3,9 +3,9 @@ import Link from "next/link";
 import { useRouter } from "next/navigation";
 import React from "react";
 import styled from "styled-components";
-import { Title } from "../../../../components/UI/Elements/Styles/Title";
-import { getAPIUrl, getBackendUrl, getUriWithOrg } from "../../../../services/config";
-import { deleteCourseFromBackend } from "../../../../services/courses/courses";
+import { Title } from "@components/UI/Elements/Styles/Title";
+import { getAPIUrl, getBackendUrl, getUriWithOrg } from "@services/config";
+import { deleteCourseFromBackend } from "@services/courses/courses";
 import useSWR, { mutate } from "swr";
 import { swrFetcher } from "@services/utils/requests";
 import { Edit2, Trash } from "lucide-react";
diff --git a/front/app/_orgs/[orgslug]/(withmenu)/layout.tsx b/front/app/_orgs/[orgslug]/(withmenu)/layout.tsx
new file mode 100644
index 00000000..4269ad70
--- /dev/null
+++ b/front/app/_orgs/[orgslug]/(withmenu)/layout.tsx
@@ -0,0 +1,15 @@
+import "@styles/globals.css";
+import { Menu } from "@components/UI/Elements/Menu";
+import AuthProvider from "@components/Security/AuthProvider";
+
+export default function RootLayout({ children, params }: { children: React.ReactNode , params:any}) {
+  
+  return (
+    <>
+      <AuthProvider>
+        <Menu></Menu>
+        {children}
+      </AuthProvider>
+    </>
+  );
+}
diff --git a/front/app/_orgs/[orgslug]/layout.tsx b/front/app/_orgs/[orgslug]/layout.tsx
index 4269ad70..d73f3607 100644
--- a/front/app/_orgs/[orgslug]/layout.tsx
+++ b/front/app/_orgs/[orgslug]/layout.tsx
@@ -7,7 +7,6 @@ export default function RootLayout({ children, params }: { children: React.React
   return (
     <>
       <AuthProvider>
-        <Menu></Menu>
         {children}
       </AuthProvider>
     </>
diff --git a/front/app/_orgs/[orgslug]/settings/account/profile/page.tsx b/front/app/_orgs/[orgslug]/settings/account/profile/page.tsx
new file mode 100644
index 00000000..00ee1533
--- /dev/null
+++ b/front/app/_orgs/[orgslug]/settings/account/profile/page.tsx
@@ -0,0 +1,52 @@
+"use client";
+import { AuthContext } from '@components/Security/AuthProvider';
+import React, { useEffect } from 'react'
+import { Formik, Form, Field, ErrorMessage } from 'formik';
+import { updateProfile } from '@services/settings/profile';
+
+function SettingsProfilePage() {
+
+    const auth: any = React.useContext(AuthContext);
+
+
+
+    return (
+        <div>
+
+            {auth.isAuthenticated && (
+                <div>
+                    <h1>Profile Settings</h1>
+                    <br /><br />
+
+                    <Formik
+                        initialValues={auth.userInfo.user_object}
+
+                        onSubmit={(values, { setSubmitting }) => {
+                            setTimeout(() => {
+                                alert(JSON.stringify(values, null, 2));
+                                setSubmitting(false);
+                                updateProfile(values)
+                            }, 400);
+                        }}
+                    >
+                        {({ isSubmitting }) => (
+                            <Form>
+                                Full name  <Field type="textarea" name="full_name" /><br />
+                                Email  <Field type="email" name="email" /><br />
+                                Bio  <Field as="textarea" type="textarea" name="bio" /><br />
+                                <button type="submit" disabled={isSubmitting}>
+                                    Submit
+                                </button>
+                            </Form>
+                        )}
+                    </Formik>
+                </div>
+            )}
+
+
+        </div>
+
+    )
+}
+
+export default SettingsProfilePage
\ No newline at end of file
diff --git a/front/app/_orgs/[orgslug]/settings/head.tsx b/front/app/_orgs/[orgslug]/settings/head.tsx
new file mode 100644
index 00000000..2cc1698e
--- /dev/null
+++ b/front/app/_orgs/[orgslug]/settings/head.tsx
@@ -0,0 +1,15 @@
+import { createStitches } from '@stitches/react';
+
+export const { getCssText } = createStitches();
+
+export default function Head() {
+    return (
+      <>
+        <title>Settings</title>
+        <meta content="width=device-width, initial-scale=1" name="viewport" />
+        <link rel="icon" href="/favicon.ico" />
+        <style id="stitches" dangerouslySetInnerHTML={{ __html: getCssText() }} />
+      </>
+    )
+  }
+  
\ No newline at end of file
diff --git a/front/app/_orgs/[orgslug]/settings/layout.tsx b/front/app/_orgs/[orgslug]/settings/layout.tsx
new file mode 100644
index 00000000..639f0461
--- /dev/null
+++ b/front/app/_orgs/[orgslug]/settings/layout.tsx
@@ -0,0 +1,88 @@
+"use client";
+import React, { createContext, useState } from 'react'
+import { styled } from '@stitches/react';
+import Link from 'next/link';
+import { AuthContext } from '@components/Security/AuthProvider';
+import Avvvatars from 'avvvatars-react';
+
+
+
+
+function SettingsLayout({ children, params }: { children: React.ReactNode, params: any }) {
+    const auth: any = React.useContext(AuthContext);
+
+    return (
+        <>
+            <Main>
+                <LeftWrapper>
+                    {auth.isAuthenticated && (
+                        <Avvvatars value={auth.userInfo.user_object.user_id} style="shape" />
+                    )}
+                    <LeftMenuWrapper>
+                        <MenuTitle>Account</MenuTitle>
+                        <ul>
+                            <li><Link href="/settings/account/profile">Profile</Link></li>
+                            <li><Link href="/settings/account/passwords">Passwords</Link></li>
+                        </ul>
+                    </LeftMenuWrapper>
+                </LeftWrapper>
+                <RightWrapper>
+                    {children}
+                </RightWrapper>
+            </Main>
+        </>
+    )
+}
+
+export default SettingsLayout
+
+
+const Main = styled('div', {
+    display: 'flex',
+})
+
+const LeftWrapper = styled('div', {
+    width: '250px',
+    background: "linear-gradient(348.55deg, #010101 -8.61%, #343434 105.52%);",
+    height: '100vh',
+    padding: '20px',
+})
+
+const LeftMenuWrapper = styled('div', {
+    display: 'flex',
+    flexDirection: 'column',
+    padding: '20px',
+
+    ul: {
+        listStyle: 'none',
+        padding: 0,
+        margin: 0,
+        li: {
+            marginBottom: '10px',
+            a: {
+                color: '#ffffff8c',
+                textDecoration: 'none',
+                fontSize: '14px',
+                fontWeight: 'bold',
+                '&:hover': {
+                    textDecoration: 'underline',
+                }
+            }
+        }
+    }
+
+})
+
+const MenuTitle = styled('h3', {
+    color: 'white',
+    fontSize: '18px',
+    fontWeight: 'bold',
+    marginBottom: '20px',
+})
+
+const RightWrapper = styled('div', {
+    flex: 1,
+    padding: '20px',
+    boxSizing: 'border-box',
+    margin: '40px',
+})
\ No newline at end of file
diff --git a/front/app/_orgs/[orgslug]/settings/page.tsx b/front/app/_orgs/[orgslug]/settings/page.tsx
new file mode 100644
index 00000000..77919d58
--- /dev/null
+++ b/front/app/_orgs/[orgslug]/settings/page.tsx
@@ -0,0 +1,9 @@
+import React from 'react'
+
+function Settings() {
+  return (
+    <div>Settings</div>
+  )
+}
+
+export default Settings
\ No newline at end of file
diff --git a/front/components/UI/Elements/Menu.tsx b/front/components/UI/Elements/Menu.tsx
index 151f3e9f..9d888ccc 100644
--- a/front/components/UI/Elements/Menu.tsx
+++ b/front/components/UI/Elements/Menu.tsx
@@ -13,7 +13,7 @@ import { getOrgFromUri, getUriWithOrg } from "@services/config";
 export const Menu = (params : any) => {
   const router = useRouter();
   const pathname = usePathname();
-  const orgslug = getOrgFromUri(pathname);
+  const orgslug = getOrgFromUri();
   
   return (
     <GlobalHeader>
diff --git a/front/package-lock.json b/front/package-lock.json
index d23c0f84..749c6bb9 100644
--- a/front/package-lock.json
+++ b/front/package-lock.json
@@ -10,6 +10,7 @@
       "dependencies": {
         "@radix-ui/react-dialog": "^1.0.2",
         "@radix-ui/react-icons": "^1.1.1",
+        "@stitches/react": "^1.2.8",
         "@tiptap/extension-collaboration": "^2.0.0-beta.199",
         "@tiptap/extension-collaboration-cursor": "^2.0.0-beta.199",
         "@tiptap/extension-youtube": "^2.0.0-beta.207",
@@ -17,9 +18,10 @@
         "@tiptap/react": "^2.0.0-beta.199",
         "@tiptap/starter-kit": "^2.0.0-beta.199",
         "avvvatars-react": "^0.4.2",
+        "formik": "^2.2.9",
         "framer-motion": "^7.3.6",
         "lucide-react": "^0.104.1",
-        "next": "^13.1.0",
+        "next": "^13.2.0",
         "react": "^18.2.0",
         "react-beautiful-dnd": "^13.1.1",
         "react-dom": "^18.2.0",
@@ -2072,9 +2074,9 @@
       }
     },
     "node_modules/@next/env": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/env/-/env-13.1.1.tgz",
-      "integrity": "sha512-vFMyXtPjSAiOXOywMojxfKIqE3VWN5RCAx+tT3AS3pcKjMLFTCJFUWsKv8hC+87Z1F4W3r68qTwDFZIFmd5Xkw=="
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/env/-/env-13.2.4.tgz",
+      "integrity": "sha512-+Mq3TtpkeeKFZanPturjcXt+KHfKYnLlX6jMLyCrmpq6OOs4i1GqBOAauSkii9QeKCMTYzGppar21JU57b/GEA=="
     },
     "node_modules/@next/eslint-plugin-next": {
       "version": "13.0.6",
@@ -2086,9 +2088,9 @@
       }
     },
     "node_modules/@next/swc-android-arm-eabi": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-android-arm-eabi/-/swc-android-arm-eabi-13.1.1.tgz",
-      "integrity": "sha512-qnFCx1kT3JTWhWve4VkeWuZiyjG0b5T6J2iWuin74lORCupdrNukxkq9Pm+Z7PsatxuwVJMhjUoYz7H4cWzx2A==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-android-arm-eabi/-/swc-android-arm-eabi-13.2.4.tgz",
+      "integrity": "sha512-DWlalTSkLjDU11MY11jg17O1gGQzpRccM9Oes2yTqj2DpHndajrXHGxj9HGtJ+idq2k7ImUdJVWS2h2l/EDJOw==",
       "cpu": [
         "arm"
       ],
@@ -2101,9 +2103,9 @@
       }
     },
     "node_modules/@next/swc-android-arm64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-13.1.1.tgz",
-      "integrity": "sha512-eCiZhTzjySubNqUnNkQCjU3Fh+ep3C6b5DCM5FKzsTH/3Gr/4Y7EiaPZKILbvnXmhWtKPIdcY6Zjx51t4VeTfA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-13.2.4.tgz",
+      "integrity": "sha512-sRavmUImUCf332Gy+PjIfLkMhiRX1Ez4SI+3vFDRs1N5eXp+uNzjFUK/oLMMOzk6KFSkbiK/3Wt8+dHQR/flNg==",
       "cpu": [
         "arm64"
       ],
@@ -2116,9 +2118,9 @@
       }
     },
     "node_modules/@next/swc-darwin-arm64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-13.1.1.tgz",
-      "integrity": "sha512-9zRJSSIwER5tu9ADDkPw5rIZ+Np44HTXpYMr0rkM656IvssowPxmhK0rTreC1gpUCYwFsRbxarUJnJsTWiutPg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-13.2.4.tgz",
+      "integrity": "sha512-S6vBl+OrInP47TM3LlYx65betocKUUlTZDDKzTiRDbsRESeyIkBtZ6Qi5uT2zQs4imqllJznVjFd1bXLx3Aa6A==",
       "cpu": [
         "arm64"
       ],
@@ -2131,9 +2133,9 @@
       }
     },
     "node_modules/@next/swc-darwin-x64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-13.1.1.tgz",
-      "integrity": "sha512-qWr9qEn5nrnlhB0rtjSdR00RRZEtxg4EGvicIipqZWEyayPxhUu6NwKiG8wZiYZCLfJ5KWr66PGSNeDMGlNaiA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-13.2.4.tgz",
+      "integrity": "sha512-a6LBuoYGcFOPGd4o8TPo7wmv5FnMr+Prz+vYHopEDuhDoMSHOnC+v+Ab4D7F0NMZkvQjEJQdJS3rqgFhlZmKlw==",
       "cpu": [
         "x64"
       ],
@@ -2146,9 +2148,9 @@
       }
     },
     "node_modules/@next/swc-freebsd-x64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-freebsd-x64/-/swc-freebsd-x64-13.1.1.tgz",
-      "integrity": "sha512-UwP4w/NcQ7V/VJEj3tGVszgb4pyUCt3lzJfUhjDMUmQbzG9LDvgiZgAGMYH6L21MoyAATJQPDGiAMWAPKsmumA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-freebsd-x64/-/swc-freebsd-x64-13.2.4.tgz",
+      "integrity": "sha512-kkbzKVZGPaXRBPisoAQkh3xh22r+TD+5HwoC5bOkALraJ0dsOQgSMAvzMXKsN3tMzJUPS0tjtRf1cTzrQ0I5vQ==",
       "cpu": [
         "x64"
       ],
@@ -2161,9 +2163,9 @@
       }
     },
     "node_modules/@next/swc-linux-arm-gnueabihf": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-13.1.1.tgz",
-      "integrity": "sha512-CnsxmKHco9sosBs1XcvCXP845Db+Wx1G0qouV5+Gr+HT/ZlDYEWKoHVDgnJXLVEQzq4FmHddBNGbXvgqM1Gfkg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-13.2.4.tgz",
+      "integrity": "sha512-7qA1++UY0fjprqtjBZaOA6cas/7GekpjVsZn/0uHvquuITFCdKGFCsKNBx3S0Rpxmx6WYo0GcmhNRM9ru08BGg==",
       "cpu": [
         "arm"
       ],
@@ -2176,9 +2178,9 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-gnu": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-13.1.1.tgz",
-      "integrity": "sha512-JfDq1eri5Dif+VDpTkONRd083780nsMCOKoFG87wA0sa4xL8LGcXIBAkUGIC1uVy9SMsr2scA9CySLD/i+Oqiw==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-13.2.4.tgz",
+      "integrity": "sha512-xzYZdAeq883MwXgcwc72hqo/F/dwUxCukpDOkx/j1HTq/J0wJthMGjinN9wH5bPR98Mfeh1MZJ91WWPnZOedOg==",
       "cpu": [
         "arm64"
       ],
@@ -2191,9 +2193,9 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-musl": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-13.1.1.tgz",
-      "integrity": "sha512-GA67ZbDq2AW0CY07zzGt07M5b5Yaq5qUpFIoW3UFfjOPgb0Sqf3DAW7GtFMK1sF4ROHsRDMGQ9rnT0VM2dVfKA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-13.2.4.tgz",
+      "integrity": "sha512-8rXr3WfmqSiYkb71qzuDP6I6R2T2tpkmf83elDN8z783N9nvTJf2E7eLx86wu2OJCi4T05nuxCsh4IOU3LQ5xw==",
       "cpu": [
         "arm64"
       ],
@@ -2206,9 +2208,9 @@
       }
     },
     "node_modules/@next/swc-linux-x64-gnu": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-13.1.1.tgz",
-      "integrity": "sha512-nnjuBrbzvqaOJaV+XgT8/+lmXrSCOt1YYZn/irbDb2fR2QprL6Q7WJNgwsZNxiLSfLdv+2RJGGegBx9sLBEzGA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-13.2.4.tgz",
+      "integrity": "sha512-Ngxh51zGSlYJ4EfpKG4LI6WfquulNdtmHg1yuOYlaAr33KyPJp4HeN/tivBnAHcZkoNy0hh/SbwDyCnz5PFJQQ==",
       "cpu": [
         "x64"
       ],
@@ -2221,9 +2223,9 @@
       }
     },
     "node_modules/@next/swc-linux-x64-musl": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-13.1.1.tgz",
-      "integrity": "sha512-CM9xnAQNIZ8zf/igbIT/i3xWbQZYaF397H+JroF5VMOCUleElaMdQLL5riJml8wUfPoN3dtfn2s4peSr3azz/g==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-13.2.4.tgz",
+      "integrity": "sha512-gOvwIYoSxd+j14LOcvJr+ekd9fwYT1RyMAHOp7znA10+l40wkFiMONPLWiZuHxfRk+Dy7YdNdDh3ImumvL6VwA==",
       "cpu": [
         "x64"
       ],
@@ -2236,9 +2238,9 @@
       }
     },
     "node_modules/@next/swc-win32-arm64-msvc": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-13.1.1.tgz",
-      "integrity": "sha512-pzUHOGrbgfGgPlOMx9xk3QdPJoRPU+om84hqVoe6u+E0RdwOG0Ho/2UxCgDqmvpUrMab1Deltlt6RqcXFpnigQ==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-13.2.4.tgz",
+      "integrity": "sha512-q3NJzcfClgBm4HvdcnoEncmztxrA5GXqKeiZ/hADvC56pwNALt3ngDC6t6qr1YW9V/EPDxCYeaX4zYxHciW4Dw==",
       "cpu": [
         "arm64"
       ],
@@ -2251,9 +2253,9 @@
       }
     },
     "node_modules/@next/swc-win32-ia32-msvc": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-13.1.1.tgz",
-      "integrity": "sha512-WeX8kVS46aobM9a7Xr/kEPcrTyiwJqQv/tbw6nhJ4fH9xNZ+cEcyPoQkwPo570dCOLz3Zo9S2q0E6lJ/EAUOBg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-13.2.4.tgz",
+      "integrity": "sha512-/eZ5ncmHUYtD2fc6EUmAIZlAJnVT2YmxDsKs1Ourx0ttTtvtma/WKlMV5NoUsyOez0f9ExLyOpeCoz5aj+MPXw==",
       "cpu": [
         "ia32"
       ],
@@ -2266,9 +2268,9 @@
       }
     },
     "node_modules/@next/swc-win32-x64-msvc": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-13.1.1.tgz",
-      "integrity": "sha512-mVF0/3/5QAc5EGVnb8ll31nNvf3BWpPY4pBb84tk+BfQglWLqc5AC9q1Ht/YMWiEgs8ALNKEQ3GQnbY0bJF2Gg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-13.2.4.tgz",
+      "integrity": "sha512-0MffFmyv7tBLlji01qc0IaPP/LVExzvj7/R5x1Jph1bTAIj4Vu81yFQWHHQAP6r4ff9Ukj1mBK6MDNVXm7Tcvw==",
       "cpu": [
         "x64"
       ],
@@ -2573,6 +2575,14 @@
       "integrity": "sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==",
       "dev": true
     },
+    "node_modules/@stitches/react": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/@stitches/react/-/react-1.2.8.tgz",
+      "integrity": "sha512-9g9dWI4gsSVe8bNLlb+lMkBYsnIKCZTmvqvDG+Avnn69XfmHZKiaMrx7cgTaddq7aTPPmXiTsbFcUy0xgI4+wA==",
+      "peerDependencies": {
+        "react": ">= 16.3.0"
+      }
+    },
     "node_modules/@swc/helpers": {
       "version": "0.4.14",
       "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.4.14.tgz",
@@ -3803,6 +3813,14 @@
       "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
       "dev": true
     },
+    "node_modules/deepmerge": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
+      "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/define-lazy-prop": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz",
@@ -4543,6 +4561,34 @@
       "integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==",
       "dev": true
     },
+    "node_modules/formik": {
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/formik/-/formik-2.2.9.tgz",
+      "integrity": "sha512-LQLcISMmf1r5at4/gyJigGn0gOwFbeEAlji+N9InZF6LIMXnFNkO42sCI8Jt84YZggpD4cPWObAZaxpEFtSzNA==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://opencollective.com/formik"
+        }
+      ],
+      "dependencies": {
+        "deepmerge": "^2.1.1",
+        "hoist-non-react-statics": "^3.3.0",
+        "lodash": "^4.17.21",
+        "lodash-es": "^4.17.21",
+        "react-fast-compare": "^2.0.1",
+        "tiny-warning": "^1.0.2",
+        "tslib": "^1.10.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8.0"
+      }
+    },
+    "node_modules/formik/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
     "node_modules/fraction.js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz",
@@ -5394,6 +5440,16 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/lodash": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+    },
+    "node_modules/lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+    },
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@@ -5527,11 +5583,11 @@
       "dev": true
     },
     "node_modules/next": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/next/-/next-13.1.1.tgz",
-      "integrity": "sha512-R5eBAaIa3X7LJeYvv1bMdGnAVF4fVToEjim7MkflceFPuANY3YyvFxXee/A+acrSYwYPvOvf7f6v/BM/48ea5w==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/next/-/next-13.2.4.tgz",
+      "integrity": "sha512-g1I30317cThkEpvzfXujf0O4wtaQHtDCLhlivwlTJ885Ld+eOgcz7r3TGQzeU+cSRoNHtD8tsJgzxVdYojFssw==",
       "dependencies": {
-        "@next/env": "13.1.1",
+        "@next/env": "13.2.4",
         "@swc/helpers": "0.4.14",
         "caniuse-lite": "^1.0.30001406",
         "postcss": "8.4.14",
@@ -5544,21 +5600,22 @@
         "node": ">=14.6.0"
       },
       "optionalDependencies": {
-        "@next/swc-android-arm-eabi": "13.1.1",
-        "@next/swc-android-arm64": "13.1.1",
-        "@next/swc-darwin-arm64": "13.1.1",
-        "@next/swc-darwin-x64": "13.1.1",
-        "@next/swc-freebsd-x64": "13.1.1",
-        "@next/swc-linux-arm-gnueabihf": "13.1.1",
-        "@next/swc-linux-arm64-gnu": "13.1.1",
-        "@next/swc-linux-arm64-musl": "13.1.1",
-        "@next/swc-linux-x64-gnu": "13.1.1",
-        "@next/swc-linux-x64-musl": "13.1.1",
-        "@next/swc-win32-arm64-msvc": "13.1.1",
-        "@next/swc-win32-ia32-msvc": "13.1.1",
-        "@next/swc-win32-x64-msvc": "13.1.1"
+        "@next/swc-android-arm-eabi": "13.2.4",
+        "@next/swc-android-arm64": "13.2.4",
+        "@next/swc-darwin-arm64": "13.2.4",
+        "@next/swc-darwin-x64": "13.2.4",
+        "@next/swc-freebsd-x64": "13.2.4",
+        "@next/swc-linux-arm-gnueabihf": "13.2.4",
+        "@next/swc-linux-arm64-gnu": "13.2.4",
+        "@next/swc-linux-arm64-musl": "13.2.4",
+        "@next/swc-linux-x64-gnu": "13.2.4",
+        "@next/swc-linux-x64-musl": "13.2.4",
+        "@next/swc-win32-arm64-msvc": "13.2.4",
+        "@next/swc-win32-ia32-msvc": "13.2.4",
+        "@next/swc-win32-x64-msvc": "13.2.4"
       },
       "peerDependencies": {
+        "@opentelemetry/api": "^1.4.0",
         "fibers": ">= 3.1.0",
         "node-sass": "^6.0.0 || ^7.0.0",
         "react": "^18.2.0",
@@ -5566,6 +5623,9 @@
         "sass": "^1.3.0"
       },
       "peerDependenciesMeta": {
+        "@opentelemetry/api": {
+          "optional": true
+        },
         "fibers": {
           "optional": true
         },
@@ -6120,6 +6180,11 @@
         "react": "^18.2.0"
       }
     },
+    "node_modules/react-fast-compare": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz",
+      "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw=="
+    },
     "node_modules/react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
@@ -6846,6 +6911,11 @@
       "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.1.tgz",
       "integrity": "sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw=="
     },
+    "node_modules/tiny-warning": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
+      "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
+    },
     "node_modules/tippy.js": {
       "version": "6.3.7",
       "resolved": "https://registry.npmjs.org/tippy.js/-/tippy.js-6.3.7.tgz",
@@ -8694,9 +8764,9 @@
       }
     },
     "@next/env": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/env/-/env-13.1.1.tgz",
-      "integrity": "sha512-vFMyXtPjSAiOXOywMojxfKIqE3VWN5RCAx+tT3AS3pcKjMLFTCJFUWsKv8hC+87Z1F4W3r68qTwDFZIFmd5Xkw=="
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/env/-/env-13.2.4.tgz",
+      "integrity": "sha512-+Mq3TtpkeeKFZanPturjcXt+KHfKYnLlX6jMLyCrmpq6OOs4i1GqBOAauSkii9QeKCMTYzGppar21JU57b/GEA=="
     },
     "@next/eslint-plugin-next": {
       "version": "13.0.6",
@@ -8708,81 +8778,81 @@
       }
     },
     "@next/swc-android-arm-eabi": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-android-arm-eabi/-/swc-android-arm-eabi-13.1.1.tgz",
-      "integrity": "sha512-qnFCx1kT3JTWhWve4VkeWuZiyjG0b5T6J2iWuin74lORCupdrNukxkq9Pm+Z7PsatxuwVJMhjUoYz7H4cWzx2A==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-android-arm-eabi/-/swc-android-arm-eabi-13.2.4.tgz",
+      "integrity": "sha512-DWlalTSkLjDU11MY11jg17O1gGQzpRccM9Oes2yTqj2DpHndajrXHGxj9HGtJ+idq2k7ImUdJVWS2h2l/EDJOw==",
       "optional": true
     },
     "@next/swc-android-arm64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-13.1.1.tgz",
-      "integrity": "sha512-eCiZhTzjySubNqUnNkQCjU3Fh+ep3C6b5DCM5FKzsTH/3Gr/4Y7EiaPZKILbvnXmhWtKPIdcY6Zjx51t4VeTfA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-13.2.4.tgz",
+      "integrity": "sha512-sRavmUImUCf332Gy+PjIfLkMhiRX1Ez4SI+3vFDRs1N5eXp+uNzjFUK/oLMMOzk6KFSkbiK/3Wt8+dHQR/flNg==",
       "optional": true
     },
     "@next/swc-darwin-arm64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-13.1.1.tgz",
-      "integrity": "sha512-9zRJSSIwER5tu9ADDkPw5rIZ+Np44HTXpYMr0rkM656IvssowPxmhK0rTreC1gpUCYwFsRbxarUJnJsTWiutPg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-13.2.4.tgz",
+      "integrity": "sha512-S6vBl+OrInP47TM3LlYx65betocKUUlTZDDKzTiRDbsRESeyIkBtZ6Qi5uT2zQs4imqllJznVjFd1bXLx3Aa6A==",
       "optional": true
     },
     "@next/swc-darwin-x64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-13.1.1.tgz",
-      "integrity": "sha512-qWr9qEn5nrnlhB0rtjSdR00RRZEtxg4EGvicIipqZWEyayPxhUu6NwKiG8wZiYZCLfJ5KWr66PGSNeDMGlNaiA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-13.2.4.tgz",
+      "integrity": "sha512-a6LBuoYGcFOPGd4o8TPo7wmv5FnMr+Prz+vYHopEDuhDoMSHOnC+v+Ab4D7F0NMZkvQjEJQdJS3rqgFhlZmKlw==",
       "optional": true
     },
     "@next/swc-freebsd-x64": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-freebsd-x64/-/swc-freebsd-x64-13.1.1.tgz",
-      "integrity": "sha512-UwP4w/NcQ7V/VJEj3tGVszgb4pyUCt3lzJfUhjDMUmQbzG9LDvgiZgAGMYH6L21MoyAATJQPDGiAMWAPKsmumA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-freebsd-x64/-/swc-freebsd-x64-13.2.4.tgz",
+      "integrity": "sha512-kkbzKVZGPaXRBPisoAQkh3xh22r+TD+5HwoC5bOkALraJ0dsOQgSMAvzMXKsN3tMzJUPS0tjtRf1cTzrQ0I5vQ==",
       "optional": true
     },
     "@next/swc-linux-arm-gnueabihf": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-13.1.1.tgz",
-      "integrity": "sha512-CnsxmKHco9sosBs1XcvCXP845Db+Wx1G0qouV5+Gr+HT/ZlDYEWKoHVDgnJXLVEQzq4FmHddBNGbXvgqM1Gfkg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-13.2.4.tgz",
+      "integrity": "sha512-7qA1++UY0fjprqtjBZaOA6cas/7GekpjVsZn/0uHvquuITFCdKGFCsKNBx3S0Rpxmx6WYo0GcmhNRM9ru08BGg==",
       "optional": true
     },
     "@next/swc-linux-arm64-gnu": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-13.1.1.tgz",
-      "integrity": "sha512-JfDq1eri5Dif+VDpTkONRd083780nsMCOKoFG87wA0sa4xL8LGcXIBAkUGIC1uVy9SMsr2scA9CySLD/i+Oqiw==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-13.2.4.tgz",
+      "integrity": "sha512-xzYZdAeq883MwXgcwc72hqo/F/dwUxCukpDOkx/j1HTq/J0wJthMGjinN9wH5bPR98Mfeh1MZJ91WWPnZOedOg==",
       "optional": true
     },
     "@next/swc-linux-arm64-musl": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-13.1.1.tgz",
-      "integrity": "sha512-GA67ZbDq2AW0CY07zzGt07M5b5Yaq5qUpFIoW3UFfjOPgb0Sqf3DAW7GtFMK1sF4ROHsRDMGQ9rnT0VM2dVfKA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-13.2.4.tgz",
+      "integrity": "sha512-8rXr3WfmqSiYkb71qzuDP6I6R2T2tpkmf83elDN8z783N9nvTJf2E7eLx86wu2OJCi4T05nuxCsh4IOU3LQ5xw==",
       "optional": true
     },
     "@next/swc-linux-x64-gnu": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-13.1.1.tgz",
-      "integrity": "sha512-nnjuBrbzvqaOJaV+XgT8/+lmXrSCOt1YYZn/irbDb2fR2QprL6Q7WJNgwsZNxiLSfLdv+2RJGGegBx9sLBEzGA==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-13.2.4.tgz",
+      "integrity": "sha512-Ngxh51zGSlYJ4EfpKG4LI6WfquulNdtmHg1yuOYlaAr33KyPJp4HeN/tivBnAHcZkoNy0hh/SbwDyCnz5PFJQQ==",
       "optional": true
     },
     "@next/swc-linux-x64-musl": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-13.1.1.tgz",
-      "integrity": "sha512-CM9xnAQNIZ8zf/igbIT/i3xWbQZYaF397H+JroF5VMOCUleElaMdQLL5riJml8wUfPoN3dtfn2s4peSr3azz/g==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-13.2.4.tgz",
+      "integrity": "sha512-gOvwIYoSxd+j14LOcvJr+ekd9fwYT1RyMAHOp7znA10+l40wkFiMONPLWiZuHxfRk+Dy7YdNdDh3ImumvL6VwA==",
       "optional": true
     },
     "@next/swc-win32-arm64-msvc": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-13.1.1.tgz",
-      "integrity": "sha512-pzUHOGrbgfGgPlOMx9xk3QdPJoRPU+om84hqVoe6u+E0RdwOG0Ho/2UxCgDqmvpUrMab1Deltlt6RqcXFpnigQ==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-13.2.4.tgz",
+      "integrity": "sha512-q3NJzcfClgBm4HvdcnoEncmztxrA5GXqKeiZ/hADvC56pwNALt3ngDC6t6qr1YW9V/EPDxCYeaX4zYxHciW4Dw==",
       "optional": true
     },
     "@next/swc-win32-ia32-msvc": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-13.1.1.tgz",
-      "integrity": "sha512-WeX8kVS46aobM9a7Xr/kEPcrTyiwJqQv/tbw6nhJ4fH9xNZ+cEcyPoQkwPo570dCOLz3Zo9S2q0E6lJ/EAUOBg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-13.2.4.tgz",
+      "integrity": "sha512-/eZ5ncmHUYtD2fc6EUmAIZlAJnVT2YmxDsKs1Ourx0ttTtvtma/WKlMV5NoUsyOez0f9ExLyOpeCoz5aj+MPXw==",
       "optional": true
     },
     "@next/swc-win32-x64-msvc": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-13.1.1.tgz",
-      "integrity": "sha512-mVF0/3/5QAc5EGVnb8ll31nNvf3BWpPY4pBb84tk+BfQglWLqc5AC9q1Ht/YMWiEgs8ALNKEQ3GQnbY0bJF2Gg==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-13.2.4.tgz",
+      "integrity": "sha512-0MffFmyv7tBLlji01qc0IaPP/LVExzvj7/R5x1Jph1bTAIj4Vu81yFQWHHQAP6r4ff9Ukj1mBK6MDNVXm7Tcvw==",
       "optional": true
     },
     "@nicolo-ribaudo/chokidar-2": {
@@ -9006,6 +9076,12 @@
       "integrity": "sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==",
       "dev": true
     },
+    "@stitches/react": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/@stitches/react/-/react-1.2.8.tgz",
+      "integrity": "sha512-9g9dWI4gsSVe8bNLlb+lMkBYsnIKCZTmvqvDG+Avnn69XfmHZKiaMrx7cgTaddq7aTPPmXiTsbFcUy0xgI4+wA==",
+      "requires": {}
+    },
     "@swc/helpers": {
       "version": "0.4.14",
       "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.4.14.tgz",
@@ -9805,6 +9881,11 @@
       "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
       "dev": true
     },
+    "deepmerge": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
+      "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA=="
+    },
     "define-lazy-prop": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz",
@@ -10376,6 +10457,27 @@
       "integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==",
       "dev": true
     },
+    "formik": {
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/formik/-/formik-2.2.9.tgz",
+      "integrity": "sha512-LQLcISMmf1r5at4/gyJigGn0gOwFbeEAlji+N9InZF6LIMXnFNkO42sCI8Jt84YZggpD4cPWObAZaxpEFtSzNA==",
+      "requires": {
+        "deepmerge": "^2.1.1",
+        "hoist-non-react-statics": "^3.3.0",
+        "lodash": "^4.17.21",
+        "lodash-es": "^4.17.21",
+        "react-fast-compare": "^2.0.1",
+        "tiny-warning": "^1.0.2",
+        "tslib": "^1.10.0"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+        }
+      }
+    },
     "fraction.js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz",
@@ -10976,6 +11078,16 @@
         "p-locate": "^5.0.0"
       }
     },
+    "lodash": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+    },
+    "lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+    },
     "lodash.debounce": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@@ -11078,24 +11190,24 @@
       "dev": true
     },
     "next": {
-      "version": "13.1.1",
-      "resolved": "https://registry.npmjs.org/next/-/next-13.1.1.tgz",
-      "integrity": "sha512-R5eBAaIa3X7LJeYvv1bMdGnAVF4fVToEjim7MkflceFPuANY3YyvFxXee/A+acrSYwYPvOvf7f6v/BM/48ea5w==",
+      "version": "13.2.4",
+      "resolved": "https://registry.npmjs.org/next/-/next-13.2.4.tgz",
+      "integrity": "sha512-g1I30317cThkEpvzfXujf0O4wtaQHtDCLhlivwlTJ885Ld+eOgcz7r3TGQzeU+cSRoNHtD8tsJgzxVdYojFssw==",
       "requires": {
-        "@next/env": "13.1.1",
-        "@next/swc-android-arm-eabi": "13.1.1",
-        "@next/swc-android-arm64": "13.1.1",
-        "@next/swc-darwin-arm64": "13.1.1",
-        "@next/swc-darwin-x64": "13.1.1",
-        "@next/swc-freebsd-x64": "13.1.1",
-        "@next/swc-linux-arm-gnueabihf": "13.1.1",
-        "@next/swc-linux-arm64-gnu": "13.1.1",
-        "@next/swc-linux-arm64-musl": "13.1.1",
-        "@next/swc-linux-x64-gnu": "13.1.1",
-        "@next/swc-linux-x64-musl": "13.1.1",
-        "@next/swc-win32-arm64-msvc": "13.1.1",
-        "@next/swc-win32-ia32-msvc": "13.1.1",
-        "@next/swc-win32-x64-msvc": "13.1.1",
+        "@next/env": "13.2.4",
+        "@next/swc-android-arm-eabi": "13.2.4",
+        "@next/swc-android-arm64": "13.2.4",
+        "@next/swc-darwin-arm64": "13.2.4",
+        "@next/swc-darwin-x64": "13.2.4",
+        "@next/swc-freebsd-x64": "13.2.4",
+        "@next/swc-linux-arm-gnueabihf": "13.2.4",
+        "@next/swc-linux-arm64-gnu": "13.2.4",
+        "@next/swc-linux-arm64-musl": "13.2.4",
+        "@next/swc-linux-x64-gnu": "13.2.4",
+        "@next/swc-linux-x64-musl": "13.2.4",
+        "@next/swc-win32-arm64-msvc": "13.2.4",
+        "@next/swc-win32-ia32-msvc": "13.2.4",
+        "@next/swc-win32-x64-msvc": "13.2.4",
         "@swc/helpers": "0.4.14",
         "caniuse-lite": "^1.0.30001406",
         "postcss": "8.4.14",
@@ -11507,6 +11619,11 @@
         "scheduler": "^0.23.0"
       }
     },
+    "react-fast-compare": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz",
+      "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw=="
+    },
     "react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
@@ -11985,6 +12102,11 @@
       "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.1.tgz",
       "integrity": "sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw=="
     },
+    "tiny-warning": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
+      "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
+    },
     "tippy.js": {
       "version": "6.3.7",
       "resolved": "https://registry.npmjs.org/tippy.js/-/tippy.js-6.3.7.tgz",
diff --git a/front/package.json b/front/package.json
index fd630495..50b1bf6c 100644
--- a/front/package.json
+++ b/front/package.json
@@ -11,6 +11,7 @@
   "dependencies": {
     "@radix-ui/react-dialog": "^1.0.2",
     "@radix-ui/react-icons": "^1.1.1",
+    "@stitches/react": "^1.2.8",
     "@tiptap/extension-collaboration": "^2.0.0-beta.199",
     "@tiptap/extension-collaboration-cursor": "^2.0.0-beta.199",
     "@tiptap/extension-youtube": "^2.0.0-beta.207",
@@ -18,9 +19,10 @@
     "@tiptap/react": "^2.0.0-beta.199",
     "@tiptap/starter-kit": "^2.0.0-beta.199",
     "avvvatars-react": "^0.4.2",
+    "formik": "^2.2.9",
     "framer-motion": "^7.3.6",
     "lucide-react": "^0.104.1",
-    "next": "^13.1.0",
+    "next": "^13.2.0",
     "react": "^18.2.0",
     "react-beautiful-dnd": "^13.1.1",
     "react-dom": "^18.2.0",
diff --git a/front/services/settings/profile.ts b/front/services/settings/profile.ts
new file mode 100644
index 00000000..8b954c68
--- /dev/null
+++ b/front/services/settings/profile.ts
@@ -0,0 +1,15 @@
+import { getAPIUrl } from "@services/config";
+import { RequestBody } from "@services/utils/requests";
+
+/*
+ This file includes only POST, PUT, DELETE requests
+ GET requests are called from the frontend using SWR (https://swr.vercel.app/)
+*/
+
+export async function updateProfile(data: any) {
+  const result: any = await fetch(`${getAPIUrl()}users/user_id/` + data.user_id, RequestBody("PUT", data))
+    .then((result) => result.json())
+    .catch((error) => console.log("error", error));
+
+  return result;
+}
diff --git a/front/styles/globals.css b/front/styles/globals.css
index 8ee06ba6..44eea471 100644
--- a/front/styles/globals.css
+++ b/front/styles/globals.css
@@ -19,9 +19,7 @@ a {
 }
 
 @media (prefers-color-scheme: dark) {
-  html {
-   
-  }
+  
   body {
     color: black;
     background: #FBFBFB;
diff --git a/src/routers/users.py b/src/routers/users.py
index 0ccc4818..3cdae9b1 100644
--- a/src/routers/users.py
+++ b/src/routers/users.py
@@ -59,7 +59,7 @@ async def api_delete_user(request: Request, user_id: str):
 
 
 @router.put("/user_id/{user_id}")
-async def api_update_user(request: Request, user_object: UserWithPassword, user_id: str):
+async def api_update_user(request: Request, user_object: User, user_id: str):
     """
     Update user by ID
     """
diff --git a/src/services/users.py b/src/services/users.py
index 36bc8fe6..a712e832 100644
--- a/src/services/users.py
+++ b/src/services/users.py
@@ -1,3 +1,4 @@
+from typing import Optional
 from uuid import uuid4
 from pydantic import BaseModel
 from src.services.security import *
@@ -17,7 +18,6 @@ class User(BaseModel):
     user_type: str | None = None
     bio: str | None = None
 
-
 class UserWithPassword(User):
     password: str
 
@@ -128,7 +128,7 @@ async def get_userid_by_username(request: Request, username: str):
     return user["user_id"]
 
 
-async def update_user(request: Request, user_id: str, user_object: UserWithPassword):
+async def update_user(request: Request, user_id: str, user_object: User):
     users = request.app.db["users"]
 
     isUserExists = await users.find_one({"user_id": user_id})
@@ -138,11 +138,18 @@ async def update_user(request: Request, user_id: str, user_object: UserWithPassw
         raise HTTPException(
             status_code=status.HTTP_409_CONFLICT, detail="User does not exist")
 
-    if isUsernameAvailable:
-        raise HTTPException(
+    
+    # TODO : fix this
+
+    # okay if username is not changed
+    if isUserExists["username"] == user_object.username:
+        user_object.username = user_object.username.lower()
+
+    else:
+        if isUsernameAvailable:
+         raise HTTPException(
             status_code=status.HTTP_409_CONFLICT, detail="Username already used")
 
-    user_object.password = await security_hash_password(user_object.password)
 
     updated_user = {"$set": user_object.dict()}
     users.update_one({"user_id": user_id}, updated_user)