diff --git a/index.html b/index.html index f79623d..17c8257 100644 --- a/index.html +++ b/index.html @@ -1,5 +1,5 @@ - + diff --git a/package.json b/package.json index e192dc0..b6c3ebc 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ ] }, "dependencies": { + "@heroicons/react": "^2.2.0", "@mui/icons-material": "^7.3.0", "@mui/material": "^7.3.0", "@mui/styled-engine-sc": "^7.3.0", @@ -44,7 +45,8 @@ "react-router-dom": "^7.7.1", "styled-components": "^6.2.0", "tailwindcss": "^4.2.4", - "vite-plugin-remove-console": "^2.2.0" + "vite-plugin-remove-console": "^2.2.0", + "zustand": "^5.0.12" }, "devDependencies": { "@chromatic-com/storybook": "^5.1.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 8010d78..2568830 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,6 +8,9 @@ importers: .: dependencies: + '@heroicons/react': + specifier: ^2.2.0 + version: 2.2.0(react@19.2.5) '@mui/icons-material': specifier: ^7.3.0 version: 7.3.10(@mui/material@7.3.10(@types/react@19.2.14)(react-dom@19.2.5(react@19.2.5))(react@19.2.5))(@types/react@19.2.14)(react@19.2.5) @@ -80,6 +83,9 @@ importers: vite-plugin-remove-console: specifier: ^2.2.0 version: 2.2.0 + zustand: + specifier: ^5.0.12 + version: 5.0.12(@types/react@19.2.14)(react@19.2.5) devDependencies: '@chromatic-com/storybook': specifier: ^5.1.2 @@ -497,6 +503,11 @@ packages: resolution: {integrity: sha512-43/qtrDUokr7LJqoF2c3+RInu/t4zfrpYdoSDfYyhg52rwLV6TnOvdG4fXm7IkSB3wErkcmJS9iEhjVtOSEjjA==} engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0} + '@heroicons/react@2.2.0': + resolution: {integrity: sha512-LMcepvRaS9LYHJGsF0zzmgKCUim/X3N/DQKc4jepAXJ7l8QxJ1PmxJzqplF2Z3FE4PqBAIGyJAQ/w4B5dsqbtQ==} + peerDependencies: + react: '>= 16 || ^19.0.0-rc' + '@humanfs/core@0.19.2': resolution: {integrity: sha512-UhXNm+CFMWcbChXywFwkmhqjs3PRCmcSa/hfBgLIb7oQ5HNb1wS0icWsGtSAUNgefHeI+eBrA8I1fxmbHsGdvA==} engines: {node: '>=18.18.0'} @@ -714,42 +725,36 @@ packages: engines: {node: ^20.19.0 || >=22.12.0} cpu: [arm64] os: [linux] - libc: [glibc] '@rolldown/binding-linux-arm64-musl@1.0.0-rc.16': resolution: {integrity: sha512-3fPzdREH806oRLxpTWW1Gt4tQHs0TitZFOECB2xzCFLPKnSOy90gwA7P29cksYilFO6XVRY1kzga0cL2nRjKPg==} engines: {node: ^20.19.0 || >=22.12.0} cpu: [arm64] os: [linux] - libc: [musl] '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.16': resolution: {integrity: sha512-EKwI1tSrLs7YVw+JPJT/G2dJQ1jl9qlTTTEG0V2Ok/RdOenRfBw2PQdLPyjhIu58ocdBfP7vIRN/pvMsPxs/AQ==} engines: {node: ^20.19.0 || >=22.12.0} cpu: [ppc64] os: [linux] - libc: [glibc] '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.16': resolution: {integrity: sha512-Uknladnb3Sxqu6SEcqBldQyJUpk8NleooZEc0MbRBJ4inEhRYWZX0NJu12vNf2mqAq7gsofAxHrGghiUYjhaLQ==} engines: {node: ^20.19.0 || >=22.12.0} cpu: [s390x] os: [linux] - libc: [glibc] '@rolldown/binding-linux-x64-gnu@1.0.0-rc.16': resolution: {integrity: sha512-FIb8+uG49sZBtLTn+zt1AJ20TqVcqWeSIyoVt0or7uAWesgKaHbiBh6OpA/k9v0LTt+PTrb1Lao133kP4uVxkg==} engines: {node: ^20.19.0 || >=22.12.0} cpu: [x64] os: [linux] - libc: [glibc] '@rolldown/binding-linux-x64-musl@1.0.0-rc.16': resolution: {integrity: sha512-RuERhF9/EgWxZEXYWCOaViUWHIboceK4/ivdtQ3R0T44NjLkIIlGIAVAuCddFxsZ7vnRHtNQUrt2vR2n2slB2w==} engines: {node: ^20.19.0 || >=22.12.0} cpu: [x64] os: [linux] - libc: [musl] '@rolldown/binding-openharmony-arm64@1.0.0-rc.16': resolution: {integrity: sha512-mXcXnvd9GpazCxeUCCnZ2+YF7nut+ZOEbE4GtaiPtyY6AkhZWbK70y1KK3j+RDhjVq5+U8FySkKRb/+w0EeUwA==} @@ -907,42 +912,36 @@ packages: engines: {node: '>=10'} cpu: [arm64] os: [linux] - libc: [glibc] '@swc/core-linux-arm64-musl@1.15.30': resolution: {integrity: sha512-1SYGs2l0Yyyi0pR/P/NKz/x0kqxkoiw+BXeJjLUdecSk/KasncWlJrc6hOvFSgKHOBrzgM5jwuluKtlT8dnrcA==} engines: {node: '>=10'} cpu: [arm64] os: [linux] - libc: [musl] '@swc/core-linux-ppc64-gnu@1.15.30': resolution: {integrity: sha512-TXREtiXeRhbfDFbmhnkIsXpKfzbfT73YkV2ZF6w0sfxgjC5zI2ZAbaCOq25qxvegofj2K93DtOpm9RLaBgqR2g==} engines: {node: '>=10'} cpu: [ppc64] os: [linux] - libc: [glibc] '@swc/core-linux-s390x-gnu@1.15.30': resolution: {integrity: sha512-DCR2YYeyd6DQE4OuDhImouuNcjXEiEdnn1Y0DyGteugPEDvVuvYk8Xddi+4o2SgWH6jiW8/I+3emZvbep1NC+g==} engines: {node: '>=10'} cpu: [s390x] os: [linux] - libc: [glibc] '@swc/core-linux-x64-gnu@1.15.30': resolution: {integrity: sha512-5Pizw3NgfOJ5BJOBK8TIRa59xFW2avESTOBDPTAYwZYa1JNDs+KMF9lUfjJiJLM5HiMs/wPheA9eiT0q9m2AoA==} engines: {node: '>=10'} cpu: [x64] os: [linux] - libc: [glibc] '@swc/core-linux-x64-musl@1.15.30': resolution: {integrity: sha512-qyqydP/wyH8alcIP4a2hnGSjHLJjm9H7yDFup+CPy9oTahFgLLwnNcv5UHXqO2Qs3AIND+cls5f/Bb6hqpxdgA==} engines: {node: '>=10'} cpu: [x64] os: [linux] - libc: [musl] '@swc/core-win32-arm64-msvc@1.15.30': resolution: {integrity: sha512-CaQENgDHVGOg1mSF5sQVgvfFHG9kjMor2rkLMLeLOkfZYNj13ppnJ9+lfaBZLZUMMbnlGQnavCJb8PVBUOso7Q==} @@ -1018,28 +1017,24 @@ packages: engines: {node: '>= 20'} cpu: [arm64] os: [linux] - libc: [glibc] '@tailwindcss/oxide-linux-arm64-musl@4.2.4': resolution: {integrity: sha512-bBADEGAbo4ASnppIziaQJelekCxdMaxisrk+fB7Thit72IBnALp9K6ffA2G4ruj90G9XRS2VQ6q2bCKbfFV82g==} engines: {node: '>= 20'} cpu: [arm64] os: [linux] - libc: [musl] '@tailwindcss/oxide-linux-x64-gnu@4.2.4': resolution: {integrity: sha512-7Mx25E4WTfnht0TVRTyC00j3i0M+EeFe7wguMDTlX4mRxafznw0CA8WJkFjWYH5BlgELd1kSjuU2JiPnNZbJDA==} engines: {node: '>= 20'} cpu: [x64] os: [linux] - libc: [glibc] '@tailwindcss/oxide-linux-x64-musl@4.2.4': resolution: {integrity: sha512-2wwJRF7nyhOR0hhHoChc04xngV3iS+akccHTGtz965FwF0up4b2lOdo6kI1EbDaEXKgvcrFBYcYQQ/rrnWFVfA==} engines: {node: '>= 20'} cpu: [x64] os: [linux] - libc: [musl] '@tailwindcss/oxide-wasm32-wasi@4.2.4': resolution: {integrity: sha512-FQsqApeor8Fo6gUEklzmaa9994orJZZDBAlQpK2Mq+DslRKFJeD6AjHpBQ0kZFQohVr8o85PPh8eOy86VlSCmw==} @@ -2218,28 +2213,24 @@ packages: engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] - libc: [glibc] lightningcss-linux-arm64-musl@1.32.0: resolution: {integrity: sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] - libc: [musl] lightningcss-linux-x64-gnu@1.32.0: resolution: {integrity: sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] - libc: [glibc] lightningcss-linux-x64-musl@1.32.0: resolution: {integrity: sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] - libc: [musl] lightningcss-win32-arm64-msvc@1.32.0: resolution: {integrity: sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==} @@ -3181,6 +3172,24 @@ packages: zod@4.3.6: resolution: {integrity: sha512-rftlrkhHZOcjDwkGlnUtZZkvaPHCsDATp4pGpuOOMDaTdDDXF91wuVDJoWoPsKX/3YPQ5fHuF3STjcYyKr+Qhg==} + zustand@5.0.12: + resolution: {integrity: sha512-i77ae3aZq4dhMlRhJVCYgMLKuSiZAaUPAct2AksxQ+gOtimhGMdXljRT21P5BNpeT4kXlLIckvkPM029OljD7g==} + engines: {node: '>=12.20.0'} + peerDependencies: + '@types/react': '>=18.0.0' + immer: '>=9.0.6' + react: '>=18.0.0' + use-sync-external-store: '>=1.2.0' + peerDependenciesMeta: + '@types/react': + optional: true + immer: + optional: true + react: + optional: true + use-sync-external-store: + optional: true + snapshots: '@adobe/css-tools@4.4.4': {} @@ -3475,6 +3484,10 @@ snapshots: '@eslint/core': 0.17.0 levn: 0.4.1 + '@heroicons/react@2.2.0(react@19.2.5)': + dependencies: + react: 19.2.5 + '@humanfs/core@0.19.2': dependencies: '@humanfs/types': 0.15.0 @@ -6143,3 +6156,8 @@ snapshots: zod: 4.3.6 zod@4.3.6: {} + + zustand@5.0.12(@types/react@19.2.14)(react@19.2.5): + optionalDependencies: + '@types/react': 19.2.14 + react: 19.2.5 diff --git a/src/App.tsx b/src/App.tsx index b62da76..d8c23dc 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -4,20 +4,20 @@ import { RouterProvider } from 'react-router-dom' import router from './routes' // import styles from "./App.module.css"; -import { AuthProvider } from './context/AuthContext' +import { AuthProvider } from "./context/AuthContext"; +import TestCard from "./TestCard"; +import LoginCard from "./LoginCard"; // import * from '@mui/styled-engine-sc' as styledEngineSC;, -import { LanguageProvider } from './context/LanguageContext' -import CustomTranslate from './textTranslation/CustomTranslate' +// import { LanguageProvider } from "./context/LanguageContext"; +// import CustomTranslate from "./textTranslation/CustomTranslate"; + function App() { return ( - - - {/* */} - - {/* */} - + + + ) } diff --git a/src/LoginCard.tsx b/src/LoginCard.tsx new file mode 100644 index 0000000..a004028 --- /dev/null +++ b/src/LoginCard.tsx @@ -0,0 +1,86 @@ +import ThemeToggleSwitch from './ThemeToggleSwitch'; + +function LoginCard() { + + const handleGoogleLogin = () => { + // Replace with your actual backend OAuth endpoint + window.location.href = 'http://localhost:8080/oauth2/authorization/google'; + }; + + return ( +
+ +
+ +
+ +
+ + {/* Heading */} +
+

+ Welcome +

+ +

+ Sign in using your Google account +

+
+ + {/* Google OAuth Button */} + + + {/* Footer */} +

+ By continuing, you agree to the platform policies. +

+
+
+ ); +} + +export default LoginCard; \ No newline at end of file diff --git a/src/TestCard.tsx b/src/TestCard.tsx new file mode 100644 index 0000000..3f75a03 --- /dev/null +++ b/src/TestCard.tsx @@ -0,0 +1,42 @@ +// import React from 'react'; +import { useTheme } from '@/shared/theme/useTheme'; +import { type ThemeName } from '@/shared/theme/types'; +import { themeRegistry } from './shared/theme'; + +function TestCard() { + const { setTheme, themeName } = useTheme(); + // const availableThemes1: ThemeName[] = ['light', 'dark']; + const { availableThemes } = useTheme(); + return ( +
+
+ {availableThemes.map((theme) => { + const t = themeRegistry[theme]; + return ( + + ) + })} +
+ +
+ Current theme: {themeName} +
+ +
+ Test Theme +
+ +
+ Full token test +
+
+ ); +} +export default TestCard; \ No newline at end of file diff --git a/src/ThemeToggleSwitch.tsx b/src/ThemeToggleSwitch.tsx new file mode 100644 index 0000000..a99fabe --- /dev/null +++ b/src/ThemeToggleSwitch.tsx @@ -0,0 +1,95 @@ +import { useState, useRef, useEffect } from 'react'; +import { useTheme } from '@/shared/theme/useTheme'; +import { SunIcon, MoonIcon } from '@heroicons/react/24/outline'; + +function ThemeToggleSwitch() { + const { themeName, setTheme } = useTheme(); + const [open, setOpen] = useState(false); + const ref = useRef(null); + + // Close dropdown on outside click + useEffect(() => { + const handleClickOutside = (e: MouseEvent) => { + if (ref.current && !ref.current.contains(e.target as Node)) { + setOpen(false); + } + }; + document.addEventListener('mousedown', handleClickOutside); + return () => document.removeEventListener('mousedown', handleClickOutside); + }, []); + + const handleSelect = (theme: string) => { + if (theme === 'digital' || theme === 'monochrome') return; // placeholder + setTheme(theme as any); + setOpen(false); + }; + + return ( +
+ {/* Toggle Button */} + + + {/* Dropdown */} + {open && ( +
+ {/* Light */} + + + {/* Dark */} + + + {/* Divider */} +
+ + {/* Digital (disabled) */} + + + {/* Monochrome (disabled) */} + +
+ )} +
+ ); +} + +export default ThemeToggleSwitch; \ No newline at end of file diff --git a/src/index.css b/src/index.css index a9fa80a..ad25b80 100644 --- a/src/index.css +++ b/src/index.css @@ -1,333 +1,59 @@ @import 'tailwindcss'; -@theme { - /* Primary colors */ - --color-primary: #e27e03; - --color-primary-dark: #c16c03; - --color-primary-dark: #cc6e03; - --color-primary-light: #f08d1a; - --color-primary-text: #ffffff; - --color-primary-text-dark: #000000; - /* Set both background-color and background-image for better compatibility */ - --color-primary-background-color: #ffffff; - /* --color-primary-background-image: radial-gradient(circle at center, rgba(255, 255, 255, 1) 51%, rgba(255, 255, 255, 1) 21%, rgba(237, 221, 83, 1) 100%); */ - --color-primary-background-dark: #0d0d0d; - --color-primary-background-light: #1f1f1f; - - /* Secondary colors */ - --color-secondary: #323232; - --color-secondary-dark: #222222; - --color-secondary-light: #4a4a4a; - --color-secondary-text: #b0b0b0; - --color-secondary-text-dark: #8d8d8d; - --color-secondary-background: none; - --color-secondary-background-dark: #1f1f1f; - --color-secondary-background-light: #4a4a4a; -} - -.borderRed { - border: 2px solid red; -} - -.navbar-gradient { - background: linear-gradient( - to right, - rgba(0, 1, 71, 1) 0%, - rgb(22, 24, 157) 33%, - rgb(51, 53, 154) 66%, - #000147 100% - ); -} - -.floating-navbar { - border-radius: 30px; -} - -.card-shadow { - border: 2px solid grey; - box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; -} - -.parallax-bg { - width: 100%; - padding: 0; - margin: 0; - background-size: auto; - background-position: top; - border-radius: 30px; -} - -.card-styling { - background: #fff7dc; - backdrop-filter: blur(10px); - border-radius: 16px; - border: 1px solid #ffeca8; -} -.card-styling-without-transition { - background: #fff7dc; - backdrop-filter: blur(10px); - border-radius: 16px; - border: 1px solid #ffeca8; -} - -.cursor-pointer { - cursor: pointer; -} - -.footer-link-hover { - text-decoration: underline; - text-decoration-color: white; -} - -.card-styling:hover, -.card-styling:focus { - transition: all 0.3s ease-in-out; - background: #ffde71; -} - -/* Hide scrollbars globally */ -* { - -ms-overflow-style: none; - /* IE/Edge */ - scrollbar-width: none; - /* Firefox */ -} - -*::-webkit-scrollbar { - display: none; - /* Chrome/Safari */ -} - -.navscrollbehavior { - position: fixed; - /* transition: translateY(2rem) 2s; */ - - /* transform: animation: transform 0.3s ease-in-out forwards; */ - /* top:1.5rem; */ - width: 90%; - /* margin: 1rem auto 0 auto; */ - /* border-radius: 1.5rem; */ - /* transition: background-color 1s ease; */ - /* display: flex; - justify-content: center; */ - box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 15px; - background: inherit; - /* background: linear-gradient(to right, #000147, #1BADD9); */ - /* background: #0A0032; */ - box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 15px; - /* animation: navbarFloatingDown 0.7s ease-in-out forwards; */ -} +/* 1. Fallback tokens (match SemanticTokens EXACTLY) */ +:root { + --color-bg-primary: #ffffff; + --color-bg-secondary: #f5f5f5; + --color-text-primary: #000000; + --color-text-secondary: #555555; + --color-border: #e5e5e5; + --color-danger: #ef4444; + --color-success: #22c55e; -.w-100C { - width: 100%; -} - -.btn-primary { - background-color: #000147; - /* Default button color */ -} + --radius-sm: 4px; + --radius-md: 8px; + --radius-lg: 12px; -.nav-focus-styling:focus { - background-color: rgba(0, 0, 0, 0); + --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05); + --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1); } -.hamburger-icon { - display: none !important; -} - -.mobile-navbar { - display: none; -} - -/* Closing animation */ -.mobile-navbar-closing { - animation: mobile-navbar-slide-left 0.3s ease-in-out; -} - -.navbar-logos { - display: flex !important; -} - -.navbar-logos-mob { - display: none !important; -} - -/* Opening animation - slide in from left */ -@keyframes mobile-navbar-slide-right { - from { - transform: translateX(-30rem); - } - - to { - transform: translateX(0rem); - } -} - -/* Closing animation - slide out to left */ -@keyframes mobile-navbar-slide-left { - from { - transform: translateX(0rem); - } - - to { - transform: translateX(-30rem); - } -} - -@keyframes navbarFloatingDown { - from { - transform: translateY(0rem); - } - - to { - transform: translateY(2rem); - } -} - -@keyframes spiny { - 0% { - transform: rotateY(0deg); - } - - 100% { - transform: rotateY(360deg); - } -} - -.cdacSpinner { - animation: spiny 2s linear infinite !important; -} - -.footer-links-container-mob { - display: none !important; -} - -.footer-links-container-pc { - display: inline-block !important; -} - -.navbar-list-mob { - display: none !important; -} - -.parallax-bg-pc { - display: block; -} - -.parallax-bg-mob { - display: none; -} - -.profile-stats-pc { - display: block; -} - -.profile-stats-mob { - display: none; -} - -.view-card-instruction-mob { - display: none; -} - -@media screen and (max-width: 769px) { - .navbar-list { - display: none !important; - } - - .view-card-instruction-mob { - display: block; - font-size: 0.7rem !important; - } - - .mobile-navbar { - display: flex; - height: 100vh; - width: 100%; - position: fixed; - z-index: 999; - background: linear-gradient( - to right, - rgba(0, 1, 71, 1) 0%, - rgb(22, 24, 157) 33%, - rgb(51, 53, 154) 66%, - #000147 100% - ); - overflow: hidden; - animation: mobile-navbar-slide-right 0.3s ease-in-out; - } - - .navbar-list-mob { - display: flex !important; - flex-direction: column !important; - justify-content: center; - height: 100%; - } - - .navbarCdacLogo { - display: inline; - } - - .navscrollbehavior { - border-radius: 0rem; - width: 100%; - animation: none !important; - transition: none !important; - } - - .communitycards { - display: flex; - justify-content: center; - flex-direction: column; - align-items: center; - } - - .hamburger-icon { - display: inline-block !important; - } - - .footer-links-container-pc { - display: none !important; - } - - .footer-links-container-mob { - display: flex !important; - } - - .navbar-logos { - display: none !important; - } - - .navbar-logos-mob { - display: flex !important; - } - - .hide-these-mobile-view { - display: none !important; - } - - .parallax-bg-pc { - display: none; - } - - .parallax-bg-mob { - display: block; - } - - .profile-stats-pc { - display: none; - } - - .profile-stats-mob { - display: block; - } - - .post-rating-like-share { - flex-direction: column; - /* align-items: center; */ - } - - .post-rating-like-share > div { - margin-bottom: 1rem; - } +/* 2. Tailwind v4 bridge (CRITICAL) */ +@theme { + /* Background */ + --color-bg-primary: var(--color-bg-primary); + --color-bg-secondary: var(--color-bg-secondary); + --color-bg-tertiary: var(--color-bg-tertiary); + + /* Text */ + --color-text-primary: var(--color-text-primary); + --color-text-secondary: var(--color-text-secondary); + --color-text-tertiary: var(--color-text-tertiary); + + /* Borders */ + --color-border-primary: var(--color-border-primary); + --color-border-secondary: var(--color-border-secondary); + --color-border-tertiary: var(--color-border-tertiary); + + /* Status */ + --color-danger: var(--color-danger); + --color-warning: var(--color-warning); + --color-success: var(--color-success); + --color-info: var(--color-info); +} + +/* Disable transitions on first load (prevents flash) */ +html[data-theme-loaded="false"], +html[data-theme-loaded="false"] * { + transition: none !important; +} + +/* Enable smooth transitions AFTER theme is applied */ +html[data-theme-loaded="true"], +html[data-theme-loaded="true"] * { + transition: + background-color 0.25s ease, + color 0.25s ease, + border-color 0.25s ease, + box-shadow 0.25s ease; } diff --git a/src/layouts/MainLayout/BaseLayout.tsx b/src/layouts/MainLayout/BaseLayout.tsx index 00085bf..cea4b3b 100644 --- a/src/layouts/MainLayout/BaseLayout.tsx +++ b/src/layouts/MainLayout/BaseLayout.tsx @@ -1,70 +1,21 @@ -// import Navbar from '@components/Navbar/Navbar'; -import React, { Suspense, useContext, useEffect } from 'react' -import { Outlet, useLocation, useNavigate } from 'react-router-dom' - -// import Nav from '@components/Navbar/Nav'; -// import Footer from '@/views/Home/Footer'; -// import Nav from '@/components/Navbar/Nav'; -import AuthContext from '@/context/AuthContext' -import { clearPostLoginRedirect, getPostLoginRedirect } from '@/utils/postLoginRedirect' +import React, { Suspense } from 'react'; +import { Outlet } from 'react-router-dom'; const BaseLayout: React.FC = () => { - const { isAuthenticated, isLoading } = useContext(AuthContext) - const navigate = useNavigate() - const location = useLocation() - - useEffect(() => { - if (!isAuthenticated || isLoading) return - - const pendingRedirect = getPostLoginRedirect() - if (!pendingRedirect) return - - const currentPath = `${location.pathname}${location.search}${location.hash}` - - if (pendingRedirect === currentPath) { - clearPostLoginRedirect() - return - } - - const isFallbackLanding = - location.pathname === '/' || location.pathname === '/home' || location.pathname === '/login' - if (isFallbackLanding) { - navigate(pendingRedirect, { replace: true }) - } - }, [isAuthenticated, isLoading, location.pathname, location.search, location.hash, navigate]) - - // const homeRef = useRef(null); - // const fdRef = useRef(null); - // const hiwRef = useRef(null); - // const rdRef = useRef(null); - // const communityRef = useRef(null); - // const startRef = useRef(null); - // const NAV_HEIGHT_OFFSET = 60; - - // const scrollToSection = (yScrollPosition: number) => { - // window.scrollTo({ - // top: yScrollPosition, - // behavior: 'smooth' - // }); - // }; return ( -
- {/*