diff options
author | Mo Tarbin <mhed.t91@gmail.com> | 2024-06-30 18:55:39 -0400 |
---|---|---|
committer | Mo Tarbin <mhed.t91@gmail.com> | 2024-06-30 18:55:39 -0400 |
commit | 2657469964e24ffbeb905024532120395f6e797c (patch) | |
tree | 2fe9db8a4ecfa92d854ca94f7586d81163c8bd25 /src/contexts | |
download | donetick-frontend-2657469964e24ffbeb905024532120395f6e797c.tar.gz donetick-frontend-2657469964e24ffbeb905024532120395f6e797c.tar.bz2 donetick-frontend-2657469964e24ffbeb905024532120395f6e797c.zip |
move to Donetick Org, First commit frontend
Diffstat (limited to '')
-rw-r--r-- | src/contexts/Contexts.jsx | 13 | ||||
-rw-r--r-- | src/contexts/QueryContext.jsx | 11 | ||||
-rw-r--r-- | src/contexts/RouterContext.jsx | 116 | ||||
-rw-r--r-- | src/contexts/ThemeContext.jsx | 86 | ||||
-rw-r--r-- | src/contexts/UserContext.js | 8 |
5 files changed, 234 insertions, 0 deletions
diff --git a/src/contexts/Contexts.jsx b/src/contexts/Contexts.jsx new file mode 100644 index 0000000..1269154 --- /dev/null +++ b/src/contexts/Contexts.jsx @@ -0,0 +1,13 @@ +import QueryContext from './QueryContext' +import RouterContext from './RouterContext' +import ThemeContext from './ThemeContext' + +const Contexts = () => { + const contexts = [ThemeContext, QueryContext, RouterContext] + + return contexts.reduceRight((acc, Context) => { + return <Context>{acc}</Context> + }, {}) +} + +export default Contexts diff --git a/src/contexts/QueryContext.jsx b/src/contexts/QueryContext.jsx new file mode 100644 index 0000000..3087d65 --- /dev/null +++ b/src/contexts/QueryContext.jsx @@ -0,0 +1,11 @@ +import { QueryClient, QueryClientProvider } from '@tanstack/react-query' + +const QueryContext = ({ children }) => { + const queryClient = new QueryClient() + + return ( + <QueryClientProvider client={queryClient}>{children}</QueryClientProvider> + ) +} + +export default QueryContext diff --git a/src/contexts/RouterContext.jsx b/src/contexts/RouterContext.jsx new file mode 100644 index 0000000..6077092 --- /dev/null +++ b/src/contexts/RouterContext.jsx @@ -0,0 +1,116 @@ +import App from '@/App' +import ChoreEdit from '@/views/ChoreEdit/ChoreEdit' +import ChoresOverview from '@/views/ChoresOverview' +import Error from '@/views/Error' +import Settings from '@/views/Settings/Settings' +import { RouterProvider, createBrowserRouter } from 'react-router-dom' +import ForgotPasswordView from '../views/Authorization/ForgotPasswordView' +import LoginView from '../views/Authorization/LoginView' +import SignupView from '../views/Authorization/Signup' +import UpdatePasswordView from '../views/Authorization/UpdatePasswordView' +import MyChores from '../views/Chores/MyChores' +import JoinCircleView from '../views/Circles/JoinCircle' +import ChoreHistory from '../views/History/ChoreHistory' +import Landing from '../views/Landing/Landing' +import PaymentCancelledView from '../views/Payments/PaymentFailView' +import PaymentSuccessView from '../views/Payments/PaymentSuccessView' +import PrivacyPolicyView from '../views/PrivacyPolicy/PrivacyPolicyView' +import TermsView from '../views/Terms/TermsView' +import TestView from '../views/TestView/Test' +import ThingsHistory from '../views/Things/ThingsHistory' +import ThingsView from '../views/Things/ThingsView' +const Router = createBrowserRouter([ + { + path: '/', + element: <App />, + errorElement: <Error />, + children: [ + { + path: '/', + element: <Landing />, + }, + { + path: '/settings', + element: <Settings />, + }, + { + path: '/chores', + element: <ChoresOverview />, + }, + { + path: '/chores/:choreId/edit', + element: <ChoreEdit />, + }, + { + path: '/chores/create', + element: <ChoreEdit />, + }, + { + path: '/chores/:choreId/history', + element: <ChoreHistory />, + }, + { + path: '/my/chores', + element: <MyChores />, + }, + { + path: '/login', + element: <LoginView />, + }, + { + path: '/signup', + element: <SignupView />, + }, + { + path: '/landing', + element: <Landing />, + }, + { + path: '/test', + element: <TestView />, + }, + { + path: '/forgot-password', + element: <ForgotPasswordView />, + }, + { + path: '/password/update', + element: <UpdatePasswordView />, + }, + { + path: '/privacy', + element: <PrivacyPolicyView />, + }, + { + path: '/terms', + element: <TermsView />, + }, + { + path: 'circle/join', + element: <JoinCircleView />, + }, + { + path: 'payments/success', + element: <PaymentSuccessView />, + }, + { + path: 'payments/cancel', + element: <PaymentCancelledView />, + }, + { + path: 'things', + element: <ThingsView />, + }, + { + path: 'things/:id', + element: <ThingsHistory />, + }, + ], + }, +]) + +const RouterContext = ({ children }) => { + return <RouterProvider router={Router} /> +} + +export default RouterContext diff --git a/src/contexts/ThemeContext.jsx b/src/contexts/ThemeContext.jsx new file mode 100644 index 0000000..45e91b5 --- /dev/null +++ b/src/contexts/ThemeContext.jsx @@ -0,0 +1,86 @@ +import { COLORS } from '@/constants/theme' +import { CssBaseline } from '@mui/joy' +import { CssVarsProvider, extendTheme } from '@mui/joy/styles' +import PropType from 'prop-types' + +const primaryColor = 'cyan' + +const shades = [ + '50', + ...Array.from({ length: 9 }, (_, i) => String((i + 1) * 100)), +] + +const getPallete = (key = primaryColor) => { + return shades.reduce((acc, shade) => { + acc[shade] = COLORS[key][shade] + return acc + }, {}) +} + +const primaryPalette = getPallete(primaryColor) + +const theme = extendTheme({ + colorSchemes: { + light: { + palette: { + primary: primaryPalette, + success: { + 50: '#f3faf7', + 100: '#def5eb', + 200: '#b7e7d5', + 300: '#8ed9be', + 400: '#6ecdb0', + 500: '#4ec1a2', + 600: '#46b89a', + 700: '#3cae91', + 800: '#32a487', + 900: '#229d76', + }, + danger: { + 50: '#fef2f2', + 100: '#fde8e8', + 200: '#fbd5d5', + 300: '#f9c1c1', + 400: '#f6a8a8', + 500: '', + 600: '#f47272', + 700: '#e33434', + 800: '#cc1f1a', + 900: '#b91c1c', + }, + }, + warning: { + 50: '#fffdf7', + 100: '#fef8e1', + 200: '#fdecb2', + 300: '#fcd982', + 400: '#fbcf52', + 500: '#f9c222', + 600: '#f6b81e', + 700: '#f3ae1a', + 800: '#f0a416', + 900: '#e99b0e', + }, + }, + }, + dark: { + palette: { + primary: primaryPalette, + }, + }, +}) + +const ThemeContext = ({ children }) => { + return ( + <CssVarsProvider theme={theme}> + <CssBaseline /> + {children} + </CssVarsProvider> + ) +} + +ThemeContext.propTypes = { + children: PropType.node, +} + +export default ThemeContext diff --git a/src/contexts/UserContext.js b/src/contexts/UserContext.js new file mode 100644 index 0000000..7d2527e --- /dev/null +++ b/src/contexts/UserContext.js @@ -0,0 +1,8 @@ +import { createContext } from 'react' + +const UserContext = createContext({ + userProfile: null, + setUserProfile: () => {}, +}) + +export { UserContext } |