diff --git a/packages/apps/human-app/frontend/src/api/auth-service.ts b/packages/apps/human-app/frontend/src/api/auth-service.ts index f54a1a49c5..967ca6c662 100644 --- a/packages/apps/human-app/frontend/src/api/auth-service.ts +++ b/packages/apps/human-app/frontend/src/api/auth-service.ts @@ -1,5 +1,5 @@ import { jwtDecode } from 'jwt-decode'; -import { type SignInDto } from '@/modules/signin/worker/schemas'; +import { type SignInDto } from '@/modules/signin/schemas'; import { browserAuthProvider } from '@/shared/contexts/browser-auth-provider'; import { type AuthTokensSuccessResponse, diff --git a/packages/apps/human-app/frontend/src/api/authorized-http-api-client.ts b/packages/apps/human-app/frontend/src/api/authorized-http-api-client.ts index 92a427d161..4907c45090 100644 --- a/packages/apps/human-app/frontend/src/api/authorized-http-api-client.ts +++ b/packages/apps/human-app/frontend/src/api/authorized-http-api-client.ts @@ -6,7 +6,7 @@ import { } from './http-api-client'; import { AuthService, type AuthProvider } from './auth-service'; -export class AuthorizedHttpApiClient extends HttpApiClient { +class AuthorizedHttpApiClient extends HttpApiClient { constructor( baseUrl: string, private readonly authProvider: AuthProvider diff --git a/packages/apps/human-app/frontend/src/assets/background-images/signin-background-mobile.png b/packages/apps/human-app/frontend/src/assets/background-images/signin-background-mobile.png deleted file mode 100644 index 6fff015e74..0000000000 Binary files a/packages/apps/human-app/frontend/src/assets/background-images/signin-background-mobile.png and /dev/null differ diff --git a/packages/apps/human-app/frontend/src/assets/background-images/signup-background-mobile.png b/packages/apps/human-app/frontend/src/assets/background-images/signup-background-mobile.png deleted file mode 100644 index 3400ddfe29..0000000000 Binary files a/packages/apps/human-app/frontend/src/assets/background-images/signup-background-mobile.png and /dev/null differ diff --git a/packages/apps/human-app/frontend/src/modules/auth/context/auth-context.tsx b/packages/apps/human-app/frontend/src/modules/auth/context/auth-context.tsx index 41df7be2d3..0cb61239d2 100644 --- a/packages/apps/human-app/frontend/src/modules/auth/context/auth-context.tsx +++ b/packages/apps/human-app/frontend/src/modules/auth/context/auth-context.tsx @@ -1,6 +1,7 @@ import { z } from 'zod'; + import { createAuthProvider } from '@/shared/contexts/generic-auth-context'; -import { KycStatus } from '@/modules/worker/profile/types'; +import { KycStatus } from '@/shared/types/entity.type'; const userDataSchema = z.object({ site_key: z.string().optional().nullable(), diff --git a/packages/apps/human-app/frontend/src/modules/governance-banner/components/governance-banner.tsx b/packages/apps/human-app/frontend/src/modules/governance-banner/components/governance-banner.tsx index 6128ff6366..42df0df4fb 100644 --- a/packages/apps/human-app/frontend/src/modules/governance-banner/components/governance-banner.tsx +++ b/packages/apps/human-app/frontend/src/modules/governance-banner/components/governance-banner.tsx @@ -1,9 +1,9 @@ -import AccessTimeIcon from '@mui/icons-material/AccessTime'; -import { Box, Grid, Link as MuiLink, Typography } from '@mui/material'; import { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; +import AccessTimeIcon from '@mui/icons-material/AccessTime'; +import { Box, Grid, Link as MuiLink, Typography } from '@mui/material'; + import { env } from '@/shared/env'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { useProposalQuery } from '../hooks/use-proposal-query'; import { formatCountdown } from '../../../shared/utils/time'; import { type ProposalResponse } from '../services/governance.service'; @@ -20,8 +20,6 @@ function getProposalStatus(proposal: ProposalResponse): ProposalStatus { export function GovernanceBanner() { const { t } = useTranslation(); const { data: proposal, isLoading, isError } = useProposalQuery(); - const { colorPalette } = useColorMode(); - const { text, background } = colorPalette.banner; const [timeRemaining, setTimeRemaining] = useState('00:00:00'); useEffect(() => { @@ -55,8 +53,8 @@ export function GovernanceBanner() { sx={{ alignItems: { xs: 'flex-start', sm: 'center' }, justifyContent: { xs: 'flex-start', sm: 'space-between' }, - bgcolor: background.primary, - color: text.secondary, + bgcolor: 'primary.main', + color: 'common.white', borderRadius: '8px', p: 2, gap: 2, @@ -75,13 +73,13 @@ export function GovernanceBanner() { > - + {status === 'pending' ? t('governance.timeToStart', 'Voting starts in') : t('governance.timeToReveal', 'Time to reveal vote')} : - + {timeRemaining} @@ -90,8 +88,8 @@ export function GovernanceBanner() { variant="body1" sx={{ ml: { xs: 0, md: 8 }, - color: text.primary, - bgcolor: background.secondary, + color: 'text.primary', + bgcolor: 'background.paper', borderRadius: '8px', p: '4px 8px', }} @@ -113,9 +111,9 @@ export function GovernanceBanner() { href={env.VITE_GOVERNANCE_URL} target="_blank" rel="noopener noreferrer" + variant="body1" sx={{ - color: text.secondary, - fontWeight: 500, + color: 'common.white', textDecoration: 'none', '&:hover': { textDecoration: 'underline', diff --git a/packages/apps/human-app/frontend/src/modules/homepage/components/logo-section.tsx b/packages/apps/human-app/frontend/src/modules/homepage/components/logo-section.tsx index 0c7089ebba..efe5f8e5f8 100644 --- a/packages/apps/human-app/frontend/src/modules/homepage/components/logo-section.tsx +++ b/packages/apps/human-app/frontend/src/modules/homepage/components/logo-section.tsx @@ -1,43 +1,40 @@ -import { Grid, Stack, Typography } from '@mui/material'; +import { Stack, Typography } from '@mui/material'; import { useTranslation } from 'react-i18next'; export function LogoSection() { const { t } = useTranslation(); - const logoText: string = t('homepage.humanApp'); - const logoTextSplit: string[] = logoText.split(' '); + + const logoText = t('homepage.humanApp'); + const logoTextSplit = logoText.split(' '); return ( - - {logoTextSplit[0]} - - {logoTextSplit[1]} + + {logoTextSplit[0]} + + {logoTextSplit[1]} + - + {t('homepage.completeJobs')} - + ); } diff --git a/packages/apps/human-app/frontend/src/modules/homepage/components/sign-in-section.tsx b/packages/apps/human-app/frontend/src/modules/homepage/components/sign-in-section.tsx index 09b30c6cbb..dc39b438bb 100644 --- a/packages/apps/human-app/frontend/src/modules/homepage/components/sign-in-section.tsx +++ b/packages/apps/human-app/frontend/src/modules/homepage/components/sign-in-section.tsx @@ -1,27 +1,27 @@ -import { Paper, Button } from '@mui/material'; import { Link } from 'react-router-dom'; import { useTranslation } from 'react-i18next'; -import { useColorMode } from '@/shared/contexts/color-mode'; +import { Paper, Button, Typography } from '@mui/material'; + import { routerPaths } from '@/router/router-paths'; export function SignInSection() { - const { colorPalette } = useColorMode(); const { t } = useTranslation(); return ( - + */} + + {t('homepage.signUpClosed')} + ); } diff --git a/packages/apps/human-app/frontend/src/modules/homepage/views/home.page.tsx b/packages/apps/human-app/frontend/src/modules/homepage/views/home.page.tsx index c85d49d090..2127687527 100644 --- a/packages/apps/human-app/frontend/src/modules/homepage/views/home.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/homepage/views/home.page.tsx @@ -1,14 +1,14 @@ import { Box, Container, Grid, Paper } from '@mui/material'; import { Navigate } from 'react-router-dom'; -import { routerPaths } from '@/router/router-paths'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { LogoSection } from '../components/logo-section'; import { SignInSection } from '../components/sign-in-section'; +import { routerPaths } from '@/router/router-paths'; +import { useColorMode } from '@/shared/contexts/color-mode'; import { useIsUserVerified } from '@/shared/hooks'; export function HomePage() { - const { colorPalette } = useColorMode(); + const { isDarkMode } = useColorMode(); const isUserVerified = useIsUserVerified(); if (isUserVerified) { @@ -22,7 +22,7 @@ export function HomePage() { sx={{ position: 'relative', mx: { xs: 0, md: 4 }, - bgcolor: colorPalette.backgroundColor, + bgcolor: isDarkMode ? 'background.default' : 'common.white', }} > @@ -31,7 +31,10 @@ export function HomePage() { spacing={{ xs: 0, lg: 10 }} sx={{ width: '100%', alignItems: 'center', pb: { xs: 5, lg: 0 } }} > - + diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/sign-in-form.tsx b/packages/apps/human-app/frontend/src/modules/signin/components/sign-in-form.tsx similarity index 63% rename from packages/apps/human-app/frontend/src/modules/signin/worker/sign-in-form.tsx rename to packages/apps/human-app/frontend/src/modules/signin/components/sign-in-form.tsx index 181d9e9192..3f6621465f 100644 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/sign-in-form.tsx +++ b/packages/apps/human-app/frontend/src/modules/signin/components/sign-in-form.tsx @@ -1,6 +1,6 @@ import { type SubmitEvent } from 'react'; import { FormProvider, useForm } from 'react-hook-form'; -import { Box, Divider, Grid, Link as MuiLink, Typography } from '@mui/material'; +import { Box, Grid, Link as MuiLink } from '@mui/material'; import { zodResolver } from '@hookform/resolvers/zod'; import { useTranslation } from 'react-i18next'; import { Link } from 'react-router-dom'; @@ -8,12 +8,10 @@ import { Link } from 'react-router-dom'; import { Input } from '@/shared/components/data-entry/input'; import { Button } from '@/shared/components/ui/button'; import { Password } from '@/shared/components/data-entry/password'; -import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; import { useResetMutationErrors } from '@/shared/hooks/use-reset-mutation-errors'; import { HCaptchaForm } from '@/shared/components/hcaptcha'; import { routerPaths } from '@/router/router-paths'; - -import { type SignInDto, signInDtoSchema } from './schemas'; +import { type SignInDto, signInDtoSchema } from '../schemas'; interface SignInFormProps { onSubmit: (data: SignInDto) => void; @@ -29,7 +27,6 @@ export function SignInForm({ resetMutation, }: SignInFormProps) { const { t } = useTranslation(); - const { colorPalette } = useColorMode(); const methods = useForm({ defaultValues: { @@ -50,30 +47,23 @@ export function SignInForm({
- + - {t('worker.signInForm.forgotPassword')} + {t('signInForm.forgotPassword')} @@ -84,25 +74,22 @@ export function SignInForm({ fullWidth loading={isLoading} > - {t('worker.signInForm.submitBtn')} + {t('signInForm.submitBtn')} - - + {/* + - {t('worker.signInForm.or')} + {t('signInForm.or')} - - {t('worker.signInForm.dontHaveAccount')} + + {t('signInForm.dontHaveAccount')} {' '} - {t('worker.signInForm.signUp')} + {t('signInForm.signUp')} - + */}
diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in-mutation.ts b/packages/apps/human-app/frontend/src/modules/signin/hooks/use-sign-in-mutation.ts similarity index 92% rename from packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in-mutation.ts rename to packages/apps/human-app/frontend/src/modules/signin/hooks/use-sign-in-mutation.ts index cf75008640..ee2ea03125 100644 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in-mutation.ts +++ b/packages/apps/human-app/frontend/src/modules/signin/hooks/use-sign-in-mutation.ts @@ -2,7 +2,7 @@ import { useMutation } from '@tanstack/react-query'; import { env } from '@/shared/env'; import { AuthService, HttpApiClient } from '@/api'; import { useAuth } from '@/modules/auth/hooks/use-auth'; -import { type SignInDto } from './schemas'; +import { type SignInDto } from '../schemas'; function signInMutationFn(data: SignInDto) { const httpClient = new HttpApiClient(env.VITE_API_URL); diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in.tsx b/packages/apps/human-app/frontend/src/modules/signin/hooks/use-sign-in.tsx similarity index 94% rename from packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in.tsx rename to packages/apps/human-app/frontend/src/modules/signin/hooks/use-sign-in.tsx index 477abd65c1..16698fbed9 100644 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/use-sign-in.tsx +++ b/packages/apps/human-app/frontend/src/modules/signin/hooks/use-sign-in.tsx @@ -1,7 +1,8 @@ import { useEffect } from 'react'; + import { browserAuthProvider } from '@/shared/contexts/browser-auth-provider'; import { useSignInMutation } from './use-sign-in-mutation'; -import { type SignInDto } from './schemas'; +import { type SignInDto } from '../schemas'; export function useSignIn() { const { diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/schemas.ts b/packages/apps/human-app/frontend/src/modules/signin/schemas.ts similarity index 100% rename from packages/apps/human-app/frontend/src/modules/signin/worker/schemas.ts rename to packages/apps/human-app/frontend/src/modules/signin/schemas.ts diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/sign-in.page.tsx b/packages/apps/human-app/frontend/src/modules/signin/sign-in.page.tsx similarity index 79% rename from packages/apps/human-app/frontend/src/modules/signin/worker/sign-in.page.tsx rename to packages/apps/human-app/frontend/src/modules/signin/sign-in.page.tsx index ea0b529ba9..179db6ec7e 100644 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/sign-in.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/signin/sign-in.page.tsx @@ -1,29 +1,29 @@ import { useEffect } from 'react'; import { t } from 'i18next'; import { useNavigate } from 'react-router-dom'; -import { Box, Grid, Paper, Typography } from '@mui/material'; +import { Box, Grid, Typography } from '@mui/material'; + import { getErrorMessageForError } from '@/shared/errors'; import { ApiClientError } from '@/api'; -import { useSignIn } from './use-sign-in'; -import { SignInForm } from './sign-in-form'; - +import { useSignIn } from './hooks/use-sign-in'; +import { SignInForm } from './components/sign-in-form'; import signInImage from '@/assets/background-images/signin-background.png'; import { TopNotificationType, useNotification, } from '@/shared/hooks/use-notification'; import { BackButton } from '@/shared/components/ui/page-card/back-button'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { useAuth } from '@/modules/auth/hooks/use-auth'; import { routerPaths } from '@/router/router-paths'; import { useIsUserVerified } from '@/shared/hooks'; import { browserAuthProvider } from '@/shared/contexts/browser-auth-provider'; +import { PageCard } from '@/shared/components/ui/page-card'; function formattedSignInErrorMessage( unknownError: unknown ): string | undefined { if (unknownError instanceof ApiClientError && unknownError.status === 401) { - return t('worker.signInForm.errors.invalidCredentials'); + return t('signInForm.errors.invalidCredentials'); } } @@ -31,7 +31,6 @@ export function SignInPage() { const { showNotification } = useNotification(); const navigate = useNavigate(); const { user, status, signOut } = useAuth(); - const { colorPalette } = useColorMode(); const isUserVerified = useIsUserVerified(); const { signIn, error, isError, isLoading, reset } = useSignIn(); @@ -79,25 +78,10 @@ export function SignInPage() { }; return ( - - {t('worker.signInForm.title')} + {t('signInForm.title')} - + ); } diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/index.ts b/packages/apps/human-app/frontend/src/modules/signin/worker/index.ts deleted file mode 100644 index 33eedcbea5..0000000000 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './sign-in.page'; -export * from './verify-user.page'; diff --git a/packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-mutation.ts b/packages/apps/human-app/frontend/src/modules/signup/hooks/use-sign-up-mutation.ts similarity index 100% rename from packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-mutation.ts rename to packages/apps/human-app/frontend/src/modules/signup/hooks/use-sign-up-mutation.ts diff --git a/packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-worker.tsx b/packages/apps/human-app/frontend/src/modules/signup/hooks/use-sign-up-worker.tsx similarity index 100% rename from packages/apps/human-app/frontend/src/modules/signup/worker/hooks/use-sign-up-worker.tsx rename to packages/apps/human-app/frontend/src/modules/signup/hooks/use-sign-up-worker.tsx diff --git a/packages/apps/human-app/frontend/src/modules/signup/worker/schema.ts b/packages/apps/human-app/frontend/src/modules/signup/schema.ts similarity index 100% rename from packages/apps/human-app/frontend/src/modules/signup/worker/schema.ts rename to packages/apps/human-app/frontend/src/modules/signup/schema.ts diff --git a/packages/apps/human-app/frontend/src/modules/signup/services/signup.service.ts b/packages/apps/human-app/frontend/src/modules/signup/services/signup.service.ts index f410015543..8910e4afb4 100644 --- a/packages/apps/human-app/frontend/src/modules/signup/services/signup.service.ts +++ b/packages/apps/human-app/frontend/src/modules/signup/services/signup.service.ts @@ -1,5 +1,5 @@ import { ApiClientError, humanAppApiClient } from '@/api'; -import { type SignUpDto } from '../worker/schema'; +import { type SignUpDto } from '../schema'; const signUpPath = '/auth/signup'; diff --git a/packages/apps/human-app/frontend/src/modules/signup/worker/views/sign-up-worker.page.tsx b/packages/apps/human-app/frontend/src/modules/signup/sign-up.page.tsx similarity index 69% rename from packages/apps/human-app/frontend/src/modules/signup/worker/views/sign-up-worker.page.tsx rename to packages/apps/human-app/frontend/src/modules/signup/sign-up.page.tsx index bb8dd28edd..3d4e73c02a 100644 --- a/packages/apps/human-app/frontend/src/modules/signup/worker/views/sign-up-worker.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/signup/sign-up.page.tsx @@ -1,10 +1,11 @@ -import { useEffect } from 'react'; +import { useEffect, type SubmitEvent } from 'react'; import { FormProvider, useForm } from 'react-hook-form'; import { Link as RouterLink, useNavigate } from 'react-router-dom'; import { zodResolver } from '@hookform/resolvers/zod'; -import { Box, Divider, Grid, Link, Paper, Typography } from '@mui/material'; +import { Box, Divider, Grid, Link, Typography } from '@mui/material'; import { Trans } from 'react-i18next'; import { t } from 'i18next'; + import { Button } from '@/shared/components/ui/button'; import { Input } from '@/shared/components/data-entry/input'; import { Password } from '@/shared/components/data-entry/password'; @@ -12,30 +13,32 @@ import { env } from '@/shared/env'; import { getErrorMessageForError } from '@/shared/errors'; import { HCaptchaForm } from '@/shared/components/hcaptcha'; import { useResetMutationErrors } from '@/shared/hooks/use-reset-mutation-errors'; -import { useSignUpWorker } from '@/modules/signup/worker/hooks/use-sign-up-worker'; +import { useSignUpWorker } from './hooks/use-sign-up-worker'; import { ApiClientError } from '@/api'; -import { signUpDtoSchema } from '../schema'; +import { signUpDtoSchema } from './schema'; import signUpImage from '@/assets/background-images/signup-background.png'; import { BackButton } from '@/shared/components/ui/page-card/back-button'; - import { routerPaths } from '@/router/router-paths'; import { TopNotificationType, useNotification, } from '@/shared/hooks/use-notification'; +import { PageCard } from '@/shared/components/ui/page-card'; import { useColorMode } from '@/shared/contexts/color-mode'; function handleSignupError(unknownError: unknown) { if (unknownError instanceof ApiClientError && unknownError.status === 409) { - return t('worker.signUpForm.errors.emailTaken'); + return t('signUpForm.errors.emailTaken'); } } export function SignUpPage() { const { showNotification } = useNotification(); const navigate = useNavigate(); - const { colorPalette } = useColorMode(); + const { isDarkMode } = useColorMode(); + const { signUp, error, isError, isLoading, reset } = useSignUpWorker(); + const methods = useForm({ defaultValues: { email: '', @@ -62,29 +65,12 @@ export function SignUpPage() { navigate(-1); }; - const handleSubmit = (event: React.FormEvent) => { + const handleSubmit = (event: SubmitEvent) => { void methods.handleSubmit(signUp)(event); }; return ( - + - {t('worker.signUpForm.title')} + {t('signUpForm.title')}
- + ), 2: ( ), }} - i18nKey="worker.signUpForm.termsOfServiceAndPrivacyPolicy" + i18nKey="signUpForm.termsOfServiceAndPrivacyPolicy" /> @@ -173,25 +158,22 @@ export function SignUpPage() { fullWidth loading={isLoading} > - {t('worker.signUpForm.submitBtn')} + {t('signUpForm.submitBtn')} - + - {t('worker.signUpForm.or')} + {t('signUpForm.or')} - {t('worker.signUpForm.alreadyHaveAccount')} + {t('signUpForm.alreadyHaveAccount')} {' '} - {t('worker.signUpForm.signIn')} + {t('signUpForm.signIn')} @@ -251,6 +226,6 @@ export function SignUpPage() { /> - + ); } diff --git a/packages/apps/human-app/frontend/src/modules/signup/worker/index.ts b/packages/apps/human-app/frontend/src/modules/signup/worker/index.ts deleted file mode 100644 index 3c0e3dddf5..0000000000 --- a/packages/apps/human-app/frontend/src/modules/signup/worker/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './views/sign-up-worker.page'; diff --git a/packages/apps/human-app/frontend/src/modules/smart-contracts/chains.ts b/packages/apps/human-app/frontend/src/modules/smart-contracts/chains.ts index 7666fcd23d..8f79e50d7e 100644 --- a/packages/apps/human-app/frontend/src/modules/smart-contracts/chains.ts +++ b/packages/apps/human-app/frontend/src/modules/smart-contracts/chains.ts @@ -5,14 +5,13 @@ // function import { ChainId } from '@human-protocol/sdk/src/enums'; import { NETWORKS } from '@human-protocol/sdk/src/constants'; -import { env } from '@/shared/env'; import { MainnetContracts, TestnetContracts, type ContractsAddresses, } from '@/modules/smart-contracts/contracts'; -export interface Chain { +interface Chain { explorerUrl: string; name: string; chainId: number; @@ -23,22 +22,22 @@ export type ChainWithAddresses = Chain & { addresses: ContractsAddresses; }; -export const TestnetChainsIds = [ +const TestnetChainsIds = [ ChainId.POLYGON_AMOY, ChainId.SEPOLIA, ChainId.BSC_TESTNET, ChainId.LOCALHOST, ] as const; -export const MainnetChainsIds = [ +const MainnetChainsIds = [ ChainId.POLYGON, ChainId.MAINNET, ChainId.BSC_MAINNET, ChainId.ALL, ] as const; -export type TestnetNarrow = Exclude; -export type MainnetNarrow = Exclude; +type TestnetNarrow = Exclude; +type MainnetNarrow = Exclude; export const TestnetChains: readonly ChainWithAddresses[] = [ { @@ -87,28 +86,3 @@ function getChainConfigsForChainIds( } return result; } - -const handleFilterChains = ( - chainsArr: ChainWithAddresses[], - chainIdsEnabled: number[] -) => { - return chainsArr.filter((chain) => - chainIdsEnabled.some((el) => el === chain.chainId) - ); -}; - -export const getTestnetChainsEnabled = (chainIdsEnabled: number[]) => { - return handleFilterChains(AllTestnetsChains, chainIdsEnabled); -}; - -export const getMainnetChainsEnabled = (chainIdsEnabled: number[]) => { - return handleFilterChains(AllMainnetChains, chainIdsEnabled); -}; - -export const getEnabledChainsByUiConfig = ( - chainIdsEnabled: number[] -): Chain[] => - (env.VITE_NETWORK === 'mainnet' - ? getMainnetChainsEnabled(chainIdsEnabled) - : getTestnetChainsEnabled(chainIdsEnabled) - ).map(({ addresses: _, ...chainData }) => chainData); diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/components/identity-verification-control.tsx b/packages/apps/human-app/frontend/src/modules/verify-user/components/identity-verification-control.tsx similarity index 76% rename from packages/apps/human-app/frontend/src/modules/worker/profile/components/identity-verification-control.tsx rename to packages/apps/human-app/frontend/src/modules/verify-user/components/identity-verification-control.tsx index cbbb106d4c..6558d1eafb 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/components/identity-verification-control.tsx +++ b/packages/apps/human-app/frontend/src/modules/verify-user/components/identity-verification-control.tsx @@ -3,9 +3,8 @@ import { useTranslation, Trans } from 'react-i18next'; import { Box, keyframes, Link, Stack, Typography } from '@mui/material'; import { jwtDecode } from 'jwt-decode'; -import { useStartIdv } from '../hooks'; -import { KycStatus } from '../types'; -import { useColorMode } from '@/shared/contexts/color-mode'; +import { useStartIdv } from '../hooks/use-start-idv'; +import { KycStatus } from '@/shared/types/entity.type'; import { env } from '@/shared/env'; import { HourglassIcon, VeriffIcon } from '@/shared/components/ui/icons'; import { Button } from '@/shared/components/ui/button'; @@ -13,6 +12,7 @@ import { useAccessTokenRefresh } from '@/api/hooks/use-access-token-refresh'; import { browserAuthProvider } from '@/shared/contexts/browser-auth-provider'; import { UserData } from '@/modules/auth/context/auth-context'; import { useAuth } from '@/modules/auth/hooks/use-auth'; +import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; const hourglassSpin = keyframes` 0% { @@ -29,8 +29,7 @@ const hourglassSpin = keyframes` } `; -// TODO: Extend to 30 seconds -const CHECK_STATUS_COOLDOWN_TIME = 10000; +const CHECK_STATUS_COOLDOWN_TIME = 30000; export function IdentityVerificationControl({ kycStatus, @@ -45,6 +44,8 @@ export function IdentityVerificationControl({ const cooldownTimerRef = useRef(null); const { t } = useTranslation(); + const { isDarkMode } = useColorMode(); + const { isIdvAlreadyInProgress, idvStarted, idvStartIsPending, startIdv } = useStartIdv(); const { @@ -52,7 +53,6 @@ export function IdentityVerificationControl({ isPending: isRefreshingAccessToken, } = useAccessTokenRefresh(); const { updateUserData } = useAuth(); - const { colorPalette } = useColorMode(); const handleCheckVerificationStatus = useCallback(async () => { if (isRefreshingAccessToken || isCheckStatusCoolingDown) { @@ -107,13 +107,13 @@ export function IdentityVerificationControl({ return ( , }} - i18nKey="worker.profile.verificationDeclined" + i18nKey="verifyUser.verificationDeclined" /> ); @@ -131,24 +131,20 @@ export function IdentityVerificationControl({ p: 2.5, borderRadius: '10px', border: '1px solid', - borderColor: colorPalette.border.main, + borderColor: 'border.main', }} > - - {t('worker.profile.verificationOpenedInNewTab')} + + {t('verifyUser.verificationOpenedInNewTab')} - {t('worker.profile.completeYourVerification')} + {t('verifyUser.completeYourVerification')} - {t('worker.profile.waitingForVerification')} + {t('verifyUser.waitingForVerification')} @@ -180,7 +175,7 @@ export function IdentityVerificationControl({ loading={isRefreshingAccessToken} onClick={handleCheckVerificationStatus} > - {t('worker.profile.checkVerificationStatus')} + {t('verifyUser.checkVerificationStatus')} @@ -190,10 +185,10 @@ export function IdentityVerificationControl({ return ( - {t('worker.profile.veriffCopy')} + {t('verifyUser.veriffCopy')} - {t('worker.profile.poweredBy')} + {t('verifyUser.poweredBy')} @@ -224,7 +214,7 @@ export function IdentityVerificationControl({ loading={idvStartIsPending} onClick={startIdv} > - {t('worker.profile.completeIdentityVerification')} + {t('verifyUser.completeIdentityVerification')} ); diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/components/buttons/register-address-btn.tsx b/packages/apps/human-app/frontend/src/modules/verify-user/components/register-address-btn.tsx similarity index 66% rename from packages/apps/human-app/frontend/src/modules/worker/profile/components/buttons/register-address-btn.tsx rename to packages/apps/human-app/frontend/src/modules/verify-user/components/register-address-btn.tsx index 21973a3fd7..2479ece814 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/components/buttons/register-address-btn.tsx +++ b/packages/apps/human-app/frontend/src/modules/verify-user/components/register-address-btn.tsx @@ -1,7 +1,8 @@ import { t } from 'i18next'; + import { Button } from '@/shared/components/ui/button'; -import { useRegisterAddress } from '@/modules/worker/hooks/use-register-address'; -import { useRegisterAddressNotifications } from '@/modules/worker/hooks/use-register-address-notifications'; +import { useRegisterAddress } from '../hooks/use-register-address'; +import { useRegisterAddressNotifications } from '../hooks/use-register-address-notifications'; export function RegisterAddressBtn() { const { onSuccess, onError } = useRegisterAddressNotifications(); @@ -18,7 +19,7 @@ export function RegisterAddressBtn() { loading={isPending} onClick={mutate.bind(undefined, undefined)} > - {t('worker.profile.registerAddress')} + {t('verifyUser.registerAddress')} ); } diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/verification-flow.tsx b/packages/apps/human-app/frontend/src/modules/verify-user/components/verification-flow.tsx similarity index 64% rename from packages/apps/human-app/frontend/src/modules/signin/worker/verification-flow.tsx rename to packages/apps/human-app/frontend/src/modules/verify-user/components/verification-flow.tsx index 64a4034535..29fc8b94ce 100644 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/verification-flow.tsx +++ b/packages/apps/human-app/frontend/src/modules/verify-user/components/verification-flow.tsx @@ -1,14 +1,10 @@ import { useCallback, useState } from 'react'; -import { Box, Stack, Typography } from '@mui/material'; +import { Box, Chip, Stack, Typography } from '@mui/material'; import { t } from 'i18next'; -import { Chip } from '@/shared/components/ui/chip'; -import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; -import { - IdentityVerificationControl, - WalletConnectionControl, -} from '@/modules/worker/profile/components'; -import { KycStatus } from '@/modules/worker/profile/types/profile-types'; +import { IdentityVerificationControl } from './identity-verification-control'; +import { WalletConnectionControl } from './wallet-connection-control'; +import { KycStatus } from '@/shared/types/entity.type'; import { useIsMobile } from '@/shared/hooks'; import { useAuth } from '@/modules/auth/hooks/use-auth'; @@ -35,14 +31,11 @@ export function VerificationFlow({ ); const { user } = useAuth(); - const { colorPalette } = useColorMode(); const isMobile = useIsMobile(); const kycStatus = user?.kyc_status as KycStatus; - const label = kycStatus - ? t(`worker.profile.idvStatusValues.${kycStatus}`) - : ''; + const label = kycStatus ? t(`verifyUser.idvStatusValues.${kycStatus}`) : ''; const isKycDeclined = kycStatus === KycStatus.DECLINED; const isKycStarted = kycStatus !== KycStatus.NONE; @@ -54,9 +47,9 @@ export function VerificationFlow({ - {t('worker.profile.beforeWeGetStarted')} + {t('verifyUser.beforeWeGetStarted')} @@ -86,19 +76,25 @@ export function VerificationFlow({ <> - {t('worker.profile.identityVerification')} + {t('verifyUser.identityVerification')} {isKycStarted && label && ( - + )} - {t('worker.profile.connectYourWallet')} + {t('verifyUser.connectYourWallet')} diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/components/wallet-connection-control.tsx b/packages/apps/human-app/frontend/src/modules/verify-user/components/wallet-connection-control.tsx similarity index 70% rename from packages/apps/human-app/frontend/src/modules/worker/profile/components/wallet-connection-control.tsx rename to packages/apps/human-app/frontend/src/modules/verify-user/components/wallet-connection-control.tsx index 5f8cabf303..7affcb96d1 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/components/wallet-connection-control.tsx +++ b/packages/apps/human-app/frontend/src/modules/verify-user/components/wallet-connection-control.tsx @@ -1,16 +1,15 @@ import { useTranslation } from 'react-i18next'; import { Stack, Typography } from '@mui/material'; + +import { RegisterAddressBtn } from './register-address-btn'; import { Button } from '@/shared/components/ui/button'; import { useWalletConnect } from '@/shared/contexts/wallet-connect'; -import { RegisterAddressBtn } from './buttons/register-address-btn'; import { useAuth } from '@/modules/auth/hooks/use-auth'; -import { useColorMode } from '@/shared/contexts/color-mode'; export function WalletConnectionControl() { const { t } = useTranslation(); const { user } = useAuth(); const { isConnected, openModal } = useWalletConnect(); - const { colorPalette } = useColorMode(); const hasWalletAddress = !!user?.wallet_address; @@ -18,8 +17,8 @@ export function WalletConnectionControl() { return ( - - {t('worker.profile.walletAddressMessage')} + + {t('verifyUser.walletAddressMessage')} ); @@ -32,7 +31,7 @@ export function WalletConnectionControl() { fullWidth onClick={() => void openModal()} > - {t('components.wallet.connectBtn.connect')} + {t('verifyUser.connectWallet')} ); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address-notifications.tsx b/packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-register-address-notifications.tsx similarity index 92% rename from packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address-notifications.tsx rename to packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-register-address-notifications.tsx index 506e6e87c0..e1ba19f51a 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address-notifications.tsx +++ b/packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-register-address-notifications.tsx @@ -12,7 +12,7 @@ export function useRegisterAddressNotifications() { const onSuccess = () => { showNotification({ type: TopNotificationType.SUCCESS, - message: t('worker.registerAddress.success'), + message: t('verifyUser.registerAddressSuccess'), }); }; const onError = (error: ResponseError) => { diff --git a/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address.ts b/packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-register-address.ts similarity index 93% rename from packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address.ts rename to packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-register-address.ts index bd1b5f8d5e..569d4295b6 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/hooks/use-register-address.ts +++ b/packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-register-address.ts @@ -1,11 +1,12 @@ import { useMutation } from '@tanstack/react-query'; import { t } from 'i18next'; + import { useAccessTokenRefresh } from '@/api/hooks/use-access-token-refresh'; import type { ResponseError } from '@/shared/types/global.type'; import { useWalletConnect } from '@/shared/contexts/wallet-connect'; import { usePrepareSignature } from '@/shared/hooks'; import { PrepareSignatureType } from '@/shared/services/signature.service'; -import * as profileService from '../profile/services/profile.service'; +import * as verifyUserService from '../services/verify-user.service'; import { useAuth } from '@/modules/auth/hooks/use-auth'; interface RegisterAddressCallbacks { @@ -36,7 +37,7 @@ function useRegisterAddressMutation(callbacks: RegisterAddressCallbacks) { // wallet address is part of the JWT payload // so we need to refresh the token after the address is registered - await profileService.registerAddress({ address, chainId, signature }); + await verifyUserService.registerAddress({ address, chainId, signature }); await refreshAccessTokenAsync({}); updateUserData({ wallet_address: address, diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv-mutation.ts b/packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-start-idv-mutation.ts similarity index 66% rename from packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv-mutation.ts rename to packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-start-idv-mutation.ts index c64cb15770..433d2596b0 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv-mutation.ts +++ b/packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-start-idv-mutation.ts @@ -1,12 +1,13 @@ import { useMutation } from '@tanstack/react-query'; -import * as profileService from '../services/profile.service'; + +import * as verifyUserService from '../services/verify-user.service'; import { useAuth } from '@/modules/auth/hooks/use-auth'; export function useIdvStartMutation() { const { user } = useAuth(); return useMutation({ - mutationFn: async () => profileService.startIdv(), + mutationFn: async () => verifyUserService.startIdv(), mutationKey: ['idvStart', user?.email], }); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv.ts b/packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-start-idv.ts similarity index 100% rename from packages/apps/human-app/frontend/src/modules/worker/profile/hooks/use-start-idv.ts rename to packages/apps/human-app/frontend/src/modules/verify-user/hooks/use-start-idv.ts diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/services/profile.service.ts b/packages/apps/human-app/frontend/src/modules/verify-user/services/verify-user.service.ts similarity index 100% rename from packages/apps/human-app/frontend/src/modules/worker/profile/services/profile.service.ts rename to packages/apps/human-app/frontend/src/modules/verify-user/services/verify-user.service.ts diff --git a/packages/apps/human-app/frontend/src/modules/signin/worker/verify-user.page.tsx b/packages/apps/human-app/frontend/src/modules/verify-user/verify-user.page.tsx similarity index 68% rename from packages/apps/human-app/frontend/src/modules/signin/worker/verify-user.page.tsx rename to packages/apps/human-app/frontend/src/modules/verify-user/verify-user.page.tsx index 3b293077d4..debb6a8b5c 100644 --- a/packages/apps/human-app/frontend/src/modules/signin/worker/verify-user.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/verify-user/verify-user.page.tsx @@ -1,19 +1,18 @@ import { useEffect } from 'react'; import { Navigate, useNavigate } from 'react-router-dom'; -import { Paper, Stack } from '@mui/material'; +import { Stack } from '@mui/material'; +import { VerificationFlow } from './components/verification-flow'; import { useAuth } from '@/modules/auth/hooks/use-auth'; -import { KycStatus } from '@/modules/worker/profile/types'; import { routerPaths } from '@/router/router-paths'; +import { KycStatus } from '@/shared/types/entity.type'; import { useIsUserVerified } from '@/shared/hooks'; -import { useColorMode } from '@/shared/contexts/color-mode'; -import { VerificationFlow } from './verification-flow'; import { Loader } from '@/shared/components/ui/loader'; +import { PageCard } from '@/shared/components/ui/page-card'; export function VerifyUserPage() { const navigate = useNavigate(); const { user, status } = useAuth(); - const { colorPalette } = useColorMode(); const isUserVerified = useIsUserVerified(); const isEmailVerificationPending = @@ -45,28 +44,13 @@ export function VerifyUserPage() { } return ( - {isLoading ? ( @@ -84,6 +68,6 @@ export function VerifyUserPage() { isKycApproved={user?.kyc_status === KycStatus.APPROVED} /> )} - + ); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-form-container.tsx b/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-form-container.tsx index eea5be3c4b..24dcda7b19 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-form-container.tsx +++ b/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-form-container.tsx @@ -2,30 +2,30 @@ import { useEffect } from 'react'; import { Trans, useTranslation } from 'react-i18next'; import { useNavigate } from 'react-router-dom'; import { FormProvider } from 'react-hook-form'; -import { Box, Paper, Stack, Typography } from '@mui/material'; +import { Box, Stack, Typography } from '@mui/material'; -import { PageCardLoader } from '@/shared/components/ui/page-card'; +import { PageCard, PageCardLoader } from '@/shared/components/ui/page-card'; import { getErrorMessageForError } from '@/shared/errors'; import { TopNotificationType, useNotification, } from '@/shared/hooks/use-notification'; import { useResendEmailRouterParams, useResendEmail } from '../hooks'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { useAuth } from '@/modules/auth/hooks/use-auth'; import { routerPaths } from '@/router/router-paths'; import { InboxIcon } from '@/shared/components/ui/icons'; import { Button } from '@/shared/components/ui/button'; import { HCaptchaForm } from '@/shared/components/hcaptcha/h-captcha-form'; +import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; export function EmailVerificationFormContainer() { const { email } = useResendEmailRouterParams() ?? {}; const { methods, handleResend, isError, error, isSuccess } = useResendEmail(); const { showNotification } = useNotification(); const { t } = useTranslation(); - const { colorPalette } = useColorMode(); const { user, signOut } = useAuth(); const navigate = useNavigate(); + const { isDarkMode } = useColorMode(); useEffect(() => { if (isError) { @@ -55,27 +55,10 @@ export function EmailVerificationFormContainer() { } return ( - @@ -85,30 +68,26 @@ export function EmailVerificationFormContainer() { }} > - + {t('worker.verifyEmail.checkYourInbox')} - + ), }} @@ -119,11 +98,9 @@ export function EmailVerificationFormContainer() { {t('worker.verifyEmail.paragraph2')} @@ -137,7 +114,7 @@ export function EmailVerificationFormContainer() { }} > {!!user && ( @@ -151,6 +128,6 @@ export function EmailVerificationFormContainer() { - +
); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-success-message.tsx b/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-success-message.tsx index ccd9ec3eff..6609035a9c 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-success-message.tsx +++ b/packages/apps/human-app/frontend/src/modules/worker/email-verification/components/email-verification-success-message.tsx @@ -1,45 +1,23 @@ import { t } from 'i18next'; import { Link } from 'react-router-dom'; -import { Paper, Stack, Typography } from '@mui/material'; +import { Stack, Typography } from '@mui/material'; import { Button } from '@/shared/components/ui/button'; import { SuccessIcon } from '@/shared/components/ui/icons'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { routerPaths } from '@/router/router-paths'; +import { PageCard } from '@/shared/components/ui/page-card'; export function EmailVerificationSuccessMessage() { - const { colorPalette } = useColorMode(); return ( - - + {t('worker.emailVerification.title')} - + {t('worker.registrationInExchangeOracle.completeMessage')} diff --git a/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/registration.page.tsx b/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/registration.page.tsx index 8202dbf41f..8c57329568 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/registration.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/worker/oracle-registration/registration.page.tsx @@ -7,7 +7,6 @@ import { Loader } from '@/shared/components/ui/loader'; import { routerPaths } from '@/router/router-paths'; import { useGetOracles } from '../hooks'; import { useIsAlreadyRegistered } from './hooks'; -import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; import { useIsMobile } from '@/shared/hooks/use-is-mobile'; import { BackButton } from '@/shared/components/ui/page-card/back-button'; @@ -17,7 +16,6 @@ function isAddress(address: string | undefined): address is string { export function RegistrationPage() { const { t } = useTranslation(); - const { colorPalette } = useColorMode(); const navigate = useNavigate(); const isMobile = useIsMobile(); const { address: oracleAddress } = useParams<{ address: string }>(); @@ -49,14 +47,14 @@ export function RegistrationPage() { p: { xs: 0, md: 4 }, mx: { xs: 2, md: 0 }, gap: { xs: 1, md: 0 }, - borderBottom: { + borderBottom: (theme) => ({ xs: 'none', - md: `1px solid ${colorPalette.border.main}`, - }, + md: `1px solid ${theme.palette.border.main}`, + }), }} > {isMobile && } - + {t('protectedPagesHeaders.registrationInExchangeOracle')} @@ -77,7 +75,7 @@ export function RegistrationPage() { maxWidth: { xs: '100%', md: '350px' }, }} > - + {t('worker.registrationInExchangeOracle.requiredMessage')} theme.zIndex.appBar, }} > diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/components/profile-data.tsx b/packages/apps/human-app/frontend/src/modules/worker/profile/components/profile-data.tsx index ec9db397b2..3af47ceea2 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/components/profile-data.tsx +++ b/packages/apps/human-app/frontend/src/modules/worker/profile/components/profile-data.tsx @@ -1,8 +1,8 @@ +import { type ReactNode } from 'react'; import { Box, Link, Stack, Typography } from '@mui/material'; import { Link as RouterLink, useLocation } from 'react-router-dom'; import { useAuthenticatedUser } from '@/modules/auth/hooks/use-authenticated-user'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { shortenEscrowAddress } from '@/shared/helpers/evm'; import { routerPaths } from '@/router/router-paths'; @@ -13,7 +13,7 @@ function Wrapper({ }: { isCompact: boolean; isProfilePage: boolean; - children: React.ReactNode; + children: ReactNode; }) { if (isCompact && !isProfilePage) { return ( @@ -36,7 +36,6 @@ export function ProfileData({ variant?: 'compact' | 'expanded'; }) { const { user } = useAuthenticatedUser(); - const { colorPalette } = useColorMode(); const location = useLocation(); const isProfilePage = location.pathname === routerPaths.profile; @@ -61,17 +60,16 @@ export function ProfileData({ width: { xs: '38px', md: isCompact ? '48px' : '76px' }, height: { xs: '38px', md: isCompact ? '48px' : '76px' }, borderRadius: '50%', - backgroundColor: colorPalette.white, - border: `1px solid ${colorPalette.border.strong}`, + bgcolor: 'common.white', + border: (theme) => `1px solid ${theme.palette.border.strong}`, opacity: 0.8, }} > {user?.email.charAt(0).toUpperCase()} @@ -91,12 +89,9 @@ export function ProfileData({ sx={{ fontSize: { xs: isCompact ? 14 : 16, md: isCompact ? 16 : 32 }, fontWeight: { xs: 700, md: 600 }, - lineHeight: 'normal', color: { - xs: colorPalette.text.primary, - md: isCompact - ? colorPalette.text.auxiliary100 - : colorPalette.text.primary, + xs: 'text.primary', + md: isCompact ? 'text.auxiliary100' : 'text.primary', }, ...(!isCompact && { overflow: 'hidden', @@ -111,8 +106,7 @@ export function ProfileData({ sx={{ fontSize: { xs: 12, md: isCompact ? 14 : 16 }, fontWeight: 500, - lineHeight: 'normal', - color: colorPalette.text.auxiliary200, + color: 'text.auxiliary200', }} > {shortenEscrowAddress( diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/index.ts b/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/index.ts deleted file mode 100644 index bae54c609e..0000000000 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/hooks/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './use-start-idv'; diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/types/index.ts b/packages/apps/human-app/frontend/src/modules/worker/profile/types/index.ts deleted file mode 100644 index 99448194ce..0000000000 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/types/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './profile-types'; diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/types/profile-types.ts b/packages/apps/human-app/frontend/src/modules/worker/profile/types/profile-types.ts deleted file mode 100644 index 0bfeebdb00..0000000000 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/types/profile-types.ts +++ /dev/null @@ -1,9 +0,0 @@ -export enum KycStatus { - NONE = 'none', - APPROVED = 'approved', - RESUBMISSION_REQUESTED = 'resubmission_requested', - DECLINED = 'declined', - REVIEW = 'review', - EXPIRED = 'expired', - ABANDONED = 'abandoned', -} diff --git a/packages/apps/human-app/frontend/src/modules/worker/profile/views/profile.page.tsx b/packages/apps/human-app/frontend/src/modules/worker/profile/views/profile.page.tsx index fcee561141..e4def2a86a 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/profile/views/profile.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/worker/profile/views/profile.page.tsx @@ -9,7 +9,6 @@ import { TopNotificationType, useNotification, } from '@/shared/hooks/use-notification'; -import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; import { ProfileData } from '../components/profile-data'; import { CheckmarkIcon, LogoutIcon } from '@/shared/components/ui/icons'; import { shortenEscrowAddress } from '@/shared/helpers/evm'; @@ -22,7 +21,6 @@ import { CopyToClipboardButton } from '@/shared/components/ui/copy-to-clipboard- export function ProfilePage() { const { user } = useAuthenticatedUser(); - const { colorPalette } = useColorMode(); const { isConnected, initializing, web3ProviderMutation } = useWalletConnect(); const { showNotification } = useNotification(); @@ -77,24 +75,14 @@ export function ProfilePage() { }} > {isMobile && } - + {t('worker.profile.profileHeader')} `1px solid ${theme.palette.border.strong}`, overflow: 'hidden', }} > @@ -107,7 +95,7 @@ export function ProfilePage() { py: 2, px: { xs: 2, md: 3 }, gap: 2, - borderBottom: `1px solid ${colorPalette.border.strong}`, + borderBottom: (theme) => `1px solid ${theme.palette.border.strong}`, }} > @@ -118,8 +106,7 @@ export function ProfilePage() { flexShrink: 0, alignItems: 'center', gap: { xs: 0.5, md: 1 }, - fontWeight: 500, - color: colorPalette.success.main, + color: 'success.main', }} > @@ -137,33 +124,13 @@ export function ProfilePage() { > - + {t('worker.profile.email')} - - {user.email} - + {user.email} - + {t('worker.profile.walletAddress')} {shortenEscrowAddress(user.wallet_address ?? '', 9, 8)} diff --git a/packages/apps/human-app/frontend/src/modules/worker/reset-password/reset-password-success.page.tsx b/packages/apps/human-app/frontend/src/modules/worker/reset-password/reset-password-success.page.tsx index bc292347ff..f6e1957f85 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/reset-password/reset-password-success.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/worker/reset-password/reset-password-success.page.tsx @@ -1,16 +1,15 @@ import { useEffect } from 'react'; -import { Paper, Stack, Typography } from '@mui/material'; import { t } from 'i18next'; import { Link } from 'react-router-dom'; +import { Stack, Typography } from '@mui/material'; import CheckCircle from '@mui/icons-material/CheckCircle'; import { Button } from '@/shared/components/ui/button'; import { routerPaths } from '@/router/router-paths'; import { useAuth } from '@/modules/auth/hooks/use-auth'; -import { useColorMode } from '@/shared/contexts/color-mode'; +import { PageCard } from '@/shared/components/ui/page-card'; export function ResetPasswordSuccessPage() { - const { colorPalette } = useColorMode(); const { signOut, user } = useAuth(); useEffect(() => { @@ -20,27 +19,12 @@ export function ResetPasswordSuccessPage() { }, [user, signOut]); return ( - - + {t('worker.resetPasswordSuccess.title')} - + {t('worker.resetPasswordSuccess.description')} - + , + 1: , 2: , }} i18nKey="worker.sendResetLinkSuccess.paragraph4" @@ -146,6 +126,6 @@ export function SendResetLinkSuccessPage() { - + ); } diff --git a/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/send-reset-link.page.tsx b/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/send-reset-link.page.tsx index 9fc49d96b3..fc21cde9a9 100644 --- a/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/send-reset-link.page.tsx +++ b/packages/apps/human-app/frontend/src/modules/worker/send-reset-link/send-reset-link.page.tsx @@ -1,6 +1,6 @@ import { useEffect } from 'react'; import { FormProvider, useForm } from 'react-hook-form'; -import { Box, Grid, Paper, Stack, Typography } from '@mui/material'; +import { Box, Grid, Stack, Typography } from '@mui/material'; import { zodResolver } from '@hookform/resolvers/zod'; import { useTranslation } from 'react-i18next'; import { Input } from '@/shared/components/data-entry/input'; @@ -12,18 +12,17 @@ import { routerPaths } from '@/router/router-paths'; import { useResetMutationErrors } from '@/shared/hooks/use-reset-mutation-errors'; import { useSendResetLinkMutation } from './hooks'; import { type SendResetLinkDto, sendResetLinkDtoSchema } from './schemas'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { BackButton } from '@/shared/components/ui/page-card/back-button'; import { useNavigate } from 'react-router-dom'; import { TopNotificationType, useNotification, } from '@/shared/hooks/use-notification'; +import { PageCard } from '@/shared/components/ui/page-card'; export function SendResetLinkPage() { const { t } = useTranslation(); const { user } = useAuth(); - const { colorPalette } = useColorMode(); const { showNotification } = useNotification(); const navigate = useNavigate(); @@ -64,27 +63,12 @@ export function SendResetLinkPage() { }; return ( - @@ -100,7 +84,7 @@ export function SendResetLinkPage() { {t('worker.sendResetLinkForm.title')} @@ -112,10 +96,7 @@ export function SendResetLinkPage() { }} > - + {t('worker.sendResetLinkForm.description')} - + ); } diff --git a/packages/apps/human-app/frontend/src/router/components/footer.tsx b/packages/apps/human-app/frontend/src/router/components/footer.tsx index 79ae8ef89e..f88fae4520 100644 --- a/packages/apps/human-app/frontend/src/router/components/footer.tsx +++ b/packages/apps/human-app/frontend/src/router/components/footer.tsx @@ -9,10 +9,10 @@ interface FooterProps { } export function Footer({ displayChatIcon = true }: FooterProps) { - const { colorPalette, isDarkMode } = useColorMode(); + const { isDarkMode } = useColorMode(); const { t } = useTranslation(); - const footerTextColor = isDarkMode ? 'rgba(255, 255, 255, 0.70)' : '#676767'; + const footerTextColor = isDarkMode ? 'text.secondary' : 'text.auxiliary200'; return ( ({ + xs: `1px solid ${theme.palette.border.main}`, md: 'none', - }, + }), }} > {isActive && } @@ -119,7 +115,7 @@ export function DesktopAsideBar() { borderTopLeftRadius: '20px', borderTopRightRadius: '20px', borderTop: '1px solid', - borderColor: colorPalette.border.main, + borderColor: 'border.main', }} > diff --git a/packages/apps/human-app/frontend/src/router/components/layout/protected/jobs-switcher-mobile.tsx b/packages/apps/human-app/frontend/src/router/components/layout/protected/jobs-switcher-mobile.tsx index 675b05b234..6a8307aedf 100644 --- a/packages/apps/human-app/frontend/src/router/components/layout/protected/jobs-switcher-mobile.tsx +++ b/packages/apps/human-app/frontend/src/router/components/layout/protected/jobs-switcher-mobile.tsx @@ -17,7 +17,7 @@ const BUTTONS = [ ] as const satisfies { label: string; path: string }[]; export function JobsSwitcherMobile() { - const { colorPalette, isDarkMode } = useColorMode(); + const { isDarkMode } = useColorMode(); const { t } = useTranslation(); const { pathname } = useLocation(); @@ -36,7 +36,7 @@ export function JobsSwitcherMobile() { maxWidth: '500px', mx: 'auto', borderRadius: '90px', - bgcolor: colorPalette.background.default, + bgcolor: 'background.default', }} > {BUTTONS.map((button) => { @@ -48,11 +48,11 @@ export function JobsSwitcherMobile() { to={button.path} fullWidth sx={{ - color: colorPalette.text.primary, + color: 'text.primary', opacity: isActive ? 1 : 0.8, fontSize: '14px', fontWeight: isActive ? 700 : 600, - bgcolor: isActive ? colorPalette.background.paper : 'transparent', + bgcolor: isActive ? 'background.paper' : 'transparent', borderRadius: '90px', boxShadow: isActive ? `3px 3px 24px 0px ${shadowColor}` : 'none', }} diff --git a/packages/apps/human-app/frontend/src/router/components/layout/protected/layout.tsx b/packages/apps/human-app/frontend/src/router/components/layout/protected/layout.tsx index af0bb348c3..d580014904 100644 --- a/packages/apps/human-app/frontend/src/router/components/layout/protected/layout.tsx +++ b/packages/apps/human-app/frontend/src/router/components/layout/protected/layout.tsx @@ -6,7 +6,6 @@ import { useIsMobile } from '@/shared/hooks/use-is-mobile'; import { GovernanceBanner } from '@/modules/governance-banner/components/governance-banner'; import { Footer } from '../../footer'; import { Navbar } from './navbar'; -import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; import { DesktopAsideBar } from './desktop-aside-bar'; import { ProfileBottomTray } from '@/modules/worker/profile/components/profile-bottom-tray'; import { MOBILE_BOTTOM_TRAY_HEIGHT } from '@/shared/consts'; @@ -22,7 +21,6 @@ export function ProtectedLayout() { const layoutElementRef = useRef(null); const isMobile = useIsMobile(); - const { colorPalette } = useColorMode(); const location = useLocation(); const isProfilePage = location.pathname === routerPaths.profile; @@ -41,8 +39,8 @@ export function ProtectedLayout() { pb: { xs: isBottomTrayVisible ? MOBILE_BOTTOM_TRAY_HEIGHT : 0, md: 2 }, gap: 2, bgcolor: { - xs: colorPalette.background.paper, - md: colorPalette.background.default, + xs: 'background.paper', + md: 'background.default', }, }} > @@ -52,12 +50,12 @@ export function ProtectedLayout() { sx={{ flex: 1, gap: { xs: 0, md: 3 }, - bgcolor: colorPalette.background.paper, + bgcolor: 'background.paper', borderRadius: { xs: '0px', md: '30px' }, - border: { + border: (theme) => ({ xs: 'none', - md: `1px solid ${colorPalette.border.main}`, - }, + md: `1px solid ${theme.palette.border.main}`, + }), }} >
diff --git a/packages/apps/human-app/frontend/src/router/components/layout/protected/navbar.tsx b/packages/apps/human-app/frontend/src/router/components/layout/protected/navbar.tsx index fcd04711bf..e78ddf6fd6 100644 --- a/packages/apps/human-app/frontend/src/router/components/layout/protected/navbar.tsx +++ b/packages/apps/human-app/frontend/src/router/components/layout/protected/navbar.tsx @@ -3,12 +3,10 @@ import { t } from 'i18next'; import { HumanLogoNavbarIcon } from '@/shared/components/ui/icons'; import { Button } from '@/shared/components/ui/button'; -import { useColorMode } from '@/shared/contexts/color-mode'; import { useHandleMainNavIconClick } from '@/shared/hooks/use-handle-main-nav-icon-click'; import { ColorModeSwitch } from '@/shared/components/ui/dark-mode-switch'; export function Navbar() { - const { colorPalette } = useColorMode(); const handleMainNavIconClick = useHandleMainNavIconClick(); return ( @@ -19,7 +17,7 @@ export function Navbar() { display: { xs: 'flex', md: 'none' }, alignItems: 'center', justifyContent: 'space-between', - backgroundColor: colorPalette.background.paper, + backgroundColor: 'background.paper', width: '100%', p: 2, zIndex: '130', diff --git a/packages/apps/human-app/frontend/src/router/components/layout/unprotected/layout.tsx b/packages/apps/human-app/frontend/src/router/components/layout/unprotected/layout.tsx index 993e87b49c..77349145da 100644 --- a/packages/apps/human-app/frontend/src/router/components/layout/unprotected/layout.tsx +++ b/packages/apps/human-app/frontend/src/router/components/layout/unprotected/layout.tsx @@ -1,21 +1,23 @@ +import { useMemo } from 'react'; import { Container, Stack } from '@mui/material'; import { Outlet } from 'react-router-dom'; -import { useColorMode } from '@/shared/contexts/color-mode'; + import { Footer } from '../../footer'; import { Navbar } from './navbar'; +import { useColorMode } from '@/shared/contexts/color-mode'; import { useIsMainPage } from '@/router/hooks/use-is-main-page'; export function UnprotectedLayout() { - const { colorPalette, isDarkMode } = useColorMode(); + const { isDarkMode } = useColorMode(); const isMainPage = useIsMainPage(); - const layoutBackgroundColor = (() => { - if (isDarkMode || isMainPage) { - return colorPalette.backgroundColor; + const layoutBackgroundColor = useMemo(() => { + if (isDarkMode || !isMainPage) { + return 'background.default'; + } else { + return 'background.paper'; } - - return colorPalette.paper.main; - })(); + }, [isDarkMode, isMainPage]); return ( diff --git a/packages/apps/human-app/frontend/src/router/components/layout/unprotected/use-mobile-layout-background.ts b/packages/apps/human-app/frontend/src/router/components/layout/unprotected/use-mobile-layout-background.ts deleted file mode 100644 index 5b1b0da4e6..0000000000 --- a/packages/apps/human-app/frontend/src/router/components/layout/unprotected/use-mobile-layout-background.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { useLocation } from 'react-router-dom'; -import signupBackground from '@/assets/background-images/signup-background-mobile.png'; -import signinBackground from '@/assets/background-images/signin-background-mobile.png'; -import { routerPaths } from '@/router/router-paths'; - -const signupRoutes = [ - routerPaths.signUp, - routerPaths.emailVerification, - routerPaths.verifyEmail, -] as string[]; - -const signinRoutes = [ - routerPaths.signIn, - routerPaths.sendResetLink, - routerPaths.resetPassword, - routerPaths.sendResetLinkSuccess, - routerPaths.resetPasswordSuccess, -] as string[]; - -export function useMobileLayoutBackground() { - const { pathname } = useLocation(); - - if (signupRoutes.includes(pathname)) { - return signupBackground; - } - - if (signinRoutes.includes(pathname)) { - return signinBackground; - } - - return undefined; -} diff --git a/packages/apps/human-app/frontend/src/router/router-paths.ts b/packages/apps/human-app/frontend/src/router/router-paths.ts index 0183b5dbd3..753570a90d 100644 --- a/packages/apps/human-app/frontend/src/router/router-paths.ts +++ b/packages/apps/human-app/frontend/src/router/router-paths.ts @@ -1,7 +1,7 @@ export const routerPaths = { homePage: '/', signIn: '/sign-in', - signUp: '/sign-up', + // signUp: '/sign-up', resetPassword: '/reset-password', resetPasswordSuccess: '/reset-password-success', sendResetLink: '/send-reset-link', diff --git a/packages/apps/human-app/frontend/src/router/routes.tsx b/packages/apps/human-app/frontend/src/router/routes.tsx index fd7bb01d82..4c41816c45 100644 --- a/packages/apps/human-app/frontend/src/router/routes.tsx +++ b/packages/apps/human-app/frontend/src/router/routes.tsx @@ -12,11 +12,12 @@ import { EmailVerificationProcessPage, VerifyEmailPage, } from '@/modules/worker/email-verification'; -import { SignInPage, VerifyUserPage } from '@/modules/signin/worker'; +import { SignInPage } from '@/modules/signin/sign-in.page'; +import { VerifyUserPage } from '@/modules/verify-user/verify-user.page'; import { JobsDiscoveryPage } from '@/modules/worker/jobs-discovery'; import { MyJobsPage } from '@/modules/worker/jobs/my-jobs/my-jobs.page'; import { ProfilePage } from '@/modules/worker/profile'; -import { SignUpPage } from '@/modules/signup/worker'; +//import { SignUpPage } from '@/modules/signup/sign-up.page'; import { HomePage } from '@/modules/homepage'; import { ResetPasswordPage, @@ -36,10 +37,10 @@ export const unprotectedRoutes: RouteProps[] = [ path: routerPaths.signIn, element: , }, - { - path: routerPaths.signUp, - element: , - }, + // { + // path: routerPaths.signUp, + // element: , + // }, { path: routerPaths.emailVerification, element: , diff --git a/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/human-currency.tsx b/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/human-currency.tsx index 140a41b2d2..5f6efc4e2d 100644 --- a/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/human-currency.tsx +++ b/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/human-currency.tsx @@ -1,18 +1,12 @@ import { t } from 'i18next'; -import type { ForwardRefExoticComponent, RefAttributes } from 'react'; import { forwardRef } from 'react'; -import type { NumericFormatProps } from 'react-number-format'; -import { NumericFormat } from 'react-number-format'; +import { NumericFormat, type NumericFormatProps } from 'react-number-format'; interface CustomProps { onChange: (event: { target: { name: string; value: string } }) => void; name: string; } -export type InputMaskComponent = ForwardRefExoticComponent< - CustomProps & RefAttributes ->; - export const HumanCurrencyInputMask = forwardRef< NumericFormatProps, CustomProps diff --git a/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/index.ts b/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/index.ts index 675216357f..58cc5d4298 100644 --- a/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/index.ts +++ b/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/index.ts @@ -4,5 +4,3 @@ import { PercentsInputMask } from '@/shared/components/data-entry/input-masks/pe export type InputMask = | typeof HumanCurrencyInputMask | typeof PercentsInputMask; - -export { HumanCurrencyInputMask, PercentsInputMask }; diff --git a/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/percents.tsx b/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/percents.tsx index 2985abf67d..6fe8cc1cc0 100644 --- a/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/percents.tsx +++ b/packages/apps/human-app/frontend/src/shared/components/data-entry/input-masks/percents.tsx @@ -1,18 +1,12 @@ import { t } from 'i18next'; -import type { ForwardRefExoticComponent, RefAttributes } from 'react'; import { forwardRef } from 'react'; -import type { NumericFormatProps } from 'react-number-format'; -import { NumericFormat } from 'react-number-format'; +import { NumericFormat, type NumericFormatProps } from 'react-number-format'; interface CustomProps { onChange: (event: { target: { name: string; value: string } }) => void; name: string; } -export type InputMaskComponent = ForwardRefExoticComponent< - CustomProps & RefAttributes ->; - export const PercentsInputMask = forwardRef( function NumericFormatCustom(props, ref) { const { onChange, ...other } = props; diff --git a/packages/apps/human-app/frontend/src/shared/components/data-entry/input.tsx b/packages/apps/human-app/frontend/src/shared/components/data-entry/input.tsx index 3ae76177f2..a232c51896 100644 --- a/packages/apps/human-app/frontend/src/shared/components/data-entry/input.tsx +++ b/packages/apps/human-app/frontend/src/shared/components/data-entry/input.tsx @@ -1,16 +1,15 @@ +import { type ReactNode } from 'react'; import { Controller } from 'react-hook-form'; -import type { TextFieldProps } from '@mui/material/TextField'; -import TextField from '@mui/material/TextField'; -import { Typography } from '@mui/material'; +import { type TextFieldProps, TextField, Typography } from '@mui/material'; + import { type InputMask } from '@/shared/components/data-entry/input-masks'; -import { useColorMode } from '@/shared/contexts/color-mode'; type OmittedProps = Omit; export interface InputProps extends OmittedProps { name: string; label?: string; autoComplete?: string; - customError?: React.ReactNode; + customError?: ReactNode; mask?: InputMask; } @@ -22,8 +21,6 @@ export function Input({ mask, ...rest }: InputProps) { - const { colorPalette } = useColorMode(); - return ( {customError ? customError : fieldState.error?.message} diff --git a/packages/apps/human-app/frontend/src/shared/components/data-entry/password.tsx b/packages/apps/human-app/frontend/src/shared/components/data-entry/password.tsx index cba51984cc..5f62242852 100644 --- a/packages/apps/human-app/frontend/src/shared/components/data-entry/password.tsx +++ b/packages/apps/human-app/frontend/src/shared/components/data-entry/password.tsx @@ -2,16 +2,14 @@ import { useState, MouseEvent } from 'react'; import Visibility from '@mui/icons-material/Visibility'; import VisibilityOff from '@mui/icons-material/VisibilityOff'; import { IconButton, InputAdornment } from '@mui/material'; + import { Input, type InputProps } from '@/shared/components/data-entry/input'; -import { useColorMode } from '@/shared/contexts/color-mode/use-color-mode'; type PasswordProps = InputProps & { type?: never }; export function Password(props: PasswordProps) { const [showPassword, setShowPassword] = useState(false); - const { colorPalette } = useColorMode(); - const handleClickShowPassword = () => { setShowPassword((show) => !show); }; @@ -34,9 +32,9 @@ export function Password(props: PasswordProps) { onMouseDown={handleMouseDownPassword} > {showPassword ? ( - + ) : ( - + )} diff --git a/packages/apps/human-app/frontend/src/shared/components/expiration-modal.tsx b/packages/apps/human-app/frontend/src/shared/components/expiration-modal.tsx index 50d087c3cf..56c6adfed5 100644 --- a/packages/apps/human-app/frontend/src/shared/components/expiration-modal.tsx +++ b/packages/apps/human-app/frontend/src/shared/components/expiration-modal.tsx @@ -1,16 +1,15 @@ import { t } from 'i18next'; import { Stack, Typography } from '@mui/material'; import { useNavigate } from 'react-router-dom'; + import { Button } from '@/shared/components/ui/button'; import { routerPaths } from '@/router/router-paths'; import { browserAuthProvider } from '@/shared/contexts/browser-auth-provider'; import { useModal } from '@/shared/contexts/modal-context'; -import { useColorMode } from '../contexts/color-mode'; export function ExpirationModal() { const { closeModal } = useModal(); const navigate = useNavigate(); - const { colorPalette } = useColorMode(); const handleOnSignInClick = () => { browserAuthProvider.signOut(); @@ -33,11 +32,11 @@ export function ExpirationModal() { maxWidth: '352px', }} > - + {t('expirationModal.header')} - + {t('expirationModal.description')}