diff --git a/package.json b/package.json index eaa287d..d173aba 100644 --- a/package.json +++ b/package.json @@ -16,16 +16,20 @@ "@types/react": "^18.0.28", "@types/react-dom": "^18.0.11", "mobx": "^6.8.0", + "mobx-react-lite": "^3.4.3", "react": "^18.2.0", "react-advanced-cropper": "^0.18.0", "react-colorful": "^5.6.1", "react-dom": "^18.2.0", + "react-error-boundary": "^3.1.4", "react-hook-form": "^7.43.7", "react-icons": "^4.8.0", "react-loading-skeleton": "^3.2.0", "react-responsive": "^9.0.2", + "react-router-dom": "^6.9.0", "react-scripts": "5.0.1", - "react-spinkit": "^3.0.0", + "react-spinners": "^0.13.8", + "reoverlay": "^1.0.3", "slate": "^0.91.4", "slate-react": "^0.92.0", "styled-components": "^5.3.9", @@ -57,6 +61,7 @@ }, "devDependencies": { "@craco/craco": "^7.1.0", + "@types/styled-components": "^5.1.26", "craco-esbuild": "^0.5.2" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1bf3fc0..2643f81 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -14,18 +14,23 @@ specifiers: '@types/node': ^16.18.16 '@types/react': ^18.0.28 '@types/react-dom': ^18.0.11 + '@types/styled-components': ^5.1.26 craco-esbuild: ^0.5.2 mobx: ^6.8.0 + mobx-react-lite: ^3.4.3 react: ^18.2.0 react-advanced-cropper: ^0.18.0 react-colorful: ^5.6.1 react-dom: ^18.2.0 + react-error-boundary: ^3.1.4 react-hook-form: ^7.43.7 react-icons: ^4.8.0 react-loading-skeleton: ^3.2.0 react-responsive: ^9.0.2 + react-router-dom: ^6.9.0 react-scripts: 5.0.1 - react-spinkit: ^3.0.0 + react-spinners: ^0.13.8 + reoverlay: ^1.0.3 slate: ^0.91.4 slate-react: ^0.92.0 styled-components: ^5.3.9 @@ -45,16 +50,20 @@ dependencies: '@types/react': 18.0.28 '@types/react-dom': 18.0.11 mobx: 6.8.0 + mobx-react-lite: 3.4.3_woojb62cqeyk443mbl7msrwu2e react: 18.2.0 react-advanced-cropper: 0.18.0_react@18.2.0 react-colorful: 5.6.1_biqbaboplfbrettd7655fr4n2y react-dom: 18.2.0_react@18.2.0 + react-error-boundary: 3.1.4_react@18.2.0 react-hook-form: 7.43.7_react@18.2.0 react-icons: 4.8.0_react@18.2.0 react-loading-skeleton: 3.2.0_react@18.2.0 react-responsive: 9.0.2_react@18.2.0 + react-router-dom: 6.9.0_biqbaboplfbrettd7655fr4n2y react-scripts: 5.0.1_j5ip3o3v6sktjzl5cxtjyfbuo4 - react-spinkit: 3.0.0 + react-spinners: 0.13.8_biqbaboplfbrettd7655fr4n2y + reoverlay: 1.0.3_biqbaboplfbrettd7655fr4n2y slate: 0.91.4 slate-react: 0.92.0_6tgy34rvmll7duwkm4ydcekf3u styled-components: 5.3.9_biqbaboplfbrettd7655fr4n2y @@ -62,6 +71,7 @@ dependencies: devDependencies: '@craco/craco': 7.1.0_t5qpnnrvp3p35ejzfaqjqkexiq + '@types/styled-components': 5.1.26 craco-esbuild: 0.5.2_u2d5pzzfsjvcxtlxpwh3btnila packages: @@ -2458,6 +2468,11 @@ packages: resolution: {integrity: sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==} dev: false + /@remix-run/router/1.4.0: + resolution: {integrity: sha512-BJ9SxXux8zAg991UmT8slpwpsd31K1dHHbD3Ba4VzD+liLQ4WAMSxQp2d2ZPRPfN0jN2NPRowcSSoM7lCaF08Q==} + engines: {node: '>=14'} + dev: false + /@rollup/plugin-babel/5.3.1_hqhlikriuul7byjexqnpgcmenu: resolution: {integrity: sha512-WFfdLWU/xVWKeRQnKmIAQULUI7Il0gZnBIH/ZFO069wYIfPu+8zrfp/KMW0atmELoRDq8FbiP3VCss9MhCut7Q==} engines: {node: '>= 10.0.0'} @@ -2795,6 +2810,13 @@ packages: dependencies: '@types/node': 16.18.16 + /@types/hoist-non-react-statics/3.3.1: + resolution: {integrity: sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==} + dependencies: + '@types/react': 18.0.28 + hoist-non-react-statics: 3.3.2 + dev: true + /@types/html-minifier-terser/6.1.0: resolution: {integrity: sha512-oh/6byDPnL1zeNXFrDXFLyZjkr1MsBG667IM792caf1L2UPOOMf65NFzjUH/ltyfwjAGfs1rsX1eftK0jC/KIg==} @@ -2851,7 +2873,6 @@ packages: /@types/prop-types/15.7.5: resolution: {integrity: sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==} - dev: false /@types/q/1.5.5: resolution: {integrity: sha512-L28j2FcJfSZOnL1WBjDYp2vUHCeIFlyYI/53EwD/rKUBQ7MtUUfbQWiyKJGpcnv4/WgrhWsFKrcPstcAt/J0tQ==} @@ -2886,7 +2907,6 @@ packages: '@types/prop-types': 15.7.5 '@types/scheduler': 0.16.2 csstype: 3.1.1 - dev: false /@types/resolve/1.17.1: resolution: {integrity: sha512-yy7HuzQhj0dhGpD8RLXSZWEkLsV9ibvxvi6EiJ3bkqLAO1RGo0WbkWQiwpRlSFymTJRz0d3k5LM3kkx8ArDbLw==} @@ -2898,7 +2918,6 @@ packages: /@types/scheduler/0.16.2: resolution: {integrity: sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==} - dev: false /@types/semver/7.3.13: resolution: {integrity: sha512-21cFJr9z3g5dW8B0CVI9g2O9beqaThGQ6ZFBqHfwhzLDKUxaqTIy3vnfah/UPkfOiF2pLq+tGz+W8RyCskuslw==} @@ -2922,6 +2941,14 @@ packages: /@types/stack-utils/2.0.1: resolution: {integrity: sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==} + /@types/styled-components/5.1.26: + resolution: {integrity: sha512-KuKJ9Z6xb93uJiIyxo/+ksS7yLjS1KzG6iv5i78dhVg/X3u5t1H7juRWqVmodIdz6wGVaIApo1u01kmFRdJHVw==} + dependencies: + '@types/hoist-non-react-statics': 3.3.1 + '@types/react': 18.0.28 + csstype: 3.1.1 + dev: true + /@types/testing-library__jest-dom/5.14.5: resolution: {integrity: sha512-SBwbxYoyPIvxHbeHxTZX2Pe/74F/tX2/D3mMvzabdeJ25bBojfW0TyB8BHrbq/9zaaKICJZjLP+8r6AeZMFCuQ==} dependencies: @@ -4511,7 +4538,6 @@ packages: /csstype/3.1.1: resolution: {integrity: sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==} - dev: false /damerau-levenshtein/1.0.8: resolution: {integrity: sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==} @@ -5969,7 +5995,6 @@ packages: resolution: {integrity: sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==} dependencies: react-is: 16.13.1 - dev: false /hoopy/0.1.4: resolution: {integrity: sha512-HRcs+2mr52W0K+x8RzcLzuPPmVIKMSv97RGHy0Ea9y/mpcaK+xTrjICA04KAHi4GRzxliNqNJEFYWHghy3rSfQ==} @@ -7316,10 +7341,6 @@ packages: resolution: {integrity: sha512-ZvFw1KWS3GVyYBYb7qkmRM/WwL2TQQBxgCK62rlvm4WpVQ23Nb4tYjApUlfjrEGvOs7KHEsmyUn75OHZrJMWPw==} engines: {node: '>= 12.13.0'} - /loaders.css/0.1.2: - resolution: {integrity: sha512-Rhowlq24ey1VOeor+3wYOt9+MjaxBOJm1u4KlQgNC3+0xJ0LS4wq4iG57D/BPzvuD/7HHDGQOWJ+81oR2EI9bQ==} - dev: false - /locate-path/3.0.0: resolution: {integrity: sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==} engines: {node: '>=6'} @@ -7544,6 +7565,24 @@ packages: dependencies: minimist: 1.2.8 + /mobx-react-lite/3.4.3_woojb62cqeyk443mbl7msrwu2e: + resolution: {integrity: sha512-NkJREyFTSUXR772Qaai51BnE1voWx56LOL80xG7qkZr6vo8vEaLF3sz1JNUVh+rxmUzxYaqOhfuxTfqUh0FXUg==} + peerDependencies: + mobx: ^6.1.0 + react: ^16.8.0 || ^17 || ^18 + react-dom: '*' + react-native: '*' + peerDependenciesMeta: + react-dom: + optional: true + react-native: + optional: true + dependencies: + mobx: 6.8.0 + react: 18.2.0 + react-dom: 18.2.0_react@18.2.0 + dev: false + /mobx/6.8.0: resolution: {integrity: sha512-+o/DrHa4zykFMSKfS8Z+CPSEg5LW9tSNGTuN8o6MF1GKxlfkSHSeJn5UtgxvPkGgaouplnrLXCF+duAsmm6FHQ==} dev: false @@ -8877,6 +8916,16 @@ packages: scheduler: 0.23.0 dev: false + /react-error-boundary/3.1.4_react@18.2.0: + resolution: {integrity: sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==} + engines: {node: '>=10', npm: '>=6'} + peerDependencies: + react: '>=16.13.1' + dependencies: + '@babel/runtime': 7.21.0 + react: 18.2.0 + dev: false + /react-error-overlay/6.0.11: resolution: {integrity: sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg==} @@ -8931,6 +8980,29 @@ packages: shallow-equal: 1.2.1 dev: false + /react-router-dom/6.9.0_biqbaboplfbrettd7655fr4n2y: + resolution: {integrity: sha512-/seUAPY01VAuwkGyVBPCn1OXfVbaWGGu4QN9uj0kCPcTyNYgL1ldZpxZUpRU7BLheKQI4Twtl/OW2nHRF1u26Q==} + engines: {node: '>=14'} + peerDependencies: + react: '>=16.8' + react-dom: '>=16.8' + dependencies: + '@remix-run/router': 1.4.0 + react: 18.2.0 + react-dom: 18.2.0_react@18.2.0 + react-router: 6.9.0_react@18.2.0 + dev: false + + /react-router/6.9.0_react@18.2.0: + resolution: {integrity: sha512-51lKevGNUHrt6kLuX3e/ihrXoXCa9ixY/nVWRLlob4r/l0f45x3SzBvYJe3ctleLUQQ5fVa4RGgJOTH7D9Umhw==} + engines: {node: '>=14'} + peerDependencies: + react: '>=16.8' + dependencies: + '@remix-run/router': 1.4.0 + react: 18.2.0 + dev: false + /react-scripts/5.0.1_j5ip3o3v6sktjzl5cxtjyfbuo4: resolution: {integrity: sha512-8VAmEm/ZAwQzJ+GOMLbBsTdDKOpuZh7RPs0UymvBR2vRk4iZWCskjbFnxqjrzoIvlNNRZ3QJFx6/qDSi6zSnaQ==} engines: {node: '>=14.0.0'} @@ -9026,13 +9098,14 @@ packages: - webpack-hot-middleware - webpack-plugin-serve - /react-spinkit/3.0.0: - resolution: {integrity: sha512-RrfGRPjqxHQiy7quPqhjPynTu0zobgQaZu1QYBMpJJ6pCSRRRK16EZMaxdE6fLVYFRJWpX/eGATWLMoVFFT5uQ==} + /react-spinners/0.13.8_biqbaboplfbrettd7655fr4n2y: + resolution: {integrity: sha512-3e+k56lUkPj0vb5NDXPVFAOkPC//XyhKPJjvcGjyMNPWsBKpplfeyialP74G7H7+It7KzhtET+MvGqbKgAqpZA==} + peerDependencies: + react: ^16.0.0 || ^17.0.0 || ^18.0.0 + react-dom: ^16.0.0 || ^17.0.0 || ^18.0.0 dependencies: - classnames: 2.3.2 - loaders.css: 0.1.2 - object-assign: 4.1.1 - prop-types: 15.8.1 + react: 18.2.0 + react-dom: 18.2.0_react@18.2.0 dev: false /react-transition-group/4.4.5_biqbaboplfbrettd7655fr4n2y: @@ -9169,6 +9242,18 @@ packages: lodash: 4.17.21 strip-ansi: 6.0.1 + /reoverlay/1.0.3_biqbaboplfbrettd7655fr4n2y: + resolution: {integrity: sha512-KNk8JVf49+SS6qold8Hb6R/+Y1wti6qZfiA0YfqP+2gjWADUduM2HL2oDHQPS2HWcJLOBuGKUQF1/54DXIPEXw==} + peerDependencies: + react: '>=16.8.0' + react-dom: '>=16.8.0' + dependencies: + nanoid: 3.3.4 + prop-types: 15.8.1 + react: 18.2.0 + react-dom: 18.2.0_react@18.2.0 + dev: false + /repeat-element/1.1.4: resolution: {integrity: sha512-LFiNfRcSu7KK3evMyYOuCzv3L10TW7yC1G2/+StMjK8Y6Vqd2MG7r/Qjw4ghtuCOjFvlnms/iMmLqpvW/ES/WQ==} engines: {node: '>=0.10.0'} diff --git a/public/favicon.ico b/public/favicon.ico index a11777c..e1a43ed 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/public/index.html b/public/index.html index e9af5a5..a2cb0f8 100644 --- a/public/index.html +++ b/public/index.html @@ -10,34 +10,20 @@ content="Web site created using create-react-app" /> - - Fosscord + +
- diff --git a/public/logo192.png b/public/logo192.png index fc44b0a..aa6c49f 100644 Binary files a/public/logo192.png and b/public/logo192.png differ diff --git a/public/logo512.png b/public/logo512.png index a4e47a6..694a66d 100644 Binary files a/public/logo512.png and b/public/logo512.png differ diff --git a/src/App.tsx b/src/App.tsx index b30e2a0..67ecd7c 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,14 +1,26 @@ -import Typography from "@mui/material/Typography"; -import "./App.css"; +import { Route, Routes } from "react-router-dom"; +import LoginPage from "./pages/LoginPage"; +import NotFoundPage from "./pages/NotFound"; +import RegistrationPage from "./pages/RegistrationPage"; +import RootPage from "./pages/RootPage"; +import RequireAuth from "./utils/RequireAuth"; function App() { return ( -
- - Fosscord Client - - ; -
+ + + + + } + /> + + } /> + } /> + } /> + ); } diff --git a/src/assets/images/logo/Fosscord-Icon-Rounded.svg b/src/assets/images/logo/Fosscord-Icon-Rounded.svg new file mode 100644 index 0000000..47fbe93 --- /dev/null +++ b/src/assets/images/logo/Fosscord-Icon-Rounded.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/components/Container.tsx b/src/components/Container.tsx new file mode 100644 index 0000000..7b4556c --- /dev/null +++ b/src/components/Container.tsx @@ -0,0 +1,6 @@ +import styled from "styled-components"; + +export default styled.div` + background-color: var(--background); + color: var(--text); +`; diff --git a/src/components/Text.tsx b/src/components/Text.tsx new file mode 100644 index 0000000..3cd2094 --- /dev/null +++ b/src/components/Text.tsx @@ -0,0 +1,5 @@ +import styled from "styled-components"; + +export default styled.div` + color: var(--text); +`; diff --git a/src/contexts/Auth.tsx b/src/contexts/Auth.tsx new file mode 100644 index 0000000..bf9e14a --- /dev/null +++ b/src/contexts/Auth.tsx @@ -0,0 +1,25 @@ +import React from "react"; + +interface AuthContextType { + user: any; + signin: () => void; + signout: () => void; +} + +export const AuthContext = React.createContext(null!); + +export function AuthProvider({ children }: { children: React.ReactNode }) { + let [user, setUser] = React.useState(null); + + let signin = () => { + setUser("test"); + }; + + let signout = () => { + setUser(null); + }; + + let value = { user, signin, signout }; + + return {children}; +} diff --git a/src/contexts/Theme.tsx b/src/contexts/Theme.tsx new file mode 100644 index 0000000..d3e8c3b --- /dev/null +++ b/src/contexts/Theme.tsx @@ -0,0 +1,57 @@ +import { observer } from "mobx-react-lite"; +import { createGlobalStyle } from "styled-components"; +import { useAppStore } from "../stores/AppStore"; + +export type ThemeVariables = "primary" | "secondary" | "background" | "text"; + +export type Overrides = { + [variable in ThemeVariables]: string; +}; + +export type Theme = Overrides & { + light?: boolean; +}; + +export const ThemePresets: Record = { + light: { + primary: "#FF5F00", + secondary: "#FF3D00", + background: "#e9e2e1", + text: "#000000", + }, + dark: { + primary: "#FF5F00", + secondary: "#FF3D00", + background: "#141212", + text: "#e9e2e1", + }, +}; + +const GlobalTheme = createGlobalStyle<{ theme: Theme }>` +:root { + ${(props) => generateVariables(props.theme)} +} +`; + +export const generateVariables = (theme: Theme) => { + return (Object.keys(theme) as ThemeVariables[]).map((key) => { + const colour = theme[key]; + try { + const r = parseInt(colour.substring(1, 3), 16); + const g = parseInt(colour.substring(3, 5), 16); + const b = parseInt(colour.substring(5, 7), 16); + return `--${key}: ${theme[key]}; --${key}-rgb: rgb(${r}, ${g}, ${b});`; + } catch { + return `--${key}: ${theme[key]};`; + } + }); +}; + +export default observer(() => { + const appStore = useAppStore(); + const theme = appStore.theme; + + const variables = theme.computeVariables(); + + return ; +}); diff --git a/src/hooks/useAuth.ts b/src/hooks/useAuth.ts new file mode 100644 index 0000000..645e158 --- /dev/null +++ b/src/hooks/useAuth.ts @@ -0,0 +1,6 @@ +import React from "react"; +import { AuthContext } from "../contexts/Auth"; + +export default function useAuth() { + return React.useContext(AuthContext); +} diff --git a/src/index.tsx b/src/index.tsx index 27e4993..5caf8d2 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -4,7 +4,10 @@ import "@fontsource/roboto/500.css"; import "@fontsource/roboto/700.css"; import React from "react"; import ReactDOM from "react-dom/client"; +import { BrowserRouter } from "react-router-dom"; import App from "./App"; +import { AuthProvider } from "./contexts/Auth"; +import Theme from "./contexts/Theme"; import "./index.css"; const root = ReactDOM.createRoot( @@ -12,6 +15,11 @@ const root = ReactDOM.createRoot( ); root.render( - + + + + + + ); diff --git a/src/pages/ErrorPage.tsx b/src/pages/ErrorPage.tsx new file mode 100644 index 0000000..6d3293e --- /dev/null +++ b/src/pages/ErrorPage.tsx @@ -0,0 +1,17 @@ +import Container from "../components/Container"; +import Text from "../components/Text"; + +interface Props { + error: Error; +} + +function ErrorPage({ error }: Props) { + return ( + + Oops, Something went wrong! + 
{error.message}
+ + ); +} + +export default ErrorPage; diff --git a/src/pages/LoginPage.tsx b/src/pages/LoginPage.tsx new file mode 100644 index 0000000..1a24a2c --- /dev/null +++ b/src/pages/LoginPage.tsx @@ -0,0 +1,7 @@ +import Container from "../components/Container"; + +function LoginPage() { + return LoginPage; +} + +export default LoginPage; diff --git a/src/pages/NotFound.tsx b/src/pages/NotFound.tsx new file mode 100644 index 0000000..63369be --- /dev/null +++ b/src/pages/NotFound.tsx @@ -0,0 +1,7 @@ +import Container from "../components/Container"; + +function NotFoundPage() { + return NotFound; +} + +export default NotFoundPage; diff --git a/src/pages/RegistrationPage.tsx b/src/pages/RegistrationPage.tsx new file mode 100644 index 0000000..513f84a --- /dev/null +++ b/src/pages/RegistrationPage.tsx @@ -0,0 +1,7 @@ +import Container from "../components/Container"; + +function RegistrationPage() { + return RegistrationPage; +} + +export default RegistrationPage; diff --git a/src/pages/RootPage.tsx b/src/pages/RootPage.tsx new file mode 100644 index 0000000..1765c3d --- /dev/null +++ b/src/pages/RootPage.tsx @@ -0,0 +1,7 @@ +import Container from "../components/Container"; + +function RootPage() { + return RootPage; +} + +export default RootPage; diff --git a/src/stores/AppStore.ts b/src/stores/AppStore.ts new file mode 100644 index 0000000..4718320 --- /dev/null +++ b/src/stores/AppStore.ts @@ -0,0 +1,18 @@ +import { makeAutoObservable } from "mobx"; +import ThemeStore from "./ThemeStore"; + +export default class AppStore { + theme: ThemeStore; + + constructor() { + this.theme = new ThemeStore(); + + makeAutoObservable(this); + } +} + +export const appStore = new AppStore(); + +export function useAppStore() { + return appStore; +} diff --git a/src/stores/ThemeStore.ts b/src/stores/ThemeStore.ts new file mode 100644 index 0000000..6bf2ff0 --- /dev/null +++ b/src/stores/ThemeStore.ts @@ -0,0 +1,24 @@ +import { computed, makeAutoObservable } from "mobx"; +import type { Theme } from "../contexts/Theme"; +import { ThemePresets } from "../contexts/Theme"; + +export default class ThemeStore { + constructor() { + makeAutoObservable(this); + } + + @computed + getVariables(): Theme { + return { + ...ThemePresets["dark"], + light: false, + }; + } + + @computed + computeVariables() { + const variables = this.getVariables(); + + return variables as unknown as Theme; + } +} diff --git a/src/utils/RequireAuth.tsx b/src/utils/RequireAuth.tsx new file mode 100644 index 0000000..1cd62c1 --- /dev/null +++ b/src/utils/RequireAuth.tsx @@ -0,0 +1,15 @@ +import { Navigate, useLocation } from "react-router-dom"; +import useAuth from "../hooks/useAuth"; + +function RequireAuth({ children }: { children: JSX.Element }) { + let auth = useAuth(); + let location = useLocation(); + + if (!auth.user) { + return ; + } + + return children; +} + +export default RequireAuth; diff --git a/tsconfig.json b/tsconfig.json index a273b0c..ed0e2cf 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,11 +1,7 @@ { "compilerOptions": { "target": "es5", - "lib": [ - "dom", - "dom.iterable", - "esnext" - ], + "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true, "esModuleInterop": true, @@ -18,9 +14,9 @@ "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, - "jsx": "react-jsx" + "jsx": "react-jsx", + "experimentalDecorators": true, + "emitDecoratorMetadata": true }, - "include": [ - "src" - ] + "include": ["src"] }