From f9f85c8c5996982cdff2c666cd51188690f27d9b Mon Sep 17 00:00:00 2001 From: JKaypa Date: Fri, 16 Aug 2024 11:47:53 -0500 Subject: [PATCH 001/128] OV-2: + add sign in string to AuthApiPath const --- shared/src/bundles/auth/enums/auth-api-path.enum.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/shared/src/bundles/auth/enums/auth-api-path.enum.ts b/shared/src/bundles/auth/enums/auth-api-path.enum.ts index 5833c6684..f64e5d59e 100644 --- a/shared/src/bundles/auth/enums/auth-api-path.enum.ts +++ b/shared/src/bundles/auth/enums/auth-api-path.enum.ts @@ -1,6 +1,7 @@ const AuthApiPath = { ROOT: '/', SIGN_UP: '/sign-up', + SIGN_IN: '/sign-in', } as const; export { AuthApiPath }; From 532a1197e11bf7cbe140bc7a55972680117014cd Mon Sep 17 00:00:00 2001 From: JKaypa Date: Fri, 16 Aug 2024 12:14:23 -0500 Subject: [PATCH 002/128] OV-2: + create user signin request dto type --- shared/src/bundles/users/types/types.ts | 1 + .../src/bundles/users/types/user-sign-in-request-dto.type.ts | 5 +++++ shared/src/bundles/users/users.ts | 1 + shared/src/index.ts | 1 + 4 files changed, 8 insertions(+) create mode 100644 shared/src/bundles/users/types/user-sign-in-request-dto.type.ts diff --git a/shared/src/bundles/users/types/types.ts b/shared/src/bundles/users/types/types.ts index 7564f70b2..f6fd8caa2 100644 --- a/shared/src/bundles/users/types/types.ts +++ b/shared/src/bundles/users/types/types.ts @@ -1,4 +1,5 @@ export { type UserGetAllItemResponseDto } from './user-get-all-item-response-dto.type.js'; export { type UserGetAllResponseDto } from './user-get-all-response-dto.type.js'; +export { type UserSignInRequestDto } from './user-sign-in-request-dto.type.js'; export { type UserSignUpRequestDto } from './user-sign-up-request-dto.type.js'; export { type UserSignUpResponseDto } from './user-sign-up-response-dto.type.js'; diff --git a/shared/src/bundles/users/types/user-sign-in-request-dto.type.ts b/shared/src/bundles/users/types/user-sign-in-request-dto.type.ts new file mode 100644 index 000000000..6d445fe1e --- /dev/null +++ b/shared/src/bundles/users/types/user-sign-in-request-dto.type.ts @@ -0,0 +1,5 @@ +import { type UserSignUpRequestDto } from './types.js'; + +type UserSignInRequestDto = Pick; + +export { type UserSignInRequestDto }; diff --git a/shared/src/bundles/users/users.ts b/shared/src/bundles/users/users.ts index e65858985..f51c03f83 100644 --- a/shared/src/bundles/users/users.ts +++ b/shared/src/bundles/users/users.ts @@ -2,6 +2,7 @@ export { UsersApiPath, UserValidationMessage } from './enums/enums.js'; export { type UserGetAllItemResponseDto, type UserGetAllResponseDto, + type UserSignInRequestDto, type UserSignUpRequestDto, type UserSignUpResponseDto, } from './types/types.js'; diff --git a/shared/src/index.ts b/shared/src/index.ts index df887038b..62e27af88 100644 --- a/shared/src/index.ts +++ b/shared/src/index.ts @@ -2,6 +2,7 @@ export { AuthApiPath } from './bundles/auth/auth.js'; export { type UserGetAllItemResponseDto, type UserGetAllResponseDto, + type UserSignInRequestDto, type UserSignUpRequestDto, type UserSignUpResponseDto, UsersApiPath, From 8e9d770ef08fb351ec73878fdf5d4c52d381cf12 Mon Sep 17 00:00:00 2001 From: JKaypa Date: Sat, 17 Aug 2024 18:20:00 -0500 Subject: [PATCH 003/128] OV-2: + create user signin response dto type --- shared/src/bundles/users/types/types.ts | 1 + .../bundles/users/types/user-sign-in-response-dto.type.ts | 5 +++++ shared/src/bundles/users/users.ts | 1 + shared/src/index.ts | 1 + 4 files changed, 8 insertions(+) create mode 100644 shared/src/bundles/users/types/user-sign-in-response-dto.type.ts diff --git a/shared/src/bundles/users/types/types.ts b/shared/src/bundles/users/types/types.ts index f6fd8caa2..36cfa4fdb 100644 --- a/shared/src/bundles/users/types/types.ts +++ b/shared/src/bundles/users/types/types.ts @@ -1,5 +1,6 @@ export { type UserGetAllItemResponseDto } from './user-get-all-item-response-dto.type.js'; export { type UserGetAllResponseDto } from './user-get-all-response-dto.type.js'; export { type UserSignInRequestDto } from './user-sign-in-request-dto.type.js'; +export { type UserSignInResponseDto } from './user-sign-in-response-dto.type.js'; export { type UserSignUpRequestDto } from './user-sign-up-request-dto.type.js'; export { type UserSignUpResponseDto } from './user-sign-up-response-dto.type.js'; diff --git a/shared/src/bundles/users/types/user-sign-in-response-dto.type.ts b/shared/src/bundles/users/types/user-sign-in-response-dto.type.ts new file mode 100644 index 000000000..61be88ee0 --- /dev/null +++ b/shared/src/bundles/users/types/user-sign-in-response-dto.type.ts @@ -0,0 +1,5 @@ +import { type UserSignUpResponseDto } from './user-sign-up-response-dto.type.js'; + +type UserSignInResponseDto = UserSignUpResponseDto; + +export { type UserSignInResponseDto }; diff --git a/shared/src/bundles/users/users.ts b/shared/src/bundles/users/users.ts index f51c03f83..502faa91f 100644 --- a/shared/src/bundles/users/users.ts +++ b/shared/src/bundles/users/users.ts @@ -3,6 +3,7 @@ export { type UserGetAllItemResponseDto, type UserGetAllResponseDto, type UserSignInRequestDto, + type UserSignInResponseDto, type UserSignUpRequestDto, type UserSignUpResponseDto, } from './types/types.js'; diff --git a/shared/src/index.ts b/shared/src/index.ts index 62e27af88..3a0064087 100644 --- a/shared/src/index.ts +++ b/shared/src/index.ts @@ -3,6 +3,7 @@ export { type UserGetAllItemResponseDto, type UserGetAllResponseDto, type UserSignInRequestDto, + type UserSignInResponseDto, type UserSignUpRequestDto, type UserSignUpResponseDto, UsersApiPath, From 5fe0d635becc23e832c64d0d21496e82ddd8f4b9 Mon Sep 17 00:00:00 2001 From: Luis Felix Date: Sun, 18 Aug 2024 12:18:43 -0400 Subject: [PATCH 004/128] OV-4: + name and repeatPassword properties for sign-up form --- .../components/sign-up-form/constants/constants.ts | 2 ++ .../auth/components/sign-up-form/sign-up-form.tsx | 12 ++++++++++++ .../users/types/user-sign-up-request-dto.type.ts | 2 ++ .../user-sign-up.validation-schema.ts | 4 ++++ 4 files changed, 20 insertions(+) diff --git a/frontend/src/bundles/auth/components/sign-up-form/constants/constants.ts b/frontend/src/bundles/auth/components/sign-up-form/constants/constants.ts index 219f8854a..49ecd1635 100644 --- a/frontend/src/bundles/auth/components/sign-up-form/constants/constants.ts +++ b/frontend/src/bundles/auth/components/sign-up-form/constants/constants.ts @@ -1,8 +1,10 @@ import { type UserSignUpRequestDto } from '~/bundles/users/users.js'; const DEFAULT_SIGN_UP_PAYLOAD: UserSignUpRequestDto = { + name: '', email: '', password: '', + repeatPassword: '', }; export { DEFAULT_SIGN_UP_PAYLOAD }; diff --git a/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx b/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx index 82d4620d0..90b956282 100644 --- a/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx +++ b/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx @@ -34,6 +34,12 @@ const SignUpForm: React.FC = ({ onSubmit }) => {
+ = ({ onSubmit }) => { placeholder="Enter your password" name="password" /> + + + + ); +}; + +export { PasswordInput }; From e94407cf957a6c944f23a49fe78b96a1e49db8bd Mon Sep 17 00:00:00 2001 From: Luis Felix Date: Sun, 18 Aug 2024 20:51:20 -0400 Subject: [PATCH 019/128] OV-4: + redirect to root after sign-up submit --- frontend/src/bundles/auth/pages/auth.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/frontend/src/bundles/auth/pages/auth.tsx b/frontend/src/bundles/auth/pages/auth.tsx index 6592265c3..f15c3e020 100644 --- a/frontend/src/bundles/auth/pages/auth.tsx +++ b/frontend/src/bundles/auth/pages/auth.tsx @@ -1,4 +1,6 @@ -import { AppRoute } from '~/bundles/common/enums/enums.js'; +import { Navigate } from 'react-router-dom'; + +import { AppRoute, DataStatus } from '~/bundles/common/enums/enums.js'; import { useAppDispatch, useAppSelector, @@ -41,6 +43,10 @@ const Auth: React.FC = () => { return null; }; + if(dataStatus === DataStatus.FULFILLED) { + return ; + } + return ( <> state: {dataStatus} From 547891c8f64cb702b382ddc9e43796798bafe35d Mon Sep 17 00:00:00 2001 From: Luis Felix Date: Sun, 18 Aug 2024 21:04:32 -0400 Subject: [PATCH 020/128] OV-4: + save authenticated user after sign-up --- frontend/src/bundles/auth/store/slice.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/frontend/src/bundles/auth/store/slice.ts b/frontend/src/bundles/auth/store/slice.ts index 746d4b107..8dc90ddad 100644 --- a/frontend/src/bundles/auth/store/slice.ts +++ b/frontend/src/bundles/auth/store/slice.ts @@ -2,15 +2,18 @@ import { createSlice } from '@reduxjs/toolkit'; import { DataStatus } from '~/bundles/common/enums/enums.js'; import { type ValueOf } from '~/bundles/common/types/types.js'; +import { type UserSignUpResponseDto } from '~/bundles/users/users.js'; import { signUp } from './actions.js'; type State = { dataStatus: ValueOf; + user: UserSignUpResponseDto | undefined | null; }; const initialState: State = { dataStatus: DataStatus.IDLE, + user: null, }; const { reducer, actions, name } = createSlice({ @@ -21,11 +24,15 @@ const { reducer, actions, name } = createSlice({ builder.addCase(signUp.pending, (state) => { state.dataStatus = DataStatus.PENDING; }); - builder.addCase(signUp.fulfilled, (state) => { + builder.addCase(signUp.fulfilled, (state, action) => { + const payload = action.payload; + state.dataStatus = DataStatus.FULFILLED; + state.user = payload; }); builder.addCase(signUp.rejected, (state) => { state.dataStatus = DataStatus.REJECTED; + state.user = null; }); }, }); From dbfeb20ed2da2f0b05ceea221e4785dd95ea8633 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 11:24:38 +0300 Subject: [PATCH 021/128] OV-6: + colors for loader --- frontend/src/framework/theme/styles/colors.styles.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/frontend/src/framework/theme/styles/colors.styles.ts b/frontend/src/framework/theme/styles/colors.styles.ts index 75c91a9c5..0429cb141 100644 --- a/frontend/src/framework/theme/styles/colors.styles.ts +++ b/frontend/src/framework/theme/styles/colors.styles.ts @@ -1,7 +1,15 @@ const colors = { + white: '#ffffff', brand: { 900: '#1a365d', 200: '#b3e0ff', + secondary: { + 300: '#ff6e1c', + }, + }, + shadow: { + 200: 'rgba(0, 0, 0, 0.2)', + 700: 'rgba(0, 0, 0, 0.7)', }, text: { default: '#36454f', From 6f85559618ca6b315a56bc83c205c4bb51744552 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 11:33:29 +0300 Subject: [PATCH 022/128] OV-6: + loader component --- .../common/components/loader/loader.tsx | 17 +++++++ .../components/loader/styles.module.css | 47 +++++++++++++++++++ 2 files changed, 64 insertions(+) create mode 100644 frontend/src/bundles/common/components/loader/loader.tsx create mode 100644 frontend/src/bundles/common/components/loader/styles.module.css diff --git a/frontend/src/bundles/common/components/loader/loader.tsx b/frontend/src/bundles/common/components/loader/loader.tsx new file mode 100644 index 000000000..7a13c7ba5 --- /dev/null +++ b/frontend/src/bundles/common/components/loader/loader.tsx @@ -0,0 +1,17 @@ +import styles from './styles.module.css'; + +const Loader = (): JSX.Element => { + return ( +
+
+
+
LOGO
+
+
+
+

Loading...

+
+ ); +}; + +export { Loader }; diff --git a/frontend/src/bundles/common/components/loader/styles.module.css b/frontend/src/bundles/common/components/loader/styles.module.css new file mode 100644 index 000000000..151587b98 --- /dev/null +++ b/frontend/src/bundles/common/components/loader/styles.module.css @@ -0,0 +1,47 @@ +.loader-container { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.loader { + position: relative; + width: 100px; + height: 100px; +} + +.logo-wrapper { + display: flex; + justify-content: center; + align-items: center; + width: 100px; + height: 100px; + color: var(--chakra-colors-text-default); + background-color: var(--chakra-colors-white); + border-radius: 50%; +} + +.spinner-overlay { + position: absolute; + inset: 0; + border: 5px solid var(--chakra-colors-shadow-200); + border-top: 5px solid var(--chakra-colors-brand-secondary-300); + border-radius: 50%; + animation: spin 1s linear infinite; +} + +.loader-text { + padding-top: 20px; + font-size: 18px; +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } +} From 0d9234a14eee77fd2de94ef7a78056e94c98c13d Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 11:34:31 +0300 Subject: [PATCH 023/128] OV-6: + loaderOverlay component --- .../components/loader-overlay/loader-overlay.tsx | 12 ++++++++++++ .../components/loader-overlay/styles.module.css | 11 +++++++++++ 2 files changed, 23 insertions(+) create mode 100644 frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx create mode 100644 frontend/src/bundles/common/components/loader-overlay/styles.module.css diff --git a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx new file mode 100644 index 000000000..e292d0afc --- /dev/null +++ b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx @@ -0,0 +1,12 @@ +import { Loader } from '../components.js'; +import styles from './styles.module.css'; + +const LoaderOverlay = (): JSX.Element => { + return ( +
+ +
+ ); +}; + +export { LoaderOverlay }; diff --git a/frontend/src/bundles/common/components/loader-overlay/styles.module.css b/frontend/src/bundles/common/components/loader-overlay/styles.module.css new file mode 100644 index 000000000..4fa539d9d --- /dev/null +++ b/frontend/src/bundles/common/components/loader-overlay/styles.module.css @@ -0,0 +1,11 @@ +.container { + position: absolute; + display: flex; + justify-content: center; + align-items: center; + width: 100%; + height: 100%; + color: var(--chakra-colors-white); + text-align: center; + background: var(--chakra-colors-shadow-700); +} From 9c55dfd6730d8c8bffda52e4db672575d9343192 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 11:42:12 +0300 Subject: [PATCH 024/128] OV-6: + component exports --- frontend/src/bundles/common/components/components.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/frontend/src/bundles/common/components/components.ts b/frontend/src/bundles/common/components/components.ts index ce95bfe64..6bf7bee06 100644 --- a/frontend/src/bundles/common/components/components.ts +++ b/frontend/src/bundles/common/components/components.ts @@ -1,6 +1,8 @@ export { Button } from './button/button.js'; export { Input } from './input/input.js'; export { Link } from './link/link.js'; +export { Loader } from './loader/loader.js'; +export { LoaderOverlay } from './loader-overlay/loader-overlay.js'; export { RouterProvider } from './router-provider/router-provider.js'; export { Box, From 763efd63572b03987fce0e77a78dd18fc896807b Mon Sep 17 00:00:00 2001 From: nikita-remeslov Date: Mon, 19 Aug 2024 11:05:04 +0200 Subject: [PATCH 025/128] production: * codestyle --- .github/ISSUE_TEMPLATE/bug-report.yml | 2 +- .github/ISSUE_TEMPLATE/feature.yml | 38 +++++++++---------- .ls-lint.yml | 2 +- .../framework/config/base-config.package.ts | 4 +- .../config/types/environment-schema.type.ts | 2 +- .../http-api/types/http-api-options.type.ts | 2 +- 6 files changed, 24 insertions(+), 26 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/bug-report.yml b/.github/ISSUE_TEMPLATE/bug-report.yml index c4efbf503..d14de0c2e 100644 --- a/.github/ISSUE_TEMPLATE/bug-report.yml +++ b/.github/ISSUE_TEMPLATE/bug-report.yml @@ -2,7 +2,7 @@ name: Bug Report description: Report a bug title: 'BUG:' labels: ['BUG'] -projects: "BinaryStudioAcademy/30" +projects: 'BinaryStudioAcademy/30' body: - type: markdown attributes: diff --git a/.github/ISSUE_TEMPLATE/feature.yml b/.github/ISSUE_TEMPLATE/feature.yml index c793c4684..a628b3881 100644 --- a/.github/ISSUE_TEMPLATE/feature.yml +++ b/.github/ISSUE_TEMPLATE/feature.yml @@ -1,22 +1,22 @@ name: Feature description: Abstract feature description -title: "FEAT:" -projects: "BinaryStudioAcademy/30" +title: 'FEAT:' +projects: 'BinaryStudioAcademy/30' body: - - type: textarea - id: what-feature - attributes: - label: What feature? - placeholder: Add descriptions - validations: - required: true - - type: textarea - id: screenshots - attributes: - label: Add screenshots - placeholder: Add screenshots, mockups, etc. - - type: textarea - id: acceptance-criteria - attributes: - label: Acceptance criteria - placeholder: Add acceptance criteria. + - type: textarea + id: what-feature + attributes: + label: What feature? + placeholder: Add descriptions + validations: + required: true + - type: textarea + id: screenshots + attributes: + label: Add screenshots + placeholder: Add screenshots, mockups, etc. + - type: textarea + id: acceptance-criteria + attributes: + label: Acceptance criteria + placeholder: Add acceptance criteria. diff --git a/.ls-lint.yml b/.ls-lint.yml index 486067041..292cee3b8 100644 --- a/.ls-lint.yml +++ b/.ls-lint.yml @@ -16,7 +16,7 @@ ls: .ts: snake_case ignore: - - .git + - .github - node_modules - build - shared/build diff --git a/frontend/src/framework/config/base-config.package.ts b/frontend/src/framework/config/base-config.package.ts index 2b2a35e0e..1224b76c5 100644 --- a/frontend/src/framework/config/base-config.package.ts +++ b/frontend/src/framework/config/base-config.package.ts @@ -10,9 +10,7 @@ class BaseConfig implements Config { private get envSchema(): EnvironmentSchema { return { APP: { - ENVIRONMENT: import.meta.env[ - 'VITE_APP_NODE_ENV' - ], + ENVIRONMENT: import.meta.env['VITE_APP_NODE_ENV'], }, API: { ORIGIN_URL: import.meta.env[ diff --git a/frontend/src/framework/config/types/environment-schema.type.ts b/frontend/src/framework/config/types/environment-schema.type.ts index 47109076d..6f8f4df7c 100644 --- a/frontend/src/framework/config/types/environment-schema.type.ts +++ b/frontend/src/framework/config/types/environment-schema.type.ts @@ -1,5 +1,5 @@ import { type AppEnvironment } from '~/bundles/common/enums/enums.js'; -import { type ValueOf } from '~/bundles/common/types/types.js'; +import { type ValueOf } from '~/bundles/common/types/types.js'; type EnvironmentSchema = { APP: { diff --git a/frontend/src/framework/http-api/types/http-api-options.type.ts b/frontend/src/framework/http-api/types/http-api-options.type.ts index 88cda053c..ba7f07184 100644 --- a/frontend/src/framework/http-api/types/http-api-options.type.ts +++ b/frontend/src/framework/http-api/types/http-api-options.type.ts @@ -1,5 +1,5 @@ import { type ContentType } from '~/bundles/common/enums/enums.js'; -import { type ValueOf } from '~/bundles/common/types/types.js'; +import { type ValueOf } from '~/bundles/common/types/types.js'; import { type HttpOptions } from '~/framework/http/http.js'; type HttpApiOptions = Omit & { From d3ebf0b248215de77136b9ca3d1ae314aa21405a Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 14:18:10 +0300 Subject: [PATCH 026/128] OV-6: * loader component --- .../common/components/loader/loader.tsx | 38 ++++++++++++++----- 1 file changed, 28 insertions(+), 10 deletions(-) diff --git a/frontend/src/bundles/common/components/loader/loader.tsx b/frontend/src/bundles/common/components/loader/loader.tsx index 7a13c7ba5..c5cf0c671 100644 --- a/frontend/src/bundles/common/components/loader/loader.tsx +++ b/frontend/src/bundles/common/components/loader/loader.tsx @@ -1,16 +1,34 @@ -import styles from './styles.module.css'; +import { Box, Circle, Flex, keyframes, Text } from '@chakra-ui/react'; + +const spin = keyframes` + 0% { transform: rotate(0deg);} + 100% { transform: rotate(360deg)} +`; const Loader = (): JSX.Element => { return ( -
-
-
-
LOGO
-
-
-
-

Loading...

-
+ + + + LOGO + + + + + Loading... + + ); }; From d506d2bde5d645039259fb7779e5d0829037aba1 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 14:18:59 +0300 Subject: [PATCH 027/128] OV-6: * loaderOverlay component --- .../components/loader-overlay/loader-overlay.tsx | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx index e292d0afc..1e2e0dbb2 100644 --- a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx +++ b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx @@ -1,11 +1,20 @@ +import { Flex } from '@chakra-ui/react'; + import { Loader } from '../components.js'; -import styles from './styles.module.css'; const LoaderOverlay = (): JSX.Element => { return ( -
+ -
+ ); }; From 4e60691d8e2e9d385550349ddeadd6454cc7a894 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 14:20:45 +0300 Subject: [PATCH 028/128] OV-6: - css files --- .../loader-overlay/styles.module.css | 11 ----- .../components/loader/styles.module.css | 47 ------------------- 2 files changed, 58 deletions(-) delete mode 100644 frontend/src/bundles/common/components/loader-overlay/styles.module.css delete mode 100644 frontend/src/bundles/common/components/loader/styles.module.css diff --git a/frontend/src/bundles/common/components/loader-overlay/styles.module.css b/frontend/src/bundles/common/components/loader-overlay/styles.module.css deleted file mode 100644 index 4fa539d9d..000000000 --- a/frontend/src/bundles/common/components/loader-overlay/styles.module.css +++ /dev/null @@ -1,11 +0,0 @@ -.container { - position: absolute; - display: flex; - justify-content: center; - align-items: center; - width: 100%; - height: 100%; - color: var(--chakra-colors-white); - text-align: center; - background: var(--chakra-colors-shadow-700); -} diff --git a/frontend/src/bundles/common/components/loader/styles.module.css b/frontend/src/bundles/common/components/loader/styles.module.css deleted file mode 100644 index 151587b98..000000000 --- a/frontend/src/bundles/common/components/loader/styles.module.css +++ /dev/null @@ -1,47 +0,0 @@ -.loader-container { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; -} - -.loader { - position: relative; - width: 100px; - height: 100px; -} - -.logo-wrapper { - display: flex; - justify-content: center; - align-items: center; - width: 100px; - height: 100px; - color: var(--chakra-colors-text-default); - background-color: var(--chakra-colors-white); - border-radius: 50%; -} - -.spinner-overlay { - position: absolute; - inset: 0; - border: 5px solid var(--chakra-colors-shadow-200); - border-top: 5px solid var(--chakra-colors-brand-secondary-300); - border-radius: 50%; - animation: spin 1s linear infinite; -} - -.loader-text { - padding-top: 20px; - font-size: 18px; -} - -@keyframes spin { - 0% { - transform: rotate(0deg); - } - - 100% { - transform: rotate(360deg); - } -} From c9b1687c185ffd580f98987867d57eb9e64a112b Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 14:38:33 +0300 Subject: [PATCH 029/128] OV-6: + animation constant --- .../common/components/loader/libs/constants/constants.ts | 1 + .../loader/libs/constants/spin-animation.constant.ts | 8 ++++++++ 2 files changed, 9 insertions(+) create mode 100644 frontend/src/bundles/common/components/loader/libs/constants/constants.ts create mode 100644 frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts diff --git a/frontend/src/bundles/common/components/loader/libs/constants/constants.ts b/frontend/src/bundles/common/components/loader/libs/constants/constants.ts new file mode 100644 index 000000000..e530775ac --- /dev/null +++ b/frontend/src/bundles/common/components/loader/libs/constants/constants.ts @@ -0,0 +1 @@ +export { spin } from './spin-animation.constant.js'; diff --git a/frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts b/frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts new file mode 100644 index 000000000..dd122fc85 --- /dev/null +++ b/frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts @@ -0,0 +1,8 @@ +import { keyframes } from '@chakra-ui/react'; + +const spin = keyframes` + 0% { transform: rotate(0deg);} + 100% { transform: rotate(360deg)} +`; + +export { spin }; From 467f748fea897e13af37e5ec288bf01e6d1794c4 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 14:39:26 +0300 Subject: [PATCH 030/128] OV-6: * loader --- frontend/src/bundles/common/components/loader/loader.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/frontend/src/bundles/common/components/loader/loader.tsx b/frontend/src/bundles/common/components/loader/loader.tsx index c5cf0c671..2f2355e58 100644 --- a/frontend/src/bundles/common/components/loader/loader.tsx +++ b/frontend/src/bundles/common/components/loader/loader.tsx @@ -1,9 +1,6 @@ -import { Box, Circle, Flex, keyframes, Text } from '@chakra-ui/react'; +import { Box, Circle, Flex, Text } from '@chakra-ui/react'; -const spin = keyframes` - 0% { transform: rotate(0deg);} - 100% { transform: rotate(360deg)} -`; +import { spin } from './libs/constants/constants.js'; const Loader = (): JSX.Element => { return ( From 7f08fad1400d0a006cfc2e491359dede1da1fab8 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 16:02:11 +0300 Subject: [PATCH 031/128] OV-6: * exports --- frontend/src/bundles/common/components/components.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/frontend/src/bundles/common/components/components.ts b/frontend/src/bundles/common/components/components.ts index 6bf7bee06..d2d0d1986 100644 --- a/frontend/src/bundles/common/components/components.ts +++ b/frontend/src/bundles/common/components/components.ts @@ -1,7 +1,6 @@ export { Button } from './button/button.js'; export { Input } from './input/input.js'; export { Link } from './link/link.js'; -export { Loader } from './loader/loader.js'; export { LoaderOverlay } from './loader-overlay/loader-overlay.js'; export { RouterProvider } from './router-provider/router-provider.js'; export { From 46fc2999a04facccbe66acec9d6d2db91a2e93d4 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 16:03:43 +0300 Subject: [PATCH 032/128] OV-6: + add transition --- .../loader-overlay/loader-overlay.tsx | 28 ++++++++++--------- 1 file changed, 15 insertions(+), 13 deletions(-) diff --git a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx index 1e2e0dbb2..c6a085991 100644 --- a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx +++ b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx @@ -1,20 +1,22 @@ -import { Flex } from '@chakra-ui/react'; +import { Fade, Flex } from '@chakra-ui/react'; -import { Loader } from '../components.js'; +import { Loader } from '../loader/loader.js'; const LoaderOverlay = (): JSX.Element => { return ( - - - + + + + + ); }; From f9cda0afbd908a46f8a3207fec48e526d6b44bbe Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 16:54:07 +0300 Subject: [PATCH 033/128] OV-6: * constant name --- .../common/components/loader/libs/constants/constants.ts | 2 +- .../loader/libs/constants/spin-animation.constant.ts | 4 ++-- frontend/src/bundles/common/components/loader/loader.tsx | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/frontend/src/bundles/common/components/loader/libs/constants/constants.ts b/frontend/src/bundles/common/components/loader/libs/constants/constants.ts index e530775ac..f02cfb0a2 100644 --- a/frontend/src/bundles/common/components/loader/libs/constants/constants.ts +++ b/frontend/src/bundles/common/components/loader/libs/constants/constants.ts @@ -1 +1 @@ -export { spin } from './spin-animation.constant.js'; +export { SPIN_ANIMATION } from './spin-animation.constant.js'; diff --git a/frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts b/frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts index dd122fc85..163609b40 100644 --- a/frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts +++ b/frontend/src/bundles/common/components/loader/libs/constants/spin-animation.constant.ts @@ -1,8 +1,8 @@ import { keyframes } from '@chakra-ui/react'; -const spin = keyframes` +const SPIN_ANIMATION = keyframes` 0% { transform: rotate(0deg);} 100% { transform: rotate(360deg)} `; -export { spin }; +export { SPIN_ANIMATION }; diff --git a/frontend/src/bundles/common/components/loader/loader.tsx b/frontend/src/bundles/common/components/loader/loader.tsx index 2f2355e58..abc763d3d 100644 --- a/frontend/src/bundles/common/components/loader/loader.tsx +++ b/frontend/src/bundles/common/components/loader/loader.tsx @@ -1,6 +1,6 @@ import { Box, Circle, Flex, Text } from '@chakra-ui/react'; -import { spin } from './libs/constants/constants.js'; +import { SPIN_ANIMATION } from './libs/constants/constants.js'; const Loader = (): JSX.Element => { return ( @@ -19,7 +19,7 @@ const Loader = (): JSX.Element => { borderWidth="5px" borderColor="shadow.200" borderTopColor="brand.secondary.300" - animation={`${spin} 1s linear infinite`} + animation={`${SPIN_ANIMATION} 1s linear infinite`} > From 4e10c8222bc219fc0ed22c7790933ab9af5dd95c Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 16:54:58 +0300 Subject: [PATCH 034/128] OV-6: * exports --- frontend/src/bundles/common/components/components.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/src/bundles/common/components/components.ts b/frontend/src/bundles/common/components/components.ts index d2d0d1986..6bf7bee06 100644 --- a/frontend/src/bundles/common/components/components.ts +++ b/frontend/src/bundles/common/components/components.ts @@ -1,6 +1,7 @@ export { Button } from './button/button.js'; export { Input } from './input/input.js'; export { Link } from './link/link.js'; +export { Loader } from './loader/loader.js'; export { LoaderOverlay } from './loader-overlay/loader-overlay.js'; export { RouterProvider } from './router-provider/router-provider.js'; export { From 580d235f7ed2f53e9041ce8bfdd0d8df065166ab Mon Sep 17 00:00:00 2001 From: Sergiy Date: Mon, 19 Aug 2024 16:55:56 +0300 Subject: [PATCH 035/128] OV-6: * loaderOverlay component --- .../common/components/loader-overlay/loader-overlay.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx index c6a085991..018ca7a06 100644 --- a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx +++ b/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx @@ -2,9 +2,13 @@ import { Fade, Flex } from '@chakra-ui/react'; import { Loader } from '../loader/loader.js'; -const LoaderOverlay = (): JSX.Element => { +type Properties = { + isOpen: boolean; +}; + +const LoaderOverlay = ({ isOpen }: Properties): JSX.Element => { return ( - + Date: Mon, 19 Aug 2024 17:12:06 +0300 Subject: [PATCH 036/128] OV-6: * loaderOverlay component --- frontend/src/bundles/common/components/components.ts | 2 +- .../loader-overlay.tsx => overlay/overlay.tsx} | 9 ++++----- 2 files changed, 5 insertions(+), 6 deletions(-) rename frontend/src/bundles/common/components/{loader-overlay/loader-overlay.tsx => overlay/overlay.tsx} (73%) diff --git a/frontend/src/bundles/common/components/components.ts b/frontend/src/bundles/common/components/components.ts index 6bf7bee06..c453d5f1a 100644 --- a/frontend/src/bundles/common/components/components.ts +++ b/frontend/src/bundles/common/components/components.ts @@ -2,7 +2,7 @@ export { Button } from './button/button.js'; export { Input } from './input/input.js'; export { Link } from './link/link.js'; export { Loader } from './loader/loader.js'; -export { LoaderOverlay } from './loader-overlay/loader-overlay.js'; +export { Overlay } from './overlay/overlay.js'; export { RouterProvider } from './router-provider/router-provider.js'; export { Box, diff --git a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx b/frontend/src/bundles/common/components/overlay/overlay.tsx similarity index 73% rename from frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx rename to frontend/src/bundles/common/components/overlay/overlay.tsx index 018ca7a06..f1fc4e5ee 100644 --- a/frontend/src/bundles/common/components/loader-overlay/loader-overlay.tsx +++ b/frontend/src/bundles/common/components/overlay/overlay.tsx @@ -1,12 +1,11 @@ import { Fade, Flex } from '@chakra-ui/react'; -import { Loader } from '../loader/loader.js'; - type Properties = { isOpen: boolean; + children: React.ReactNode; }; -const LoaderOverlay = ({ isOpen }: Properties): JSX.Element => { +const Overlay = ({ isOpen, children }: Properties): JSX.Element => { return ( { justifyContent="center" alignItems="center" > - + {children} ); }; -export { LoaderOverlay }; +export { Overlay }; From 60dec102faefcda40e7e50282ab3ea42db6c0c12 Mon Sep 17 00:00:00 2001 From: Luis Felix Date: Mon, 19 Aug 2024 10:20:22 -0400 Subject: [PATCH 037/128] OV-4: * Improvement in sign-up form validations --- .../components/sign-up-form/sign-up-form.tsx | 29 +++++++++++++------ .../common/components/button/button.tsx | 5 ++-- .../bundles/common/components/components.ts | 2 ++ .../components/form-error/form-error.tsx | 19 ++++++++++++ .../enums/user-validation-message.enum.ts | 8 +++-- .../users/enums/user-validation-rule.enum.ts | 5 +++- .../user-sign-up.validation-schema.ts | 29 ++++++++++++++++--- 7 files changed, 78 insertions(+), 19 deletions(-) create mode 100644 frontend/src/bundles/common/components/form-error/form-error.tsx diff --git a/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx b/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx index c3ba658eb..d00052912 100644 --- a/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx +++ b/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx @@ -1,3 +1,5 @@ +import { UserValidationMessage } from 'shared/src/bundles/users/users.js'; + import { Box, Button, @@ -9,8 +11,9 @@ import { Text, VStack, } from '~/bundles/common/components/components.js'; -import { AppRoute } from '~/bundles/common/enums/enums.js'; -import { useAppForm } from '~/bundles/common/hooks/hooks.js'; +import { FormError } from '~/bundles/common/components/form-error/form-error.js'; +import { AppRoute, DataStatus } from '~/bundles/common/enums/enums.js'; +import { useAppForm, useAppSelector } from '~/bundles/common/hooks/hooks.js'; import { type UserSignUpRequestDto, userSignUpValidationSchema, @@ -23,13 +26,17 @@ type Properties = { }; const SignUpForm: React.FC = ({ onSubmit }) => { + const { dataStatus } = useAppSelector(({ auth }) => ({ + dataStatus: auth.dataStatus, + })); const form = useAppForm({ initialValues: DEFAULT_SIGN_UP_PAYLOAD, validationSchema: userSignUpValidationSchema, onSubmit, + mode: 'onChange', }); - const { handleSubmit } = form; + const { handleSubmit, isValid } = form; return ( @@ -43,26 +50,30 @@ const SignUpForm: React.FC = ({ onSubmit }) => { - - - - ); -}; - -export { PasswordInput }; From 95c3a324d086e7914e4f2f047ea87ef9f4906633 Mon Sep 17 00:00:00 2001 From: Luis Felix Date: Mon, 19 Aug 2024 19:52:05 -0400 Subject: [PATCH 048/128] OV-4: * change names to match, the one already made --- .../users/enums/user-validation-message.enum.ts | 4 ++-- .../user-sign-up.validation-schema.ts | 14 +++++++------- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/shared/src/bundles/users/enums/user-validation-message.enum.ts b/shared/src/bundles/users/enums/user-validation-message.enum.ts index e8ef590b3..90decf5d5 100644 --- a/shared/src/bundles/users/enums/user-validation-message.enum.ts +++ b/shared/src/bundles/users/enums/user-validation-message.enum.ts @@ -1,8 +1,8 @@ const UserValidationMessage = { FIELD_IS_REQUIRE: 'Please fill out this field', - EMAIL_WRONG: 'Please enter a valid email', + EMAIL_INVALID: 'Please enter a valid email', + PASSWORD_LENGTH: 'Password must have from 6 to 12 characters', PASS_DONT_MATCH: 'Passwords must be identical', - PASS_WRONG: 'Password must have from 6 to 12 characters', USER_IS_NOT_AVAILABLE: 'User with this email already exists. Log in if it is you', } as const; diff --git a/shared/src/bundles/users/validation-schemas/user-sign-up.validation-schema.ts b/shared/src/bundles/users/validation-schemas/user-sign-up.validation-schema.ts index 0af9d16d3..785644fca 100644 --- a/shared/src/bundles/users/validation-schemas/user-sign-up.validation-schema.ts +++ b/shared/src/bundles/users/validation-schemas/user-sign-up.validation-schema.ts @@ -18,31 +18,31 @@ const userSignUp = z .string() .trim() .min(UserValidationRule.EMAIL_MINIMUM_LENGTH, { - message: UserValidationMessage.EMAIL_WRONG, + message: UserValidationMessage.EMAIL_INVALID, }) .max(UserValidationRule.EMAIL_MAXIMUM_LENGTH, { - message: UserValidationMessage.EMAIL_WRONG, + message: UserValidationMessage.EMAIL_INVALID, }) .email({ - message: UserValidationMessage.EMAIL_WRONG, + message: UserValidationMessage.EMAIL_INVALID, }), password: z .string() .trim() .min(UserValidationRule.PASSWORD_MINIMUM_LENGTH, { - message: UserValidationMessage.PASS_WRONG, + message: UserValidationMessage.PASSWORD_LENGTH, }) .max(UserValidationRule.PASSWORD_MAXIMUM_LENGTH, { - message: UserValidationMessage.PASS_WRONG, + message: UserValidationMessage.PASSWORD_LENGTH, }), confirmPassword: z .string() .trim() .min(UserValidationRule.PASSWORD_MINIMUM_LENGTH, { - message: UserValidationMessage.PASS_WRONG, + message: UserValidationMessage.PASSWORD_LENGTH, }) .max(UserValidationRule.PASSWORD_MAXIMUM_LENGTH, { - message: UserValidationMessage.PASS_WRONG, + message: UserValidationMessage.PASSWORD_LENGTH, }), }) .required() From 253804a9ec716a5588b2f75019a0fd32929eba54 Mon Sep 17 00:00:00 2001 From: Luis Felix Date: Mon, 19 Aug 2024 19:53:32 -0400 Subject: [PATCH 049/128] OV-4: * change to match layout already made --- frontend/src/app/app.tsx | 57 ++------------ frontend/src/bundles/auth/pages/auth.tsx | 24 ++++-- .../framework/theme/styles/colors.styles.ts | 17 +++++ .../theme/styles/components.styles.ts | 76 ++++++++++++++++++- 4 files changed, 115 insertions(+), 59 deletions(-) diff --git a/frontend/src/app/app.tsx b/frontend/src/app/app.tsx index e1f671b35..671be91a9 100644 --- a/frontend/src/app/app.tsx +++ b/frontend/src/app/app.tsx @@ -1,61 +1,18 @@ -import reactLogo from '~/assets/img/react.svg'; -import { Link, RouterOutlet } from '~/bundles/common/components/components.js'; +import { RouterOutlet } from '~/bundles/common/components/components.js'; import { AppRoute } from '~/bundles/common/enums/enums.js'; -import { - useAppDispatch, - useAppSelector, - useEffect, - useLocation, -} from '~/bundles/common/hooks/hooks.js'; -import { actions as userActions } from '~/bundles/users/store/users.js'; +import { useLocation } from '~/bundles/common/hooks/hooks.js'; const App: React.FC = () => { const { pathname } = useLocation(); - const dispatch = useAppDispatch(); - const { users, dataStatus } = useAppSelector(({ users }) => ({ - users: users.users, - dataStatus: users.dataStatus, - })); - const isRoot = pathname === AppRoute.ROOT; - - useEffect(() => { - if (isRoot) { - void dispatch(userActions.loadAll()); - } - }, [isRoot, dispatch]); + const isAuth = + pathname === AppRoute.SIGN_IN || pathname === AppRoute.SIGN_UP; return ( <> - logo - -
    -
  • - Root -
    • -
  • - Sign in -
    • -
  • - Sign up -
    • -
-

Current path: {pathname}

- -
- -
- {isRoot && ( - <> -

Users:

-

Status: {dataStatus}

-
    - {users.map((it) => ( -
  • {it.email}
    • - ))} -
- - )} + {/* TODO Header */} + {!isAuth && 'Header'} + ); }; diff --git a/frontend/src/bundles/auth/pages/auth.tsx b/frontend/src/bundles/auth/pages/auth.tsx index f15c3e020..612a0ffcb 100644 --- a/frontend/src/bundles/auth/pages/auth.tsx +++ b/frontend/src/bundles/auth/pages/auth.tsx @@ -1,5 +1,6 @@ import { Navigate } from 'react-router-dom'; +import { Center, SimpleGrid } from '~/bundles/common/components/components.js'; import { AppRoute, DataStatus } from '~/bundles/common/enums/enums.js'; import { useAppDispatch, @@ -30,6 +31,10 @@ const Auth: React.FC = () => { [dispatch], ); + if(dataStatus === DataStatus.FULFILLED) { + return ; + } + const getScreen = (screen: string): React.ReactNode => { switch (screen) { case AppRoute.SIGN_IN: { @@ -43,15 +48,18 @@ const Auth: React.FC = () => { return null; }; - if(dataStatus === DataStatus.FULFILLED) { - return ; - } - return ( - <> - state: {dataStatus} - {getScreen(pathname)} - + + {/* TODO: Replace with valid loader */} + {dataStatus === DataStatus.PENDING && ( +

+ Loading... +

+ )} +
{getScreen(pathname)}
+ {/* TODO: Add logo */} +
LOGO
+ ); }; diff --git a/frontend/src/framework/theme/styles/colors.styles.ts b/frontend/src/framework/theme/styles/colors.styles.ts index 75c91a9c5..78fc063ee 100644 --- a/frontend/src/framework/theme/styles/colors.styles.ts +++ b/frontend/src/framework/theme/styles/colors.styles.ts @@ -1,7 +1,24 @@ const colors = { + white: '#ffffff', + background: { + 900: '#0a0049', + 600: '#35399a', + 300: '#3c9cf5', + 50: '#e2e1ec', + }, brand: { 900: '#1a365d', 200: '#b3e0ff', + secondary: { + 300: '#ff6e1c', + 600: '#eb5500', + 900: '#e13b00', + }, + }, + typography: { + 900: '#181b1a', + 600: '#616271', + 300: '#989898', }, text: { default: '#36454f', diff --git a/frontend/src/framework/theme/styles/components.styles.ts b/frontend/src/framework/theme/styles/components.styles.ts index 2e62e5878..417d40ef9 100644 --- a/frontend/src/framework/theme/styles/components.styles.ts +++ b/frontend/src/framework/theme/styles/components.styles.ts @@ -1,7 +1,81 @@ +import { colors } from './colors.styles.js'; + const components = { Heading: { baseStyle: { - color: 'text.accent', + color: colors.text.accent, + }, + }, + Button: { + variants: { + solid: { + color: colors.white, + bgColor: colors.brand.secondary[300], + _hover: { + bg: colors.brand.secondary[600], + _disabled: { + bg: colors.brand.secondary[600], + }, + }, + }, + ghostIcon: { + color: colors.white, + _hover: { + color: colors.brand.secondary[300], + }, + }, + }, + }, + Link: { + variants: { + primary: { + color: colors.text.default, + }, + secondary: { + color: colors.brand.secondary[300], + _hover: { + color: colors.brand.secondary[600], + }, + }, + }, + baseStyle: { + _hover: { + textDecoration: 'none', + }, + }, + }, + Input: { + variants: { + outline: { + field: { + _focus: { + borderWidth: '2px', + borderColor: colors.brand.secondary[300], + boxShadow: 'none', + }, + _placeholder: { + color: colors.typography[300], + }, + _invalid: { + borderWidth: '2px', + borderColor: colors.brand.secondary[900], + boxShadow: 'none', + }, + _autofill: { + textFillColor: colors.white, + caretColor: colors.white, + boxShadow: '0 0 0 0 inherit inset', + transition: 'background-color 5000s ease-in-out 0s', + }, + }, + }, + }, + }, + FormError: { + baseStyle: { + text: { + color: colors.brand.secondary[900], + }, }, }, }; From d32bc9f66c4711ea608189c254e066dfa1b8802a Mon Sep 17 00:00:00 2001 From: XCODE89 Date: Mon, 19 Aug 2024 20:13:05 -0400 Subject: [PATCH 050/128] OV-9: * format correction --- .../src/router/components/protected-route.tsx | 1 - frontend/src/router/routes.tsx | 22 +++++++++---------- .../src/router/routes/protected-routes.tsx | 8 +++---- frontend/src/router/routes/public-routes.tsx | 8 +++---- 4 files changed, 18 insertions(+), 21 deletions(-) diff --git a/frontend/src/router/components/protected-route.tsx b/frontend/src/router/components/protected-route.tsx index d021f5cdc..2f55ae9d6 100644 --- a/frontend/src/router/components/protected-route.tsx +++ b/frontend/src/router/components/protected-route.tsx @@ -10,7 +10,6 @@ const ProtectedRoute: React.FC = () => { if (dataStatus !== DataStatus.FULFILLED) { return ; } - return ; }; diff --git a/frontend/src/router/routes.tsx b/frontend/src/router/routes.tsx index e77d8ed47..142ff054b 100644 --- a/frontend/src/router/routes.tsx +++ b/frontend/src/router/routes.tsx @@ -4,16 +4,14 @@ import { AppRoute } from '~/bundles/common/enums/app-route.enum.js'; import { protectedRoutes } from './routes/protected-routes.js'; import { publicRoutes } from './routes/public-routes.js'; -const routes = [ - { - path: AppRoute.ROOT, - element: , - children: [ - protectedRoutes, - ...publicRoutes, - ], - }, - ]; - - export { routes }; +const routes = [{ + path: AppRoute.ROOT, + element: , + children: [ + protectedRoutes, + ...publicRoutes, + ], +}]; + +export { routes }; \ No newline at end of file diff --git a/frontend/src/router/routes/protected-routes.tsx b/frontend/src/router/routes/protected-routes.tsx index be641e859..212994025 100644 --- a/frontend/src/router/routes/protected-routes.tsx +++ b/frontend/src/router/routes/protected-routes.tsx @@ -10,12 +10,12 @@ const protectedRoutes = { children: [ //TODO Add protected routes here in element property and specify the correct path { - path: AppRoute.PROTECTED, - element: (
test
) + path: AppRoute.PROTECTED, + element: (
test
) }, { - path: AppRoute.ANY, - element: + path: AppRoute.ANY, + element: }, ] }; diff --git a/frontend/src/router/routes/public-routes.tsx b/frontend/src/router/routes/public-routes.tsx index e87c6614f..33c9fcf6c 100644 --- a/frontend/src/router/routes/public-routes.tsx +++ b/frontend/src/router/routes/public-routes.tsx @@ -6,16 +6,16 @@ import { AppRoute } from '~/bundles/common/enums/app-route.enum.js'; const publicRoutes = [ { path: AppRoute.SIGN_IN, - element: , + element: }, { path: AppRoute.SIGN_UP, - element: , + element: }, { path: AppRoute.ANY, - element: , + element: } ]; -export { publicRoutes }; \ No newline at end of file +export { publicRoutes }; From 3f8f21bb0346003f4476a1bebc8ddb78fc697cda Mon Sep 17 00:00:00 2001 From: XCODE89 Date: Mon, 19 Aug 2024 20:23:12 -0400 Subject: [PATCH 051/128] OV-9: * format correction-2 --- frontend/src/router/routes.tsx | 3 +-- frontend/src/router/routes/protected-routes.tsx | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/frontend/src/router/routes.tsx b/frontend/src/router/routes.tsx index 142ff054b..d728f93e1 100644 --- a/frontend/src/router/routes.tsx +++ b/frontend/src/router/routes.tsx @@ -12,6 +12,5 @@ const routes = [{ ...publicRoutes, ], }]; - + export { routes }; - \ No newline at end of file diff --git a/frontend/src/router/routes/protected-routes.tsx b/frontend/src/router/routes/protected-routes.tsx index 212994025..ec64a52c1 100644 --- a/frontend/src/router/routes/protected-routes.tsx +++ b/frontend/src/router/routes/protected-routes.tsx @@ -10,7 +10,7 @@ const protectedRoutes = { children: [ //TODO Add protected routes here in element property and specify the correct path { - path: AppRoute.PROTECTED, + path: AppRoute.PROTECTED, element: (
test
) }, { From dcff05901767014ecc159cc34e8ea37ddf58a602 Mon Sep 17 00:00:00 2001 From: Luis Felix Date: Mon, 19 Aug 2024 20:27:24 -0400 Subject: [PATCH 052/128] OV-4: * improvement styles in sign-up form --- .../components/sign-up-form/sign-up-form.tsx | 48 ++++++++++++------- .../common/components/button/button.tsx | 23 +++++++-- .../bundles/common/components/components.ts | 5 +- .../bundles/common/components/link/link.tsx | 6 ++- 4 files changed, 59 insertions(+), 23 deletions(-) diff --git a/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx b/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx index d00052912..98bcdffa0 100644 --- a/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx +++ b/frontend/src/bundles/auth/components/sign-up-form/sign-up-form.tsx @@ -4,21 +4,18 @@ import { Box, Button, FormProvider, - Heading, Input, Link, - PasswordInput, - Text, VStack, } from '~/bundles/common/components/components.js'; -import { FormError } from '~/bundles/common/components/form-error/form-error.js'; import { AppRoute, DataStatus } from '~/bundles/common/enums/enums.js'; -import { useAppForm, useAppSelector } from '~/bundles/common/hooks/hooks.js'; +import { useAppForm, useAppSelector, useMemo } from '~/bundles/common/hooks/hooks.js'; import { type UserSignUpRequestDto, userSignUpValidationSchema, } from '~/bundles/users/users.js'; +import { FormError, FormHeader, PasswordInput } from '../common/components.js'; import { DEFAULT_SIGN_UP_PAYLOAD } from './constants/constants.js'; type Properties = { @@ -33,18 +30,29 @@ const SignUpForm: React.FC = ({ onSubmit }) => { initialValues: DEFAULT_SIGN_UP_PAYLOAD, validationSchema: userSignUpValidationSchema, onSubmit, - mode: 'onChange', }); - const { handleSubmit, isValid } = form; + const { handleSubmit, errors, values } = form; + + const isEmpty = useMemo( + () => Object.values(values).some((value) => value.trim().length === 0), + [values], + ); return ( - - Create an account - Already registerd? - Log In - + + + Already registerd?{' '} + + Log In + + + } + />
= ({ onSubmit }) => { /> + + +
+ + ); +}; + +export { VideoPreview }; From 742e62ab7a0a112c72ff29a1422722d9fdd5f8a1 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Wed, 21 Aug 2024 10:09:48 +0300 Subject: [PATCH 105/128] OV-18: + exports --- .../video-modal-content/libs/components/components.ts | 2 ++ 1 file changed, 2 insertions(+) create mode 100644 frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/components.ts diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/components.ts b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/components.ts new file mode 100644 index 000000000..d179bd19c --- /dev/null +++ b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/components.ts @@ -0,0 +1,2 @@ +export { Tab } from './tab/tab.js'; +export { VideoPreview } from './video-preview/video-preview.js'; From 0dbf2cedf56d39a9d2d44c6a0d05fadc91c4c590 Mon Sep 17 00:00:00 2001 From: Sergiy Date: Wed, 21 Aug 2024 10:11:18 +0300 Subject: [PATCH 106/128] OV-18: - old files --- .../bundles/common/components/modal/modal.tsx | 36 ------------------- .../libs/components/components.ts | 1 - .../video-modal-side-bar.tsx | 34 ------------------ 3 files changed, 71 deletions(-) delete mode 100644 frontend/src/bundles/common/components/modal/modal.tsx delete mode 100644 frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/libs/components/components.ts delete mode 100644 frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/video-modal-side-bar.tsx diff --git a/frontend/src/bundles/common/components/modal/modal.tsx b/frontend/src/bundles/common/components/modal/modal.tsx deleted file mode 100644 index e10682e5d..000000000 --- a/frontend/src/bundles/common/components/modal/modal.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import { - Modal as ChakraModal, - ModalBody, - ModalCloseButton, - ModalContent, - ModalHeader, - ModalOverlay, -} from '@chakra-ui/react'; -import { type ReactNode } from 'react'; - -type Properties = { - isOpen: boolean; - closeModal: () => void; - title?: string; - children: ReactNode; -}; - -const Modal = ({ - isOpen, - closeModal, - title, - children, -}: Properties): JSX.Element => { - return ( - - - - {title} - - {children} - - - ); -}; - -export { Modal }; diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/libs/components/components.ts b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/libs/components/components.ts deleted file mode 100644 index e5eeec838..000000000 --- a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/libs/components/components.ts +++ /dev/null @@ -1 +0,0 @@ -export { Tab } from './tab/tab.js'; diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/video-modal-side-bar.tsx b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/video-modal-side-bar.tsx deleted file mode 100644 index 3948c46f6..000000000 --- a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-side-bar/video-modal-side-bar.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import { TabList, TabPanel, TabPanels, Tabs } from '@chakra-ui/react'; - -import { Tab } from './libs/components/components.js'; - -const VideoModalSideBar = (): JSX.Element => { - return ( - - - - - - - - -

one!

- - -

two!

- - -

three!

- - - - ); -}; - -export { VideoModalSideBar }; From 68796b7cfae4964828c834b6acf7bd79648b094c Mon Sep 17 00:00:00 2001 From: Sergiy Date: Wed, 21 Aug 2024 10:12:34 +0300 Subject: [PATCH 107/128] OV-18: + VideoModalContent component --- .../video-modal/libs/components/components.ts | 2 +- .../video-modal-content.tsx | 24 +++++++++++++++++++ 2 files changed, 25 insertions(+), 1 deletion(-) create mode 100644 frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/video-modal-content.tsx diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/components.ts b/frontend/src/bundles/common/components/video-modal/libs/components/components.ts index 5f623fe39..9ba9d1e9d 100644 --- a/frontend/src/bundles/common/components/video-modal/libs/components/components.ts +++ b/frontend/src/bundles/common/components/video-modal/libs/components/components.ts @@ -1 +1 @@ -export { VideoModalSideBar } from './video-modal-side-bar/video-modal-side-bar.js'; +export { VideoModalContent } from './video-modal-content/video-modal-content.js'; diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/video-modal-content.tsx b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/video-modal-content.tsx new file mode 100644 index 000000000..01524e5a7 --- /dev/null +++ b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/video-modal-content.tsx @@ -0,0 +1,24 @@ +import { TabList, TabPanel, TabPanels, Tabs } from '@chakra-ui/react'; + +import { Tab, VideoPreview } from './libs/components/components.js'; + +const VideoModalContent = (): JSX.Element => { + return ( + + + + + + + + + + + ); +}; + +export { VideoModalContent }; From d2bec02e2ff5dbb6c612dd0478fea4204607485c Mon Sep 17 00:00:00 2001 From: Sergiy Date: Wed, 21 Aug 2024 10:13:52 +0300 Subject: [PATCH 108/128] OV-18: + VideoModal component --- .../bundles/common/components/components.ts | 1 + .../components/video-modal/video-modal.tsx | 45 +++++++++++++++++-- 2 files changed, 43 insertions(+), 3 deletions(-) diff --git a/frontend/src/bundles/common/components/components.ts b/frontend/src/bundles/common/components/components.ts index c453d5f1a..82afbde76 100644 --- a/frontend/src/bundles/common/components/components.ts +++ b/frontend/src/bundles/common/components/components.ts @@ -4,6 +4,7 @@ export { Link } from './link/link.js'; export { Loader } from './loader/loader.js'; export { Overlay } from './overlay/overlay.js'; export { RouterProvider } from './router-provider/router-provider.js'; +export { VideoModal } from './video-modal/video-modal.js'; export { Box, ChakraProvider as ComponentsProvider, diff --git a/frontend/src/bundles/common/components/video-modal/video-modal.tsx b/frontend/src/bundles/common/components/video-modal/video-modal.tsx index 77d5953e6..934ca60c9 100644 --- a/frontend/src/bundles/common/components/video-modal/video-modal.tsx +++ b/frontend/src/bundles/common/components/video-modal/video-modal.tsx @@ -1,7 +1,46 @@ -import { VideoModalSideBar } from './libs/components/components.js'; +import { + Modal, + ModalBody, + ModalCloseButton, + ModalContent, + ModalHeader, + ModalOverlay, +} from '@chakra-ui/react'; -const VideoModal = (): JSX.Element => { - return ; +import { VideoModalContent } from './libs/components/components.js'; + +type Properties = { + isOpen: boolean; + closeModal: () => void; +}; + +const VideoModal = ({ isOpen, closeModal }: Properties): JSX.Element => { + return ( + + + + + Create video + + + + + + + + ); }; export { VideoModal }; From 2e8f11a0a3acede6c43683ea4aef8f15f242ddb2 Mon Sep 17 00:00:00 2001 From: Oleksandra Nedashkivska Date: Wed, 21 Aug 2024 10:52:23 +0300 Subject: [PATCH 109/128] OV-27: + chakra icons --- frontend/package.json | 1 + package-lock.json | 13 +++++++++++++ 2 files changed, 14 insertions(+) diff --git a/frontend/package.json b/frontend/package.json index 881769413..41ff12932 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -27,6 +27,7 @@ "vite": "5.4.0" }, "dependencies": { + "@chakra-ui/icons": "2.1.1", "@chakra-ui/react": "2.8.2", "@emotion/react": "11.13.0", "@emotion/styled": "11.13.0", diff --git a/package-lock.json b/package-lock.json index 711edfde0..c679dfd41 100644 --- a/package-lock.json +++ b/package-lock.json @@ -71,6 +71,7 @@ "frontend": { "version": "1.0.0", "dependencies": { + "@chakra-ui/icons": "2.1.1", "@chakra-ui/react": "2.8.2", "@emotion/react": "11.13.0", "@emotion/styled": "11.13.0", @@ -803,6 +804,18 @@ "react": ">=18" } }, + "node_modules/@chakra-ui/icons": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@chakra-ui/icons/-/icons-2.1.1.tgz", + "integrity": "sha512-3p30hdo4LlRZTT5CwoAJq3G9fHI0wDc0pBaMHj4SUn0yomO+RcDRlzhdXqdr5cVnzax44sqXJVnf3oQG0eI+4g==", + "dependencies": { + "@chakra-ui/icon": "3.2.0" + }, + "peerDependencies": { + "@chakra-ui/system": ">=2.0.0", + "react": ">=18" + } + }, "node_modules/@chakra-ui/image": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/image/-/image-2.1.0.tgz", From a6158d4f05a84e0d8a3d649abd8ea4d65c912c2a Mon Sep 17 00:00:00 2001 From: Sergiy Date: Wed, 21 Aug 2024 11:29:38 +0300 Subject: [PATCH 110/128] OV-18: + enum --- .../libs/components/video-preview/libs/enums/enums.ts | 1 + .../components/video-preview/libs/enums/video-sizes.enum.ts | 6 ++++++ 2 files changed, 7 insertions(+) create mode 100644 frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/video-sizes.enum.ts diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/enums.ts b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/enums.ts index 42f29f46e..9a2f32d26 100644 --- a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/enums.ts +++ b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/enums.ts @@ -1 +1,2 @@ export { VideoPreview } from './video-preview.enum.js'; +export { VideoSizeLabel } from './video-sizes.enum.js'; diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/video-sizes.enum.ts b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/video-sizes.enum.ts new file mode 100644 index 000000000..8be9ed814 --- /dev/null +++ b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/libs/enums/video-sizes.enum.ts @@ -0,0 +1,6 @@ +const VideoSizeLabel = { + PORTRAIT: '1080 x 1920', + LANDSCAPE: '1920 x 1080', +} as const; + +export { VideoSizeLabel }; From 8270db92ea18df1027cd3ab9b59a037966facadf Mon Sep 17 00:00:00 2001 From: Sergiy Date: Wed, 21 Aug 2024 11:31:21 +0300 Subject: [PATCH 111/128] OV-18: + icon --- .../libs/components/tab/tab.tsx | 13 +++++-- .../video-preview/video-preview.tsx | 36 +++++++++++++------ 2 files changed, 37 insertions(+), 12 deletions(-) diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/tab/tab.tsx b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/tab/tab.tsx index 1459629a9..ea8761154 100644 --- a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/tab/tab.tsx +++ b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/tab/tab.tsx @@ -1,10 +1,13 @@ -import { Tab as ChakraTab } from '@chakra-ui/react'; +import { Icon, Tab as ChakraTab } from '@chakra-ui/react'; +import { type IconDefinition } from '@fortawesome/free-solid-svg-icons'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; type Properties = { label: string; + icon: IconDefinition; }; -const Tab = ({ label }: Properties): JSX.Element => { +const Tab = ({ label, icon }: Properties): JSX.Element => { return ( { textAlign="left" _selected={{ backgroundColor: 'gray.300' }} > + {' '} {label} ); diff --git a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/video-preview.tsx b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/video-preview.tsx index a86514b0c..8586316f2 100644 --- a/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/video-preview.tsx +++ b/frontend/src/bundles/common/components/video-modal/libs/components/video-modal-content/libs/components/video-preview/video-preview.tsx @@ -1,7 +1,12 @@ -import { Box, Button, Flex, Text } from '@chakra-ui/react'; +import { Button, Flex, Icon, Text } from '@chakra-ui/react'; +import { faPlay } from '@fortawesome/free-solid-svg-icons'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { useCallback, useState } from 'react'; -import { VideoPreview as VideoPreviewValues } from './libs/enums/enums.js'; +import { + VideoPreview as VideoPreviewValues, + VideoSizeLabel, +} from './libs/enums/enums.js'; import { type VideoPreview as VideoPreviewType } from './libs/types/types.js'; const VideoPreview = (): JSX.Element => { @@ -19,23 +24,34 @@ const VideoPreview = (): JSX.Element => { return ( - - - {view === VideoPreviewValues.PORTRAIT - ? '1080 x 1920' - : '1920 x 1080'} - - + + + + {view === VideoPreviewValues.PORTRAIT + ? VideoSizeLabel.PORTRAIT + : VideoSizeLabel.LANDSCAPE} + + +