From b234dc3212d0451cf40179453940eca6f15ca722 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Wed, 28 Jun 2023 10:49:40 +0300 Subject: [PATCH 01/16] refactor: molecules components --- .../molecules/base-field/BaseField.tsx | 94 +++++ .../molecules/category/Category.tsx | 18 +- .../molecules/charts/DoughnutChart.tsx | 188 +++++---- src/components/molecules/header/Header.tsx | 40 +- .../input-password/InputPassword.styled.ts | 19 - .../input-password/InputPassword.tsx | 33 -- .../molecules/popup/PopupAddWallet.tsx | 397 ------------------ .../molecules/popup/PopupDeleteAccount.tsx | 73 ++-- .../molecules/popup/PopupEditProfile.tsx | 369 ---------------- .../molecules/popup/PopupEditWallet.tsx | 136 +++--- .../popup/add-wallet/AddBankdataTab.tsx | 154 +++++++ .../popup/add-wallet/AddWalletTab.tsx | 134 ++++++ .../popup/add-wallet/BankdataInfoMessage.tsx | 35 ++ .../popup/add-wallet/PopupAddWallet.tsx | 97 +++++ .../popup/edit-profile/ChangePasswordTab.tsx | 121 ++++++ .../popup/edit-profile/EditProfileTab.tsx | 102 +++++ .../popup/edit-profile/PopupEditProfile.tsx | 102 +++++ src/components/molecules/select/Select.tsx | 8 +- .../molecules/tabs/filter/TabFilter.tsx | 5 +- .../molecules/tabs/switch/TabSwitch.tsx | 3 +- .../molecules/transaction/Transaction.tsx | 37 +- src/components/molecules/wallet/Wallet.tsx | 7 +- src/components/pages/home/HomePage.tsx | 34 +- src/shared/styles/variables.ts | 2 +- src/shared/utils/field-rules/amount.ts | 13 + src/shared/utils/field-rules/email.ts | 9 + src/shared/utils/field-rules/name.ts | 9 + src/shared/utils/field-rules/password.ts | 22 + src/shared/utils/field-rules/title.ts | 9 + 29 files changed, 1205 insertions(+), 1065 deletions(-) create mode 100644 src/components/molecules/base-field/BaseField.tsx delete mode 100644 src/components/molecules/input-password/InputPassword.styled.ts delete mode 100644 src/components/molecules/input-password/InputPassword.tsx delete mode 100644 src/components/molecules/popup/PopupAddWallet.tsx delete mode 100644 src/components/molecules/popup/PopupEditProfile.tsx create mode 100644 src/components/molecules/popup/add-wallet/AddBankdataTab.tsx create mode 100644 src/components/molecules/popup/add-wallet/AddWalletTab.tsx create mode 100644 src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx create mode 100644 src/components/molecules/popup/add-wallet/PopupAddWallet.tsx create mode 100644 src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx create mode 100644 src/components/molecules/popup/edit-profile/EditProfileTab.tsx create mode 100644 src/components/molecules/popup/edit-profile/PopupEditProfile.tsx create mode 100644 src/shared/utils/field-rules/amount.ts create mode 100644 src/shared/utils/field-rules/email.ts create mode 100644 src/shared/utils/field-rules/name.ts create mode 100644 src/shared/utils/field-rules/password.ts create mode 100644 src/shared/utils/field-rules/title.ts diff --git a/src/components/molecules/base-field/BaseField.tsx b/src/components/molecules/base-field/BaseField.tsx new file mode 100644 index 0000000..81f3f4a --- /dev/null +++ b/src/components/molecules/base-field/BaseField.tsx @@ -0,0 +1,94 @@ +import { Box } from "../../atoms/box/Box.styled"; +import { Label } from "../../atoms/label/Label.styled"; +import { Input } from "../../atoms/input/Input.styled"; + +import { ALMOST_BLACK_FOR_TEXT } from "../../../shared/styles/variables"; + +import VisibilityOff from "../../../shared/assets/icons/visibility-off.svg"; +import VisibilityOn from "../../../shared/assets/icons/visibility-on.svg"; + +type BaseFieldProps = { + fieldType: "text" | "email" | "password"; + name: string; + label: string; + errors: any; + isPasswordVisible?: boolean; + setIsPasswordVisible?: any; + registerOptions?: any; + [key: string]: any; +}; + +const BaseField: React.FC = ({ + fieldType, + name, + label, + errors, + isPasswordVisible, + setIsPasswordVisible, + registerOptions, + ...rest +}) => { + const setInputType = (): "text" | "password" => { + if (fieldType === "password") { + if (isPasswordVisible) { + return "text"; + } else { + return "password"; + } + } + return "text"; + }; + + return ( + + + + {fieldType === "password" && ( + setIsPasswordVisible(!isPasswordVisible)} + style={{ + position: "absolute", + top: "16px", + right: "10px", + cursor: "pointer" + }} + > + {isPasswordVisible ? : } + + )} + + + + {errors?.[name] && <>{errors?.[name]?.message || "Error!"}} + + + ); +}; + +export default BaseField; diff --git a/src/components/molecules/category/Category.tsx b/src/components/molecules/category/Category.tsx index 748526b..62c0795 100644 --- a/src/components/molecules/category/Category.tsx +++ b/src/components/molecules/category/Category.tsx @@ -1,11 +1,21 @@ +import { useAppSelector } from "../../../store/hooks"; + +import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; +import { CategoryWrapper } from "./CategoryWrapper"; + +import { + GREEN, + WHITE, + ALERT_1, + PRIMARY, + DARK_FOR_TEXT +} from './../../../shared/styles/variables'; + import IncomeIcon from "../../../shared/assets/icons/income.svg" import ExpenseIcon from "../../../shared/assets/icons/expense.svg" -import { GREEN, WHITE, ALERT_1, PRIMARY, DARK_FOR_TEXT } from './../../../shared/styles/variables'; -import { Box } from "../../atoms/box/Box.styled"; + import { CategoryProps } from "../../../../types/molecules"; -import { useAppSelector } from "../../../store/hooks"; -import { CategoryWrapper } from "./CategoryWrapper"; const Category: React.FC = ({ category }) => { const { activeCategory } = useAppSelector(state => state.category) diff --git a/src/components/molecules/charts/DoughnutChart.tsx b/src/components/molecules/charts/DoughnutChart.tsx index 8774e56..895f182 100644 --- a/src/components/molecules/charts/DoughnutChart.tsx +++ b/src/components/molecules/charts/DoughnutChart.tsx @@ -1,9 +1,13 @@ import { useEffect, useRef } from "react"; + import { Chart } from "chart.js/auto"; +import ChartDataLabels from 'chartjs-plugin-datalabels'; + +import { useAppSelector } from "../../../store/hooks"; + import { Box } from "../../atoms/box/Box.styled"; + import { WHITE } from "../../../shared/styles/variables"; -import { useAppSelector } from "../../../store/hooks"; -import ChartDataLabels from 'chartjs-plugin-datalabels'; type DoughnutChartProps = { data: string[]; @@ -16,104 +20,112 @@ const DoughnutChart: React.FC = ({ labels, isHomePage }) => { - const chartRef = useRef(null); - const chart = useRef(null); + const chartRef = useRef(null); + const chart = useRef(); - const { incomesChart, expensesChart, allOutlaysChart, isLoading } = useAppSelector(state => state.statistics); + const { incomesChart, expensesChart, allOutlaysChart } = useAppSelector(state => state.statistics); - useEffect(() => { - const myDoughnutChartRef = chartRef.current.getContext('2d'); + const calculatePercentage = (value: number, ctx: any): string => { + let sum = 0; + let dataArr = ctx.chart.data.datasets[0].data; + let percentage: any = 0; - if (chart.current) { - chart.current.destroy(); // Destroy the previous chart instance + dataArr.map((data: any) => { + if (typeof data === 'number') { + sum += data; + } + }); + + if (typeof value === 'number') { + percentage = ((value * 100) / sum).toFixed(); } - chart.current = new Chart(myDoughnutChartRef, { - type: 'doughnut', - data: { - labels: labels, - datasets: [ - { - data: data, - backgroundColor: [ - '#7380F0', - '#5DD9AD', - '#E5FC6D', - '#FAB471', - '#D95DB2', - '#6EE4E6', - '#A3FC6D', - '#F2CA68', - '#F06C6F', - '#926DFC', - ], - hoverBackgroundColor: [ - '#7380F0dd', - '#5DD9ADdd', - '#E5FC6Ddd', - '#FAB471dd', - '#D95DB2dd', - '#6EE4E6dd', - '#A3FC6Ddd', - '#F2CA68dd', - '#F06C6Fdd', - '#926DFCdd', - ], - borderWidth: 0, - }, + return percentage + '%'; + } + + const chartData = { + labels: labels, + datasets: [ + { + data: data, + backgroundColor: [ + '#7380F0', + '#5DD9AD', + '#E5FC6D', + '#FAB471', + '#D95DB2', + '#6EE4E6', + '#A3FC6D', + '#F2CA68', + '#F06C6F', + '#926DFC', + ], + hoverBackgroundColor: [ + '#7380F0dd', + '#5DD9ADdd', + '#E5FC6Ddd', + '#FAB471dd', + '#D95DB2dd', + '#6EE4E6dd', + '#A3FC6Ddd', + '#F2CA68dd', + '#F06C6Fdd', + '#926DFCdd', ], + borderWidth: 0, }, - options: { - plugins: { - tooltip: { - callbacks: { - label: (context) => { - const label = context?.dataset?.label || ''; - const value = context?.formattedValue; - return `${label} ${value}₴`; - }, - }, - }, - legend: { - labels: { - font: { - size: 16, - }, - }, + ], + } + + const chartOptions = { + plugins: { + tooltip: { + callbacks: { + label: (context: any) => { + const label = context?.dataset?.label || ''; + const value = context?.formattedValue; + return `${label} ${value}₴`; }, - datalabels: { - formatter: (value, ctx) => { - let sum = 0; - let dataArr = ctx.chart.data.datasets[0].data; - dataArr.map((data: any) => { - if (typeof data === 'number') { - sum += data; - } - }); - let percentage: any = 0; - if (typeof value === 'number') { - percentage = ((value * 100) / sum).toFixed(); - } - return percentage + '%'; - }, - backgroundColor: "rgba(85, 85, 85, 0.35)", - borderRadius: 4, - padding: 6, - color: WHITE, - font: { - size: 13, - family: "Inter", - weight: "bold", - }, + }, + }, + legend: { + labels: { + font: { + size: 16, }, }, - responsive: true, - maintainAspectRatio: false, - animation: { - duration: 1000, + }, + datalabels: { + formatter: calculatePercentage, + backgroundColor: "rgba(85, 85, 85, 0.35)", + borderRadius: 4, + padding: 6, + color: WHITE, + font: { + size: 13, + family: "Inter", + weight: "bold" as const, }, }, - // Add the datalabels plugin + }, + responsive: true, + maintainAspectRatio: false, + animation: { + duration: 1000, + }, + }; + + useEffect(() => { + const myDoughnutChartRef = chartRef.current.getContext('2d'); + + if (chart.current) { + chart.current.destroy(); // Destroy the previous chart instance + } + + chart.current = new Chart(myDoughnutChartRef, { + type: 'doughnut', + data: chartData, + options: chartOptions, plugins: [ChartDataLabels], }); diff --git a/src/components/molecules/header/Header.tsx b/src/components/molecules/header/Header.tsx index 2262b9c..e335316 100644 --- a/src/components/molecules/header/Header.tsx +++ b/src/components/molecules/header/Header.tsx @@ -1,30 +1,32 @@ +import { useContext, useEffect } from "react"; import { Link, useNavigate } from "react-router-dom"; -import LogoIcon from '../../../shared/assets/icons/logo.svg' -import HomeIcon from '../../../shared/assets/icons/home.svg' -import RouteIcon from '../../../shared/assets/icons/route.svg' -import FolderCheckIcon from '../../../shared/assets/icons/folder-check.svg' -import PieChartIcon from '../../../shared/assets/icons/pie-chart.svg' -import SettingsIcon from '../../../shared/assets/icons/settings-header.svg' -import LogoutIcon from '../../../shared/assets/icons/logout.svg' +import { PopupContext } from "../../../contexts/PopupContext"; +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { logoutUser, resetUserState, setIsLoggedOut } from "../../../store/userSlice"; +import { resetWalletState } from "../../../store/walletSlice"; +import { resetCategoryState } from "../../../store/categorySlice"; +import { resetTransactionState } from "../../../store/transactionSlice"; +import { resetStatisticsState } from "../../../store/statisticsSlice"; + +import { HeaderWrapper } from './Header.styled'; import { LinkMenu } from "../../atoms/link/LinkMenu.styled"; import { Box } from './../../atoms/box/Box.styled'; import { Typography } from "../../atoms/typography/Typography.styled"; -import { HeaderWrapper } from './Header.styled'; import { List } from './../../atoms/list/List.styled'; import { ListItem } from './../../atoms/list/ListItem.styled'; import { ButtonTransparent } from "../../atoms/button/ButtonTransparent.styled"; -import { useContext, useEffect } from "react"; -import { PopupContext } from "../../../contexts/PopupContext"; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { logoutUser, resetUserState, setIsLoggedOut } from "../../../store/userSlice"; -import PopupEditProfile from "../popup/PopupEditProfile"; +import PopupEditProfile from "../popup/edit-profile/PopupEditProfile"; import PopupDeleteAccount from "../popup/PopupDeleteAccount"; -import { resetWalletState } from "../../../store/walletSlice"; -import { resetCategoryState } from "../../../store/categorySlice"; -import { resetTransactionState } from "../../../store/transactionSlice"; -import { resetStatisticsState } from "../../../store/statisticsSlice"; + +import LogoIcon from '../../../shared/assets/icons/logo.svg' +import HomeIcon from '../../../shared/assets/icons/home.svg' +import RouteIcon from '../../../shared/assets/icons/route.svg' +import FolderCheckIcon from '../../../shared/assets/icons/folder-check.svg' +import PieChartIcon from '../../../shared/assets/icons/pie-chart.svg' +import SettingsIcon from '../../../shared/assets/icons/settings-header.svg' +import LogoutIcon from '../../../shared/assets/icons/logout.svg' const Header: React.FC = () => { const dispatch = useAppDispatch() @@ -50,11 +52,11 @@ const Header: React.FC = () => { } }, [isLoggedOut]); - function handleEditProfileClick() { + const handleEditProfileClick = () => { setIsEditProfilePopupOpen(true); }; - function handleLogOutClick() { + const handleLogOutClick = () => { dispatch(logoutUser()); } diff --git a/src/components/molecules/input-password/InputPassword.styled.ts b/src/components/molecules/input-password/InputPassword.styled.ts deleted file mode 100644 index 3067f51..0000000 --- a/src/components/molecules/input-password/InputPassword.styled.ts +++ /dev/null @@ -1,19 +0,0 @@ -import styled from "styled-components"; - -export const InputPasswordWrapper = styled.div` - position: relative; - display: inline-block; - margin-right: 70px; - - > input { - font-size: 16px; - padding-right: 50px; - } - - > svg { - position: absolute; - top: 16px; - right: -50px; - cursor: pointer; - } -` \ No newline at end of file diff --git a/src/components/molecules/input-password/InputPassword.tsx b/src/components/molecules/input-password/InputPassword.tsx deleted file mode 100644 index d68e120..0000000 --- a/src/components/molecules/input-password/InputPassword.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import {Input} from '../../atoms/input/Input.styled'; -import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg' -import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg' -import {useState} from 'react'; -import {InputPasswordWrapper} from './InputPassword.styled'; - -/*type InputPasswordProps = { - labelId?: string; - inputName?: string; - onChangeProps?: (e: React.ChangeEvent) => void; -}*/ -const InputPassword: React.FC/**/ = (/*{labelId, inputName, onChangeProps, ...rest}*/) => { - - - const [showPassword, setShowPassword] = useState(false); - - const toggleShowPassword = () => { - setShowPassword(!showPassword); - }; - - return ( - - - {showPassword ? - - : - - } - - ); -} - -export default InputPassword; \ No newline at end of file diff --git a/src/components/molecules/popup/PopupAddWallet.tsx b/src/components/molecules/popup/PopupAddWallet.tsx deleted file mode 100644 index 185fbe8..0000000 --- a/src/components/molecules/popup/PopupAddWallet.tsx +++ /dev/null @@ -1,397 +0,0 @@ -import { useRef, useState } from "react"; - -import { useForm } from "react-hook-form"; - -import { - ALERT_1, - ALMOST_BLACK_FOR_TEXT, - DIVIDER, - PRIMARY_HOVER, - SUCCESS -} from "../../../shared/styles/variables"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from '../../atoms/button/Button.styled'; -import { Input } from "../../atoms/input/Input.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import CrossIcon from './../../../shared/assets/icons/cross.svg'; -import { PopupWrapper } from "./Popup.styled"; -import React, { useContext, useEffect } from "react"; -import { PopupContext } from "../../../contexts/PopupContext"; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { ButtonPopup } from "../../atoms/button/ButtonPopup"; -import { Form } from "../../atoms/form/Form.styled"; -import { moneyAmountRegex, titleRegex, twoSymbolsRegex } from "../../../shared/utils/regexes"; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { IBankData, IWallet, WalletFormData } from "../../../store/types"; -import { resetError, setActiveWallet, setSuccessStatus, walletAction } from "../../../store/walletSlice"; -import { userId } from "../../../api/api"; -import { MessageProps } from "../../../../types/molecules"; -import PackageSuccessIcon from "../../../shared/assets/icons/package-success.svg"; -import PackageErrorIcon from "../../../shared/assets/icons/package-error.svg"; -import { sendBankData, setBankDataSuccessStatus } from "../../../store/bankDataSlice"; - -const PopupAddWallet: React.FC = () => { - const dispatch = useAppDispatch() - - const { setIsAddWalletPopupOpen } = useContext(PopupContext); - - const [isAddWalletManuallyOpen, setIsAddWalletManuallyOpen] = useState(true); - - const { isAddWalletSuccess } = useAppSelector(state => state.wallet); - - const handleCloseClick = () => { - dispatch(setActiveWallet(null)); - dispatch(resetError()); - dispatch(setSuccessStatus(false)); - dispatch(setBankDataSuccessStatus(false)); - setIsAddWalletPopupOpen(false); - }; - - const handleOpenLeftPart = () => { - setIsAddWalletManuallyOpen(true); - }; - const handleOpenRightPart = () => { - setIsAddWalletManuallyOpen(false); - }; - - useEffect(() => { - if (isAddWalletSuccess) { - handleCloseClick(); - dispatch(setSuccessStatus(false)); - } - }, [isAddWalletSuccess]); - - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - window.addEventListener('keydown', handleKeyPress) - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - return ( - - event.stopPropagation()}> - - - Додати картковий рахунок - - - Ввести дані вручну - Завантажити дані з файлу - - - {isAddWalletManuallyOpen ? ( - - ) : ( - - )} - - - - - ); -} - -const AddWalletTab: React.FC = () => { - const dispatch = useAppDispatch() - - const { setIsAddWalletPopupOpen } = useContext(PopupContext); - - const { - error, - activeWallet, - isAddWalletSuccess, - isLoading - } = useAppSelector(state => state.wallet); - - const { user } = useAppSelector(state => state.user); - - const { - register, - formState: { errors, isValid }, - handleSubmit, - reset - } = useForm({ - mode: "all", - }); - - const handleCloseClick = () => { - reset(); - dispatch(setActiveWallet(null)); - dispatch(resetError()); - dispatch(setSuccessStatus(false)); - dispatch(setBankDataSuccessStatus(false)); - setIsAddWalletPopupOpen(false); - }; - - useEffect(() => { - if (isAddWalletSuccess) { - handleCloseClick(); - } - }, [isAddWalletSuccess]); - - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - window.addEventListener('keydown', handleKeyPress) - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - function handleSubmitWallet(data: WalletFormData) { - const wallet: IWallet = { - title: data.title, - amount: data.amount, - type_of_account: "bank", - owner: user?.id || userId, - } - - dispatch(walletAction({ - data: wallet, - method: "POST", - })) - } - - return ( -
- - - - twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів', - hasTwoLetters: (value) => titleRegex.test(value) || 'Повинно бути не менше 2 літер', - } - })} - type="text" id="title" width="340px" - className={errors.title && 'error'} - defaultValue={activeWallet?.title} - /> - {errors?.title && <>{errors?.title?.message || 'Error!'}} - - - - - {errors?.amount && <>{errors?.amount?.message - || 'Введіть додаткове значення'}} - - - {error && {error}} - - - - -
- ) -} - -const AddBankDataTab: React.FC = () => { - const dispatch = useAppDispatch() - - const { setIsAddWalletPopupOpen } = useContext(PopupContext); - - const [fileValue, setFileValue] = useState(); - - const inputFileRef = useRef(null); - const submitButtonRef = useRef(null); - - const { - error, - activeWallet, - isAddWalletSuccess, - isLoading - } = useAppSelector(state => state.wallet); - const { user } = useAppSelector(state => state.user); - const { isAddBankDataSuccess } = useAppSelector(state => state.bankData); - - const { - register, - formState: { errors, isValid }, - handleSubmit, - reset - } = useForm({ mode: "all" }); - - const handleCloseClick = () => { - reset(); - dispatch(setActiveWallet(null)); - dispatch(resetError()); - dispatch(setSuccessStatus(false)); - dispatch(setBankDataSuccessStatus(false)); - setIsAddWalletPopupOpen(false); - }; - - useEffect(() => { - if (isAddBankDataSuccess) { - handleCloseClick(); - dispatch(setBankDataSuccessStatus(false)); - } - }, [isAddBankDataSuccess]); - - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - window.addEventListener('keydown', handleKeyPress) - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - function handleSubmitBankData(data: IBankData) { - const formData: any = new FormData(); - formData.append('file', fileValue); - formData.append('owner', user?.id || userId); - formData.append('wallettitle', data.wallettitle); - - dispatch(sendBankData(formData)); - } - - return ( -
- - - - twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів', - hasTwoLetters: (value) => titleRegex.test(value) || 'Повинно бути не менше 2 літер', - } - })} - type="text" id="wallettitle" width="340px" - className={errors.wallettitle && 'error'} - defaultValue={activeWallet?.title} - /> - {errors?.wallettitle && <>{errors?.wallettitle?.message || 'Error!'}} - - - - - setFileValue(e.target.files[0])} - multiple={false} - style={{ display: "none" }} - /> - - {error && } - {isAddWalletSuccess && } - - - - - {error && {error}} - - - - - -
- ) -} - -const Message: React.FC = ({ message }) => { - return ( - - {message === "success" ? ( - - ) : ( - - )} - - {message === "success" ? ( - "Файл успішно додано" - ) : ( - "Виникла помилка" - )} - - - ); -} - -export default PopupAddWallet; \ No newline at end of file diff --git a/src/components/molecules/popup/PopupDeleteAccount.tsx b/src/components/molecules/popup/PopupDeleteAccount.tsx index 299560f..8c8568b 100644 --- a/src/components/molecules/popup/PopupDeleteAccount.tsx +++ b/src/components/molecules/popup/PopupDeleteAccount.tsx @@ -1,20 +1,30 @@ -import React, { useContext, useEffect } from "react"; +import { useContext, useEffect } from "react"; +import { useNavigate } from 'react-router-dom'; + import { useForm } from "react-hook-form"; + import { PopupContext } from "../../../contexts/PopupContext"; + import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from '../../atoms/button/Button.styled'; -import CrossIcon from './../../../shared/assets/icons/cross.svg'; -import { PopupWrapper } from "./Popup.styled"; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { Form } from "../../atoms/form/Form.styled"; -import { deleteUserAccount, resetDeleteUserAccountError, resetUserState, setIsAccountDeleted } from "../../../store/userSlice"; -import { useNavigate } from 'react-router-dom'; +import { + deleteUserAccount, + resetDeleteUserAccountError, + resetUserState, + setIsAccountDeleted +} from "../../../store/userSlice"; import { resetWalletState } from "../../../store/walletSlice"; import { resetCategoryState } from "../../../store/categorySlice"; import { resetTransactionState } from "../../../store/transactionSlice"; import { resetStatisticsState } from "../../../store/statisticsSlice"; +import { Box } from "../../atoms/box/Box.styled"; +import { Button } from '../../atoms/button/Button.styled'; +import { Typography } from '../../atoms/typography/Typography.styled'; +import { Form } from "../../atoms/form/Form.styled"; +import { PopupWrapper } from "./Popup.styled"; + +import CrossIcon from './../../../shared/assets/icons/cross.svg'; + const PopupDeleteAccount: React.FC = () => { const dispatch = useAppDispatch(); const navigate = useNavigate(); @@ -22,9 +32,7 @@ const PopupDeleteAccount: React.FC = () => { const { setIsDeleteAccountPopupOpen, setIsEditProfilePopupOpen } = useContext(PopupContext); const { isAccountDeleted, isLoading } = useAppSelector(state => state.user) - const { - handleSubmit, - } = useForm(); + const { handleSubmit } = useForm(); useEffect(() => { if (isAccountDeleted) { @@ -40,27 +48,29 @@ const PopupDeleteAccount: React.FC = () => { } }, [isAccountDeleted]); - function handleCloseClick() { + const handleCloseClick = () => { dispatch(resetDeleteUserAccountError()); setIsDeleteAccountPopupOpen(false); }; + const handleSub = () => { + dispatch(deleteUserAccount()); + } + useEffect(() => { const handleKeyPress = (event: KeyboardEvent) => { if (event.key === 'Escape') { handleCloseClick() } } - window.addEventListener('keydown', handleKeyPress) + + window.addEventListener('keydown', handleKeyPress); + return () => { window.removeEventListener('keydown', handleKeyPress); }; }, []); - function handleSub() { - dispatch(deleteUserAccount()); - } - return ( event.stopPropagation()}> @@ -68,11 +78,11 @@ const PopupDeleteAccount: React.FC = () => { Видалення аккаунту - Ви збираєтесь видалити свій обліковий запис, цей - процес
- незворотній і всі ваші дані та інформація будуть втрачені.
-
- Підтвердіть операцію. + + Ви збираєтесь видалити свій обліковий запис, цей процес
+ незворотній і всі ваші дані та інформація будуть втрачені.

+ Підтвердіть операцію. +
{ justifyContent="space-between" pt="25px" > - -
- - {/*{deleteUserAccountError && {deleteUserAccountError}}*/} - - - ); -} - -const EditProfileTab: React.FC = () => { - const dispatch = useAppDispatch(); - - const { - setIsEditProfilePopupOpen, - } = useContext(PopupContext); - - const { isProfileChanged, isLoading, user } = useAppSelector(state => state.user); - - const { - register, - formState: { errors, isValid }, - handleSubmit - } = useForm({ mode: "all" }); - - const handleCloseClick = () => { - dispatch(resetProfileEditErrors()); - setIsEditProfilePopupOpen(false); - }; - - useEffect(() => { - if (isProfileChanged) { - dispatch(setSuccessStatus(false)) - handleCloseClick(); - } - }, [isProfileChanged]); - - function handleSubmitChangeProfile(data: IUser) { - dispatch(changeUserProfile(data)) - } - - return ( -
- - - - {errors?.first_name && <>{errors?.first_name?.message || 'Error!'}} - - - - - {errors?.last_name && <>{errors?.last_name?.message || 'Error!'}} - - - - - {errors?.email && <>{errors?.email?.message || 'Error!'}} - - - - - - -
- ) -} - -const ChangePasswordTab: React.FC = () => { - const dispatch = useAppDispatch(); - - const [showOldPassword, setShowOldPassword] = useState(false); - const [showPassword, setShowPassword] = useState(false); - const [showConfirmPassword, setShowConfirmPassword] = useState(false); - - const { isLoading, isPasswordChanged, passwordChangeError } = useAppSelector(state => state.user) - - const { setIsEditProfilePopupOpen } = useContext(PopupContext); - - const { - register, - formState: { errors, isValid }, - handleSubmit, - watch - } = useForm({ - mode: "all", - }); - - useEffect(() => { - if (isPasswordChanged) { - dispatch(setSuccessStatus(false)) - handleCloseClick(); - } - }, [isPasswordChanged]); - - const handleToggleOldPassword = () => { - setShowOldPassword(!showOldPassword); - }; - const handleTogglePassword = () => { - setShowPassword(!showPassword); - }; - const handleToggleConfirmPassword = () => { - setShowConfirmPassword(!showConfirmPassword); - }; - - const handleCloseClick = () => { - dispatch(resetProfileEditErrors()); - setIsEditProfilePopupOpen(false); - }; - - function handleSubmitChangePassword(data: PasswordChangeFormData) { - dispatch(changeUserPassword(data)); - } - - return ( -
- - - - {showOldPassword ? - - : - - } - - - {errors?.old_password && <>{errors?.old_password?.message || 'Error!'}} - - - - - {showPassword ? - - : - - } - - - {errors?.new_password && <>{errors?.new_password?.message || 'Error!'}} - - - - - {showConfirmPassword ? - - : - - } - { - if (watch('new_password') != val) { - return "Паролі не співпадають"; - } - } - })} - style={{ paddingRight: '35px' }} - className={errors.new_password_2 && 'error'} - /> - - {errors?.new_password_2 - && <>{errors?.new_password_2?.message - || 'Обов\'язкове поле для заповнення'}} - - - {passwordChangeError && {passwordChangeError}} - - - - - - -
- ) -} - -export default PopupEditProfile; \ No newline at end of file diff --git a/src/components/molecules/popup/PopupEditWallet.tsx b/src/components/molecules/popup/PopupEditWallet.tsx index bbd26e6..621d215 100644 --- a/src/components/molecules/popup/PopupEditWallet.tsx +++ b/src/components/molecules/popup/PopupEditWallet.tsx @@ -1,22 +1,34 @@ +import React, { useContext, useEffect } from "react"; + import { useForm } from "react-hook-form"; -import { ALERT_1, ALMOST_BLACK_FOR_TEXT, DIVIDER } from "../../../shared/styles/variables"; +import { PopupContext } from "../../../contexts/PopupContext"; + +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { + resetError, + setActiveWallet, + setSuccessStatus, + walletAction +} from "../../../store/walletSlice"; + +import { userId } from "../../../api/api"; + import { Box } from "../../atoms/box/Box.styled"; import { Button } from '../../atoms/button/Button.styled'; -import { Input } from "../../atoms/input/Input.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import CrossIcon from './../../../shared/assets/icons/cross.svg'; -import { PopupWrapper } from "./Popup.styled"; -import React, { useContext, useEffect } from "react"; -import { PopupContext } from "../../../contexts/PopupContext"; import { Typography } from '../../atoms/typography/Typography.styled'; import { ButtonLink } from "../../atoms/button/ButtonLink"; import { Form } from "../../atoms/form/Form.styled"; -import { moneyAmountRegex, titleRegex, twoSymbolsRegex } from "../../../shared/utils/regexes"; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { PopupWrapper } from "./Popup.styled"; + +import CrossIcon from './../../../shared/assets/icons/cross.svg'; + +import { ALERT_1, DIVIDER } from "../../../shared/styles/variables"; + import { IWallet, WalletFormData } from "../../../store/types"; -import { resetError, setActiveWallet, setSuccessStatus, walletAction } from "../../../store/walletSlice"; -import { userId } from "../../../api/api"; +import BaseField from "../base-field/BaseField"; +import { titleFieldRules } from "../../../shared/utils/field-rules/title"; +import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; const PopupEditWallet: React.FC = () => { const dispatch = useAppDispatch() @@ -40,10 +52,7 @@ const PopupEditWallet: React.FC = () => { isValid, }, handleSubmit, - reset - } = useForm({ - mode: "all", - }); + } = useForm({ mode: "all" }); const handleCloseClick = () => { setIsEditWalletPopupOpen(false); @@ -52,12 +61,6 @@ const PopupEditWallet: React.FC = () => { dispatch(setSuccessStatus(false)); }; - useEffect(() => { - if (isEditWalletSuccess || isDeleteWalletSuccess) { - handleCloseClick() - } - }, [isEditWalletSuccess, isDeleteWalletSuccess]); - const handleDeleteWallet = () => { dispatch(setSuccessStatus(false)); dispatch(walletAction({ @@ -66,19 +69,7 @@ const PopupEditWallet: React.FC = () => { })); }; - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - window.addEventListener('keydown', handleKeyPress) - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - function handleSub(data: WalletFormData) { + const handleSub = (data: WalletFormData) => { const wallet: IWallet = { title: data.title, amount: data.amount, @@ -93,6 +84,26 @@ const PopupEditWallet: React.FC = () => { })) } + useEffect(() => { + if (isEditWalletSuccess || isDeleteWalletSuccess) { + handleCloseClick() + } + }, [isEditWalletSuccess, isDeleteWalletSuccess]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + handleCloseClick() + } + } + + window.addEventListener('keydown', handleKeyPress); + + return () => { + window.removeEventListener('keydown', handleKeyPress); + }; + }, []); + return ( event.stopPropagation()}> @@ -102,46 +113,24 @@ const PopupEditWallet: React.FC = () => {
- - - twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів', - hasTwoLetters: (value) => titleRegex.test(value) || 'Повинно бути не менше 2 літер', - } - })} - type="text" id="title" width="284px" - className={errors.title && 'error'} - defaultValue={activeWallet?.title} - - /> - {errors?.title && <>{errors?.title?.message || 'Error!'}} - - - - - {errors?.amount && <>{errors?.amount?.message - || 'Введіть додаткове значення'}} - + + + {error && {error}} { Видалити рахунок )} - + + setFileValue(e.target.files[0])} + multiple={false} + style={{ display: "none" }} + /> + + {error && } + {isAddWalletSuccess && } + + + + + {error && {error}} + + + + + +
+ ) +} + +export default AddBankDataTab; \ No newline at end of file diff --git a/src/components/molecules/popup/add-wallet/AddWalletTab.tsx b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx new file mode 100644 index 0000000..a880eba --- /dev/null +++ b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx @@ -0,0 +1,134 @@ +import { useContext, useEffect } from "react"; + +import { useForm } from "react-hook-form"; + +import { PopupContext } from "../../../../contexts/PopupContext"; + +import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; +import { setBankDataSuccessStatus } from "../../../../store/bankDataSlice"; +import { + resetError, + setActiveWallet, + setSuccessStatus, + walletAction +} from "../../../../store/walletSlice"; + +import { titleFieldRules } from "../../../../shared/utils/field-rules/title"; +import { amountFieldRules } from "../../../../shared/utils/field-rules/amount"; + +import { userId } from "../../../../api/api"; + +import { Form } from "../../../atoms/form/Form.styled"; +import { Box } from "../../../atoms/box/Box.styled"; +import { Button } from "../../../atoms/button/Button.styled"; +import { Typography } from "../../../atoms/typography/Typography.styled"; +import BaseField from "../../base-field/BaseField"; + +import { ALERT_1, DIVIDER } from "../../../../shared/styles/variables"; + +import { IWallet, WalletFormData } from "../../../../store/types"; + +const AddWalletTab: React.FC = () => { + const dispatch = useAppDispatch() + + const { setIsAddWalletPopupOpen } = useContext(PopupContext); + + const { + error, + isAddWalletSuccess, + isLoading + } = useAppSelector(state => state.wallet); + + const { user } = useAppSelector(state => state.user); + + const { + register, + formState: { errors, isValid }, + handleSubmit, + reset + } = useForm({ mode: "all" }); + + const handleCloseClick = () => { + reset(); + dispatch(setActiveWallet(null)); + dispatch(resetError()); + dispatch(setSuccessStatus(false)); + dispatch(setBankDataSuccessStatus(false)); + setIsAddWalletPopupOpen(false); + }; + + const handleSubmitWallet = (data: WalletFormData) => { + const wallet: IWallet = { + title: data.title, + amount: data.amount, + type_of_account: "bank", + owner: user?.id || userId, + } + + dispatch(walletAction({ + data: wallet, + method: "POST", + })) + } + + useEffect(() => { + if (isAddWalletSuccess) { + handleCloseClick(); + } + }, [isAddWalletSuccess]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + handleCloseClick() + } + } + + window.addEventListener('keydown', handleKeyPress); + + return () => { + window.removeEventListener('keydown', handleKeyPress); + }; + }, []); + + return ( +
+ + + + + + {error && {error}} + + + + + +
+ ) +} + +export default AddWalletTab; \ No newline at end of file diff --git a/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx new file mode 100644 index 0000000..0e561ed --- /dev/null +++ b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx @@ -0,0 +1,35 @@ + +import { Box } from "../../../atoms/box/Box.styled"; +import { Typography } from "../../../atoms/typography/Typography.styled"; + +import { SUCCESS, ALERT_1 } from "../../../../shared/styles/variables"; + +import PackageSuccessIcon from "../../../../shared/assets/icons/package-success.svg"; +import PackageErrorIcon from "../../../../shared/assets/icons/package-error.svg"; + +import { MessageProps } from "../../../../../types/molecules"; + +const BankdataInfoMessage: React.FC = ({ message }) => { + return ( + + {message === "success" ? ( + + ) : ( + + )} + + {message === "success" ? ( + "Файл успішно додано" + ) : ( + "Виникла помилка" + )} + + + ); +} + +export default BankdataInfoMessage; \ No newline at end of file diff --git a/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx new file mode 100644 index 0000000..0071713 --- /dev/null +++ b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx @@ -0,0 +1,97 @@ +import { useContext, useEffect, useState } from "react"; + +import { PopupContext } from "../../../../contexts/PopupContext"; + +import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; +import { setBankDataSuccessStatus } from "../../../../store/bankDataSlice"; +import { resetError, setActiveWallet, setSuccessStatus } from "../../../../store/walletSlice"; + +import { Box } from "../../../atoms/box/Box.styled"; +import { Button } from "../../../atoms/button/Button.styled"; +import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; +import { Typography } from '../../../atoms/typography/Typography.styled'; +import { PopupWrapper } from "../Popup.styled"; +import AddWalletTab from "./AddWalletTab"; +import AddBankDataTab from "./AddBankdataTab"; + +import CrossIcon from '../../../../shared/assets/icons/cross.svg'; + +import { PRIMARY_HOVER } from "../../../../shared/styles/variables"; + +const PopupAddWallet: React.FC = () => { + const dispatch = useAppDispatch() + + const [isAddWalletManuallyOpen, setIsAddWalletManuallyOpen] = useState(true); + + const { setIsAddWalletPopupOpen } = useContext(PopupContext); + + const { isAddWalletSuccess } = useAppSelector(state => state.wallet); + + const handleCloseClick = () => { + dispatch(setActiveWallet(null)); + dispatch(resetError()); + dispatch(setSuccessStatus(false)); + dispatch(setBankDataSuccessStatus(false)); + setIsAddWalletPopupOpen(false); + }; + + useEffect(() => { + if (isAddWalletSuccess) { + handleCloseClick(); + dispatch(setSuccessStatus(false)); + } + }, [isAddWalletSuccess]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + handleCloseClick() + } + } + + window.addEventListener('keydown', handleKeyPress); + + return () => { + window.removeEventListener('keydown', handleKeyPress); + }; + }, []); + + return ( + + event.stopPropagation()}> + + + Додати картковий рахунок + + + setIsAddWalletManuallyOpen(true)} + style={{ + fontWeight: isAddWalletManuallyOpen && "700", + borderBottom: isAddWalletManuallyOpen && `2px solid ${PRIMARY_HOVER}` + }}> + Ввести дані вручну + + setIsAddWalletManuallyOpen(false)} + style={{ + fontWeight: !isAddWalletManuallyOpen && "700", + borderBottom: !isAddWalletManuallyOpen && `2px solid ${PRIMARY_HOVER}` + }}> + Завантажити дані з файлу + + + + {isAddWalletManuallyOpen ? ( + + ) : ( + + )} + + + + + ); +} + +export default PopupAddWallet; \ No newline at end of file diff --git a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx new file mode 100644 index 0000000..dc49e53 --- /dev/null +++ b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx @@ -0,0 +1,121 @@ +import { useContext, useEffect, useState } from "react"; + +import { useForm } from 'react-hook-form'; + +import { PopupContext } from "../../../../contexts/PopupContext"; + +import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; +import { + changeUserPassword, + resetProfileEditErrors, + setSuccessStatus +} from "../../../../store/userSlice"; + +import { Form } from "../../../atoms/form/Form.styled"; +import { Box } from "../../../atoms/box/Box.styled"; +import { Typography } from "../../../atoms/typography/Typography.styled"; +import { Button } from "../../../atoms/button/Button.styled"; +import BaseField from './../../base-field/BaseField'; + +import { ALERT_1, DIVIDER } from "../../../../shared/styles/variables"; + +import { confirmPasswordInputRules, passwordInputRules } from "../../../../shared/utils/field-rules/password"; + +import { PasswordChangeFormData } from "../../../../store/types"; + +const ChangePasswordTab: React.FC = () => { + const dispatch = useAppDispatch(); + + const [showOldPassword, setShowOldPassword] = useState(false); + const [showPassword, setShowPassword] = useState(false); + const [showConfirmPassword, setShowConfirmPassword] = useState(false); + + const { + isLoading, + isPasswordChanged, + passwordChangeError + } = useAppSelector(state => state.user) + + const { setIsEditProfilePopupOpen } = useContext(PopupContext); + + const handleCloseClick = () => { + dispatch(resetProfileEditErrors()); + setIsEditProfilePopupOpen(false); + }; + + const handleSubmitChangePassword = (data: PasswordChangeFormData) => { + dispatch(changeUserPassword(data)); + } + + const { + register, + formState: { errors, isValid }, + handleSubmit, + watch + } = useForm({ mode: "all" }); + + useEffect(() => { + if (isPasswordChanged) { + dispatch(setSuccessStatus(false)) + handleCloseClick(); + } + }, [isPasswordChanged]); + + return ( +
+ + + + + {passwordChangeError && ( + {passwordChangeError} + )} + + + + + + + ) +} + +export default ChangePasswordTab; \ No newline at end of file diff --git a/src/components/molecules/popup/edit-profile/EditProfileTab.tsx b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx new file mode 100644 index 0000000..743457a --- /dev/null +++ b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx @@ -0,0 +1,102 @@ +import { useContext, useEffect } from "react"; + +import { useForm } from "react-hook-form"; + +import { PopupContext } from "../../../../contexts/PopupContext"; + +import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; +import { + changeUserProfile, + resetProfileEditErrors, + setSuccessStatus +} from "../../../../store/userSlice"; + +import { nameFieldRules } from "../../../../shared/utils/field-rules/name"; + +import { userDataParsed } from "../../../../api/api"; + +import { Form } from "../../../atoms/form/Form.styled"; +import { Box } from "../../../atoms/box/Box.styled"; +import { Button } from "../../../atoms/button/Button.styled"; +import BaseField from "../../base-field/BaseField"; + +import { DIVIDER } from "../../../../shared/styles/variables"; + +import { IUser } from "../../../../store/types"; + +const EditProfileTab: React.FC = () => { + const dispatch = useAppDispatch(); + + const { setIsEditProfilePopupOpen } = useContext(PopupContext); + + const { isProfileChanged, isLoading, user } = useAppSelector(state => state.user); + + const handleCloseClick = () => { + dispatch(resetProfileEditErrors()); + setIsEditProfilePopupOpen(false); + }; + + const handleSubmitChangeProfile = (data: IUser) => { + dispatch(changeUserProfile(data)) + } + + const { + register, + formState: { errors, isValid }, + handleSubmit + } = useForm({ mode: "all" }); + + useEffect(() => { + if (isProfileChanged) { + dispatch(setSuccessStatus(false)) + handleCloseClick(); + } + }, [isProfileChanged]); + + return ( +
+ + + + + + + + + + ) +} + +export default EditProfileTab; \ No newline at end of file diff --git a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx new file mode 100644 index 0000000..1bd183f --- /dev/null +++ b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx @@ -0,0 +1,102 @@ +import { useContext, useEffect, useState } from "react"; + +import { PopupContext } from "../../../../contexts/PopupContext"; + +import { useAppSelector } from "../../../../store/hooks"; + +import EditProfileTab from "./EditProfileTab"; +import ChangePasswordTab from "./ChangePasswordTab"; +import { Box } from "../../../atoms/box/Box.styled"; +import { Button } from '../../../atoms/button/Button.styled'; +import { PopupWrapper } from "../Popup.styled"; +import { Typography } from '../../../atoms/typography/Typography.styled'; +import { ButtonLink } from "../../../atoms/button/ButtonLink"; + +import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; + +import { PRIMARY_HOVER } from "../../../../shared/styles/variables"; + +import CrossIcon from '../../../../shared/assets/icons/cross.svg'; + +const PopupEditProfile: React.FC = () => { + const { + setIsEditProfilePopupOpen, + setIsDeleteAccountPopupOpen + } = useContext(PopupContext); + + const { isProfileChanged } = useAppSelector(state => state.user); + + const [isEditProfileTabOpen, setIsEditProfileTabOpen] = useState(true); + + const handleCloseClick = () => { + setIsEditProfilePopupOpen(false); + }; + + const onDeleteAccountClick = () => { + setIsDeleteAccountPopupOpen(true); + } + + useEffect(() => { + if (isProfileChanged) { + handleCloseClick(); + } + }, [isProfileChanged]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + handleCloseClick() + } + } + + window.addEventListener('keydown', handleKeyPress); + + return () => { + window.removeEventListener('keydown', handleKeyPress); + }; + }, []); + + return ( + + event.stopPropagation()}> + + + Налаштування профілю + + + + setIsEditProfileTabOpen(true)} + style={{ + fontWeight: isEditProfileTabOpen && "700", + borderBottom: isEditProfileTabOpen && `2px solid ${PRIMARY_HOVER}` + }}> + Дані користувача + + setIsEditProfileTabOpen(false)} + style={{ + fontWeight: !isEditProfileTabOpen && "700", + borderBottom: !isEditProfileTabOpen && `2px solid ${PRIMARY_HOVER}` + }}> + Зміна паролю + + + + {isEditProfileTabOpen ? ( + + ) : ( + + )} + + + Видалити аккаунт + + + + + + ); +} + +export default PopupEditProfile; \ No newline at end of file diff --git a/src/components/molecules/select/Select.tsx b/src/components/molecules/select/Select.tsx index 4e2e3c3..c730b55 100644 --- a/src/components/molecules/select/Select.tsx +++ b/src/components/molecules/select/Select.tsx @@ -19,7 +19,13 @@ type SelectProps = { isError?: any; } -const Select: React.FC = ({ value, options, onCategoryChange, width, isError }) => { +const Select: React.FC = ({ + value, + options, + onCategoryChange, + width, + isError +}) => { const customStyles: StylesConfig = { control: (baseStyles) => ({ ...baseStyles, diff --git a/src/components/molecules/tabs/filter/TabFilter.tsx b/src/components/molecules/tabs/filter/TabFilter.tsx index c9e2c04..e778d34 100644 --- a/src/components/molecules/tabs/filter/TabFilter.tsx +++ b/src/components/molecules/tabs/filter/TabFilter.tsx @@ -1,8 +1,9 @@ -import { TabFilterWrapper } from "./TabFilter.styled"; +import { Link } from './../../../atoms/link/Link.styled'; import { List } from "../../../atoms/list/List.styled"; import { ListItem } from "../../../atoms/list/ListItem.styled"; +import { TabFilterWrapper } from "./TabFilter.styled"; + import { WHITE } from "../../../../shared/styles/variables"; -import { Link } from './../../../atoms/link/Link.styled'; export interface IFilterButton { filterBy: string; diff --git a/src/components/molecules/tabs/switch/TabSwitch.tsx b/src/components/molecules/tabs/switch/TabSwitch.tsx index 01baded..6d403ca 100644 --- a/src/components/molecules/tabs/switch/TabSwitch.tsx +++ b/src/components/molecules/tabs/switch/TabSwitch.tsx @@ -1,9 +1,10 @@ -import { WHITE } from "../../../../shared/styles/variables"; import { ButtonTransparent } from "../../../atoms/button/ButtonTransparent.styled"; import { List } from "../../../atoms/list/List.styled"; import { ListItem } from "../../../atoms/list/ListItem.styled"; import { TabSwitchWrapper } from "./TabSwitch.styled"; +import { WHITE } from "../../../../shared/styles/variables"; + export interface ISwitchButton { buttonName: string; onTabClick: () => void; diff --git a/src/components/molecules/transaction/Transaction.tsx b/src/components/molecules/transaction/Transaction.tsx index fa46f7c..df17acb 100644 --- a/src/components/molecules/transaction/Transaction.tsx +++ b/src/components/molecules/transaction/Transaction.tsx @@ -1,17 +1,30 @@ +import { useAppSelector } from '../../../store/hooks'; + +import formatTransactionTime from "../../../shared/utils/formatTransactionTime"; + +import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; +import { TransactionWrapper } from './TransactionWrapper'; + import IncomeIcon from "../../../shared/assets/icons/income.svg" import ExpenseIcon from "../../../shared/assets/icons/expense.svg" -import { DARK_FOR_TEXT, GREEN, WHITE, PRIMARY, RED, ALMOST_BLACK_FOR_TEXT, DISABLED, DIVIDER } from './../../../shared/styles/variables'; -import { Box } from "../../atoms/box/Box.styled"; -import { useAppSelector } from '../../../store/hooks'; -import { TransactionWrapper } from './TransactionWrapper'; + +import { + DARK_FOR_TEXT, + GREEN, + WHITE, + PRIMARY, + RED, + ALMOST_BLACK_FOR_TEXT, + DISABLED, + DIVIDER +} from './../../../shared/styles/variables'; + import { ITransaction } from "../../../store/types"; -import formatTransactionTime from "../../../shared/utils/formatTransactionTime"; -import { useEffect, useRef } from "react"; export type TransactionProps = { transaction: ITransaction; - onClick?: () => {}; + onClick?: () => void; isTransactionsPage?: boolean; } @@ -23,11 +36,13 @@ const Transaction: React.FC = ({ transaction, isTransactionsPa const isActive = transaction?.id === activeTransaction?.id; const isIncome = transaction?.type_of_outlay === "income"; - const transactionCategoryTitle: string = (categories.all) - ?.find(category => category.id === transaction.category)?.title; + const transactionCategoryTitle: string = categories.all?.find(category => { + return category.id === transaction.category; + })?.title; - const transactionWalletTitle: string = (wallets) - ?.find(wallet => wallet.id === transaction.wallet)?.title; + const transactionWalletTitle: string = wallets?.find(wallet => { + return wallet.id === transaction.wallet + })?.title; return ( = ({ wallet, onWalletClick, isActive }) => { fw="600" fz="22px" > - {wallet?.amount && wallet?.amount + " ₴"} + {wallet?.amount && (wallet?.amount + " ₴")}
diff --git a/src/components/pages/home/HomePage.tsx b/src/components/pages/home/HomePage.tsx index c121623..c99930b 100644 --- a/src/components/pages/home/HomePage.tsx +++ b/src/components/pages/home/HomePage.tsx @@ -11,7 +11,7 @@ import { Button } from "../../atoms/button/Button.styled"; import DoughnutChart from "../../molecules/charts/DoughnutChart"; import { HomePageWrapper } from "./HomePage.styled"; import { PopupContext } from "../../../contexts/PopupContext"; -import PopupAddWallet from "../../molecules/popup/PopupAddWallet"; +import PopupAddWallet from "../../molecules/popup/add-wallet/PopupAddWallet"; import PopupEditWallet from "../../molecules/popup/PopupEditWallet"; import { mockWallets } from "../../../../mock-data/wallets"; import Transaction from "../../molecules/transaction/Transaction"; @@ -55,31 +55,31 @@ const HomePage: React.FC = () => { dispatch(getUserDetails()) } - dispatch(getWallets()); - dispatch(getTransactions()); - dispatch(getFilteredCategories("?type_of_outlay=income")) - dispatch(getFilteredCategories("?type_of_outlay=expense")) - dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); - dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); + // dispatch(getWallets()); + // dispatch(getTransactions()); + // dispatch(getFilteredCategories("?type_of_outlay=income")) + // dispatch(getFilteredCategories("?type_of_outlay=expense")) + // dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); + // dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); }, []); useEffect(() => { if (isWalletActionLoading === false || isBankDataLoading === false) { - dispatch(getWallets()); - dispatch(getTransactions()); - dispatch(getCategories()); - dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); - dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); + // dispatch(getWallets()); + // dispatch(getTransactions()); + // dispatch(getCategories()); + // dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); + // dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); } }, [isWalletActionLoading, isBankDataLoading]); useEffect(() => { if (isAddWalletSuccess || isEditWalletSuccess || isDeleteWalletSuccess || isAddBankDataSuccess) { - dispatch(getWallets()); - dispatch(getTransactions()); - dispatch(getCategories()); - dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); - dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); + // dispatch(getWallets()); + // dispatch(getTransactions()); + // dispatch(getCategories()); + // dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); + // dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); } }, [isAddWalletSuccess, isEditWalletSuccess, isDeleteWalletSuccess, isAddBankDataSuccess]); diff --git a/src/shared/styles/variables.ts b/src/shared/styles/variables.ts index 6e9b27a..f3dc21b 100644 --- a/src/shared/styles/variables.ts +++ b/src/shared/styles/variables.ts @@ -27,4 +27,4 @@ export const MENU_BUTTON_HOVER = "#E1E5F5"; export const GREY_50 = "#808080"; -export const GRADIENT = `linear-gradient(130.59deg, #A96BF8 0%, #725DD9 19.48%, #737FEF 39.78%, #5D8AD9 60.07%, #6BC3F8 77.93%)`; \ No newline at end of file +export const GRADIENT = `linear-gradient(130.59deg, #A96BF8 0%, #725DD9 19.48%, #737FEF 39.78%, #5D8AD9 60.07%, #6BC3F8 77.93%)`; diff --git a/src/shared/utils/field-rules/amount.ts b/src/shared/utils/field-rules/amount.ts new file mode 100644 index 0000000..9b0efa2 --- /dev/null +++ b/src/shared/utils/field-rules/amount.ts @@ -0,0 +1,13 @@ +import { moneyAmountRegex } from "../regexes"; + +export const amountFieldRules = { + required: 'Обов\'язкове поле для заповнення', + pattern: { + value: moneyAmountRegex, + message: 'Сума може бути від 1 до 8 цифр перед крапкою та до 2 цифр після крапки', + }, + min: { + value: 0.00, + message: 'Сума може бути додатньою від 1 до 8 цифр перед крапкою та до 2 цифр після крапки' + }, +} diff --git a/src/shared/utils/field-rules/email.ts b/src/shared/utils/field-rules/email.ts new file mode 100644 index 0000000..1e88149 --- /dev/null +++ b/src/shared/utils/field-rules/email.ts @@ -0,0 +1,9 @@ +import { emailRegex } from "../regexes"; + +export const emailFieldRules = { + required: 'Обов\'язкове поле для заповнення', + pattern: { + value: emailRegex, + message: "Назва повинна бути не менше 2 літер", + }, +} \ No newline at end of file diff --git a/src/shared/utils/field-rules/name.ts b/src/shared/utils/field-rules/name.ts new file mode 100644 index 0000000..e8c8242 --- /dev/null +++ b/src/shared/utils/field-rules/name.ts @@ -0,0 +1,9 @@ +import { nameRegex } from "../regexes"; + +export const nameFieldRules = { + required: 'Обов\'язкове поле для заповнення', + pattern: { + value: nameRegex, + message: "Назва повинна бути не менше 2 літер", + }, +} \ No newline at end of file diff --git a/src/shared/utils/field-rules/password.ts b/src/shared/utils/field-rules/password.ts new file mode 100644 index 0000000..21d9138 --- /dev/null +++ b/src/shared/utils/field-rules/password.ts @@ -0,0 +1,22 @@ +import { passwordRegex } from "../regexes"; + +export const passwordInputRules = { + required: 'Обов\'язкове поле для заповнення', + pattern: { + value: passwordRegex, + message: `Пароль повинен містити не менше 8 символів, 1 літеру, 1 цифру та 1 спеціальний символ` + }, +} + +export const confirmPasswordInputRules = ( + watchFunc: any, passwordName: string +): any => { + return { + required: 'Обов\'язкове поле для заповнення', + validate: (val: string) => { + if (watchFunc(passwordName) != val) { + return "Паролі не співпадають"; + } + } + } +} diff --git a/src/shared/utils/field-rules/title.ts b/src/shared/utils/field-rules/title.ts new file mode 100644 index 0000000..6b672f5 --- /dev/null +++ b/src/shared/utils/field-rules/title.ts @@ -0,0 +1,9 @@ +import { titleRegex, twoSymbolsRegex } from "../regexes"; + +export const titleFieldRules = { + required: 'Обов\'язкове поле для заповнення', + validate: { + hasTwoSymbols: (value: string) => twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів', + hasTwoLetters: (value: string) => titleRegex.test(value) || 'Повинно бути не менше 2 літер', + } +} From aa0f2e9e71a6e5ce9a54d5ff1f5d90a87fc731da Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Wed, 28 Jun 2023 20:18:49 +0300 Subject: [PATCH 02/16] refactor: component logic --- .../molecules/popup/PopupEditWallet.tsx | 7 +- src/components/molecules/select/Select.tsx | 4 +- .../molecules/transaction/Transaction.tsx | 2 +- .../pages/2FA/TwoFactorAuthenticationPage.tsx | 40 +- .../pages/categories/AddCategory.tsx | 48 ++- .../pages/categories/Categories.tsx | 30 +- .../pages/categories/CategoriesPage.tsx | 12 +- .../pages/categories/EditCategory.tsx | 47 +- src/components/pages/data/DataEntryPage.tsx | 62 +-- src/components/pages/home/HomePage.tsx | 408 ++---------------- src/components/pages/home/Statistics.tsx | 140 ++++++ src/components/pages/home/Transitions.tsx | 67 +++ src/components/pages/home/Wallets.tsx | 118 +++++ src/components/pages/login/LoginPage.tsx | 39 +- .../pages/password-recovery/EmailStep.tsx | 86 ++++ .../password-recovery/NewPasswordStep.tsx | 155 +++++++ .../password-recovery/PasswordRecovery.tsx | 260 +---------- .../pages/password-recovery/ResetLinkStep.tsx | 51 +++ .../pages/register/RegisterPage.tsx | 38 +- .../pages/statistics/DoughnutChartSection.tsx | 117 +++++ .../pages/statistics/LineChartSection.tsx | 94 ++++ .../pages/statistics/StatisticsHeader.tsx | 56 +++ .../pages/statistics/StatisticsPage.tsx | 328 +------------- .../pages/transactions/AddTransaction.tsx | 200 +++++---- .../pages/transactions/DatePicker.tsx | 53 ++- .../pages/transactions/EditTransaction.tsx | 115 ++--- .../pages/transactions/Transactions.tsx | 77 ++-- .../pages/transactions/TransactionsPage.tsx | 20 +- src/components/pages/welcome/WelcomePage.tsx | 11 +- .../calculateCategoriesWithTotalAmount.ts | 33 ++ .../utils/statistics/calculateTotalAmount.ts | 13 + .../statistics/generateNewLineChartData.ts | 24 ++ .../{ => transactions}/filterTransactions.ts | 2 +- .../formatTransactionDate.ts | 0 .../formatTransactionTime.ts | 0 .../utils/transactions/setSelectOptions.ts | 19 + types/molecules.ts | 5 + 37 files changed, 1451 insertions(+), 1330 deletions(-) create mode 100644 src/components/pages/home/Statistics.tsx create mode 100644 src/components/pages/home/Transitions.tsx create mode 100644 src/components/pages/home/Wallets.tsx create mode 100644 src/components/pages/password-recovery/EmailStep.tsx create mode 100644 src/components/pages/password-recovery/NewPasswordStep.tsx create mode 100644 src/components/pages/password-recovery/ResetLinkStep.tsx create mode 100644 src/components/pages/statistics/DoughnutChartSection.tsx create mode 100644 src/components/pages/statistics/LineChartSection.tsx create mode 100644 src/components/pages/statistics/StatisticsHeader.tsx create mode 100644 src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts create mode 100644 src/shared/utils/statistics/calculateTotalAmount.ts create mode 100644 src/shared/utils/statistics/generateNewLineChartData.ts rename src/shared/utils/{ => transactions}/filterTransactions.ts (89%) rename src/shared/utils/{ => transactions}/formatTransactionDate.ts (100%) rename src/shared/utils/{ => transactions}/formatTransactionTime.ts (100%) create mode 100644 src/shared/utils/transactions/setSelectOptions.ts diff --git a/src/components/molecules/popup/PopupEditWallet.tsx b/src/components/molecules/popup/PopupEditWallet.tsx index 621d215..c8dc22a 100644 --- a/src/components/molecules/popup/PopupEditWallet.tsx +++ b/src/components/molecules/popup/PopupEditWallet.tsx @@ -12,6 +12,9 @@ import { walletAction } from "../../../store/walletSlice"; +import { titleFieldRules } from "../../../shared/utils/field-rules/title"; +import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; + import { userId } from "../../../api/api"; import { Box } from "../../atoms/box/Box.styled"; @@ -20,15 +23,13 @@ import { Typography } from '../../atoms/typography/Typography.styled'; import { ButtonLink } from "../../atoms/button/ButtonLink"; import { Form } from "../../atoms/form/Form.styled"; import { PopupWrapper } from "./Popup.styled"; +import BaseField from "../base-field/BaseField"; import CrossIcon from './../../../shared/assets/icons/cross.svg'; import { ALERT_1, DIVIDER } from "../../../shared/styles/variables"; import { IWallet, WalletFormData } from "../../../store/types"; -import BaseField from "../base-field/BaseField"; -import { titleFieldRules } from "../../../shared/utils/field-rules/title"; -import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; const PopupEditWallet: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/molecules/select/Select.tsx b/src/components/molecules/select/Select.tsx index c730b55..705f546 100644 --- a/src/components/molecules/select/Select.tsx +++ b/src/components/molecules/select/Select.tsx @@ -11,8 +11,10 @@ import { WHITE } from "../../../shared/styles/variables"; +import { SelectOptions } from '../../../../types/molecules'; + type SelectProps = { - value: { value: number, label: string }; + value: SelectOptions; options: any; onCategoryChange: (e: any) => void; width?: string; diff --git a/src/components/molecules/transaction/Transaction.tsx b/src/components/molecules/transaction/Transaction.tsx index df17acb..852cc41 100644 --- a/src/components/molecules/transaction/Transaction.tsx +++ b/src/components/molecules/transaction/Transaction.tsx @@ -1,6 +1,6 @@ import { useAppSelector } from '../../../store/hooks'; -import formatTransactionTime from "../../../shared/utils/formatTransactionTime"; +import formatTransactionTime from '../../../shared/utils/transactions/formatTransactionTime'; import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; diff --git a/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx b/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx index 2ce0334..70d43d8 100644 --- a/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx +++ b/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx @@ -1,6 +1,10 @@ -import React, { useEffect, useRef, useState } from "react"; +import { useEffect, useRef, useState } from "react"; + import { useForm } from "react-hook-form"; +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { getUserDetails } from "../../../store/userSlice"; + import { Box } from '../../atoms/box/Box.styled'; import { Typography } from '../../atoms/typography/Typography.styled'; import { Img } from '../../atoms/img/Img.styled'; @@ -9,48 +13,40 @@ import { Form } from "../../atoms/form/Form.styled"; import { Label } from "../../atoms/label/Label.styled"; import { Input } from "../../atoms/input/Input.styled"; import { Button } from "../../atoms/button/Button.styled"; +import { ButtonLink } from "../../atoms/button/ButtonLink"; import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; import { - ALERT_1, ALERT_2, ALMOST_BLACK_FOR_TEXT, DISABLED, GRADIENT, PRIMARY, WHITE } from "../../../shared/styles/variables"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; -import { getUserDetails } from "../../../store/userSlice"; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { token } from "../../../api/api"; const TwoFactorAuthenticationPage: React.FC = () => { const dispatch = useAppDispatch(); + + const [count, setCount] = useState(60); + const { isLoading } = useAppSelector(state => state.user); - const { - register, - formState: { - errors, - isValid, - }, - handleSubmit, - reset, - } = useForm({ - mode: "all", - }); + const intervalRef = useRef(null); - function handleSub(data: {}) { - //alert(JSON.stringify(data)); + const handleSub = (data: {}) => { reset(); } - const [count, setCount] = useState(60); - const intervalRef = useRef(null); + const { + register, + formState: { errors, isValid }, + handleSubmit, + reset, + } = useForm({ mode: "all" }); useEffect(() => { - dispatch(getUserDetails()) + dispatch(getUserDetails()); intervalRef.current = setInterval(() => { setCount(count => count - 1); diff --git a/src/components/pages/categories/AddCategory.tsx b/src/components/pages/categories/AddCategory.tsx index e859b41..218c11f 100644 --- a/src/components/pages/categories/AddCategory.tsx +++ b/src/components/pages/categories/AddCategory.tsx @@ -1,19 +1,25 @@ -import { BASE_2, WHITE } from "../../../shared/styles/variables"; -import { categoryAction, setActiveCategory } from "../../../store/categorySlice"; +import { useEffect } from "react"; + +import { useForm } from "react-hook-form"; + import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setAddCategoryData } from "../../../store/categorySlice"; +import { categoryAction, setActiveCategory } from "../../../store/categorySlice"; + +import { Form } from "../../atoms/form/Form.styled"; +import { Label } from "../../atoms/label/Label.styled"; +import { Input } from "../../atoms/input/Input.styled"; import { Box } from "../../atoms/box/Box.styled"; import { Button } from "../../atoms/button/Button.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; import TabSwitch, { ISwitchButton } from "../../molecules/tabs/switch/TabSwitch"; -import { Label } from "../../atoms/label/Label.styled"; -import { Input } from "../../atoms/input/Input.styled"; -import { userId } from "../../../api/api"; -import { useEffect } from "react"; -import { useForm } from "react-hook-form"; -import { Form } from "../../atoms/form/Form.styled"; + import { titleRegex, twoSymbolsRegex } from "../../../shared/utils/regexes"; +import { userId } from "../../../api/api"; + +import { BASE_2, WHITE } from "../../../shared/styles/variables"; + const AddCategory: React.FC = () => { const dispatch = useAppDispatch() @@ -22,16 +28,6 @@ const AddCategory: React.FC = () => { const isValid = Object.keys(addCategoryData || {})?.length >= 1; - const { - register, - formState: { errors }, - handleSubmit, - setValue, - reset, - } = useForm({ - mode: "all", - }); - const switchButtons: ISwitchButton[] = [ { buttonName: 'Витрата', @@ -49,11 +45,7 @@ const AddCategory: React.FC = () => { }, ]; - useEffect(() => { - dispatch(setAddCategoryData({ type_of_outlay: "expense" })) - }, []); - - function handleSub(data: { title: string }) { + const handleSub = (data: { title: string }) => { dispatch(setActiveCategory({})); dispatch(categoryAction({ data: { @@ -65,6 +57,16 @@ const AddCategory: React.FC = () => { })) } + const { + register, + formState: { errors }, + handleSubmit, + } = useForm({ mode: "all" }); + + useEffect(() => { + dispatch(setAddCategoryData({ type_of_outlay: "expense" })) + }, []); + return ( { }, ]; - function onCategoryClick(category: ICategory) { + const onCategoryClick = (category: ICategory) => { dispatch(setActiveCategory(category)); dispatch(setEditCategoryData(category)); dispatch(setIsEditCategoryOpen(true)); } const categoriesData = (): ICategory[] => { - if (isDev) { - return mockCategories; - } else { - if (filterByTypeOfOutlay === "all") { - return categories.all; - } else if (filterByTypeOfOutlay === "expense") { - return categories.expense; - } else if (filterByTypeOfOutlay === "income") { - return categories.income; - } + if (filterByTypeOfOutlay === "all") { + return categories.all; + } else if (filterByTypeOfOutlay === "expense") { + return categories.expense; + } else if (filterByTypeOfOutlay === "income") { + return categories.income; } } diff --git a/src/components/pages/categories/CategoriesPage.tsx b/src/components/pages/categories/CategoriesPage.tsx index 5524ba3..cd71432 100644 --- a/src/components/pages/categories/CategoriesPage.tsx +++ b/src/components/pages/categories/CategoriesPage.tsx @@ -1,17 +1,17 @@ import { useEffect } from 'react' +import { useNavigate } from 'react-router-dom'; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { getCategories } from "../../../store/categorySlice"; +import { token } from '../../../api/api'; + import { Box } from "../../atoms/box/Box.styled"; -import { CategoriesPageWrapper } from "./CategoriesPage.styled"; import Header from '../../molecules/header/Header'; - import Categories from './Categories'; import EditCategory from './EditCategory'; import AddCategory from './AddCategory'; -import { token } from '../../../api/api'; -import { useNavigate } from 'react-router-dom'; +import { CategoriesPageWrapper } from "./CategoriesPage.styled"; const CategoriesPage: React.FC = () => { const dispatch = useAppDispatch() @@ -25,7 +25,7 @@ const CategoriesPage: React.FC = () => { isLoading } = useAppSelector(state => state.category); - const { isLoggedIn, isRegistered, user } = useAppSelector(state => state.user); + const { isLoggedIn, isRegistered } = useAppSelector(state => state.user); if (!token && !isRegistered && !isLoggedIn) { navigate("/welcome") @@ -36,7 +36,7 @@ const CategoriesPage: React.FC = () => { }, []); useEffect(() => { - if (isLoading === false) { + if (!isLoading) { dispatch(getCategories()); } }, [isLoading]); diff --git a/src/components/pages/categories/EditCategory.tsx b/src/components/pages/categories/EditCategory.tsx index 922f6b4..36d169e 100644 --- a/src/components/pages/categories/EditCategory.tsx +++ b/src/components/pages/categories/EditCategory.tsx @@ -1,12 +1,8 @@ -import { MENU_BUTTON_HOVER, WHITE } from "../../../shared/styles/variables"; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; -import { Label } from "../../atoms/label/Label.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import TabSwitch, { ISwitchButton } from "../../molecules/tabs/switch/TabSwitch"; +import { useEffect } from "react"; +import { useForm } from "react-hook-form"; + +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { categoryAction, resetActiveCategoryState, @@ -14,11 +10,21 @@ import { setEditCategoryData, setIsEditCategoryOpen } from "../../../store/categorySlice"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Button } from "../../atoms/button/Button.styled"; +import { ButtonLink } from "../../atoms/button/ButtonLink"; +import { Label } from "../../atoms/label/Label.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; import { Input } from "../../atoms/input/Input.styled"; -import { useForm } from "react-hook-form"; import { Form } from "../../atoms/form/Form.styled"; +import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; + import { titleRegex, twoSymbolsRegex } from "../../../shared/utils/regexes"; -import { useEffect } from "react"; + +import { MENU_BUTTON_HOVER, WHITE } from "../../../shared/styles/variables"; + +import { ISwitchButton } from "../../molecules/tabs/switch/TabSwitch"; const EditCategory: React.FC = () => { const dispatch = useAppDispatch() @@ -37,15 +43,7 @@ const EditCategory: React.FC = () => { handleSubmit, setValue, clearErrors, - reset, - } = useForm({ - mode: "all", - }); - - useEffect(() => { - clearErrors('title') - setValue('title', editCategoryData?.title) - }, [editCategoryData?.title]); + } = useForm({ mode: "all" }); const switchButtons: ISwitchButton[] = [ { @@ -64,12 +62,12 @@ const EditCategory: React.FC = () => { }, ]; - function handleCancelEditCategory() { + const handleCancelEditCategory = () => { dispatch(setIsEditCategoryOpen(false)); dispatch(resetActiveCategoryState({})); } - function handleDeleteCategory() { + const handleDeleteCategory = () => { dispatch(setIsEditCategoryOpen(false)); dispatch(categoryAction({ method: "DELETE", @@ -78,7 +76,7 @@ const EditCategory: React.FC = () => { dispatch(setActiveCategory({})); } - function handleSub(data: { title: string }) { + const handleSub = (data: { title: string }) => { const editCategoryDataNoId = { ...editCategoryData, title: data?.title @@ -94,6 +92,11 @@ const EditCategory: React.FC = () => { })); } + useEffect(() => { + clearErrors('title') + setValue('title', editCategoryData?.title) + }, [editCategoryData?.title]); + return ( { const dispatch = useAppDispatch() const navigate = useNavigate(); - const { isEntryDataSuccess, entryDataError, isLoading } = useAppSelector(state => state.wallet) - const { user, getDetailsError, isRegistered } = useAppSelector(state => state.user) + const { + isEntryDataSuccess, + entryDataError, + isLoading + } = useAppSelector(state => state.wallet) + const { + user, + getDetailsError, + isRegistered + } = useAppSelector(state => state.user) if (!isRegistered && localStorageIsDataEntrySuccess) { navigate("/home") } + const handleSub = (data: DataEntryFormData) => { + const resultData: DataEntryFormData = { + ...data, + userId: user?.id || userId, + } + + dispatch(postEntryData(resultData)) + } + const { register, - formState: { - errors, - isValid, - }, + formState: { errors, isValid }, handleSubmit, reset, - } = useForm({ - mode: "all", - }); + } = useForm({ mode: "all" }); useEffect(() => { if (isEntryDataSuccess) { @@ -72,21 +87,12 @@ const DataEntryPage: React.FC = () => { } }, [user?.token]); - function handleSub(data: DataEntryFormData) { - const resultData: DataEntryFormData = { - ...data, - userId: user?.id || userId, - } - - dispatch(postEntryData(resultData)) - } - return ( InterfaceImage - + Logo diff --git a/src/components/pages/home/HomePage.tsx b/src/components/pages/home/HomePage.tsx index c99930b..862890a 100644 --- a/src/components/pages/home/HomePage.tsx +++ b/src/components/pages/home/HomePage.tsx @@ -1,32 +1,24 @@ -import React, { useContext, useEffect, useRef } from "react"; +import { useContext, useEffect } from "react"; +import { useNavigate } from "react-router-dom"; -import { BASE_2, DIVIDER } from "../../../shared/styles/variables"; -import { Box } from "../../atoms/box/Box.styled"; -import Header from '../../molecules/header/Header'; -import { Typography } from '../../atoms/typography/Typography.styled'; -import Wallet from '../../molecules/wallet/Wallet'; -import { ListItem } from '../../atoms/list/ListItem.styled'; -import { List } from "../../atoms/list/List.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import DoughnutChart from "../../molecules/charts/DoughnutChart"; -import { HomePageWrapper } from "./HomePage.styled"; import { PopupContext } from "../../../contexts/PopupContext"; -import PopupAddWallet from "../../molecules/popup/add-wallet/PopupAddWallet"; -import PopupEditWallet from "../../molecules/popup/PopupEditWallet"; -import { mockWallets } from "../../../../mock-data/wallets"; -import Transaction from "../../molecules/transaction/Transaction"; + import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { getWallets, setActiveWallet } from "../../../store/walletSlice"; -import { ICategory, ICategoryWithTotalAmount, IWallet, Transactions } from "../../../store/types"; -import { isDev } from "../../../consts/consts"; -import { formatTransactionDateToFullDate } from "../../../shared/utils/formatTransactionDate"; +import { getWallets } from "../../../store/walletSlice"; +import { getUserDetails } from "../../../store/userSlice"; import { getFilteredTransactions, getTransactions } from "../../../store/transactionSlice"; import { getCategories, getFilteredCategories } from "../../../store/categorySlice"; + import { token } from "../../../api/api"; -import { useNavigate } from "react-router-dom"; -import { getUserDetails } from "../../../store/userSlice"; -import { filterTransactions } from "../../../shared/utils/filterTransactions"; -import { setTotalExpenses, setTotalIncomes } from "../../../store/statisticsSlice"; + +import { Box } from "../../atoms/box/Box.styled"; +import Header from '../../molecules/header/Header'; +import PopupAddWallet from "../../molecules/popup/add-wallet/PopupAddWallet"; +import PopupEditWallet from "../../molecules/popup/PopupEditWallet"; +import Wallets from "./Wallets"; +import Transactions from "./Transitions"; +import Statistics from "./Statistics"; +import { HomePageWrapper } from "./HomePage.styled"; const HomePage: React.FC = () => { const dispatch = useAppDispatch(); @@ -42,9 +34,17 @@ const HomePage: React.FC = () => { isEditWalletSuccess, isDeleteWalletSuccess, isLoading: isWalletActionLoading - } = useAppSelector(state => state.wallet) - const { isLoggedIn, isRegistered } = useAppSelector(state => state.user); - const { isLoading: isBankDataLoading, isAddBankDataSuccess } = useAppSelector(state => state.bankData); + } = useAppSelector(state => state.wallet); + + const { + isLoggedIn, + isRegistered + } = useAppSelector(state => state.user); + + const { + isLoading: isBankDataLoading, + isAddBankDataSuccess + } = useAppSelector(state => state.bankData); if (!token && !isRegistered && !isLoggedIn) { navigate("/welcome") @@ -55,31 +55,31 @@ const HomePage: React.FC = () => { dispatch(getUserDetails()) } - // dispatch(getWallets()); - // dispatch(getTransactions()); - // dispatch(getFilteredCategories("?type_of_outlay=income")) - // dispatch(getFilteredCategories("?type_of_outlay=expense")) - // dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); - // dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); + dispatch(getWallets()); + dispatch(getTransactions()); + dispatch(getFilteredCategories("?type_of_outlay=income")) + dispatch(getFilteredCategories("?type_of_outlay=expense")) + dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); + dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); }, []); useEffect(() => { - if (isWalletActionLoading === false || isBankDataLoading === false) { - // dispatch(getWallets()); - // dispatch(getTransactions()); - // dispatch(getCategories()); - // dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); - // dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); + if (!isWalletActionLoading || !isBankDataLoading) { + dispatch(getWallets()); + dispatch(getTransactions()); + dispatch(getCategories()); + dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); + dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); } }, [isWalletActionLoading, isBankDataLoading]); useEffect(() => { if (isAddWalletSuccess || isEditWalletSuccess || isDeleteWalletSuccess || isAddBankDataSuccess) { - // dispatch(getWallets()); - // dispatch(getTransactions()); - // dispatch(getCategories()); - // dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); - // dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); + dispatch(getWallets()); + dispatch(getTransactions()); + dispatch(getCategories()); + dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); + dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); } }, [isAddWalletSuccess, isEditWalletSuccess, isDeleteWalletSuccess, isAddBankDataSuccess]); @@ -100,326 +100,4 @@ const HomePage: React.FC = () => { ); }; -const Wallets: React.FC = () => { - const dispatch = useAppDispatch() - - const { - setIsAddWalletPopupOpen, - setIsEditWalletPopupOpen - } = useContext(PopupContext); - - const { wallets, activeWallet, isLoading } = useAppSelector(state => state.wallet) - - const cashWallet = wallets?.find( - (wallet) => wallet?.type_of_account === 'cash' - ); - const bankWallets = wallets?.filter( - (wallet) => wallet?.type_of_account === 'bank' - ); - - const handleAddWalletClick = () => { - setIsAddWalletPopupOpen(true); - }; - - function onWalletClick(wallet: IWallet) { - setIsEditWalletPopupOpen(true) - dispatch(setActiveWallet(wallet)); - }; - - return ( - - - Рахунки - - - - - {isDev ? "Готівка" : cashWallet?.title || "Готівка"} - - onWalletClick(isDev ? mockWallets[0] : cashWallet)} - isActive={activeWallet?.id === (isDev ? mockWallets[0] : cashWallet)?.id} - /> - - - - Картки - - - {(isDev - ? mockWallets.filter(w => w.type_of_account === "bank") - : bankWallets).map((wallet) => ( - - onWalletClick(wallet)} - isActive={activeWallet?.id === wallet.id} - /> - - ))} - - - - - - ); -} - -const Transactions: React.FC = () => { - const { transactions } = useAppSelector(state => state.transaction) - - const transactionsData = (): Transactions => { - let filteredTransactions: Transactions = transactions.all; - - return filterTransactions(filteredTransactions) - }; - - return ( - - - Останні транзакції - - - {Object.entries(transactionsData()).map(([date, transactions]) => ( - - - {formatTransactionDateToFullDate(date)} - - - {transactions.sort((a, b) => new Date(b.created).getTime() - new Date(a.created).getTime()) - .map((transaction) => ( - - - - ))} - - - ))} - - - ); -} - -const Statistics: React.FC = () => { - const dispatch = useAppDispatch(); - - const { incomesChart, expensesChart, isLoading } = useAppSelector(state => state.statistics); - - const incomesLabels = useRef(null); - const expensesLabels = useRef(null); - - const incomesData = useRef(null); - const expensesData = useRef(null); - - const incomeCategoriesWithTotalAmount = useRef(null); - const expenseCategoriesWithTotalAmount = useRef(null); - - useEffect(() => { - if (incomesChart.categories && incomesChart.allTransactions) { - incomeCategoriesWithTotalAmount.current = incomesChart.categories - .flatMap((category) => { - const transactionsForCategory = Object.values(incomesChart.allTransactions) - .flat() - .filter( - (transaction) => - parseFloat(transaction.amount_of_funds) > 0 && - transaction.category === category.id - ); - if (!transactionsForCategory || transactionsForCategory.length === 0) { - return []; - } - const totalAmount = transactionsForCategory.reduce( - (sum, transaction) => - sum + parseFloat(transaction.amount_of_funds), - 0 - ); - return { - id: category.id, - title: category.title, - type_of_outlay: category.type_of_outlay, - owner: category.owner, - totalAmount, - }; - }) - .filter((category) => category.totalAmount > 0); - - incomesLabels.current = incomeCategoriesWithTotalAmount.current.map(c => { - return c.title - }) - incomesData.current = incomeCategoriesWithTotalAmount.current.map(c => { - return c.totalAmount - }) - } - }, [incomesChart.categories, incomesChart.allTransactions]); - - useEffect(() => { - if (expensesChart.categories && expensesChart.allTransactions) { - expenseCategoriesWithTotalAmount.current = expensesChart.categories - .flatMap((category) => { - const transactionsForCategory = Object.values(expensesChart.allTransactions) - .flat() - .filter( - (transaction) => - parseFloat(transaction.amount_of_funds) > 0 && - transaction.category === category.id - ); - if (!transactionsForCategory || transactionsForCategory.length === 0) { - return []; - } - const totalAmount = transactionsForCategory.reduce( - (sum, transaction) => - sum + parseFloat(transaction.amount_of_funds), - 0 - ); - return { - id: category.id, - title: category.title, - type_of_outlay: category.type_of_outlay, - owner: category.owner, - totalAmount, - }; - }) - .filter((category) => category.totalAmount > 0); - - expensesLabels.current = expenseCategoriesWithTotalAmount.current.map(c => { - return c.title - }) - expensesData.current = expenseCategoriesWithTotalAmount.current.map(c => { - return c.totalAmount - }) - } - }, [expensesChart.categories, expensesChart.allTransactions]) - - const totalIncomesAmount: string = Object.values(incomesChart?.allTransactions) - .map((transactionsArr) => transactionsArr.reduce((sum, transaction) => { - return sum += parseFloat(transaction.amount_of_funds) - }, 0)) - .reduce((sum, t) => sum + t, 0) - .toFixed(2); - - const totalExpensesAmount: string = Object.values(expensesChart?.allTransactions) - ?.map((transactionsArr) => transactionsArr?.reduce((sum, transaction) => { - return sum += parseFloat(transaction?.amount_of_funds) - }, 0)) - .reduce((sum, t) => sum + t, 0) - .toFixed(2); - - useEffect(() => { - if (isLoading === false) { - if (incomesChart.allTransactions) { - dispatch(setTotalIncomes(totalIncomesAmount)); - } - if (expensesChart.allTransactions) { - dispatch(setTotalExpenses(totalExpensesAmount)); - } - } - }, [incomesChart.allTransactions, expensesChart.allTransactions, isLoading]); - return ( - - - Статистика за останній місяць - - - - - - Витрати - - - {expensesChart.totalAmount} ₴ - - - - - - - - - - Надходження - - - {incomesChart.totalAmount} ₴ - - - - - - - - - ); -} - export default HomePage; \ No newline at end of file diff --git a/src/components/pages/home/Statistics.tsx b/src/components/pages/home/Statistics.tsx new file mode 100644 index 0000000..fc47401 --- /dev/null +++ b/src/components/pages/home/Statistics.tsx @@ -0,0 +1,140 @@ +import { useRef, useEffect } from "react"; + +import { setTotalIncomes, setTotalExpenses } from "../../../store/categorySlice"; +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { ICategoryWithTotalAmount } from "../../../store/types"; + +import { + calculateCategoriesWithTotalAmount +} from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import DoughnutChart from "../../molecules/charts/DoughnutChart"; + +import { BASE_2 } from "../../../shared/styles/variables"; +import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; + +const Statistics: React.FC = () => { + const dispatch = useAppDispatch(); + + const { + incomesChart, + expensesChart, + isLoading + } = useAppSelector(state => state.statistics); + + const incomesLabels = useRef(null); + const expensesLabels = useRef(null); + + const incomesData = useRef(null); + const expensesData = useRef(null); + + const incomeCategoriesWithTotalAmount = useRef(null); + const expenseCategoriesWithTotalAmount = useRef(null); + + const totalIncomesAmount: string = calculateTotalAmount(incomesChart?.allTransactions); + const totalExpensesAmount: string = calculateTotalAmount(expensesChart?.allTransactions); + + useEffect(() => { + if (incomesChart.categories && incomesChart.allTransactions) { + incomeCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( + incomesChart.categories, + incomesChart.allTransactions, + ) + + incomesLabels.current = incomeCategoriesWithTotalAmount.current.map(c => { + return c.title + }) + incomesData.current = incomeCategoriesWithTotalAmount.current.map(c => { + return c.totalAmount + }) + } + }, [incomesChart.categories, incomesChart.allTransactions]); + + useEffect(() => { + if (expensesChart.categories && expensesChart.allTransactions) { + expenseCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( + expensesChart.categories, + expensesChart.allTransactions, + ) + + expensesLabels.current = expenseCategoriesWithTotalAmount.current.map(c => { + return c.title + }) + expensesData.current = expenseCategoriesWithTotalAmount.current.map(c => { + return c.totalAmount + }) + } + }, [expensesChart.categories, expensesChart.allTransactions]) + + useEffect(() => { + if (!isLoading) { + if (incomesChart.allTransactions) { + dispatch(setTotalIncomes(totalIncomesAmount)); + } + if (expensesChart.allTransactions) { + dispatch(setTotalExpenses(totalExpensesAmount)); + } + } + }, [isLoading, incomesChart.allTransactions, expensesChart.allTransactions]); + + return ( + + + Статистика за останній місяць + + + + + + Витрати + + + {expensesChart.totalAmount} ₴ + + + + + + + + + + Надходження + + + {incomesChart.totalAmount} ₴ + + + + + + + + + ); +} + +export default Statistics; \ No newline at end of file diff --git a/src/components/pages/home/Transitions.tsx b/src/components/pages/home/Transitions.tsx new file mode 100644 index 0000000..6f1823a --- /dev/null +++ b/src/components/pages/home/Transitions.tsx @@ -0,0 +1,67 @@ +import { useAppSelector } from "../../../store/hooks"; +import { Transactions } from "../../../store/types"; + +import { filterTransactions } from "../../../shared/utils/transactions/filterTransactions"; +import { + formatTransactionDateToFullDate +} from "../../../shared/utils/transactions/formatTransactionDate"; + +import { Box } from "../../atoms/box/Box.styled"; +import { List } from "../../atoms/list/List.styled"; +import { ListItem } from "../../atoms/list/ListItem.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import Transaction from "../../molecules/transaction/Transaction"; + +import { BASE_2 } from "../../../shared/styles/variables"; + +const Transactions: React.FC = () => { + const { transactions } = useAppSelector(state => state.transaction) + + const transactionsData = (): Transactions => { + const filteredTransactions: Transactions = transactions.all; + + return filterTransactions(filteredTransactions) + }; + + return ( + + + Останні транзакції + + + {Object.entries(transactionsData()).map(([date, transactions]) => ( + + + {formatTransactionDateToFullDate(date)} + + + {transactions.sort((a, b) => new Date(b.created).getTime() - new Date(a.created).getTime()) + .map((transaction) => ( + + + + ))} + + + ))} + + + ); +} + +export default Transactions; \ No newline at end of file diff --git a/src/components/pages/home/Wallets.tsx b/src/components/pages/home/Wallets.tsx new file mode 100644 index 0000000..6e7cfb5 --- /dev/null +++ b/src/components/pages/home/Wallets.tsx @@ -0,0 +1,118 @@ +import { useContext } from "react"; + +import { PopupContext } from "../../../contexts/PopupContext"; + +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { setActiveWallet } from "../../../store/walletSlice"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Button } from "../../atoms/button/Button.styled"; +import { List } from "../../atoms/list/List.styled"; +import { ListItem } from "../../atoms/list/ListItem.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import Wallet from "../../molecules/wallet/Wallet"; + +import { BASE_2, DIVIDER } from "../../../shared/styles/variables"; + +import { IWallet } from "../../../store/types"; + +const Wallets: React.FC = () => { + const dispatch = useAppDispatch() + + const { + setIsAddWalletPopupOpen, + setIsEditWalletPopupOpen + } = useContext(PopupContext); + + const { + wallets, + activeWallet, + isLoading + } = useAppSelector(state => state.wallet) + + const cashWallet = wallets?.find(wallet => { + return wallet?.type_of_account === "cash"; + }) + + const bankWallets = wallets?.filter(wallet => { + return wallet?.type_of_account === "bank"; + }) + + const onWalletClick = (wallet: IWallet) => { + setIsEditWalletPopupOpen(true) + dispatch(setActiveWallet(wallet)); + }; + + return ( + + + Рахунки + + + + + {cashWallet?.title || "Готівка"} + + onWalletClick(cashWallet)} + isActive={activeWallet?.id === cashWallet?.id} + /> + + + + Картки + + + {bankWallets?.map((wallet) => ( + + onWalletClick(wallet)} + isActive={activeWallet?.id === wallet.id} + /> + + ))} + + + + + + ); +} + +export default Wallets; \ No newline at end of file diff --git a/src/components/pages/login/LoginPage.tsx b/src/components/pages/login/LoginPage.tsx index 6f342a3..456a052 100644 --- a/src/components/pages/login/LoginPage.tsx +++ b/src/components/pages/login/LoginPage.tsx @@ -1,6 +1,12 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; +import { useNavigate } from "react-router-dom"; + import { useForm } from "react-hook-form"; +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { loginUser } from "../../../store/userSlice"; +import { LoginFormData } from "../../../store/types"; + import { Box } from '../../atoms/box/Box.styled'; import { Typography } from '../../atoms/typography/Typography.styled'; import { Img } from '../../atoms/img/Img.styled'; @@ -13,23 +19,17 @@ import { Button } from "../../atoms/button/Button.styled"; import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; - import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg'; import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg'; +import { emailRegex, passwordRegex } from "../../../shared/utils/regexes"; + import { - ALERT_1, ALERT_2, ALMOST_BLACK_FOR_TEXT, - GRADIENT, PRIMARY, + GRADIENT, + PRIMARY, WHITE } from "../../../shared/styles/variables"; -import { getUserDetails, loginUser } from "../../../store/userSlice"; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { LoginFormData } from "../../../store/types"; -import { useNavigate } from "react-router-dom"; -import { emailRegex, passwordRegex } from "../../../shared/utils/regexes"; -import { token } from "../../../api/api"; - const LoginPage: React.FC = () => { const dispatch = useAppDispatch(); @@ -40,19 +40,16 @@ const LoginPage: React.FC = () => { const { loginError, isLoggedIn, isLoading } = useAppSelector(state => state.user) - const handleTogglePassword = () => { - setShowPassword(!showPassword); - }; + const handleSub = (data: LoginFormData) => { + dispatch(loginUser(data)); + } const { register, formState: { errors, isValid }, handleSubmit, reset, - } = useForm({ - mode: "all", - }); - + } = useForm({ mode: "all" }); useEffect(() => { if (isLoggedIn) { @@ -61,10 +58,6 @@ const LoginPage: React.FC = () => { } }, [isLoggedIn]); - function handleSub(data: LoginFormData) { - dispatch(loginUser(data)); - } - return ( @@ -97,7 +90,7 @@ const LoginPage: React.FC = () => { - setShowPassword(!showPassword)} style={{ position: "absolute", top: "16px", right: "10px", cursor: "pointer" }}>{showPassword ? diff --git a/src/components/pages/password-recovery/EmailStep.tsx b/src/components/pages/password-recovery/EmailStep.tsx new file mode 100644 index 0000000..117b203 --- /dev/null +++ b/src/components/pages/password-recovery/EmailStep.tsx @@ -0,0 +1,86 @@ +import { useForm } from "react-hook-form"; + +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { requestPasswordReset } from "../../../store/passwordRecoverySlice"; + +import { emailRegex } from "../../../shared/utils/regexes"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Button } from "../../atoms/button/Button.styled"; +import { Container } from "../../atoms/container/Container.styled"; +import { Img } from "../../atoms/img/Img.styled"; +import { Input } from "../../atoms/input/Input.styled"; +import { Label } from "../../atoms/label/Label.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import { Form } from "../../atoms/form/Form.styled"; + +import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; +import logo from "../../../shared/assets/images/logo.png"; + +import { + GRADIENT, + WHITE, + ALMOST_BLACK_FOR_TEXT +} from "../../../shared/styles/variables"; + +const EmailStep: React.FC = () => { + const dispatch = useAppDispatch(); + const { isLoading } = useAppSelector(state => state.passwordRecovery) + + const { + register, + formState: { errors, isValid }, + handleSubmit, + } = useForm({ mode: "all" }); + + const handleSub = (data: { email: string }) => { + dispatch(requestPasswordReset(data)); + } + + return ( + + + InterfaceImage + + + + Logo + + Відновлення пароля + + + Введіть пошту на яку ви реєстрували
ваш аккаунт + +
+ + + + + {errors?.email && <>{errors?.email?.message || 'Error!'}} + + + +
+ + + + ) +} + +export default EmailStep; \ No newline at end of file diff --git a/src/components/pages/password-recovery/NewPasswordStep.tsx b/src/components/pages/password-recovery/NewPasswordStep.tsx new file mode 100644 index 0000000..cf6a766 --- /dev/null +++ b/src/components/pages/password-recovery/NewPasswordStep.tsx @@ -0,0 +1,155 @@ +import { useState, useEffect } from "react"; +import { useNavigate } from "react-router-dom"; + +import { useForm } from "react-hook-form"; + +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { confirmPasswordReset } from "../../../store/passwordRecoverySlice"; + +import { passwordRegex } from "../../../shared/utils/regexes"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Button } from "../../atoms/button/Button.styled"; +import { Container } from "../../atoms/container/Container.styled"; +import { Img } from "../../atoms/img/Img.styled"; +import { Input } from "../../atoms/input/Input.styled"; +import { Label } from "../../atoms/label/Label.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import { Form } from "../../atoms/form/Form.styled"; + +import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; +import logo from "../../../shared/assets/images/logo.png"; +import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg'; +import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg'; + +import { + GRADIENT, + WHITE, + ALMOST_BLACK_FOR_TEXT +} from "../../../shared/styles/variables"; + +const NewPasswordStep: React.FC<{ + uid: string, + resetToken: string +}> = ({ uid, resetToken }) => { + const dispatch = useAppDispatch(); + const navigate = useNavigate(); + + const { isNewPasswordSet, isLoading } = useAppSelector(state => state.passwordRecovery) + + const [showPassword, setShowPassword] = useState(false); + const [showConfirmPassword, setShowConfirmPassword] = useState(false); + + const handleSub = (data: { password: string, confirmPassword: string }) => { + dispatch(confirmPasswordReset({ + uid, + token: resetToken, + new_password: data?.password, + })) + } + + const { + register, + formState: { errors, isValid }, + handleSubmit, + watch, + } = useForm({ mode: "all" }); + + useEffect(() => { + if (isNewPasswordSet) { + navigate('/login') + } + }, [isNewPasswordSet]); + + return ( + + + InterfaceImage + + + + Logo + + Створення нового пароля + + + Введіть новий пароль для вашого
аккаунту + +
+ + + + + setShowPassword(!showPassword)} style={{ + position: "absolute", top: "16px", + right: "10px", cursor: "pointer" + }}>{showPassword ? + + : + + } + + + {errors?.password && <>{errors?.password?.message || 'Error!'}} + + + setShowConfirmPassword(!showConfirmPassword)} style={{ + position: "absolute", top: "16px", + right: "10px", cursor: "pointer" + }}>{showConfirmPassword ? + + : + + } + { + if (watch('password') != val) { + return "Паролі не співпадають"; + } + } + })} + style={{ paddingRight: '35px' }} + className={errors.confirmPassword && 'error'} + /> + + {errors?.confirmPassword && <>{errors?.confirmPassword?.message || 'Error!'}} + + + +
+ + + + ) +} + +export default NewPasswordStep; \ No newline at end of file diff --git a/src/components/pages/password-recovery/PasswordRecovery.tsx b/src/components/pages/password-recovery/PasswordRecovery.tsx index 4f4c01a..8b275f8 100644 --- a/src/components/pages/password-recovery/PasswordRecovery.tsx +++ b/src/components/pages/password-recovery/PasswordRecovery.tsx @@ -1,32 +1,10 @@ -import { useEffect, useState } from "react"; +import { useParams } from "react-router-dom"; -import { useForm } from "react-hook-form"; +import { useAppSelector } from "../../../store/hooks"; -import { Box } from '../../atoms/box/Box.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { Img } from '../../atoms/img/Img.styled'; -import { Container } from "../../atoms/container/Container.styled"; -import { Form } from "../../atoms/form/Form.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import { Input } from "../../atoms/input/Input.styled"; -import { Button } from "../../atoms/button/Button.styled"; - -import logo from "../../../shared/assets/images/logo.png"; -import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; - -import { - ALMOST_BLACK_FOR_TEXT, - GRADIENT, - WHITE -} from "../../../shared/styles/variables"; -import { emailRegex, passwordRegex } from "../../../shared/utils/regexes"; - -import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg'; -import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg'; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { confirmPasswordReset, requestPasswordReset, setIsResetLinkStepOpen } from "../../../store/passwordRecoverySlice"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; -import { useNavigate, useParams } from "react-router-dom"; +import NewPasswordStep from "./NewPasswordStep"; +import EmailStep from "./EmailStep"; +import ResetLinkStep from "./ResetLinkStep"; const PasswordRecovery: React.FC = () => { const { uid, resetToken } = useParams<{ uid: string, resetToken: string }>(); @@ -37,235 +15,9 @@ const PasswordRecovery: React.FC = () => { (uid && resetToken) ? ( ) : ( - !isResetLinkStepOpen ? : + isResetLinkStepOpen ? : ) ); } -const EmailStep: React.FC = () => { - const dispatch = useAppDispatch(); - const { isLoading } = useAppSelector(state => state.passwordRecovery) - - const { - register, - formState: { errors, isValid }, - handleSubmit, - reset, - } = useForm({ mode: "all" }); - - function handleSub(data: { email: string }) { - dispatch(requestPasswordReset(data)); - } - - return ( - - - InterfaceImage - - - - Logo - - Відновлення пароля - - - Введіть пошту на яку ви реєстрували
ваш аккаунт - -
- - - - - {errors?.email && <>{errors?.email?.message || 'Error!'}} - - - -
- - - - ) -} - -const ResetLinkStep: React.FC = () => { - const dispatch = useAppDispatch(); - - return ( - - - InterfaceImage - - - - Logo - - Відновлення пароля - - - Посилання для скидання пароля надіслано на вашу
електронну адресу. Якщо посилання не - прийшло, то ви
можете надіслати його знову. - - - dispatch(setIsResetLinkStepOpen(false))} - fz="14px" - m="0 auto" - > - Надіслати знову - - - - - - ) -} - -const NewPasswordStep: React.FC<{ uid: string, resetToken: string }> = ({ uid, resetToken }) => { - const dispatch = useAppDispatch(); - const navigate = useNavigate(); - - const { isNewPasswordSet, isLoading } = useAppSelector(state => state.passwordRecovery) - - const [showPassword, setShowPassword] = useState(false); - const [showConfirmPassword, setShowConfirmPassword] = useState(false); - - const { - register, - formState: { errors, isValid }, - handleSubmit, - watch, - } = useForm({ mode: "all" }); - - useEffect(() => { - if (isNewPasswordSet) { - navigate('/login') - } - }, [isNewPasswordSet]); - - const handleTogglePassword = () => { - setShowPassword(!showPassword); - }; - - const handleToggleConfirmPassword = () => { - setShowConfirmPassword(!showConfirmPassword); - }; - - function handleSub(data: { password: string, confirmPassword: string }) { - dispatch(confirmPasswordReset({ - uid, - token: resetToken, - new_password: data?.password, - })) - } - - return ( - - - InterfaceImage - - - - Logo - - Створення нового пароля - - - Введіть новий пароль для вашого
аккаунту - -
- - - - - {showPassword ? - - : - - } - - - {errors?.password && <>{errors?.password?.message || 'Error!'}} - - - {showConfirmPassword ? - - : - - } - { - if (watch('password') != val) { - return "Паролі не співпадають"; - } - } - })} - style={{ paddingRight: '35px' }} - className={errors.confirmPassword && 'error'} - /> - - {errors?.confirmPassword && <>{errors?.confirmPassword?.message || 'Error!'}} - - - -
- - - - ) -} - export default PasswordRecovery; \ No newline at end of file diff --git a/src/components/pages/password-recovery/ResetLinkStep.tsx b/src/components/pages/password-recovery/ResetLinkStep.tsx new file mode 100644 index 0000000..157a4d9 --- /dev/null +++ b/src/components/pages/password-recovery/ResetLinkStep.tsx @@ -0,0 +1,51 @@ +import { useAppDispatch } from "../../../store/hooks"; +import { setIsResetLinkStepOpen } from "../../../store/passwordRecoverySlice"; + +import { Box } from "../../atoms/box/Box.styled"; +import { ButtonLink } from "../../atoms/button/ButtonLink"; +import { Container } from "../../atoms/container/Container.styled"; +import { Img } from "../../atoms/img/Img.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; + +import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; +import logo from "../../../shared/assets/images/logo.png"; + +import { GRADIENT, WHITE, ALMOST_BLACK_FOR_TEXT } from "../../../shared/styles/variables"; + +const ResetLinkStep: React.FC = () => { + const dispatch = useAppDispatch(); + + return ( + + + InterfaceImage + + + + Logo + + Відновлення пароля + + + Посилання для скидання пароля надіслано на вашу
електронну адресу. Якщо посилання не + прийшло, то ви
можете надіслати його знову. + + + dispatch(setIsResetLinkStepOpen(false))} + fz="14px" + m="0 auto" + > + Надіслати знову + + + + + + ) +} + +export default ResetLinkStep; \ No newline at end of file diff --git a/src/components/pages/register/RegisterPage.tsx b/src/components/pages/register/RegisterPage.tsx index c2b40bc..21897a5 100644 --- a/src/components/pages/register/RegisterPage.tsx +++ b/src/components/pages/register/RegisterPage.tsx @@ -1,7 +1,13 @@ -import React, { useState, useEffect } from "react"; +import { useState, useEffect } from "react"; import { useNavigate } from 'react-router-dom'; + import { useForm } from "react-hook-form"; +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { registerUser } from '../../../store/userSlice'; + +import { emailRegex, nameRegex, passwordRegex } from "../../../shared/utils/regexes"; + import { Box } from '../../atoms/box/Box.styled'; import { Typography } from '../../atoms/typography/Typography.styled'; import { Img } from '../../atoms/img/Img.styled'; @@ -13,6 +19,8 @@ import { Button } from "../../atoms/button/Button.styled"; import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; +import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg'; +import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg'; import { ALERT_1, @@ -21,12 +29,7 @@ import { WHITE } from "../../../shared/styles/variables"; -import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg'; -import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg'; import { RegisterFormData } from "../../../store/types"; -import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { registerUser } from '../../../store/userSlice'; -import { emailRegex, nameRegex, passwordRegex } from "../../../shared/utils/regexes"; const RegisterPage: React.FC = () => { const dispatch = useAppDispatch(); @@ -40,22 +43,11 @@ const RegisterPage: React.FC = () => { const { register, - formState: { - errors, - isValid, - }, + formState: { errors, isValid }, handleSubmit, reset, watch, - } = useForm({ - mode: "all", - }); - const handleTogglePassword = () => { - setShowPassword(!showPassword); - }; - const handleToggleConfirmPassword = () => { - setShowConfirmPassword(!showConfirmPassword); - }; + } = useForm({ mode: "all" }); useEffect(() => { if (isRegistered) { @@ -64,8 +56,8 @@ const RegisterPage: React.FC = () => { } }, [isRegistered]); - async function handleSub(data: RegisterFormData) { - await dispatch(registerUser(data)); + const handleSub = (data: RegisterFormData) => { + dispatch(registerUser(data)); } return ( @@ -126,7 +118,7 @@ const RegisterPage: React.FC = () => { - setShowPassword(!showPassword)} style={{ position: "absolute", top: "16px", right: "10px", cursor: "pointer" }}>{showPassword ? @@ -154,7 +146,7 @@ const RegisterPage: React.FC = () => { - setShowConfirmPassword(!showConfirmPassword)} style={{ position: "absolute", top: "16px", right: "10px", cursor: "pointer" }}>{showConfirmPassword ? diff --git a/src/components/pages/statistics/DoughnutChartSection.tsx b/src/components/pages/statistics/DoughnutChartSection.tsx new file mode 100644 index 0000000..27b7897 --- /dev/null +++ b/src/components/pages/statistics/DoughnutChartSection.tsx @@ -0,0 +1,117 @@ +import { useRef, useEffect } from "react"; + +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { setTotalIncomes, setTotalExpenses } from "../../../store/categorySlice"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import DoughnutChart from "../../molecules/charts/DoughnutChart"; + +import { calculateCategoriesWithTotalAmount } from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; +import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; + +import { DIVIDER } from "../../../shared/styles/variables"; + +import { ICategoryWithTotalAmount } from "../../../store/types"; + +const DoughnutChartsSection: React.FC = () => { + const dispatch = useAppDispatch(); + + const { incomesChart, expensesChart, isLoading } = useAppSelector(state => state.statistics); + + const incomesLabels = useRef(null); + const expensesLabels = useRef(null); + + const incomesData = useRef(null); + const expensesData = useRef(null); + + const incomeCategoriesWithTotalAmount = useRef(null); + const expenseCategoriesWithTotalAmount = useRef(null); + + const totalIncomesAmount: string = calculateTotalAmount(incomesChart?.allTransactions); + const totalExpensesAmount: string = calculateTotalAmount(expensesChart?.allTransactions); + + useEffect(() => { + if (incomesChart.categories && incomesChart.allTransactions) { + incomeCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( + incomesChart.categories, + incomesChart.allTransactions, + ) + + incomesLabels.current = incomeCategoriesWithTotalAmount.current.map(c => { + return c.title + }) + incomesData.current = incomeCategoriesWithTotalAmount.current.map(c => { + return c.totalAmount + }) + } + }, [incomesChart.categories, incomesChart.allTransactions]); + + useEffect(() => { + if (expensesChart.categories && expensesChart.allTransactions) { + expenseCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( + expensesChart.categories, + expensesChart.allTransactions, + ) + + expensesLabels.current = expenseCategoriesWithTotalAmount.current.map(c => { + return c.title + }) + expensesData.current = expenseCategoriesWithTotalAmount.current.map(c => { + return c.totalAmount + }) + } + }, [expensesChart.categories, expensesChart.allTransactions]) + + useEffect(() => { + if (!isLoading) { + if (incomesChart.allTransactions) { + dispatch(setTotalIncomes(totalIncomesAmount)); + } + if (expensesChart.allTransactions) { + dispatch(setTotalExpenses(totalExpensesAmount)); + } + } + }, [incomesChart.allTransactions, expensesChart.allTransactions, isLoading]); + + return ( + + + + + Витрати: + + + {expensesChart.totalAmount} ₴ + + + + + + + + Надходження: + + + {incomesChart.totalAmount} ₴ + + + + + + ); +} + +export default DoughnutChartsSection; \ No newline at end of file diff --git a/src/components/pages/statistics/LineChartSection.tsx b/src/components/pages/statistics/LineChartSection.tsx new file mode 100644 index 0000000..7176795 --- /dev/null +++ b/src/components/pages/statistics/LineChartSection.tsx @@ -0,0 +1,94 @@ +import { useState, useEffect } from "react"; + +import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { setActiveCategoryId } from "../../../store/statisticsSlice"; +import { getFilteredTransactions } from "../../../store/transactionSlice"; + +import { + generateNewLineChartData +} from "../../../shared/utils/statistics/generateNewLineChartData"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import LineChart from "../../molecules/charts/LineChart"; +import Select from "../../molecules/select/Select"; + +import { WHITE } from "../../../shared/styles/variables"; + +const LineChartSection: React.FC = () => { + const dispatch = useAppDispatch(); + + const { filterByDays, allOutlaysChart } = useAppSelector(state => state.statistics); + const { categories } = useAppSelector(state => state.category); + + const selectedCategory = categories.all.find((c) => c.id === allOutlaysChart.activeCategoryId) + + const [selectedCategoryValues, setSelectedCategoryValues] = useState({ + value: selectedCategory?.id, + label: selectedCategory?.title, + }); + + const [chartData, setChartData] = useState([]); + + const options: any = categories.all?.map(({ id, title }) => { + return { value: id, label: title } + }) + + const onCategoryChange = (e: any): void => { + if (e.value !== allOutlaysChart?.activeCategoryId) { + setSelectedCategoryValues({ value: e.value, label: e.label }) + dispatch(setActiveCategoryId(e.value)) + dispatch(getFilteredTransactions( + `?category=${e.value}&days=${filterByDays}` + )) + } + } + + useEffect(() => { + const newChartData: number[] = new Array(parseInt(filterByDays)).fill(0); + + const { + diffInDays, + totalAmount + } = generateNewLineChartData(allOutlaysChart.categoryTransactions) + + newChartData[diffInDays] = totalAmount; + + setChartData(newChartData); + }, [allOutlaysChart?.categoryTransactions]); + + useEffect(() => { + if (allOutlaysChart?.activeCategoryId) { + dispatch(getFilteredTransactions( + `?category=${allOutlaysChart?.activeCategoryId}&days=${filterByDays}` + )) + } else { + setSelectedCategoryValues({ + value: categories.all[0]?.id, + label: categories.all[0]?.title + }) + dispatch(setActiveCategoryId(categories.all[0]?.id)) + } + }, [allOutlaysChart?.activeCategoryId, filterByDays, categories.all]); + + return ( + + + + Витрати або надходження за категорією + + - - - - - - ); -} - export default StatisticsPage; \ No newline at end of file diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index 32775ea..eb95b33 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -1,33 +1,46 @@ import { useEffect, useState } from 'react'; -import { mockWallets } from "../../../../mock-data/wallets"; -import { isDev } from "../../../consts/consts"; + +import { useForm } from 'react-hook-form'; + import { useAppDispatch, useAppSelector } from "../../../store/hooks"; +import { getFilteredCategories } from '../../../store/categorySlice'; +import { + setActiveTransaction, + setAddTransactionData, + transactionAction +} from "../../../store/transactionSlice"; + +import { + moneyAmountRegex, + titleRegex, + twoSymbolsRegex +} from '../../../shared/utils/regexes'; +import { + formatTransactionDateToUTC +} from '../../../shared/utils/transactions/formatTransactionDate'; +import { + setSelectOptions +} from '../../../shared/utils/transactions/setSelectOptions'; + +import { userId } from '../../../api/api'; + +import { Form } from '../../atoms/form/Form.styled'; import { Box } from "../../atoms/box/Box.styled"; import { Button } from "../../atoms/button/Button.styled"; import { Input } from "../../atoms/input/Input.styled"; import { Label } from "../../atoms/label/Label.styled"; -import { List } from "../../atoms/list/List.styled"; import { ListItem } from "../../atoms/list/ListItem.styled"; -import Select from "../../molecules/select/Select"; import { Typography } from "../../atoms/typography/Typography.styled"; -import TabSwitch, { ISwitchButton } from "../../molecules/tabs/switch/TabSwitch"; +import Select from "../../molecules/select/Select"; +import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; import Wallet from "../../molecules/wallet/Wallet"; -import { BASE_2, WHITE } from "../../../shared/styles/variables"; -import { IWallet } from "../../../store/types"; +import DatePicker from './DatePicker'; -import { - setActiveTransaction, - setAddTransactionData, - transactionAction -} from "../../../store/transactionSlice"; +import { BASE_2, WHITE } from "../../../shared/styles/variables"; -import { formatTransactionDateToUTC } from '../../../shared/utils/formatTransactionDate'; -import { userId } from '../../../api/api'; -import { getFilteredCategories } from '../../../store/categorySlice'; -import DatePicker from './DatePicker'; -import { Form } from '../../atoms/form/Form.styled'; -import { moneyAmountRegex, titleRegex, twoSymbolsRegex } from '../../../shared/utils/regexes'; -import { useForm } from 'react-hook-form'; +import { IWallet, TypeOfOutlay } from "../../../store/types"; +import { SelectOptions } from '../../../../types/molecules'; +import { ISwitchButton } from "../../molecules/tabs/switch/TabSwitch"; const AddTransaction: React.FC = () => { const dispatch = useAppDispatch() @@ -39,98 +52,51 @@ const AddTransaction: React.FC = () => { const selectedCategory = categories.all.find((c) => c.id === addTransactionData?.category) - const [selectedCategoryValues, setSelectedCategoryValues] = useState< - { value: number, label: string } - >({ + const [selectedCategoryValues, setSelectedCategoryValues] = useState({ value: selectedCategory?.id, label: selectedCategory?.title, }); - const options: any = (addTransactionData?.type_of_outlay === "expense" - ? categories.expense - : categories.income - )?.map(({ id, title }) => { - return { value: id, label: title } - }) - const isValid = Object.keys(addTransactionData || {})?.length >= 4; - const { - register, - formState: { errors }, - handleSubmit, - setValue, - getValues, - clearErrors, - } = useForm({ mode: "all" }); + const selectOptions = setSelectOptions( + addTransactionData?.type_of_outlay, + categories + ) - const switchButtons: ISwitchButton[] = [ - { - buttonName: 'Витрата', - onTabClick: () => { - if (addTransactionData?.type_of_outlay === "expense") return; - dispatch(setAddTransactionData({ - type_of_outlay: "expense", - category: categories.expense[0]?.id - })); - setSelectedCategoryValues({ - value: categories.expense[0]?.id, - label: categories.expense[0]?.title - }) - }, - isActive: addTransactionData?.type_of_outlay === "expense" - }, - { - buttonName: 'Надходження', + const setSwitchButtonOptions = ( + buttonName: string, + typeOfOutlay: TypeOfOutlay, + ): any => { + return { + buttonName, + isActive: addTransactionData?.type_of_outlay === typeOfOutlay, onTabClick: () => { - if (addTransactionData?.type_of_outlay === "income") return; + if (addTransactionData?.type_of_outlay === typeOfOutlay) { + return; + }; dispatch(setAddTransactionData({ - type_of_outlay: "income", - category: categories.income[0]?.id + type_of_outlay: typeOfOutlay, + category: categories[typeOfOutlay][0]?.id })); setSelectedCategoryValues({ - value: categories.income[0]?.id, - label: categories.income[0]?.title + value: categories[typeOfOutlay][0]?.id, + label: categories[typeOfOutlay][0]?.title }) }, - isActive: addTransactionData?.type_of_outlay === "income" - }, - ]; - - useEffect(() => { - clearErrors('category'); - setValue('category', addTransactionData?.category); - }, [addTransactionData?.category]); - - useEffect(() => { - dispatch(getFilteredCategories("?type_of_outlay=income")) - dispatch(getFilteredCategories("?type_of_outlay=expense")) - - dispatch(setAddTransactionData({ - created: formatTransactionDateToUTC(new Date()), - type_of_outlay: "expense", - category: categories.expense[0]?.id - })) - }, []); + } + } - useEffect(() => { - setSelectedCategoryValues({ - value: categories.expense[0]?.id, - label: categories.expense[0]?.title - }) - dispatch(setAddTransactionData({ - created: formatTransactionDateToUTC(new Date()), - type_of_outlay: "expense", - category: categories.expense[0]?.id - })) - setValue('category', selectedCategoryValues) - }, [categories.expense]); + const switchButtons: ISwitchButton[] = [ + setSwitchButtonOptions('Витрата', "expense"), + setSwitchButtonOptions('Надходження', "income"), + ]; - function onWalletClick(wallet: IWallet) { + const onWalletClick = (wallet: IWallet) => { dispatch(setAddTransactionData({ wallet: wallet.id })); }; - function onCategoryChange(selectedValue: any): void { + const onCategoryChange = (selectedValue: any): void => { dispatch(setAddTransactionData({ category: selectedValue?.value })); setSelectedCategoryValues({ value: selectedValue?.value, @@ -138,7 +104,13 @@ const AddTransaction: React.FC = () => { }); } - function handleSub(data: { amount: string, category: number, title?: string }) { + const handleSub = ( + data: { + amount: string, + category: number, + title?: string + } + ) => { let transactionTitle; if (!getValues('title')) { @@ -159,6 +131,44 @@ const AddTransaction: React.FC = () => { })) } + const { + register, + formState: { errors }, + handleSubmit, + setValue, + getValues, + clearErrors, + } = useForm({ mode: "all" }); + + useEffect(() => { + clearErrors('category'); + setValue('category', addTransactionData?.category); + }, [addTransactionData?.category]); + + useEffect(() => { + dispatch(getFilteredCategories("?type_of_outlay=income")) + dispatch(getFilteredCategories("?type_of_outlay=expense")) + + dispatch(setAddTransactionData({ + created: formatTransactionDateToUTC(new Date()), + type_of_outlay: "expense", + category: categories.expense[0]?.id + })) + }, []); + + useEffect(() => { + setSelectedCategoryValues({ + value: categories.expense[0]?.id, + label: categories.expense[0]?.title + }) + dispatch(setAddTransactionData({ + created: formatTransactionDateToUTC(new Date()), + type_of_outlay: "expense", + category: categories.expense[0]?.id + })) + setValue('category', selectedCategoryValues) + }, [categories.expense]); + return ( { { const dispatch = useAppDispatch(); @@ -27,37 +33,29 @@ const Transactions: React.FC = () => { filterByTypeOfOutlay } = useAppSelector(state => state.transaction); - const filterButtons: IFilterButton[] = [ - { - buttonName: 'Всі транзакції', - filterBy: "", - onTabClick: () => { - dispatch(setFilterByTypeOfOutlay("all")); - dispatch(getFilteredTransactions("")) - }, - isActive: filterByTypeOfOutlay === "all" - }, - { - buttonName: "Витрати", - filterBy: '?type_of_outlay=expense', + const setFilterButtonOptions = ( + buttonName: string, + typeOfOutlay: TypeOfOutlay | "", + ): any => { + return { + buttonName, + typeOfOutlay, + filterBy: typeOfOutlay ? `?type_of_outlay=${typeOfOutlay}` : "", + isActive: filterByTypeOfOutlay === (typeOfOutlay || "all"), onTabClick: () => { - dispatch(setFilterByTypeOfOutlay("expense")); - dispatch(getFilteredTransactions("?type_of_outlay=expense")) - }, - isActive: filterByTypeOfOutlay === "expense" - }, - { - buttonName: "Надходження", - filterBy: '?type_of_outlay=income', - onTabClick: () => { - dispatch(setFilterByTypeOfOutlay("income")); - dispatch(getFilteredTransactions("?type_of_outlay=income")) - }, - isActive: filterByTypeOfOutlay === "income" - }, + dispatch(setFilterByTypeOfOutlay(typeOfOutlay || "all")); + dispatch(getFilteredTransactions(typeOfOutlay)); + } + } + } + + const filterButtons: IFilterButton[] = [ + setFilterButtonOptions("Всі транзакції", ""), + setFilterButtonOptions("Витрати", "expense"), + setFilterButtonOptions("Витрати", "income") ]; - function onTransactionClick(transaction: ITransaction) { + const onTransactionClick = (transaction: ITransaction) => { dispatch(setActiveTransaction(transaction)); dispatch(setEditTransactionData(transaction)); dispatch(setIsEditTransactionOpen(true)); @@ -76,7 +74,6 @@ const Transactions: React.FC = () => { return filterTransactions(filteredTransactions) }; - return ( diff --git a/src/components/pages/transactions/TransactionsPage.tsx b/src/components/pages/transactions/TransactionsPage.tsx index 03f5f11..52b7d09 100644 --- a/src/components/pages/transactions/TransactionsPage.tsx +++ b/src/components/pages/transactions/TransactionsPage.tsx @@ -1,17 +1,19 @@ import { useEffect } from "react"; -import { Box } from "../../atoms/box/Box.styled"; -import { TransactionsPageWrapper } from "./TransactionsPage.styled"; +import { useNavigate } from "react-router-dom"; + import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { getUserDetails } from "../../../store/userSlice"; -import Header from "../../molecules/header/Header"; import { getTransactions } from "../../../store/transactionSlice"; -import EditTransaction from "./EditTransaction"; -import Transactions from "./Transactions"; -import AddTransaction from "./AddTransaction"; import { getWallets } from "../../../store/walletSlice"; import { getCategories } from "../../../store/categorySlice"; + import { token } from "../../../api/api"; -import { useNavigate } from "react-router-dom"; + +import { Box } from "../../atoms/box/Box.styled"; +import Header from "../../molecules/header/Header"; +import EditTransaction from "./EditTransaction"; +import Transactions from "./Transactions"; +import AddTransaction from "./AddTransaction"; +import { TransactionsPageWrapper } from "./TransactionsPage.styled"; const TransactionsPage: React.FC = () => { const dispatch = useAppDispatch() @@ -38,7 +40,7 @@ const TransactionsPage: React.FC = () => { }, []); useEffect(() => { - if (isLoading === false) { + if (!isLoading) { dispatch(getTransactions()); } }, [isLoading]); diff --git a/src/components/pages/welcome/WelcomePage.tsx b/src/components/pages/welcome/WelcomePage.tsx index 5b2b8d6..7ff6236 100644 --- a/src/components/pages/welcome/WelcomePage.tsx +++ b/src/components/pages/welcome/WelcomePage.tsx @@ -1,3 +1,6 @@ +import { useNavigate } from "react-router-dom"; + +import { Button } from "../../atoms/button/Button.styled"; import { Box } from '../../atoms/box/Box.styled'; import { Typography } from '../../atoms/typography/Typography.styled'; import { Img } from '../../atoms/img/Img.styled'; @@ -7,21 +10,19 @@ import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; import { GRADIENT, WHITE } from "../../../shared/styles/variables"; -import { Button } from "../../atoms/button/Button.styled"; -import { useNavigate } from "react-router-dom"; const WelcomePage = () => { const navigate = useNavigate(); - function handleEnterClick() { + const handleEnterClick = () => { navigate('/login'); } - function handleRegisterClick() { + const handleRegisterClick = () => { navigate('/register'); } - function handleShowDemoClick() { + const handleShowDemoClick = () => { window.location.replace("https://spendwise-test.vercel.app/home"); } diff --git a/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts new file mode 100644 index 0000000..f3bb47e --- /dev/null +++ b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts @@ -0,0 +1,33 @@ +import { ICategory, ICategoryWithTotalAmount, Transactions } from "../../../store/types" + +export const calculateCategoriesWithTotalAmount = ( + categories: ICategory[], + allTransactions: Transactions +): ICategoryWithTotalAmount[] => { + return categories + .flatMap((category) => { + const transactionsForCategory = Object.values(allTransactions) + .flat() + .filter( + (transaction) => + parseFloat(transaction.amount_of_funds) > 0 && + transaction.category === category.id + ); + if (!transactionsForCategory || transactionsForCategory.length === 0) { + return []; + } + const totalAmount = transactionsForCategory.reduce( + (sum, transaction) => + sum + parseFloat(transaction.amount_of_funds), + 0 + ); + return { + id: category.id, + title: category.title, + type_of_outlay: category.type_of_outlay, + owner: category.owner, + totalAmount, + }; + }) + .filter((category) => category.totalAmount > 0); +} \ No newline at end of file diff --git a/src/shared/utils/statistics/calculateTotalAmount.ts b/src/shared/utils/statistics/calculateTotalAmount.ts new file mode 100644 index 0000000..dd6d23e --- /dev/null +++ b/src/shared/utils/statistics/calculateTotalAmount.ts @@ -0,0 +1,13 @@ +import { Transactions } from "../../../store/types"; + +export const calculateTotalAmount = (allTransactions: Transactions): string => { + const transactionAmounts = Object.values(allTransactions).flatMap(transactionsArr => { + return transactionsArr.map(transaction => { + return parseFloat(transaction.amount_of_funds) + }) + }) + + const totalAmount = transactionAmounts.reduce((sum, amount) => sum + amount, 0); + + return totalAmount.toFixed(2); +}; diff --git a/src/shared/utils/statistics/generateNewLineChartData.ts b/src/shared/utils/statistics/generateNewLineChartData.ts new file mode 100644 index 0000000..3c00e9a --- /dev/null +++ b/src/shared/utils/statistics/generateNewLineChartData.ts @@ -0,0 +1,24 @@ +import { Transactions } from "../../../store/types"; + +export const generateNewLineChartData = (categoryTransactions: Transactions): { + diffInDays: number, + totalAmount: number +} => { + let diffInDays = null; + let totalAmount = null; + + Object.entries(categoryTransactions)?.forEach(([dateStr, transactionsArr]) => { + const targetDate = new Date(dateStr); + const currentDate = new Date(); + + const diffInTime = targetDate.getTime() - currentDate.getTime(); + + diffInDays = Math.abs(Math.ceil(diffInTime / (1000 * 60 * 60 * 24))); + + totalAmount = transactionsArr.reduce((acc, transaction) => { + return acc + parseInt(transaction.amount_of_funds); + }, 0); + }); + + return { diffInDays, totalAmount } +} \ No newline at end of file diff --git a/src/shared/utils/filterTransactions.ts b/src/shared/utils/transactions/filterTransactions.ts similarity index 89% rename from src/shared/utils/filterTransactions.ts rename to src/shared/utils/transactions/filterTransactions.ts index 8bf8361..a7d4aad 100644 --- a/src/shared/utils/filterTransactions.ts +++ b/src/shared/utils/transactions/filterTransactions.ts @@ -1,4 +1,4 @@ -import { Transactions } from "../../store/types"; +import { Transactions } from "../../../store/types"; export function filterTransactions(filteredTransactions: Transactions): Transactions { const sortedTransactions: Transactions = {}; diff --git a/src/shared/utils/formatTransactionDate.ts b/src/shared/utils/transactions/formatTransactionDate.ts similarity index 100% rename from src/shared/utils/formatTransactionDate.ts rename to src/shared/utils/transactions/formatTransactionDate.ts diff --git a/src/shared/utils/formatTransactionTime.ts b/src/shared/utils/transactions/formatTransactionTime.ts similarity index 100% rename from src/shared/utils/formatTransactionTime.ts rename to src/shared/utils/transactions/formatTransactionTime.ts diff --git a/src/shared/utils/transactions/setSelectOptions.ts b/src/shared/utils/transactions/setSelectOptions.ts new file mode 100644 index 0000000..0e99278 --- /dev/null +++ b/src/shared/utils/transactions/setSelectOptions.ts @@ -0,0 +1,19 @@ +import { SelectOptions } from '../../../../types/molecules'; +import { ICategory, TypeOfOutlay } from '../../../store/types'; + +export const setSelectOptions = ( + typeOfOutlay: TypeOfOutlay, + categories: any +): SelectOptions[] => { + let categoriesArr: ICategory[] = null; + + if (typeOfOutlay === "expense") { + categoriesArr = categories.expense; + } else { + categoriesArr = categories.income; + } + + return categoriesArr?.map(({ id, title }) => { + return { value: id, label: title }; + }); +}; diff --git a/types/molecules.ts b/types/molecules.ts index 310f65d..7b8f736 100644 --- a/types/molecules.ts +++ b/types/molecules.ts @@ -11,3 +11,8 @@ export type TransactionListProps = { export type MessageProps = { message: "success" | "error" } + +export type SelectOptions = { + value: number; + label: string; +} \ No newline at end of file From e08a8fe43687ab3c7321ed7793edcb07ba3f9186 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Thu, 29 Jun 2023 00:07:45 +0300 Subject: [PATCH 03/16] refactor: component content --- .../molecules/base-field/BaseField.tsx | 2 +- .../molecules/popup/PopupEditWallet.tsx | 5 +- .../popup/add-wallet/AddBankdataTab.tsx | 5 +- .../popup/edit-profile/ChangePasswordTab.tsx | 7 +- .../popup/edit-profile/PopupEditProfile.tsx | 11 +- .../pages/2FA/TwoFactorAuthenticationPage.tsx | 28 ++-- .../pages/categories/AddCategory.tsx | 69 +++----- .../pages/categories/Categories.tsx | 61 ++----- .../pages/categories/EditCategory.tsx | 69 ++------ src/components/pages/data/DataEntryPage.tsx | 90 ++++------- src/components/pages/home/Statistics.tsx | 7 +- src/components/pages/home/Transitions.tsx | 21 ++- src/components/pages/login/LoginPage.tsx | 74 +++------ .../pages/password-recovery/EmailStep.tsx | 23 +-- .../password-recovery/NewPasswordStep.tsx | 94 ++++------- .../pages/register/RegisterPage.tsx | 151 ++++++------------ .../pages/transactions/AddTransaction.tsx | 96 ++--------- .../pages/transactions/EditTransaction.tsx | 94 ++--------- .../pages/transactions/Transactions.tsx | 87 +++++----- src/components/pages/welcome/WelcomePage.tsx | 4 +- src/shared/hooks/useFilterButtonOptions.tsx | 57 +++++++ src/shared/hooks/useSwitchButtonOptions.tsx | 33 ++++ src/shared/utils/field-rules/details.ts | 22 +++ 23 files changed, 431 insertions(+), 679 deletions(-) create mode 100644 src/shared/hooks/useFilterButtonOptions.tsx create mode 100644 src/shared/hooks/useSwitchButtonOptions.tsx create mode 100644 src/shared/utils/field-rules/details.ts diff --git a/src/components/molecules/base-field/BaseField.tsx b/src/components/molecules/base-field/BaseField.tsx index 81f3f4a..2a3eb30 100644 --- a/src/components/molecules/base-field/BaseField.tsx +++ b/src/components/molecules/base-field/BaseField.tsx @@ -83,7 +83,7 @@ const BaseField: React.FC = ({ fz="13px" height="14px" width="300px" - m="0px 0 20px 0" + mb="20px" > {errors?.[name] && <>{errors?.[name]?.message || "Error!"}} diff --git a/src/components/molecules/popup/PopupEditWallet.tsx b/src/components/molecules/popup/PopupEditWallet.tsx index c8dc22a..e18367f 100644 --- a/src/components/molecules/popup/PopupEditWallet.tsx +++ b/src/components/molecules/popup/PopupEditWallet.tsx @@ -48,10 +48,7 @@ const PopupEditWallet: React.FC = () => { const { register, - formState: { - errors, - isValid, - }, + formState: { errors, isValid }, handleSubmit, } = useForm({ mode: "all" }); diff --git a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx index 73faa3e..7795c57 100644 --- a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx @@ -9,6 +9,8 @@ import { setBankDataSuccessStatus, sendBankData } from "../../../../store/bankDa import { setSuccessStatus } from "../../../../store/userSlice"; import { setActiveWallet, resetError } from "../../../../store/walletSlice"; +import { titleFieldRules } from "../../../../shared/utils/field-rules/title"; + import { userId } from "../../../../api/api"; import { Box } from "../../../atoms/box/Box.styled"; @@ -16,13 +18,12 @@ import { Button } from "../../../atoms/button/Button.styled"; import { Input } from "../../../atoms/input/Input.styled"; import { Typography } from "../../../atoms/typography/Typography.styled"; import { Form } from "../../../atoms/form/Form.styled"; +import BaseField from "../../base-field/BaseField"; import BankdataInfoMessage from "./BankdataInfoMessage"; import { ALERT_1, DIVIDER } from "../../../../shared/styles/variables"; import { IBankData } from "../../../../store/types"; -import BaseField from "../../base-field/BaseField"; -import { titleFieldRules } from "../../../../shared/utils/field-rules/title"; const AddBankDataTab: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx index dc49e53..02778f0 100644 --- a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx +++ b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx @@ -11,6 +11,11 @@ import { setSuccessStatus } from "../../../../store/userSlice"; +import { + confirmPasswordInputRules, + passwordInputRules +} from "../../../../shared/utils/field-rules/password"; + import { Form } from "../../../atoms/form/Form.styled"; import { Box } from "../../../atoms/box/Box.styled"; import { Typography } from "../../../atoms/typography/Typography.styled"; @@ -19,8 +24,6 @@ import BaseField from './../../base-field/BaseField'; import { ALERT_1, DIVIDER } from "../../../../shared/styles/variables"; -import { confirmPasswordInputRules, passwordInputRules } from "../../../../shared/utils/field-rules/password"; - import { PasswordChangeFormData } from "../../../../store/types"; const ChangePasswordTab: React.FC = () => { diff --git a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx index 1bd183f..0956dc9 100644 --- a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx +++ b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx @@ -4,15 +4,14 @@ import { PopupContext } from "../../../../contexts/PopupContext"; import { useAppSelector } from "../../../../store/hooks"; -import EditProfileTab from "./EditProfileTab"; -import ChangePasswordTab from "./ChangePasswordTab"; import { Box } from "../../../atoms/box/Box.styled"; import { Button } from '../../../atoms/button/Button.styled'; import { PopupWrapper } from "../Popup.styled"; +import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; import { Typography } from '../../../atoms/typography/Typography.styled'; import { ButtonLink } from "../../../atoms/button/ButtonLink"; - -import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; +import EditProfileTab from "./EditProfileTab"; +import ChangePasswordTab from "./ChangePasswordTab"; import { PRIMARY_HOVER } from "../../../../shared/styles/variables"; @@ -88,7 +87,9 @@ const PopupEditProfile: React.FC = () => { )} - Видалити аккаунт + + Видалити аккаунт + + primary> + Увійти + diff --git a/src/components/pages/categories/AddCategory.tsx b/src/components/pages/categories/AddCategory.tsx index 218c11f..e221361 100644 --- a/src/components/pages/categories/AddCategory.tsx +++ b/src/components/pages/categories/AddCategory.tsx @@ -6,19 +6,20 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setAddCategoryData } from "../../../store/categorySlice"; import { categoryAction, setActiveCategory } from "../../../store/categorySlice"; +import useSwitchButtonOptions from "../../../shared/hooks/useSwitchButtonOptions"; + +import { titleFieldRules } from "../../../shared/utils/field-rules/title"; + +import { userId } from "../../../api/api"; + import { Form } from "../../atoms/form/Form.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import { Input } from "../../atoms/input/Input.styled"; import { Box } from "../../atoms/box/Box.styled"; import { Button } from "../../atoms/button/Button.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; -import TabSwitch, { ISwitchButton } from "../../molecules/tabs/switch/TabSwitch"; - -import { titleRegex, twoSymbolsRegex } from "../../../shared/utils/regexes"; +import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; +import BaseField from "../../molecules/base-field/BaseField"; -import { userId } from "../../../api/api"; - -import { BASE_2, WHITE } from "../../../shared/styles/variables"; +import { BASE_2 } from "../../../shared/styles/variables"; const AddCategory: React.FC = () => { const dispatch = useAppDispatch() @@ -28,22 +29,10 @@ const AddCategory: React.FC = () => { const isValid = Object.keys(addCategoryData || {})?.length >= 1; - const switchButtons: ISwitchButton[] = [ - { - buttonName: 'Витрата', - onTabClick: () => { - dispatch(setAddCategoryData({ type_of_outlay: "expense" })); - }, - isActive: addCategoryData?.type_of_outlay === "expense" - }, - { - buttonName: 'Надходження', - onTabClick: () => { - dispatch(setAddCategoryData({ type_of_outlay: "income" })); - }, - isActive: addCategoryData?.type_of_outlay === "income" - }, - ]; + const switchButtons = useSwitchButtonOptions( + addCategoryData, + setAddCategoryData + ); const handleSub = (data: { title: string }) => { dispatch(setActiveCategory({})); @@ -98,33 +87,13 @@ const AddCategory: React.FC = () => {
- - twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів', - hasTwoLetters: (value) => titleRegex.test(value) || 'Повинно бути не менше 2 літер', - } - })} + - - {errors?.title && <>{errors?.title?.message || 'Error!'}} - + primary> + Зберегти дані +
diff --git a/src/components/pages/home/Statistics.tsx b/src/components/pages/home/Statistics.tsx index fc47401..6113b86 100644 --- a/src/components/pages/home/Statistics.tsx +++ b/src/components/pages/home/Statistics.tsx @@ -1,9 +1,9 @@ import { useRef, useEffect } from "react"; -import { setTotalIncomes, setTotalExpenses } from "../../../store/categorySlice"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { ICategoryWithTotalAmount } from "../../../store/types"; +import { setTotalIncomes, setTotalExpenses } from "../../../store/categorySlice"; +import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; import { calculateCategoriesWithTotalAmount } from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; @@ -13,7 +13,8 @@ import { Typography } from "../../atoms/typography/Typography.styled"; import DoughnutChart from "../../molecules/charts/DoughnutChart"; import { BASE_2 } from "../../../shared/styles/variables"; -import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; + +import { ICategoryWithTotalAmount } from "../../../store/types"; const Statistics: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/home/Transitions.tsx b/src/components/pages/home/Transitions.tsx index 6f1823a..892b86c 100644 --- a/src/components/pages/home/Transitions.tsx +++ b/src/components/pages/home/Transitions.tsx @@ -1,5 +1,5 @@ import { useAppSelector } from "../../../store/hooks"; -import { Transactions } from "../../../store/types"; +import { ITransaction, Transactions } from "../../../store/types"; import { filterTransactions } from "../../../shared/utils/transactions/filterTransactions"; import { @@ -14,6 +14,16 @@ import Transaction from "../../molecules/transaction/Transaction"; import { BASE_2 } from "../../../shared/styles/variables"; +const renderTransactionItems = (transactions: ITransaction[]): React.ReactNode[] => { + return transactions + .sort((a, b) => new Date(b.created).getTime() - new Date(a.created).getTime()) + .map((transaction) => ( + + + + )); +}; + const Transactions: React.FC = () => { const { transactions } = useAppSelector(state => state.transaction) @@ -44,18 +54,13 @@ const Transactions: React.FC = () => { p="15px" borderRadius="16px" > - {Object.entries(transactionsData()).map(([date, transactions]) => ( + {Object.entries(transactionsData).map(([date, transactions]) => ( {formatTransactionDateToFullDate(date)} - {transactions.sort((a, b) => new Date(b.created).getTime() - new Date(a.created).getTime()) - .map((transaction) => ( - - - - ))} + {renderTransactionItems(transactions)} ))} diff --git a/src/components/pages/login/LoginPage.tsx b/src/components/pages/login/LoginPage.tsx index 456a052..78e0220 100644 --- a/src/components/pages/login/LoginPage.tsx +++ b/src/components/pages/login/LoginPage.tsx @@ -7,22 +7,20 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { loginUser } from "../../../store/userSlice"; import { LoginFormData } from "../../../store/types"; +import { emailFieldRules } from "../../../shared/utils/field-rules/email"; +import { passwordInputRules } from "../../../shared/utils/field-rules/password"; + import { Box } from '../../atoms/box/Box.styled'; import { Typography } from '../../atoms/typography/Typography.styled'; import { Img } from '../../atoms/img/Img.styled'; import { Container } from "../../atoms/container/Container.styled"; import { Form } from "../../atoms/form/Form.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import { Input } from "../../atoms/input/Input.styled"; import { Link } from '../../atoms/link/Link.styled'; import { Button } from "../../atoms/button/Button.styled"; +import BaseField from "../../molecules/base-field/BaseField"; import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; -import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg'; -import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg'; - -import { emailRegex, passwordRegex } from "../../../shared/utils/regexes"; import { ALMOST_BLACK_FOR_TEXT, @@ -74,48 +72,22 @@ const LoginPage: React.FC = () => {
- - + - {errors?.email && <>{errors?.email?.message || 'Error!'}} - - - setShowPassword(!showPassword)} style={{ - position: "absolute", top: "16px", - right: "10px", cursor: "pointer" - }}>{showPassword ? - - : - - } - - - {errors?.password && <>{errors?.password?.message || 'Error!'}} { Забули пароль? - {loginError && { textAlign="center" > {loginError} - - } + } - +
diff --git a/src/components/pages/password-recovery/EmailStep.tsx b/src/components/pages/password-recovery/EmailStep.tsx index 117b203..6fe7e79 100644 --- a/src/components/pages/password-recovery/EmailStep.tsx +++ b/src/components/pages/password-recovery/EmailStep.tsx @@ -3,16 +3,15 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { requestPasswordReset } from "../../../store/passwordRecoverySlice"; -import { emailRegex } from "../../../shared/utils/regexes"; +import { emailFieldRules } from "../../../shared/utils/field-rules/email"; import { Box } from "../../atoms/box/Box.styled"; import { Button } from "../../atoms/button/Button.styled"; import { Container } from "../../atoms/container/Container.styled"; import { Img } from "../../atoms/img/Img.styled"; -import { Input } from "../../atoms/input/Input.styled"; -import { Label } from "../../atoms/label/Label.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; import { Form } from "../../atoms/form/Form.styled"; +import BaseField from "../../molecules/base-field/BaseField"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; import logo from "../../../shared/assets/images/logo.png"; @@ -59,19 +58,13 @@ const EmailStep: React.FC = () => { alignItems="end"> - - - {errors?.email && <>{errors?.email?.message || 'Error!'}} + primary> + Зберегти + diff --git a/src/components/pages/register/RegisterPage.tsx b/src/components/pages/register/RegisterPage.tsx index 21897a5..21c33d2 100644 --- a/src/components/pages/register/RegisterPage.tsx +++ b/src/components/pages/register/RegisterPage.tsx @@ -6,21 +6,23 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { registerUser } from '../../../store/userSlice'; -import { emailRegex, nameRegex, passwordRegex } from "../../../shared/utils/regexes"; +import { nameFieldRules } from "../../../shared/utils/field-rules/name"; +import { emailFieldRules } from "../../../shared/utils/field-rules/email"; +import { + confirmPasswordInputRules, + passwordInputRules +} from "../../../shared/utils/field-rules/password"; import { Box } from '../../atoms/box/Box.styled'; import { Typography } from '../../atoms/typography/Typography.styled'; import { Img } from '../../atoms/img/Img.styled'; import { Container } from "../../atoms/container/Container.styled"; import { Form } from "../../atoms/form/Form.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import { Input } from "../../atoms/input/Input.styled"; import { Button } from "../../atoms/button/Button.styled"; +import BaseField from "../../molecules/base-field/BaseField"; import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; -import VisibilityOn from '../../../shared/assets/icons/visibility-on.svg'; -import VisibilityOff from '../../../shared/assets/icons/visibility-off.svg'; import { ALERT_1, @@ -76,113 +78,62 @@ const RegisterPage: React.FC = () => { alignItems="end"> - - + + - {errors?.first_name && <>{errors?.first_name?.message || 'Error!'}} - - - {errors?.last_name && <>{errors?.last_name?.message || 'Error!'}} - - - {errors?.email && <>{errors?.email?.message || 'Error!'}} - - - setShowPassword(!showPassword)} style={{ - position: "absolute", top: "16px", - right: "10px", cursor: "pointer" - }}>{showPassword ? - - : - - } - - - {errors?.password && <>{errors?.password?.message || 'Error!'}} - - - setShowConfirmPassword(!showConfirmPassword)} style={{ - position: "absolute", top: "16px", - right: "10px", cursor: "pointer" - }}>{showConfirmPassword ? - - : - - } - { - if (watch('password') != val) { - return "Паролі не співпадають"; - } - } - })} - className={errors.password2 && 'error'} /> - - {errors?.password2 && <>{errors?.password2?.message || 'Error!'}} - {registerError && + {registerError && ( {registerError} - } + )} + primary> + Зареєструватись + diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index eb95b33..8c6d352 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -10,33 +10,30 @@ import { transactionAction } from "../../../store/transactionSlice"; -import { - moneyAmountRegex, - titleRegex, - twoSymbolsRegex -} from '../../../shared/utils/regexes'; import { formatTransactionDateToUTC } from '../../../shared/utils/transactions/formatTransactionDate'; import { setSelectOptions } from '../../../shared/utils/transactions/setSelectOptions'; +import { amountFieldRules } from '../../../shared/utils/field-rules/amount'; +import { detailsFieldRules } from '../../../shared/utils/field-rules/details'; import { userId } from '../../../api/api'; import { Form } from '../../atoms/form/Form.styled'; import { Box } from "../../atoms/box/Box.styled"; import { Button } from "../../atoms/button/Button.styled"; -import { Input } from "../../atoms/input/Input.styled"; import { Label } from "../../atoms/label/Label.styled"; import { ListItem } from "../../atoms/list/ListItem.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; import Select from "../../molecules/select/Select"; -import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; import Wallet from "../../molecules/wallet/Wallet"; +import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; +import BaseField from '../../molecules/base-field/BaseField'; import DatePicker from './DatePicker'; -import { BASE_2, WHITE } from "../../../shared/styles/variables"; +import { BASE_2, } from "../../../shared/styles/variables"; import { IWallet, TypeOfOutlay } from "../../../store/types"; import { SelectOptions } from '../../../../types/molecules'; @@ -243,81 +240,22 @@ const AddTransaction: React.FC = () => { - - { - if (!value) { - clearErrors('title'); - return; - }; - return twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів'; - }, - hasTwoLetters: (value) => { - if (!value) { - clearErrors('title'); - return; - }; - return titleRegex.test(value) || 'Повинно бути не менше 2 літер'; - }, - } - })} + - - {errors?.title && <>{errors?.title?.message || 'Error!'}} - - - - - {errors?.amount && <>{errors?.amount?.message || 'Error!'}} - + diff --git a/src/shared/hooks/useFilterButtonOptions.tsx b/src/shared/hooks/useFilterButtonOptions.tsx new file mode 100644 index 0000000..96c833c --- /dev/null +++ b/src/shared/hooks/useFilterButtonOptions.tsx @@ -0,0 +1,57 @@ +import { useAppDispatch, useAppSelector } from "../../store/hooks"; +import { + setFilterByTypeOfOutlay, + getFilteredTransactions +} from "../../store/transactionSlice"; +import { + setFilterByTypeOfOutlay as setCateogryFilterByTypeOfOutlay, + getFilteredCategories +} from "../../store/categorySlice"; + +import { IFilterButton } from "../../components/molecules/tabs/filter/TabFilter"; + +import { TypeOfOutlay } from "../../store/types"; + +const useFilterButtonOptions = (type: "category" | "transaction"): IFilterButton[] => { + const dispatch = useAppDispatch(); + + const { filterByTypeOfOutlay } = useAppSelector(state => state.transaction); + const { + filterByTypeOfOutlay: categoryFilterByTypeOfOutlay + } = useAppSelector(state => state.category); + + const outlayType = type === "transaction" + ? filterByTypeOfOutlay + : categoryFilterByTypeOfOutlay + + const setFilterButtonOptions = ( + buttonName: string, + typeOfOutlay: TypeOfOutlay | "", + ): any => { + return { + buttonName, + typeOfOutlay, + filterBy: typeOfOutlay ? `?type_of_outlay=${typeOfOutlay}` : "", + isActive: outlayType === (typeOfOutlay || "all"), + onTabClick: () => { + if (type === "transaction") { + dispatch(setFilterByTypeOfOutlay(typeOfOutlay || "all")); + dispatch(getFilteredTransactions(typeOfOutlay)); + } else { + dispatch(setCateogryFilterByTypeOfOutlay(typeOfOutlay || "all")); + dispatch(getFilteredCategories(typeOfOutlay)); + } + } + } + } + + const filterButtons: IFilterButton[] = [ + setFilterButtonOptions("Всі транзакції", ""), + setFilterButtonOptions("Витрати", "expense"), + setFilterButtonOptions("Надходження", "income") + ]; + + return filterButtons; +} + +export default useFilterButtonOptions; \ No newline at end of file diff --git a/src/shared/hooks/useSwitchButtonOptions.tsx b/src/shared/hooks/useSwitchButtonOptions.tsx new file mode 100644 index 0000000..00da080 --- /dev/null +++ b/src/shared/hooks/useSwitchButtonOptions.tsx @@ -0,0 +1,33 @@ +import { useAppDispatch } from "../../store/hooks"; + +import { ISwitchButton } from "../../components/molecules/tabs/switch/TabSwitch"; +import { TypeOfOutlay } from "../../store/types"; + +const useSwitchButtonOptions = ( + data: any, + dataHandler: any +): ISwitchButton[] => { + const dispatch = useAppDispatch(); + + const setSwitchButtonOptions = ( + buttonName: string, + typeOfOutlay: TypeOfOutlay, + ): any => { + return { + buttonName, + isActive: data?.type_of_outlay === typeOfOutlay, + onTabClick: () => { + dispatch(dataHandler({ type_of_outlay: typeOfOutlay })); + }, + } + } + + const switchButtons: ISwitchButton[] = [ + setSwitchButtonOptions('Витрата', "expense"), + setSwitchButtonOptions('Надходження', "income") + ]; + + return switchButtons; +} + +export default useSwitchButtonOptions; \ No newline at end of file diff --git a/src/shared/utils/field-rules/details.ts b/src/shared/utils/field-rules/details.ts new file mode 100644 index 0000000..8ba43cd --- /dev/null +++ b/src/shared/utils/field-rules/details.ts @@ -0,0 +1,22 @@ +import { titleRegex, twoSymbolsRegex } from "../regexes"; + +export const detailsFieldRules = (clearErrors: any) => { + return { + validate: { + hasTwoSymbols: (value: string) => { + if (!value) { + clearErrors('title'); + return; + }; + return twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів'; + }, + hasTwoLetters: (value: string) => { + if (!value) { + clearErrors('title'); + return; + }; + return titleRegex.test(value) || 'Повинно бути не менше 2 літер'; + }, + } + } +} From 0a358b4f341c2b9cd9c82ed297705fa9471d2916 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Fri, 30 Jun 2023 17:55:41 +0300 Subject: [PATCH 04/16] refactor(redux): async thunks; reducers Rewrite all .then() instances to async/await. Extract conditions into the utils folder. --- src/shared/utils/store/updateCategories.ts | 25 +++ .../utils/store/updateChartCategories.ts | 22 ++ .../store/updateChartCategoryTransactions.ts | 22 ++ .../utils/store/updateChartTransactions.ts | 19 ++ src/shared/utils/store/updateTransactions.ts | 25 +++ src/store/bankDataSlice.ts | 35 ++-- src/store/categorySlice.ts | 80 ++++---- src/store/hooks.ts | 1 + src/store/passwordRecoverySlice.ts | 51 +++-- src/store/statisticsSlice.ts | 70 +++---- src/store/store.ts | 1 + src/store/transactionSlice.ts | 75 +++---- src/store/userSlice.ts | 192 +++++++++++------- src/store/walletSlice.ts | 93 ++++----- 14 files changed, 422 insertions(+), 289 deletions(-) create mode 100644 src/shared/utils/store/updateCategories.ts create mode 100644 src/shared/utils/store/updateChartCategories.ts create mode 100644 src/shared/utils/store/updateChartCategoryTransactions.ts create mode 100644 src/shared/utils/store/updateChartTransactions.ts create mode 100644 src/shared/utils/store/updateTransactions.ts diff --git a/src/shared/utils/store/updateCategories.ts b/src/shared/utils/store/updateCategories.ts new file mode 100644 index 0000000..3e96398 --- /dev/null +++ b/src/shared/utils/store/updateCategories.ts @@ -0,0 +1,25 @@ +import { PayloadAction } from "@reduxjs/toolkit"; + +import { CategoryState } from "../../../store/categorySlice"; +import { ICategory } from "../../../store/types"; + +export const updateCategories = ( + state: CategoryState, + action: PayloadAction<{ data: ICategory[], params: string }> +) => { + const { data, params } = action.payload; + + switch (params) { + case "": + state.categories.all = data; + break; + case "?type_of_outlay=income": + state.categories.income = data; + break; + case "?type_of_outlay=expense": + state.categories.expense = data; + break; + default: + break; + } +} \ No newline at end of file diff --git a/src/shared/utils/store/updateChartCategories.ts b/src/shared/utils/store/updateChartCategories.ts new file mode 100644 index 0000000..2618318 --- /dev/null +++ b/src/shared/utils/store/updateChartCategories.ts @@ -0,0 +1,22 @@ +import { PayloadAction } from "@reduxjs/toolkit"; + +import { StatisticsState } from "../../../store/statisticsSlice"; +import { ICategory } from "../../../store/types"; + +export const updateChartCategories = ( + state: StatisticsState, + action: PayloadAction<{ data: ICategory[], params: string }> +) => { + const { data, params } = action.payload; + + switch (params) { + case "?type_of_outlay=income": + state.incomesChart.categories = data; + break; + case "?type_of_outlay=expense": + state.expensesChart.categories = data; + break; + default: + break; + } +} \ No newline at end of file diff --git a/src/shared/utils/store/updateChartCategoryTransactions.ts b/src/shared/utils/store/updateChartCategoryTransactions.ts new file mode 100644 index 0000000..f0b0da8 --- /dev/null +++ b/src/shared/utils/store/updateChartCategoryTransactions.ts @@ -0,0 +1,22 @@ +import { PayloadAction } from "@reduxjs/toolkit"; + +import { StatisticsState } from "../../../store/statisticsSlice"; +import { Transactions, TypeOfOutlay } from "../../../store/types"; + +export const updateChartCategoryTransactions = ( + state: StatisticsState, + action: PayloadAction<{ data: Transactions[], chartType: TypeOfOutlay }> +) => { + const { data, chartType } = action.payload; + + switch (chartType) { + case "expense": + state.expensesChart.categoryTransactions = data; + break; + case "income": + state.incomesChart.categoryTransactions = data; + break; + default: + break; + } +} \ No newline at end of file diff --git a/src/shared/utils/store/updateChartTransactions.ts b/src/shared/utils/store/updateChartTransactions.ts new file mode 100644 index 0000000..74713de --- /dev/null +++ b/src/shared/utils/store/updateChartTransactions.ts @@ -0,0 +1,19 @@ +import { PayloadAction } from "@reduxjs/toolkit"; + +import { StatisticsState } from "../../../store/statisticsSlice"; +import { Transactions } from "../../../store/types"; + +export const updateChartTransactions = ( + state: StatisticsState, + action: PayloadAction<{ data: Transactions, params: string }> +) => { + const { data, params } = action.payload; + + if (params.startsWith('?category=')) { + state.allOutlaysChart.categoryTransactions = data; + } else if (params.startsWith('?type_of_outlay=income')) { + state.incomesChart.allTransactions = data; + } else if (params.startsWith('?type_of_outlay=expense')) { + state.expensesChart.allTransactions = data; + } +} \ No newline at end of file diff --git a/src/shared/utils/store/updateTransactions.ts b/src/shared/utils/store/updateTransactions.ts new file mode 100644 index 0000000..e7b9160 --- /dev/null +++ b/src/shared/utils/store/updateTransactions.ts @@ -0,0 +1,25 @@ +import { PayloadAction } from "@reduxjs/toolkit"; + +import { TransactionState } from "../../../store/transactionSlice"; +import { Transactions } from "../../../store/types"; + +export const updateTransactions = ( + state: TransactionState, + action: PayloadAction<{ data: Transactions, params: string }> +) => { + const { data, params } = action.payload; + + switch (params) { + case "": + state.transactions.all = data; + break; + case "?type_of_outlay=income": + state.transactions.income = data; + break; + case "?type_of_outlay=expense": + state.transactions.expense = data; + break; + default: + break; + } +} \ No newline at end of file diff --git a/src/store/bankDataSlice.ts b/src/store/bankDataSlice.ts index 593c79f..cab40ae 100644 --- a/src/store/bankDataSlice.ts +++ b/src/store/bankDataSlice.ts @@ -1,5 +1,7 @@ import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; + import { $api, BANK_DATA_PATH } from '../api/api'; + import { IBankData } from './types'; export type BankDataState = { @@ -11,27 +13,30 @@ export type BankDataState = { export const getBankData = createAsyncThunk( 'bankData/getBankData', - async function (_, { rejectWithValue }) { - return $api.get(BANK_DATA_PATH) - .then(res => res?.data) - .catch(error => { - return rejectWithValue('Помилка'); - }); + async (_, { rejectWithValue }) => { + try { + const res = await $api.get(BANK_DATA_PATH); + return res?.data; + } catch (error) { + return rejectWithValue('Помилка'); + } } ); export const sendBankData = createAsyncThunk( 'bankData/sendBankData', - async function (payload, { rejectWithValue }) { - return $api.post(BANK_DATA_PATH, payload, { - headers: { - 'content-type': 'multipart/form-data', - } - }) - .then(res => res?.data) - .catch(error => { - return rejectWithValue('Помилка'); + async (payload, { rejectWithValue }) => { + try { + const response = await $api.post(BANK_DATA_PATH, payload, { + headers: { + 'content-type': 'multipart/form-data', + } }); + + return response?.data; + } catch (error) { + return rejectWithValue('Помилка'); + } } ); diff --git a/src/store/categorySlice.ts b/src/store/categorySlice.ts index a15153f..61d8228 100644 --- a/src/store/categorySlice.ts +++ b/src/store/categorySlice.ts @@ -1,10 +1,15 @@ import { createSlice, createAsyncThunk, } from '@reduxjs/toolkit'; -import { ICategory, MethodTypes } from './types'; -import { $api, CATEGORY_PATH } from '../api/api'; + import { getUserDetails } from './userSlice'; import { FilterByTypeOfOutlayOptions } from './transactionSlice'; -type CategoryState = { +import { updateCategories } from '../shared/utils/store/updateCategories'; + +import { $api, CATEGORY_PATH } from '../api/api'; + +import { ICategory, MethodTypes } from './types'; + +export type CategoryState = { filterByTypeOfOutlay: FilterByTypeOfOutlayOptions; categories: { all: ICategory[]; @@ -36,26 +41,29 @@ export const categoryAction = createAsyncThunk< { rejectValue: string } >( 'category/categoryAction', - async function (payload, { rejectWithValue }) { + async (payload, { rejectWithValue }) => { const { method, data, id } = payload; if (method !== "GET") { - $api({ - method, - url: `${CATEGORY_PATH}${id ? (id + '/') : ''}`, - data: data || {}, - }) - .then(res => res?.data) - .catch(error => { - return rejectWithValue('Помилка'); + try { + const response = await $api({ + method, + url: `${CATEGORY_PATH}${id ? (id + '/') : ''}`, + data: data || {}, }); + + return response?.data; + } catch (error) { + return rejectWithValue('Помилка'); + } } - return await $api.get(CATEGORY_PATH) - .then(res => res?.data) - .catch(error => { - return rejectWithValue(`Помилка`) - }); + try { + const response = await $api.get(CATEGORY_PATH); + return response?.data; + } catch (error) { + return rejectWithValue('Помилка'); + } } ); @@ -65,13 +73,14 @@ export const getCategories = createAsyncThunk< { rejectValue: string } >( 'category/getCategories', - async function (_, { rejectWithValue }) { - return $api.get(CATEGORY_PATH) - .then(res => res?.data) - .catch(error => { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - }); + async (_, { rejectWithValue }) => { + try { + const response = await $api.get(CATEGORY_PATH); + return response?.data; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } } ); @@ -81,10 +90,10 @@ export const getFilteredCategories = createAsyncThunk< { rejectValue: string } >( 'transaction/getFilteredCategories', - async function (params, { rejectWithValue }) { + async (params, { rejectWithValue }) => { try { - const res = await $api.get(`${CATEGORY_PATH}${params}`); - const data = res?.data; + const response = await $api.get(`${CATEGORY_PATH}${params}`); + const data = response?.data; return { data, params }; } catch (error) { const errorMessage = error.response.data; @@ -198,20 +207,7 @@ const categorySlice = createSlice({ state.error = null; }) .addCase(getFilteredCategories.fulfilled, (state, action) => { - const { data, params } = action.payload; - switch (params) { - case "": - state.categories.all = data; - break; - case "?type_of_outlay=income": - state.categories.income = data; - break; - case "?type_of_outlay=expense": - state.categories.expense = data; - break; - default: - break; - } + updateCategories(state, action) state.isLoading = false; }) .addCase(getFilteredCategories.rejected, (state, action) => { @@ -223,7 +219,7 @@ const categorySlice = createSlice({ state.isLoading = true; state.error = null; }) - .addCase(getUserDetails.fulfilled, (state, action) => { + .addCase(getUserDetails.fulfilled, (state) => { state.isLoading = false; }) .addCase(getUserDetails.rejected, (state, action) => { diff --git a/src/store/hooks.ts b/src/store/hooks.ts index 4199bf5..9437aba 100644 --- a/src/store/hooks.ts +++ b/src/store/hooks.ts @@ -1,4 +1,5 @@ import { useDispatch, useSelector, TypedUseSelectorHook } from 'react-redux'; + import type { RootState, AppDispatch } from './store'; export const useAppDispatch = () => useDispatch(); diff --git a/src/store/passwordRecoverySlice.ts b/src/store/passwordRecoverySlice.ts index c5735db..7d91b70 100644 --- a/src/store/passwordRecoverySlice.ts +++ b/src/store/passwordRecoverySlice.ts @@ -1,7 +1,12 @@ import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; -import { $api, PASSWORD_RESET_CONFIRM_PATH, PASSWORD_RESET_REQUEST_PATH } from '../api/api'; -export type PasswordRecoveryState = { +import { + $api, + PASSWORD_RESET_CONFIRM_PATH, + PASSWORD_RESET_REQUEST_PATH +} from '../api/api'; + +type PasswordRecoveryState = { email: string; isLoading: boolean; error: string | null; @@ -9,41 +14,43 @@ export type PasswordRecoveryState = { isNewPasswordSet: boolean; } +type confirmPasswordResetPayload = { + uid: string; + token: string; + new_password: string; +} + export const requestPasswordReset = createAsyncThunk< undefined, { email: string }, { rejectValue: any } >( 'passwordRecovery/requestPasswordReset', - async function (payload, { rejectWithValue }) { - return $api.post(PASSWORD_RESET_REQUEST_PATH, payload) - .then(res => res.data) - .catch(error => { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - }); + async (payload, { rejectWithValue }) => { + try { + const response = await $api.post(PASSWORD_RESET_REQUEST_PATH, payload); + return response.data; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } } ); -export type confirmPasswordResetPayload = { - uid: string; - token: string; - new_password: string; -} - export const confirmPasswordReset = createAsyncThunk< undefined, confirmPasswordResetPayload, { rejectValue: any } >( 'passwordRecovery/confirmPasswordReset', - async function (payload, { rejectWithValue }) { - return $api.post(PASSWORD_RESET_CONFIRM_PATH, payload) - .then(res => res?.data) - .catch(error => { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - }); + async (payload, { rejectWithValue }) => { + try { + const response = await $api.post(PASSWORD_RESET_CONFIRM_PATH, payload); + return response?.data; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } } ); diff --git a/src/store/statisticsSlice.ts b/src/store/statisticsSlice.ts index 78fcb5e..a6771d1 100644 --- a/src/store/statisticsSlice.ts +++ b/src/store/statisticsSlice.ts @@ -1,9 +1,21 @@ import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'; + import { getFilteredTransactions } from './transactionSlice'; -import { FilterByDaysOptions, ICategory, Transactions, TypeOfOutlay } from './types'; import { getFilteredCategories } from './categorySlice'; + +import { updateChartCategories } from '../shared/utils/store/updateChartCategories'; +import { updateChartTransactions } from '../shared/utils/store/updateChartTransactions'; +import { updateChartCategoryTransactions } from '../shared/utils/store/updateChartCategoryTransactions'; + import { $api, TRANSACTION_PATH } from '../api/api'; +import { + FilterByDaysOptions, + ICategory, + Transactions, + TypeOfOutlay +} from './types'; + type DoughnutChartData = { allTransactions: Transactions; categoryTransactions: Transactions[]; @@ -12,7 +24,7 @@ type DoughnutChartData = { totalAmount: string, }; -type StatisticsState = { +export type StatisticsState = { filterByDays: FilterByDaysOptions; incomesChart: DoughnutChartData; expensesChart: DoughnutChartData; @@ -31,15 +43,22 @@ export const getFilteredCategoryTransactions = createAsyncThunk< { rejectValue: string } >( 'statistics/getFilteredCategoryTransactions', - async function (payload, { rejectWithValue }) { + async (payload, { rejectWithValue }) => { const { chartType, categories, filterByDays } = payload; try { - const res = await categories.map(c => ( - $api.get(`${TRANSACTION_PATH}?category=${c.id}&days=${filterByDays}`) - .then(res => res.data) - )) - const data = await Promise.all(res) + const promises = categories.map(async (c) => { + try { + const response = await $api.get( + `${TRANSACTION_PATH}?category=${c.id}&days=${filterByDays}` + ); + return response.data; + } catch (error) { + throw new Error('Помилка'); + } + }); + + const data = await Promise.all(promises); return { data, chartType }; } catch (error) { return rejectWithValue('Помилка'); @@ -109,17 +128,7 @@ const statisticsSlice = createSlice({ state.error = null; }) .addCase(getFilteredCategories.fulfilled, (state, action) => { - const { data, params } = action.payload; - switch (params) { - case "?type_of_outlay=income": - state.incomesChart.categories = data; - break; - case "?type_of_outlay=expense": - state.expensesChart.categories = data; - break; - default: - break; - } + updateChartCategories(state, action) state.isLoading = false; }) .addCase(getFilteredCategories.rejected, (state, action) => { @@ -133,14 +142,7 @@ const statisticsSlice = createSlice({ }) .addCase(getFilteredTransactions.fulfilled, (state, action) => { state.isLoading = false; - const { data, params } = action.payload; - if (params.startsWith('?category=')) { - state.allOutlaysChart.categoryTransactions = data; - } else if (params.startsWith('?type_of_outlay=income')) { - state.incomesChart.allTransactions = data; - } else if (params.startsWith('?type_of_outlay=expense')) { - state.expensesChart.allTransactions = data; - } + updateChartTransactions(state, action) }) .addCase(getFilteredTransactions.rejected, (state, action) => { state.isLoading = false; @@ -153,19 +155,7 @@ const statisticsSlice = createSlice({ }) .addCase(getFilteredCategoryTransactions.fulfilled, (state, action) => { state.isLoading = false; - - const { data, chartType } = action.payload; - - switch (chartType) { - case "expense": - state.expensesChart.categoryTransactions = data; - break; - case "income": - state.incomesChart.categoryTransactions = data; - break; - default: - break; - } + updateChartCategoryTransactions(state, action) }) .addCase(getFilteredCategoryTransactions.rejected, (state, action) => { state.isLoading = false; diff --git a/src/store/store.ts b/src/store/store.ts index 2d4eaa5..c351ebb 100644 --- a/src/store/store.ts +++ b/src/store/store.ts @@ -1,4 +1,5 @@ import { configureStore } from '@reduxjs/toolkit'; + import userReducer from './userSlice'; import walletReducer from './walletSlice'; import transactionReducer from './transactionSlice'; diff --git a/src/store/transactionSlice.ts b/src/store/transactionSlice.ts index b53da46..40d1e24 100644 --- a/src/store/transactionSlice.ts +++ b/src/store/transactionSlice.ts @@ -1,11 +1,16 @@ -import { createSlice, createAsyncThunk, } from '@reduxjs/toolkit'; -import { ITransaction, MethodTypes, Transactions } from './types'; -import { $api, TRANSACTION_PATH } from '../api/api'; +import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; + import { getUserDetails } from './userSlice'; +import { updateTransactions } from '../shared/utils/store/updateTransactions'; + +import { $api, TRANSACTION_PATH } from '../api/api'; + +import { ITransaction, MethodTypes, Transactions } from './types'; + export type FilterByTypeOfOutlayOptions = "all" | "income" | "expense"; -type TransactionState = { +export type TransactionState = { filterByTypeOfOutlay: FilterByTypeOfOutlayOptions; transactions: { all: Transactions; @@ -35,26 +40,24 @@ export const transactionAction = createAsyncThunk< { rejectValue: string } >( 'transaction/transactionAction', - async function (payload, { rejectWithValue }) { + async (payload, { rejectWithValue }) => { const { method, data, id } = payload; - if (method !== "GET") { - $api({ - method, - url: `${TRANSACTION_PATH}${id ? (id + '/') : ''}`, - data: data || {}, - }) - .then(response => response?.data) - .catch(error => { - return rejectWithValue('Помилка'); + try { + if (method !== "GET") { + const response = await $api({ + method, + url: `${TRANSACTION_PATH}${id ? (id + '/') : ''}`, + data: data || {}, }); + return response.data; + } else { + const response = await $api.get(TRANSACTION_PATH); + return response.data; + } + } catch (error) { + return rejectWithValue('Помилка'); } - - return await $api.get(TRANSACTION_PATH) - .then(res => res?.data) - .catch(error => { - return rejectWithValue(`Помилка`) - }); } ); @@ -64,13 +67,14 @@ export const getTransactions = createAsyncThunk< { rejectValue: string } >( 'transaction/getTransactions', - async function (_, { rejectWithValue }) { - return $api.get(TRANSACTION_PATH) - .then(res => res?.data) - .catch(error => { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - }); + async (_, { rejectWithValue }) => { + try { + const response = await $api.get(TRANSACTION_PATH); + return response.data; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } } ); @@ -80,7 +84,7 @@ export const getFilteredTransactions = createAsyncThunk< { rejectValue: string } >( 'transaction/getFilteredTransactions', - async function (params, { rejectWithValue }) { + async (params, { rejectWithValue }) => { try { const res = await $api.get(`${TRANSACTION_PATH}${params}`); const data = res?.data; @@ -190,20 +194,7 @@ const transactionSlice = createSlice({ }) .addCase(getFilteredTransactions.fulfilled, (state, action) => { state.isLoading = false; - const { data, params } = action.payload; - switch (params) { - case "": - state.transactions.all = data; - break; - case "?type_of_outlay=income": - state.transactions.income = data; - break; - case "?type_of_outlay=expense": - state.transactions.expense = data; - break; - default: - break; - } + updateTransactions(state, action) }) .addCase(getFilteredTransactions.rejected, (state, action) => { state.isLoading = false; diff --git a/src/store/userSlice.ts b/src/store/userSlice.ts index e342774..85d1f05 100644 --- a/src/store/userSlice.ts +++ b/src/store/userSlice.ts @@ -1,6 +1,23 @@ import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; -import { IUser, LoginFormData, LoginResponse, PasswordChangeFormData, RegisterFormData } from './types'; -import { $api, CHANGE_USER_INFO_PATH, LOGIN_PATH, LOGOUT_PATH, REGISTER_PATH, USER_DETAILS_PATH, userDataParsed, CHANGE_USER_PASSWORD_PATH } from '../api/api'; + +import { + $api, + CHANGE_USER_INFO_PATH, + LOGIN_PATH, + LOGOUT_PATH, + REGISTER_PATH, + USER_DETAILS_PATH, + userDataParsed, + CHANGE_USER_PASSWORD_PATH +} from '../api/api'; + +import { + IUser, + LoginFormData, + LoginResponse, + PasswordChangeFormData, + RegisterFormData +} from './types'; export type UserState = { user: IUser; @@ -21,97 +38,117 @@ export type UserState = { passwordChangeError: string | null; } -export const registerUser = createAsyncThunk( +export const registerUser = createAsyncThunk< + any, + RegisterFormData, + { rejectValue: string } +>( 'user/registerUser', - async function (registerData, { rejectWithValue }) { - return $api.post(REGISTER_PATH, registerData) - .then(res => { - const user = res.data; - localStorage.clear(); - localStorage.setItem('token', user.token); - localStorage.setItem('userData', JSON.stringify(user)); - return user; - }) - .catch(error => { - return rejectWithValue("Акаунт із вказаною поштою вже існує"); - }); + async (registerData, { rejectWithValue }) => { + try { + const response = await $api.post(REGISTER_PATH, registerData); + const user = response.data; + localStorage.clear(); + localStorage.setItem('token', user.token); + localStorage.setItem('userData', JSON.stringify(user)); + return user; + } catch (error) { + return rejectWithValue("Акаунт із вказаною поштою вже існує"); + } } ); -export const loginUser = createAsyncThunk( +export const loginUser = createAsyncThunk< + LoginResponse, + LoginFormData, + { rejectValue: string } +>( 'user/loginUser', - async function (loginData, { rejectWithValue }) { - return $api.post(LOGIN_PATH, loginData) - .then(res => { - const userInfo = res.data; - localStorage.setItem('token', userInfo.token); - localStorage.setItem("isDataEntrySuccess", "true"); - return userInfo; - }) - .catch(error => { - return rejectWithValue('Будь ласка, введіть дані, вказані при реєстрації'); - }); + async (loginData, { rejectWithValue }) => { + try { + const response = await $api.post(LOGIN_PATH, loginData); + const userInfo = response.data; + localStorage.setItem('token', userInfo.token); + localStorage.setItem("isDataEntrySuccess", "true"); + return userInfo; + } catch (error) { + return rejectWithValue('Будь ласка, введіть дані, вказані при реєстрації'); + } } ); -export const logoutUser = createAsyncThunk( +export const logoutUser = createAsyncThunk< + undefined, + undefined, + { rejectValue: string } +>( 'user/logoutUser', - async function (_, { rejectWithValue }) { - return $api.get(LOGOUT_PATH) - .then(res => { - localStorage.clear(); - return undefined; - }) - .catch(error => { - return rejectWithValue("Помилка"); - }); + async (_, { rejectWithValue }) => { + try { + await $api.get(LOGOUT_PATH); + localStorage.clear(); + return undefined; + } catch (error) { + return rejectWithValue("Помилка"); + } } ); -export const getUserDetails = createAsyncThunk( +export const getUserDetails = createAsyncThunk< + IUser, + undefined, + { rejectValue: string } +>( 'user/getUserDetails', - async function (_, { rejectWithValue }) { - return $api.get(USER_DETAILS_PATH) - .then(res => { - localStorage.setItem('userData', JSON.stringify(res.data)) - return res.data - }) - .catch(error => { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - }); + async (_, { rejectWithValue }) => { + try { + const response = await $api.get(USER_DETAILS_PATH); + const userData = response.data; + localStorage.setItem('userData', JSON.stringify(userData)); + return userData; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } } ); -export const deleteUserAccount = createAsyncThunk( +export const deleteUserAccount = createAsyncThunk< + undefined, + undefined, + { rejectValue: string } +>( 'user/deleteUserAccount', - async function (_, { rejectWithValue }) { - return $api.delete(USER_DETAILS_PATH) - .then(res => { - localStorage.clear(); - return undefined; - }) - .catch(error => { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - }); + async (_, { rejectWithValue }) => { + try { + await $api.delete(USER_DETAILS_PATH); + localStorage.clear(); + return undefined; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } } ); -export const changeUserProfile = createAsyncThunk( +export const changeUserProfile = createAsyncThunk< + IUser, + IUser, + { rejectValue: string } +>( 'user/changeUserProfile', - async function (payload, { rejectWithValue }) { - return $api.put(CHANGE_USER_INFO_PATH, payload) - .then(newUserInfo => { - localStorage.setItem('userData', JSON.stringify({ - ...userDataParsed, - ...newUserInfo.data - })); - return newUserInfo.data; - }) - .catch(error => { - return rejectWithValue('Помилка'); - }); + async (payload, { rejectWithValue }) => { + try { + const response = await $api.put(CHANGE_USER_INFO_PATH, payload); + const newUserInfo = response.data; + localStorage.setItem('userData', JSON.stringify({ + ...userDataParsed, + ...newUserInfo + })); + return newUserInfo; + } catch (error) { + return rejectWithValue('Помилка'); + } } ); @@ -121,10 +158,13 @@ export const changeUserPassword = createAsyncThunk< { rejectValue: string } >( 'user/changeUserPassword', - async function (payload, { rejectWithValue }) { - return $api.post(CHANGE_USER_PASSWORD_PATH, payload) - .then(res => res?.data) - .catch(error => rejectWithValue("Введіть пароль, вказаний при реєстрації")); + async (payload, { rejectWithValue }) => { + try { + const response = await $api.post(CHANGE_USER_PASSWORD_PATH, payload); + return response.data; + } catch (error) { + return rejectWithValue("Введіть пароль, вказаний при реєстрації"); + } } ); diff --git a/src/store/walletSlice.ts b/src/store/walletSlice.ts index 083c496..91b7c36 100644 --- a/src/store/walletSlice.ts +++ b/src/store/walletSlice.ts @@ -1,7 +1,9 @@ import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; -import { DataEntryFormData, IWallet, MethodTypes } from './types'; + import { $api, WALLET_PATH } from '../api/api'; + import { UserState } from './userSlice'; +import { DataEntryFormData, IWallet, MethodTypes } from './types'; type WalletState = { wallets: IWallet[]; @@ -27,38 +29,40 @@ export const walletAction = createAsyncThunk< { rejectValue: string } >( 'wallet/walletAction', - async function (payload, { rejectWithValue }) { + async (payload, { rejectWithValue }) => { const { method, data, id } = payload; if (method !== "GET") { - $api({ - method, - url: `${WALLET_PATH}${id ? (id + '/') : ''}`, - data: data || {}, - }) - .then(response => response?.data) - .catch(error => { - return rejectWithValue('Помилка'); + try { + const response = await $api({ + method, + url: `${WALLET_PATH}${id ? (id + '/') : ''}`, + data: data || {}, }); + return response.data; + } catch (error) { + return rejectWithValue('Помилка'); + } } - return await $api.get(WALLET_PATH) - .then(res => res?.data) - .catch(error => { - return rejectWithValue(`Помилка`) - }); + try { + const response = await $api.get(WALLET_PATH); + return response.data; + } catch (error) { + return rejectWithValue(`Помилка`); + } } ); export const getWallets = createAsyncThunk( 'wallet/getWallets', - async function (_, { rejectWithValue }) { - return $api.get(WALLET_PATH) - .then(res => res?.data) - .catch(error => { - const errorMessage = error.response.data; - return rejectWithValue("error in get wallets"); - }); + async (_, { rejectWithValue }) => { + try { + const response = await $api.get(WALLET_PATH); + return response.data; + } catch (error) { + return rejectWithValue("error in get wallets"); + } } ); @@ -68,8 +72,8 @@ export const postEntryData = createAsyncThunk< { rejectValue: string, state: { user: UserState } } >( 'wallet/postEntryData', - async function (data, { rejectWithValue }) { - const { amountAccount, availableCash, cardAccountName, userId } = data + async (data, { rejectWithValue }) => { + const { amountAccount, availableCash, cardAccountName, userId } = data; if (!userId) { return rejectWithValue('Помилка при внесенні рахунків. Спочатку створіть акаунт.'); @@ -80,41 +84,26 @@ export const postEntryData = createAsyncThunk< amount: availableCash, owner: userId, type_of_account: "cash", - } + }; const bankWallet: IWallet = { title: cardAccountName, amount: amountAccount, owner: userId, type_of_account: "bank", - } + }; - const postCashWalletResponsePromise = await $api.post( - WALLET_PATH, - cashWallet, - ) - .then(response => response.status) - .catch(error => { - return rejectWithValue('Помилка при створенні рахунку'); - }); - - const postBankWalletResponsePromise = await $api.post( - WALLET_PATH, - bankWallet, - ) - .then(response => response.status) - .catch(error => { - return rejectWithValue('Помилка при створенні рахунку'); - }); - - const [postCashWalletResponse, postBankWalletResponse] = await Promise.all( - [postCashWalletResponsePromise, postBankWalletResponsePromise] - ); - - if (postCashWalletResponse !== 201 || postBankWalletResponse !== 201) { - return rejectWithValue('Can\'t create wallets. Server error.'); - } + try { + const postCashWalletResponse = await $api.post(WALLET_PATH, cashWallet); + const postBankWalletResponse = await $api.post(WALLET_PATH, bankWallet); + + if (postCashWalletResponse.status !== 201 || postBankWalletResponse.status !== 201) { + return rejectWithValue('Can\'t create wallets. Server error.'); + } - localStorage.setItem("isDataEntrySuccess", "true"); + localStorage.setItem("isDataEntrySuccess", "true"); + } catch (error) { + return rejectWithValue('Помилка при створенні рахунку'); + } } ); From 445e43e00b47640d1a9506062605d735f251955a Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Fri, 30 Jun 2023 18:17:56 +0300 Subject: [PATCH 05/16] refactor(chart): extract configs to separate files --- .../molecules/charts/DoughnutChart.tsx | 98 ++------------- src/components/molecules/charts/LineChart.tsx | 117 +++++------------- .../molecules/charts/doughnutChartConfig.ts | 100 +++++++++++++++ .../molecules/charts/lineChartConfig.ts | 116 +++++++++++++++++ 4 files changed, 252 insertions(+), 179 deletions(-) create mode 100644 src/components/molecules/charts/doughnutChartConfig.ts create mode 100644 src/components/molecules/charts/lineChartConfig.ts diff --git a/src/components/molecules/charts/DoughnutChart.tsx b/src/components/molecules/charts/DoughnutChart.tsx index 895f182..b4bcfc8 100644 --- a/src/components/molecules/charts/DoughnutChart.tsx +++ b/src/components/molecules/charts/DoughnutChart.tsx @@ -5,6 +5,8 @@ import ChartDataLabels from 'chartjs-plugin-datalabels'; import { useAppSelector } from "../../../store/hooks"; +import { getDoughnutChartConfig } from "./doughnutChartConfig"; + import { Box } from "../../atoms/box/Box.styled"; import { WHITE } from "../../../shared/styles/variables"; @@ -23,97 +25,13 @@ const DoughnutChart: React.FC = ({ const chartRef = useRef(null); const chart = useRef(); - const { incomesChart, expensesChart, allOutlaysChart } = useAppSelector(state => state.statistics); - - const calculatePercentage = (value: number, ctx: any): string => { - let sum = 0; - let dataArr = ctx.chart.data.datasets[0].data; - let percentage: any = 0; - - dataArr.map((data: any) => { - if (typeof data === 'number') { - sum += data; - } - }); - - if (typeof value === 'number') { - percentage = ((value * 100) / sum).toFixed(); - } + const { + incomesChart, + expensesChart, + allOutlaysChart + } = useAppSelector(state => state.statistics); - return percentage + '%'; - } - - const chartData = { - labels: labels, - datasets: [ - { - data: data, - backgroundColor: [ - '#7380F0', - '#5DD9AD', - '#E5FC6D', - '#FAB471', - '#D95DB2', - '#6EE4E6', - '#A3FC6D', - '#F2CA68', - '#F06C6F', - '#926DFC', - ], - hoverBackgroundColor: [ - '#7380F0dd', - '#5DD9ADdd', - '#E5FC6Ddd', - '#FAB471dd', - '#D95DB2dd', - '#6EE4E6dd', - '#A3FC6Ddd', - '#F2CA68dd', - '#F06C6Fdd', - '#926DFCdd', - ], - borderWidth: 0, - }, - ], - } - - const chartOptions = { - plugins: { - tooltip: { - callbacks: { - label: (context: any) => { - const label = context?.dataset?.label || ''; - const value = context?.formattedValue; - return `${label} ${value}₴`; - }, - }, - }, - legend: { - labels: { - font: { - size: 16, - }, - }, - }, - datalabels: { - formatter: calculatePercentage, - backgroundColor: "rgba(85, 85, 85, 0.35)", - borderRadius: 4, - padding: 6, - color: WHITE, - font: { - size: 13, - family: "Inter", - weight: "bold" as const, - }, - }, - }, - responsive: true, - maintainAspectRatio: false, - animation: { - duration: 1000, - }, - }; + const { chartData, chartOptions } = getDoughnutChartConfig(data, labels) useEffect(() => { const myDoughnutChartRef = chartRef.current.getContext('2d'); diff --git a/src/components/molecules/charts/LineChart.tsx b/src/components/molecules/charts/LineChart.tsx index 0e43277..8554dd0 100644 --- a/src/components/molecules/charts/LineChart.tsx +++ b/src/components/molecules/charts/LineChart.tsx @@ -1,8 +1,15 @@ -import { useEffect, useRef, useState } from "react"; +import { useState, useEffect, useRef } from "react"; + import { Chart } from "chart.js/auto"; -import { PRIMARY } from './../../../shared/styles/variables'; + import { useAppSelector } from "../../../store/hooks"; +import { + generateLabels, + setLineChartConfig, + setPointValues +} from "./lineChartConfig"; + const LineChart: React.FC<{ data: number[] }> = ({ data }) => { const { filterByDays, @@ -17,41 +24,26 @@ const LineChart: React.FC<{ data: number[] }> = ({ data }) => { const [pointHitRadiusValue, setPointHitRadiusValue] = useState(1); const [pointBorderWidthValue, setPointBorderWidthValue] = useState(1); - useEffect(() => { - const labels: string[] = []; - if (Object.keys(allOutlaysChart.categoryTransactions)?.length > 0) { - - for (let i = 0; i < (parseInt(filterByDays)); i++) { - const date = new Date(); - date.setDate(date.getDate() - i); - - const label = date.toLocaleDateString("uk-UA", { - month: "short", - day: "numeric" - }); + const { chartData, chartOptions } = setLineChartConfig( + data, + labels, + pointHitRadiusValue, + pointBorderWidthValue + ); - labels.push(label); - } - } + useEffect(() => { + const labels = generateLabels( + allOutlaysChart.categoryTransactions, + filterByDays + ) setLabels(labels) - switch (filterByDays) { - case "30": - setPointHitRadiusValue(30) - setPointBorderWidthValue(4) - break; - case "90": - setPointHitRadiusValue(15) - setPointBorderWidthValue(3) - break; - case "180": - setPointHitRadiusValue(8) - setPointBorderWidthValue(2) - break; - default: - break; - } + setPointValues( + filterByDays, + setPointHitRadiusValue, + setPointBorderWidthValue + ) }, [allOutlaysChart.categoryTransactions]); @@ -64,60 +56,8 @@ const LineChart: React.FC<{ data: number[] }> = ({ data }) => { chart.current = new Chart(myLineChartRef, { type: "line", - data: { - labels: labels, - datasets: [{ - label: 'Витрати або надходження за категорією', - data: data, - fill: false, - borderColor: PRIMARY, - tension: 0.4, - pointBackgroundColor: PRIMARY, - pointBorderWidth: pointBorderWidthValue, - pointHitRadius: pointHitRadiusValue, - }] - }, - options: { - plugins: { - tooltip: { - callbacks: { - label: (context) => { - const value = context.formattedValue; - return `${value}₴`; - }, - }, - }, - legend: { - display: false, - }, - }, - scales: { - x: { - display: true, - title: { - display: true, - text: "Період", - }, - }, - y: { - display: true, - title: { - display: true, - text: "Сума", - }, - }, - }, - responsive: true, - maintainAspectRatio: false, - elements: { - point: { - hoverBorderWidth: 5, - }, - }, - animation: { - duration: 1000, - }, - }, + data: chartData, + options: chartOptions, }); return () => { @@ -139,10 +79,9 @@ const LineChart: React.FC<{ data: number[] }> = ({ data }) => { data, ]); - return ( ); }; -export default LineChart; +export default LineChart; \ No newline at end of file diff --git a/src/components/molecules/charts/doughnutChartConfig.ts b/src/components/molecules/charts/doughnutChartConfig.ts new file mode 100644 index 0000000..8b3b7c8 --- /dev/null +++ b/src/components/molecules/charts/doughnutChartConfig.ts @@ -0,0 +1,100 @@ +import { ChartData, ChartOptions } from "chart.js"; + +import { WHITE } from "../../../shared/styles/variables"; + +const calculatePercentage = (value: number, ctx: any): string => { + let sum = 0; + let dataArr = ctx.chart.data.datasets[0].data; + let percentage: any = 0; + + dataArr.map((data: number) => { + if (typeof data === 'number') { + sum += data; + } + }); + + if (typeof value === 'number') { + percentage = ((value * 100) / sum).toFixed(); + } + + return percentage + '%'; +} + +export const getDoughnutChartConfig = ( + data: string[], + labels: string[] +): { chartData: ChartData, chartOptions: ChartOptions } => { + const chartData: ChartData = { + labels: labels, + datasets: [ + { + data: data?.map(value => parseFloat(value)), + backgroundColor: [ + '#7380F0', + '#5DD9AD', + '#E5FC6D', + '#FAB471', + '#D95DB2', + '#6EE4E6', + '#A3FC6D', + '#F2CA68', + '#F06C6F', + '#926DFC', + ], + hoverBackgroundColor: [ + '#7380F0dd', + '#5DD9ADdd', + '#E5FC6Ddd', + '#FAB471dd', + '#D95DB2dd', + '#6EE4E6dd', + '#A3FC6Ddd', + '#F2CA68dd', + '#F06C6Fdd', + '#926DFCdd', + ], + borderWidth: 0, + }, + ], + } + + const chartOptions: ChartOptions = { + plugins: { + tooltip: { + callbacks: { + label: (context: any) => { + const label = context?.dataset?.label || ''; + const value = context?.formattedValue; + return `${label} ${value}₴`; + }, + }, + }, + legend: { + labels: { + font: { + size: 16, + }, + }, + }, + datalabels: { + formatter: calculatePercentage, + backgroundColor: "rgba(85, 85, 85, 0.35)", + borderRadius: 4, + padding: 6, + color: WHITE, + font: { + size: 13, + family: "Inter", + weight: "bold" as const, + }, + }, + }, + responsive: true, + maintainAspectRatio: false, + animation: { + duration: 1000, + }, + }; + + return { chartData, chartOptions } +} \ No newline at end of file diff --git a/src/components/molecules/charts/lineChartConfig.ts b/src/components/molecules/charts/lineChartConfig.ts new file mode 100644 index 0000000..3d1561e --- /dev/null +++ b/src/components/molecules/charts/lineChartConfig.ts @@ -0,0 +1,116 @@ +import { PRIMARY } from "../../../shared/styles/variables"; + +import { ChartData, ChartOptions } from "chart.js"; + +import { FilterByDaysOptions } from "../../../store/types"; + +export const generateLabels = ( + categoryTransactions: any, + filterByDays: FilterByDaysOptions +) => { + const labels: string[] = []; + + if (Object.keys(categoryTransactions)?.length > 0) { + for (let i = 0; i < (parseInt(filterByDays)); i++) { + const date = new Date(); + date.setDate(date.getDate() - i); + + const label = date.toLocaleDateString("uk-UA", { + month: "short", + day: "numeric" + }); + + labels.push(label); + } + } + + return labels; +} + +export const setPointValues = ( + filterByDays: FilterByDaysOptions, + setPointHitRadiusValue: any, + setPointBorderWidthValue: any, +) => { + switch (filterByDays) { + case "30": + setPointHitRadiusValue(30) + setPointBorderWidthValue(4) + break; + case "90": + setPointHitRadiusValue(15) + setPointBorderWidthValue(3) + break; + case "180": + setPointHitRadiusValue(8) + setPointBorderWidthValue(2) + break; + default: + break; + } +} + +export const setLineChartConfig = ( + data: number[], + labels: string[], + pointBorderWidthValue: any, + pointHitRadiusValue: any, +): { chartData: ChartData, chartOptions: ChartOptions } => { + const chartData: ChartData = { + labels: labels, + datasets: [{ + label: 'Витрати або надходження за категорією', + data, + fill: false, + borderColor: PRIMARY, + tension: 0.4, + pointBackgroundColor: PRIMARY, + pointBorderWidth: pointBorderWidthValue, + pointHitRadius: pointHitRadiusValue, + }] + } + + const chartOptions: ChartOptions = { + plugins: { + tooltip: { + callbacks: { + label: (context) => { + const value = context.formattedValue; + return `${value}₴`; + }, + }, + }, + legend: { + display: false, + }, + }, + scales: { + x: { + display: true, + title: { + display: true, + text: "Період", + }, + }, + y: { + display: true, + title: { + display: true, + text: "Сума", + }, + }, + }, + responsive: true, + maintainAspectRatio: false, + elements: { + point: { + hoverBorderWidth: 5, + }, + }, + animation: { + duration: 1000, + }, + }; + + return { chartData, chartOptions } +} \ No newline at end of file From 638cfca584c22eae496ac714ad868f1136d0031c Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Fri, 30 Jun 2023 18:26:45 +0300 Subject: [PATCH 06/16] fix: input widths --- .../molecules/base-field/BaseField.tsx | 2 +- .../popup/add-wallet/AddBankdataTab.tsx | 1 + .../molecules/popup/add-wallet/AddWalletTab.tsx | 2 ++ .../popup/edit-profile/ChangePasswordTab.tsx | 7 ++++++- .../popup/edit-profile/EditProfileTab.tsx | 3 +++ .../pages/transactions/AddTransaction.tsx | 4 ++-- .../pages/transactions/EditTransaction.tsx | 4 ++-- src/contexts/PopupContext.tsx | 16 ++++++---------- src/shared/hooks/useFilterButtonOptions.tsx | 2 +- src/shared/utils/field-rules/details.ts | 2 +- 10 files changed, 25 insertions(+), 18 deletions(-) diff --git a/src/components/molecules/base-field/BaseField.tsx b/src/components/molecules/base-field/BaseField.tsx index 2a3eb30..aba02c5 100644 --- a/src/components/molecules/base-field/BaseField.tsx +++ b/src/components/molecules/base-field/BaseField.tsx @@ -69,7 +69,7 @@ const BaseField: React.FC = ({ type={setInputType()} id={name} name={name} - width="325px" + width="265px" style={{ paddingRight: "35px" }} className={errors?.[name] && "error"} {...registerOptions} diff --git a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx index 7795c57..577e99a 100644 --- a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx @@ -98,6 +98,7 @@ const AddBankDataTab: React.FC = () => { errors={errors} name="wallettitle" registerOptions={register('wallettitle', titleFieldRules)} + width="325px" /> + primary> + Далі + diff --git a/src/components/pages/password-recovery/NewPasswordStep.tsx b/src/components/pages/password-recovery/NewPasswordStep.tsx index f8bfacb..8ad29fb 100644 --- a/src/components/pages/password-recovery/NewPasswordStep.tsx +++ b/src/components/pages/password-recovery/NewPasswordStep.tsx @@ -22,11 +22,7 @@ import BaseField from "../../molecules/base-field/BaseField"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; import logo from "../../../shared/assets/images/logo.png"; -import { - GRADIENT, - WHITE, - ALMOST_BLACK_FOR_TEXT -} from "../../../shared/styles/variables"; +import COLORS from "../../../shared/styles/variables"; const NewPasswordStep: React.FC<{ uid: string, @@ -63,18 +59,18 @@ const NewPasswordStep: React.FC<{ return ( - + InterfaceImage + background={COLORS.WHITE}> Logo - Створення нового пароля - Введіть новий пароль для вашого
аккаунту diff --git a/src/components/pages/password-recovery/ResetLinkStep.tsx b/src/components/pages/password-recovery/ResetLinkStep.tsx index 157a4d9..a6ca7ac 100644 --- a/src/components/pages/password-recovery/ResetLinkStep.tsx +++ b/src/components/pages/password-recovery/ResetLinkStep.tsx @@ -10,25 +10,25 @@ import { Typography } from "../../atoms/typography/Typography.styled"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; import logo from "../../../shared/assets/images/logo.png"; -import { GRADIENT, WHITE, ALMOST_BLACK_FOR_TEXT } from "../../../shared/styles/variables"; +import COLORS from "../../../shared/styles/variables"; const ResetLinkStep: React.FC = () => { const dispatch = useAppDispatch(); return ( - + InterfaceImage + background={COLORS.WHITE}> Logo - Відновлення пароля - Посилання для скидання пароля надіслано на вашу
електронну адресу. Якщо посилання не прийшло, то ви
можете надіслати його знову. diff --git a/src/components/pages/register/RegisterPage.tsx b/src/components/pages/register/RegisterPage.tsx index 21c33d2..6af0a41 100644 --- a/src/components/pages/register/RegisterPage.tsx +++ b/src/components/pages/register/RegisterPage.tsx @@ -24,12 +24,7 @@ import BaseField from "../../molecules/base-field/BaseField"; import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; -import { - ALERT_1, - ALMOST_BLACK_FOR_TEXT, - GRADIENT, - WHITE -} from "../../../shared/styles/variables"; +import COLORS from "../../../shared/styles/variables"; import { RegisterFormData } from "../../../store/types"; @@ -64,14 +59,14 @@ const RegisterPage: React.FC = () => { return ( - + InterfaceImage + background={COLORS.WHITE}> Logo - + Реєстрація нового користувача
{ {registerError && ( - {registerError} + + {registerError} + )} diff --git a/src/components/pages/statistics/DoughnutChartSection.tsx b/src/components/pages/statistics/DoughnutChartSection.tsx index 27b7897..05185b5 100644 --- a/src/components/pages/statistics/DoughnutChartSection.tsx +++ b/src/components/pages/statistics/DoughnutChartSection.tsx @@ -10,7 +10,7 @@ import DoughnutChart from "../../molecules/charts/DoughnutChart"; import { calculateCategoriesWithTotalAmount } from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; -import { DIVIDER } from "../../../shared/styles/variables"; +import COLORS from "../../../shared/styles/variables"; import { ICategoryWithTotalAmount } from "../../../store/types"; @@ -80,7 +80,7 @@ const DoughnutChartsSection: React.FC = () => { gap="32px" pb="20px" mb="20px" - borderBottom={`2px solid ${DIVIDER}`} + borderBottom={`2px solid ${COLORS.DIVIDER}`} > diff --git a/src/components/pages/statistics/LineChartSection.tsx b/src/components/pages/statistics/LineChartSection.tsx index 7176795..99cd3d1 100644 --- a/src/components/pages/statistics/LineChartSection.tsx +++ b/src/components/pages/statistics/LineChartSection.tsx @@ -13,7 +13,9 @@ import { Typography } from "../../atoms/typography/Typography.styled"; import LineChart from "../../molecules/charts/LineChart"; import Select from "../../molecules/select/Select"; -import { WHITE } from "../../../shared/styles/variables"; +import { SelectOptions } from "../../../../types/molecules"; + +import COLORS from "../../../shared/styles/variables"; const LineChartSection: React.FC = () => { const dispatch = useAppDispatch(); @@ -30,7 +32,7 @@ const LineChartSection: React.FC = () => { const [chartData, setChartData] = useState([]); - const options: any = categories.all?.map(({ id, title }) => { + const options: SelectOptions[] = categories.all?.map(({ id, title }) => { return { value: id, label: title } }) @@ -84,7 +86,7 @@ const LineChartSection: React.FC = () => { onCategoryChange={onCategoryChange} /> - + diff --git a/src/components/pages/statistics/StatisticsHeader.tsx b/src/components/pages/statistics/StatisticsHeader.tsx index b7845cf..aa38024 100644 --- a/src/components/pages/statistics/StatisticsHeader.tsx +++ b/src/components/pages/statistics/StatisticsHeader.tsx @@ -5,9 +5,10 @@ import { getFilteredTransactions } from "../../../store/transactionSlice"; import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; import TabFilter from "../../molecules/tabs/filter/TabFilter"; -import { IFilterButton } from "../../molecules/tabs/filter/TabFilter"; -import { DARK_FOR_TEXT } from "../../../shared/styles/variables"; +import COLORS from "../../../shared/styles/variables"; + +import { IFilterButton } from "../../molecules/tabs/filter/TabFilter"; const StatisticsHeader: React.FC = () => { const dispatch = useAppDispatch(); @@ -44,7 +45,7 @@ const StatisticsHeader: React.FC = () => { mr="10px" fw="600" fz="12px" - color={DARK_FOR_TEXT} + color={COLORS.DARK_FOR_TEXT} > Відобразити дані за період diff --git a/src/components/pages/statistics/StatisticsPage.tsx b/src/components/pages/statistics/StatisticsPage.tsx index 73fbcc4..8cf67f0 100644 --- a/src/components/pages/statistics/StatisticsPage.tsx +++ b/src/components/pages/statistics/StatisticsPage.tsx @@ -14,7 +14,7 @@ import DoughnutChartsSection from "./DoughnutChartSection"; import LineChartSection from "./LineChartSection"; import { StatisticsPageWrapper } from "./StatisticsPage.styled"; -import { BASE_2 } from "../../../shared/styles/variables"; +import COLORS from "../../../shared/styles/variables"; const StatisticsPage: React.FC = () => { const dispatch = useAppDispatch(); @@ -51,7 +51,7 @@ const StatisticsPage: React.FC = () => { - + diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index 381caa1..0135412 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -33,7 +33,7 @@ import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; import BaseField from '../../molecules/base-field/BaseField'; import DatePicker from './DatePicker'; -import { BASE_2, } from "../../../shared/styles/variables"; +import COLORS from '../../../shared/styles/variables'; import { IWallet, TypeOfOutlay } from "../../../store/types"; import { SelectOptions } from '../../../../types/molecules'; @@ -177,7 +177,7 @@ const AddTransaction: React.FC = () => { > Додати транзакцію - + { const dispatch = useAppDispatch() @@ -142,7 +142,7 @@ const EditTransaction: React.FC = () => { > Редагування транзакції - + { as="span" mr="10px" fw="600" - color={DARK_FOR_TEXT} + color={COLORS.DARK_FOR_TEXT} fz="12px" > Відобразити @@ -103,7 +103,7 @@ const Transactions: React.FC = () => { { const navigate = useNavigate(); @@ -28,10 +28,10 @@ const WelcomePage = () => { return ( - + InterfaceImage - + Logo diff --git a/src/shared/styles/commonStyles.ts b/src/shared/styles/commonStyles.ts index 483484f..771a6e3 100644 --- a/src/shared/styles/commonStyles.ts +++ b/src/shared/styles/commonStyles.ts @@ -1,5 +1,6 @@ import { css } from "styled-components"; -import { ALMOST_BLACK_FOR_TEXT } from "./variables"; + +import COLORS from "./variables"; export type commonStylesProps = { m?: string; @@ -48,7 +49,7 @@ export const commonStyles = css` padding-right: ${({ pr }) => pr || undefined}; padding-bottom: ${({ pb }) => pb || undefined}; padding-left: ${({ pl }) => pl || undefined}; - color: ${({ color }) => color || ALMOST_BLACK_FOR_TEXT}; + color: ${({ color }) => color || COLORS.ALMOST_BLACK_FOR_TEXT}; width: ${({ width }) => width || undefined}; height: ${({ height }) => height || undefined}; line-height: ${({ lh }) => lh || undefined}; diff --git a/src/shared/styles/globalStyles.ts b/src/shared/styles/globalStyles.ts index d7f7ef2..250922a 100644 --- a/src/shared/styles/globalStyles.ts +++ b/src/shared/styles/globalStyles.ts @@ -1,7 +1,9 @@ import { createGlobalStyle } from "styled-components"; -import { ALMOST_BLACK_FOR_TEXT, BASE_1 } from "./variables"; + import { fontStyles } from "./fontStyles"; +import COLORS from "./variables"; + export const GlobalStyles = createGlobalStyle` ${fontStyles} @@ -13,8 +15,8 @@ export const GlobalStyles = createGlobalStyle` body { font-weight: 400; - background-color: ${BASE_1}; - color: ${ALMOST_BLACK_FOR_TEXT}; + background-color: ${COLORS.BASE_1}; + color: ${COLORS.ALMOST_BLACK_FOR_TEXT}; } ::-webkit-scrollbar { diff --git a/src/shared/styles/variables.ts b/src/shared/styles/variables.ts index f3dc21b..d97ccb7 100644 --- a/src/shared/styles/variables.ts +++ b/src/shared/styles/variables.ts @@ -1,30 +1,24 @@ -export const ALMOST_BLACK_FOR_TEXT = "#282828"; -export const DARK_FOR_TEXT = "#555555"; - -export const WHITE = "#FFFFFF"; -export const BASE_1 = "#FAFAFA"; -export const BASE_2 = "#F3F4F6"; - -export const DIVIDER = "#E5E5E9"; - -export const PRIMARY = "#737FEF"; -export const PRIMARY_HOVER = "#5561D1"; -export const PRIMARY_2 = "#C7CAE3"; - -export const GREEN = "#2FB876"; -export const SUCCESS = "#04C000"; - -export const RED = "#F86C6C" -export const ALERT_1 = "#F01C0E"; -export const ALERT_2 = "#FFF4F4"; - -export const ACCENT = "#00E3E6"; - -export const DISABLED = "#B3B3B7"; - -export const MENU_BUTTON_SELECTED = "#E9E9F3"; -export const MENU_BUTTON_HOVER = "#E1E5F5"; - -export const GREY_50 = "#808080"; - -export const GRADIENT = `linear-gradient(130.59deg, #A96BF8 0%, #725DD9 19.48%, #737FEF 39.78%, #5D8AD9 60.07%, #6BC3F8 77.93%)`; +const COLORS = { + ALMOST_BLACK_FOR_TEXT: "#282828", + DARK_FOR_TEXT: "#555555", + WHITE: "#FFFFFF", + BASE_1: "#FAFAFA", + BASE_2: "#F3F4F6", + DIVIDER: "#E5E5E9", + PRIMARY: "#737FEF", + PRIMARY_HOVER: "#5561D1", + PRIMARY_2: "#C7CAE3", + GREEN: "#2FB876", + SUCCESS: "#04C000", + RED: "#F86C6C", + ALERT_1: "#F01C0E", + ALERT_2: "#FFF4F4", + ACCENT: "#00E3E6", + DISABLED: "#B3B3B7", + MENU_BUTTON_SELECTED: "#E9E9F3", + MENU_BUTTON_HOVER: "#E1E5F5", + GREY_50: "#808080", + GRADIENT: `linear-gradient(130.59deg, #A96BF8 0%, #725DD9 19.48%, #737FEF 39.78%, #5D8AD9 60.07%, #6BC3F8 77.93%)`, +}; + +export default COLORS; \ No newline at end of file From b2234b78939306412f3716cbadac21b30748b66e Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Mon, 3 Jul 2023 14:00:55 +0300 Subject: [PATCH 08/16] refactor: replace 'any' with specific types --- src/api/api.ts | 7 ++++--- .../molecules/base-field/BaseField.tsx | 8 ++++--- .../molecules/charts/doughnutChartConfig.ts | 4 ++-- .../molecules/charts/lineChartConfig.ts | 12 +++++------ src/components/molecules/select/Select.tsx | 5 +++-- .../molecules/tabs/filter/TabFilter.tsx | 3 +++ .../pages/statistics/LineChartSection.tsx | 8 +++---- .../pages/statistics/StatisticsHeader.tsx | 2 +- .../pages/transactions/AddTransaction.tsx | 2 +- .../pages/transactions/EditTransaction.tsx | 16 +++++++------- src/shared/hooks/useFilterButtonOptions.tsx | 2 +- src/shared/hooks/useSwitchButtonOptions.tsx | 9 ++++---- src/shared/utils/field-rules/details.ts | 2 +- src/shared/utils/field-rules/password.ts | 21 ++++++++++++------- .../utils/transactions/setSelectOptions.ts | 6 +++++- src/store/bankDataSlice.ts | 12 +++++++++-- src/store/passwordRecoverySlice.ts | 4 ++-- 17 files changed, 74 insertions(+), 49 deletions(-) diff --git a/src/api/api.ts b/src/api/api.ts index b958b75..97fbfb2 100644 --- a/src/api/api.ts +++ b/src/api/api.ts @@ -1,6 +1,7 @@ -import axios, { AxiosRequestConfig } from 'axios'; -import { IUser } from "../store/types"; import { Store } from '@reduxjs/toolkit'; +import axios, { InternalAxiosRequestConfig } from 'axios'; + +import { IUser } from "../store/types"; export const BASE_URL = "https://prod.wallet.cloudns.ph:8800"; export const REGISTER_PATH = "/accounts/register/"; @@ -36,7 +37,7 @@ export const $api = axios.create({ } }); -$api.interceptors.request.use((config: AxiosRequestConfig): any => { +$api.interceptors.request.use((config: InternalAxiosRequestConfig): InternalAxiosRequestConfig => { const userState = store.getState().user; let currentToken: string | undefined; diff --git a/src/components/molecules/base-field/BaseField.tsx b/src/components/molecules/base-field/BaseField.tsx index d1a38ef..1f7155e 100644 --- a/src/components/molecules/base-field/BaseField.tsx +++ b/src/components/molecules/base-field/BaseField.tsx @@ -7,14 +7,16 @@ import VisibilityOn from "../../../shared/assets/icons/visibility-on.svg"; import COLORS from "../../../shared/styles/variables"; +import { FieldErrors, UseFormRegisterReturn } from 'react-hook-form' + type BaseFieldProps = { fieldType: "text" | "email" | "password"; name: string; label: string; - errors: any; + errors: FieldErrors; isPasswordVisible?: boolean; - setIsPasswordVisible?: any; - registerOptions?: any; + setIsPasswordVisible?: React.Dispatch>; + registerOptions?: UseFormRegisterReturn; [key: string]: any; }; diff --git a/src/components/molecules/charts/doughnutChartConfig.ts b/src/components/molecules/charts/doughnutChartConfig.ts index ef18522..e0f6338 100644 --- a/src/components/molecules/charts/doughnutChartConfig.ts +++ b/src/components/molecules/charts/doughnutChartConfig.ts @@ -5,7 +5,7 @@ import COLORS from "../../../shared/styles/variables"; const calculatePercentage = (value: number, ctx: any): string => { let sum = 0; let dataArr = ctx.chart.data.datasets[0].data; - let percentage: any = 0; + let percentage: number = 0; dataArr.map((data: number) => { if (typeof data === 'number') { @@ -14,7 +14,7 @@ const calculatePercentage = (value: number, ctx: any): string => { }); if (typeof value === 'number') { - percentage = ((value * 100) / sum).toFixed(); + percentage = parseInt(((value * 100) / sum).toFixed()); } return percentage + '%'; diff --git a/src/components/molecules/charts/lineChartConfig.ts b/src/components/molecules/charts/lineChartConfig.ts index 840c706..1f8e39d 100644 --- a/src/components/molecules/charts/lineChartConfig.ts +++ b/src/components/molecules/charts/lineChartConfig.ts @@ -2,10 +2,10 @@ import { ChartData, ChartOptions } from "chart.js"; import COLORS from "../../../shared/styles/variables"; -import { FilterByDaysOptions } from "../../../store/types"; +import { FilterByDaysOptions, Transactions } from "../../../store/types"; export const generateLabels = ( - categoryTransactions: any, + categoryTransactions: Transactions, filterByDays: FilterByDaysOptions ) => { const labels: string[] = []; @@ -29,8 +29,8 @@ export const generateLabels = ( export const setPointValues = ( filterByDays: FilterByDaysOptions, - setPointHitRadiusValue: any, - setPointBorderWidthValue: any, + setPointHitRadiusValue: React.Dispatch>, + setPointBorderWidthValue: React.Dispatch>, ) => { switch (filterByDays) { case "30": @@ -53,8 +53,8 @@ export const setPointValues = ( export const setLineChartConfig = ( data: number[], labels: string[], - pointBorderWidthValue: any, - pointHitRadiusValue: any, + pointBorderWidthValue: number, + pointHitRadiusValue: number, ): { chartData: ChartData, chartOptions: ChartOptions } => { const chartData: ChartData = { labels: labels, diff --git a/src/components/molecules/select/Select.tsx b/src/components/molecules/select/Select.tsx index da279b8..b17708a 100644 --- a/src/components/molecules/select/Select.tsx +++ b/src/components/molecules/select/Select.tsx @@ -3,13 +3,14 @@ import ReactSelect, { StylesConfig } from 'react-select' import COLORS from '../../../shared/styles/variables'; import { SelectOptions } from '../../../../types/molecules'; +import { FieldError, FieldErrorsImpl, Merge } from 'react-hook-form'; type SelectProps = { value: SelectOptions; options: SelectOptions[]; - onCategoryChange: (e: any) => void; + onCategoryChange: (e: React.ChangeEvent<{ value: string; label: string }>) => void; width?: string; - isError?: any; + isError?: FieldError | Merge>; } const Select: React.FC = ({ diff --git a/src/components/molecules/tabs/filter/TabFilter.tsx b/src/components/molecules/tabs/filter/TabFilter.tsx index 41e543e..5d610d5 100644 --- a/src/components/molecules/tabs/filter/TabFilter.tsx +++ b/src/components/molecules/tabs/filter/TabFilter.tsx @@ -5,11 +5,14 @@ import { TabFilterWrapper } from "./TabFilter.styled"; import COLORS from '../../../../shared/styles/variables'; +import { TypeOfOutlay } from '../../../../store/types'; + export interface IFilterButton { filterBy: string; onTabClick: () => void; buttonName: string; isActive: boolean; + typeOfOutlay?: TypeOfOutlay | ""; }; type TabFilterProps = { diff --git a/src/components/pages/statistics/LineChartSection.tsx b/src/components/pages/statistics/LineChartSection.tsx index 99cd3d1..301bbea 100644 --- a/src/components/pages/statistics/LineChartSection.tsx +++ b/src/components/pages/statistics/LineChartSection.tsx @@ -4,19 +4,17 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setActiveCategoryId } from "../../../store/statisticsSlice"; import { getFilteredTransactions } from "../../../store/transactionSlice"; -import { - generateNewLineChartData -} from "../../../shared/utils/statistics/generateNewLineChartData"; +import { generateNewLineChartData } from "../../../shared/utils/statistics/generateNewLineChartData"; import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; import LineChart from "../../molecules/charts/LineChart"; import Select from "../../molecules/select/Select"; -import { SelectOptions } from "../../../../types/molecules"; - import COLORS from "../../../shared/styles/variables"; +import { SelectOptions } from "../../../../types/molecules"; + const LineChartSection: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/statistics/StatisticsHeader.tsx b/src/components/pages/statistics/StatisticsHeader.tsx index aa38024..a17558c 100644 --- a/src/components/pages/statistics/StatisticsHeader.tsx +++ b/src/components/pages/statistics/StatisticsHeader.tsx @@ -15,7 +15,7 @@ const StatisticsHeader: React.FC = () => { const { filterByDays } = useAppSelector(state => state.statistics); - const setFilterButtonOptions = (buttonName: string, days: string): any => { + const setFilterButtonOptions = (buttonName: string, days: string): IFilterButton => { return { buttonName, filterBy: `?days=${days}`, diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index 0135412..67fe26f 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -64,7 +64,7 @@ const AddTransaction: React.FC = () => { const setSwitchButtonOptions = ( buttonName: string, typeOfOutlay: TypeOfOutlay, - ): any => { + ): ISwitchButton => { return { buttonName, isActive: addTransactionData?.type_of_outlay === typeOfOutlay, diff --git a/src/components/pages/transactions/EditTransaction.tsx b/src/components/pages/transactions/EditTransaction.tsx index 7d382d9..38b8960 100644 --- a/src/components/pages/transactions/EditTransaction.tsx +++ b/src/components/pages/transactions/EditTransaction.tsx @@ -54,14 +54,6 @@ const EditTransaction: React.FC = () => { categories ) - const onCategoryChange = (selectedValue: any): void => { - dispatch(setEditTransactionData({ category: selectedValue?.value })); - setSelectedCategoryValues({ - value: selectedValue?.value, - label: selectedValue?.label - }); - } - const handleCancelEditTransaction = () => { dispatch(setIsEditTransactionOpen(false)); dispatch(setEditTransactionData({})); @@ -100,6 +92,14 @@ const EditTransaction: React.FC = () => { })); } + const onCategoryChange = (selectedValue: any): void => { + dispatch(setEditTransactionData({ category: selectedValue?.value })); + setSelectedCategoryValues({ + value: selectedValue?.value, + label: selectedValue?.label + }); + } + const { register, formState: { errors }, diff --git a/src/shared/hooks/useFilterButtonOptions.tsx b/src/shared/hooks/useFilterButtonOptions.tsx index 772a4c9..46adf02 100644 --- a/src/shared/hooks/useFilterButtonOptions.tsx +++ b/src/shared/hooks/useFilterButtonOptions.tsx @@ -27,7 +27,7 @@ const useFilterButtonOptions = (type: "category" | "transaction"): IFilterButton const setFilterButtonOptions = ( buttonName: string, typeOfOutlay: TypeOfOutlay | "", - ): any => { + ): IFilterButton => { return { buttonName, typeOfOutlay, diff --git a/src/shared/hooks/useSwitchButtonOptions.tsx b/src/shared/hooks/useSwitchButtonOptions.tsx index 00da080..7d84185 100644 --- a/src/shared/hooks/useSwitchButtonOptions.tsx +++ b/src/shared/hooks/useSwitchButtonOptions.tsx @@ -1,18 +1,19 @@ import { useAppDispatch } from "../../store/hooks"; import { ISwitchButton } from "../../components/molecules/tabs/switch/TabSwitch"; -import { TypeOfOutlay } from "../../store/types"; +import { ICategory, TypeOfOutlay } from "../../store/types"; +import { ActionCreatorWithPayload } from "@reduxjs/toolkit"; const useSwitchButtonOptions = ( - data: any, - dataHandler: any + data: ICategory, + dataHandler: ActionCreatorWithPayload ): ISwitchButton[] => { const dispatch = useAppDispatch(); const setSwitchButtonOptions = ( buttonName: string, typeOfOutlay: TypeOfOutlay, - ): any => { + ): ISwitchButton => { return { buttonName, isActive: data?.type_of_outlay === typeOfOutlay, diff --git a/src/shared/utils/field-rules/details.ts b/src/shared/utils/field-rules/details.ts index f6afe85..e89d57e 100644 --- a/src/shared/utils/field-rules/details.ts +++ b/src/shared/utils/field-rules/details.ts @@ -1,6 +1,6 @@ import { titleRegex, twoSymbolsRegex } from "../regexes"; -export const setDetailsFieldRules = (clearErrors: any) => { +export const setDetailsFieldRules = (clearErrors: (name?: string | string[]) => void) => { return { validate: { hasTwoSymbols: (value: string) => { diff --git a/src/shared/utils/field-rules/password.ts b/src/shared/utils/field-rules/password.ts index 21d9138..c7ae05d 100644 --- a/src/shared/utils/field-rules/password.ts +++ b/src/shared/utils/field-rules/password.ts @@ -1,22 +1,29 @@ +import { FieldValues, UseFormWatch } from "react-hook-form"; import { passwordRegex } from "../regexes"; +type ConfirmPasswordInputRules = { + required: string; + validate: (val: string) => string; +}; + export const passwordInputRules = { required: 'Обов\'язкове поле для заповнення', pattern: { value: passwordRegex, message: `Пароль повинен містити не менше 8 символів, 1 літеру, 1 цифру та 1 спеціальний символ` }, -} +}; export const confirmPasswordInputRules = ( - watchFunc: any, passwordName: string -): any => { + watchFunc: UseFormWatch, + passwordName: string +): ConfirmPasswordInputRules => { return { required: 'Обов\'язкове поле для заповнення', validate: (val: string) => { - if (watchFunc(passwordName) != val) { + if (watchFunc(passwordName) !== val) { return "Паролі не співпадають"; } - } - } -} + }, + }; +}; diff --git a/src/shared/utils/transactions/setSelectOptions.ts b/src/shared/utils/transactions/setSelectOptions.ts index 0e99278..07ba9e3 100644 --- a/src/shared/utils/transactions/setSelectOptions.ts +++ b/src/shared/utils/transactions/setSelectOptions.ts @@ -3,7 +3,11 @@ import { ICategory, TypeOfOutlay } from '../../../store/types'; export const setSelectOptions = ( typeOfOutlay: TypeOfOutlay, - categories: any + categories: { + all: ICategory[]; + income: ICategory[]; + expense: ICategory[]; + } ): SelectOptions[] => { let categoriesArr: ICategory[] = null; diff --git a/src/store/bankDataSlice.ts b/src/store/bankDataSlice.ts index cab40ae..9217978 100644 --- a/src/store/bankDataSlice.ts +++ b/src/store/bankDataSlice.ts @@ -11,7 +11,11 @@ export type BankDataState = { isAddBankDataSuccess: boolean; } -export const getBankData = createAsyncThunk( +export const getBankData = createAsyncThunk< + IBankData[], + undefined, + { rejectValue: string } +>( 'bankData/getBankData', async (_, { rejectWithValue }) => { try { @@ -23,7 +27,11 @@ export const getBankData = createAsyncThunk( +export const sendBankData = createAsyncThunk< + undefined, + IBankData, + { rejectValue: string } +>( 'bankData/sendBankData', async (payload, { rejectWithValue }) => { try { diff --git a/src/store/passwordRecoverySlice.ts b/src/store/passwordRecoverySlice.ts index 7d91b70..ef6ca03 100644 --- a/src/store/passwordRecoverySlice.ts +++ b/src/store/passwordRecoverySlice.ts @@ -23,7 +23,7 @@ type confirmPasswordResetPayload = { export const requestPasswordReset = createAsyncThunk< undefined, { email: string }, - { rejectValue: any } + { rejectValue: string } >( 'passwordRecovery/requestPasswordReset', async (payload, { rejectWithValue }) => { @@ -40,7 +40,7 @@ export const requestPasswordReset = createAsyncThunk< export const confirmPasswordReset = createAsyncThunk< undefined, confirmPasswordResetPayload, - { rejectValue: any } + { rejectValue: string } >( 'passwordRecovery/confirmPasswordReset', async (payload, { rejectWithValue }) => { From ae4af76cfa27171b013efe70a3f1105c81c7d08e Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Mon, 3 Jul 2023 19:20:17 +0300 Subject: [PATCH 09/16] refactor: extract reused types into separate files --- config/build/buildDevServer.ts | 3 +- config/build/buildLoaders.ts | 3 +- config/build/buildPlugins.ts | 2 +- config/build/buildWebpackConfig.ts | 4 +- types/config.ts => config/types/types.ts | 0 mock-data/account.ts | 8 -- mock-data/categories.ts | 22 ---- mock-data/doughnutCharts.ts | 9 -- mock-data/options.ts | 12 -- mock-data/transactions.ts | 41 ------ mock-data/wallets.ts | 39 ------ src/api/api.ts | 4 +- src/components/atoms/box/Box.styled.ts | 31 ++++- src/components/atoms/button/Button.styled.ts | 8 +- .../atoms/container/Container.styled.ts | 6 +- src/components/atoms/form/Form.styled.ts | 17 ++- src/components/atoms/img/Img.styled.ts | 13 +- src/components/atoms/label/Label.styled.ts | 3 +- src/components/atoms/link/Link.styled.ts | 22 +++- src/components/atoms/list/List.styled.ts | 1 + src/components/atoms/list/ListItem.styled.ts | 1 + .../atoms/typography/Typography.styled.ts | 10 +- .../molecules/category/Category.tsx | 6 +- .../molecules/charts/lineChartConfig.ts | 3 +- .../molecules/popup/Popup.styled.ts | 1 + .../molecules/popup/PopupEditWallet.tsx | 2 +- .../popup/add-wallet/AddBankdataTab.tsx | 2 +- .../popup/add-wallet/AddWalletTab.tsx | 2 +- .../popup/add-wallet/BankdataInfoMessage.tsx | 4 +- .../popup/edit-profile/ChangePasswordTab.tsx | 2 +- .../popup/edit-profile/EditProfileTab.tsx | 3 +- src/components/molecules/select/Select.tsx | 5 +- .../molecules/tabs/filter/TabFilter.tsx | 10 +- .../molecules/tabs/switch/TabSwitch.tsx | 8 +- .../molecules/transaction/Transaction.tsx | 4 +- src/components/molecules/wallet/Wallet.tsx | 4 +- .../pages/categories/Categories.tsx | 2 +- .../pages/categories/CategoriesPage.styled.ts | 1 + src/components/pages/data/DataEntryPage.tsx | 2 +- src/components/pages/home/Statistics.tsx | 2 +- src/components/pages/home/Transitions.tsx | 3 +- src/components/pages/home/Wallets.tsx | 2 +- src/components/pages/login/LoginPage.tsx | 3 +- .../pages/register/RegisterPage.tsx | 2 +- .../pages/statistics/DoughnutChartSection.tsx | 2 +- .../pages/statistics/LineChartSection.tsx | 2 +- .../pages/statistics/StatisticsHeader.tsx | 2 +- .../pages/statistics/StatisticsPage.styled.ts | 1 + .../pages/transactions/AddTransaction.tsx | 9 +- .../pages/transactions/Transactions.tsx | 6 +- src/consts/consts.ts | 1 - src/shared/hooks/useFilterButtonOptions.tsx | 3 +- src/shared/hooks/useSwitchButtonOptions.tsx | 7 +- src/shared/utils/field-rules/password.ts | 1 + .../calculateCategoriesWithTotalAmount.ts | 3 +- .../utils/statistics/calculateTotalAmount.ts | 2 +- .../statistics/generateNewLineChartData.ts | 2 +- src/shared/utils/store/updateCategories.ts | 3 +- .../utils/store/updateChartCategories.ts | 4 +- .../store/updateChartCategoryTransactions.ts | 5 +- .../utils/store/updateChartTransactions.ts | 4 +- src/shared/utils/store/updateTransactions.ts | 3 +- .../utils/transactions/filterTransactions.ts | 2 +- .../transactions/formatTransactionDate.ts | 1 - .../utils/transactions/setSelectOptions.ts | 4 +- src/store/bankDataSlice.ts | 5 +- src/store/categorySlice.ts | 24 +--- src/store/statisticsSlice.ts | 31 +---- src/store/transactionSlice.ts | 23 +--- src/store/types.ts | 120 ------------------ src/store/userSlice.ts | 27 +--- src/store/walletSlice.ts | 11 +- types/atoms.ts | 81 ------------ types/bankdata.ts | 6 + types/category.ts | 32 +++++ types/common.ts | 26 ++++ types/molecules.ts | 18 --- types/statistics.ts | 24 ++++ types/transactions.ts | 35 +++++ types/user.ts | 53 ++++++++ types/wallet.ts | 14 ++ webpack.config.ts | 3 +- 82 files changed, 388 insertions(+), 544 deletions(-) rename types/config.ts => config/types/types.ts (100%) delete mode 100644 mock-data/account.ts delete mode 100644 mock-data/categories.ts delete mode 100644 mock-data/doughnutCharts.ts delete mode 100644 mock-data/options.ts delete mode 100644 mock-data/transactions.ts delete mode 100644 mock-data/wallets.ts delete mode 100644 src/consts/consts.ts delete mode 100644 src/store/types.ts delete mode 100644 types/atoms.ts create mode 100644 types/bankdata.ts create mode 100644 types/category.ts create mode 100644 types/common.ts delete mode 100644 types/molecules.ts create mode 100644 types/statistics.ts create mode 100644 types/transactions.ts create mode 100644 types/user.ts create mode 100644 types/wallet.ts diff --git a/config/build/buildDevServer.ts b/config/build/buildDevServer.ts index 7d7f7bc..2b19048 100644 --- a/config/build/buildDevServer.ts +++ b/config/build/buildDevServer.ts @@ -1,5 +1,6 @@ import type { Configuration as DevServerConfiguration } from "webpack-dev-server"; -import { BuildOptions } from '../../types/config'; + +import { BuildOptions } from "../types/types"; export function buildDevServer(options: BuildOptions): DevServerConfiguration { const { paths } = options diff --git a/config/build/buildLoaders.ts b/config/build/buildLoaders.ts index 03d1962..48b4dee 100644 --- a/config/build/buildLoaders.ts +++ b/config/build/buildLoaders.ts @@ -1,6 +1,7 @@ import webpack from 'webpack'; import MiniCssExtractPlugin from "mini-css-extract-plugin"; -import { BuildOptions } from '../../types/config'; + +import { BuildOptions } from '../types/types'; export function buildLoaders({ isDev }: BuildOptions): webpack.RuleSetRule[] { const typescriptLoader = { diff --git a/config/build/buildPlugins.ts b/config/build/buildPlugins.ts index 61e275a..3979408 100644 --- a/config/build/buildPlugins.ts +++ b/config/build/buildPlugins.ts @@ -3,7 +3,7 @@ import HtmlWebpackPlugin from 'html-webpack-plugin'; import MiniCssExtractPlugin from 'mini-css-extract-plugin'; import ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin'; -import { BuildOptions } from "../../types/config"; +import { BuildOptions } from "../types/types"; export function buildPlugins(options: BuildOptions): webpack.WebpackPluginInstance[] { const { paths } = options diff --git a/config/build/buildWebpackConfig.ts b/config/build/buildWebpackConfig.ts index ec902fc..a155a2c 100644 --- a/config/build/buildWebpackConfig.ts +++ b/config/build/buildWebpackConfig.ts @@ -1,12 +1,12 @@ import webpack from 'webpack'; -import { BuildOptions } from '../../types/config'; - import { buildLoaders } from './buildLoaders'; import { buildResolve } from './buildResolve'; import { buildPlugins } from './buildPlugins'; import { buildDevServer } from './buildDevServer'; +import { BuildOptions } from '../types/types'; + export function buildWebpacConfig(options: BuildOptions): webpack.Configuration { const { paths, mode, isDev } = options diff --git a/types/config.ts b/config/types/types.ts similarity index 100% rename from types/config.ts rename to config/types/types.ts diff --git a/mock-data/account.ts b/mock-data/account.ts deleted file mode 100644 index 98a8ce1..0000000 --- a/mock-data/account.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { IUser } from "../src/store/types"; - -export const mockAccount: IUser = { - id: 0, - first_name: "john", - last_name: "doe", - email: "user@gmail.com" -}; \ No newline at end of file diff --git a/mock-data/categories.ts b/mock-data/categories.ts deleted file mode 100644 index cb29376..0000000 --- a/mock-data/categories.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { ICategory } from "../src/store/types"; - -export const mockCategories: ICategory[] = [ - { - id: 0, - title: "Подарунки та благодійність (подарунки родичам та друзям, пожертвування)", - type_of_outlay: "income", - owner: 1 - }, - { - id: 1, - title: "Розваги (кінотеатри, концерти, музеї, ігри)", - type_of_outlay: "expense", - owner: 1 - }, - { - id: 2, - title: "Техніка та електроніка (комп\'ютери, смартфони, планшети)", - type_of_outlay: "expense", - owner: 1 - }, -]; diff --git a/mock-data/doughnutCharts.ts b/mock-data/doughnutCharts.ts deleted file mode 100644 index e469574..0000000 --- a/mock-data/doughnutCharts.ts +++ /dev/null @@ -1,9 +0,0 @@ -export const mockData = ["30", "25", '20', "15", "10"] - -export const mockLabels = [ - "Подарунки та благодійність", - "Охорона здоров'я та краса", - "Їжа та напої", - "Електроніка та техніка", - "Комунальні послуги" -] \ No newline at end of file diff --git a/mock-data/options.ts b/mock-data/options.ts deleted file mode 100644 index 53c6191..0000000 --- a/mock-data/options.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { IOption } from "../types/atoms"; -import { mockCategories } from "./categories"; - -export const mockOptions: IOption[] = []; - -for (let i = 0; i < mockCategories?.length; i++) { - const title = mockCategories[i].title - mockOptions.push({ - value: title, - label: title - }); -} diff --git a/mock-data/transactions.ts b/mock-data/transactions.ts deleted file mode 100644 index 3d7a4a6..0000000 --- a/mock-data/transactions.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { Transactions } from "../src/store/types"; - -export const mockTransactions: Transactions = { - "2023-04-07": [ - { - id: 14, - owner: 1, - wallet: 0, - title: "title", - category: 3, - description: "string", - type_of_outlay: "expense", - amount_of_funds: "7193", - created: "2023-04-07T21:01:49.424000Z" - }, - { - id: 15, - owner: 1, - wallet: 3, - title: "string", - category: 4, - description: "string", - type_of_outlay: "income", - amount_of_funds: "714.54", - created: "2023-04-05T17:01:49.424000Z" - } - ], - "2023-06-07": [ - { - id: 16, - owner: 1, - wallet: 1, - title: "string", - category: 1, - description: "string", - type_of_outlay: "expense", - amount_of_funds: "3114.79", - created: "2023-06-07T23:01:49.424000Z" - }, - ], -}; \ No newline at end of file diff --git a/mock-data/wallets.ts b/mock-data/wallets.ts deleted file mode 100644 index 166e7e0..0000000 --- a/mock-data/wallets.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { IWallet } from "../src/store/types"; - -export const mockWallets: IWallet[] = [ - { - id: 0, - title: "Готівка", - amount: "13248.26", - type_of_account: "cash", - owner: 1 - }, - { - id: 1, - title: "Приват", - amount: "3042.65", - type_of_account: "bank", - owner: 1 - }, - { - id: 2, - title: "Моно", - amount: "5346.70", - type_of_account: "bank", - owner: 1 - }, - { - id: 3, - title: "Ощад", - amount: "346", - type_of_account: "bank", - owner: 1 - }, - { - id: 4, - title: "Альфа", - amount: "2314.35", - type_of_account: "bank", - owner: 1 - }, -]; \ No newline at end of file diff --git a/src/api/api.ts b/src/api/api.ts index 97fbfb2..5634423 100644 --- a/src/api/api.ts +++ b/src/api/api.ts @@ -1,7 +1,7 @@ -import { Store } from '@reduxjs/toolkit'; import axios, { InternalAxiosRequestConfig } from 'axios'; +import { Store } from '@reduxjs/toolkit'; -import { IUser } from "../store/types"; +import { IUser } from '../../types/user'; export const BASE_URL = "https://prod.wallet.cloudns.ph:8800"; export const REGISTER_PATH = "/accounts/register/"; diff --git a/src/components/atoms/box/Box.styled.ts b/src/components/atoms/box/Box.styled.ts index 30b4125..492cd07 100644 --- a/src/components/atoms/box/Box.styled.ts +++ b/src/components/atoms/box/Box.styled.ts @@ -1,6 +1,27 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; -import { BoxProps } from "../../../../types/atoms"; + +import { commonStyles, commonStylesProps } from "../../../shared/styles/commonStyles"; + +type BoxProps = commonStylesProps & { + border?: string; + borderTop?: string; + borderRight?: string; + borderLeft?: string; + borderBottom?: string; + borderRadius?: string; + + maxWidth?: string; + maxHeight?: string; + textAlign?: string; + background?: string; + position?: string; + zIndex?: string; + height?: string; + flexDirection?: string; + flex?: string; + flexBasis?: string; + overflow?: string; +} export const Box = styled.div` ${commonStyles}; @@ -13,11 +34,11 @@ export const Box = styled.div` max-width: ${({ maxWidth }) => maxWidth || undefined}; max-height: ${({ maxHeight }) => maxHeight || undefined}; text-align: ${({ textAlign }) => textAlign || 'left'}; - background: ${({ background }) => background || undefined}; // + background: ${({ background }) => background || undefined}; position: ${({ position }) => position || "static"}; z-index: ${({ zIndex }) => zIndex || 0}; - height: ${({ height }) => height || undefined}; // + height: ${({ height }) => height || undefined}; flex-direction: ${({ flexDirection }) => flexDirection || undefined}; - flex: ${({ flex }) => flex || undefined}; // + flex: ${({ flex }) => flex || undefined}; flex-basis: ${({ flexBasis }) => flexBasis || undefined}; ` \ No newline at end of file diff --git a/src/components/atoms/button/Button.styled.ts b/src/components/atoms/button/Button.styled.ts index 9b2a1c7..2ad6bfa 100644 --- a/src/components/atoms/button/Button.styled.ts +++ b/src/components/atoms/button/Button.styled.ts @@ -1,10 +1,14 @@ import styled, { css } from "styled-components" -import { commonStyles } from "../../../shared/styles/commonStyles" +import { commonStyles, commonStylesProps } from "../../../shared/styles/commonStyles" import COLORS from "../../../shared/styles/variables" -import { ButtonProps } from "../../../../types/atoms" +type ButtonProps = commonStylesProps & { + primary?: boolean + secondary?: boolean + disabled?: boolean +} export const buttonStyles = css` ${({ primary, secondary, disabled }) => ` diff --git a/src/components/atoms/container/Container.styled.ts b/src/components/atoms/container/Container.styled.ts index 441409e..5ba37db 100644 --- a/src/components/atoms/container/Container.styled.ts +++ b/src/components/atoms/container/Container.styled.ts @@ -1,5 +1,9 @@ import styled from "styled-components"; -import { ContainerProps } from "../../../../types/atoms"; + +type ContainerProps = { + display?: string; + overflowX?: string; +} export const Container = styled.div` display: ${({ display }) => display || undefined}; diff --git a/src/components/atoms/form/Form.styled.ts b/src/components/atoms/form/Form.styled.ts index 58c038d..cfb2fc6 100644 --- a/src/components/atoms/form/Form.styled.ts +++ b/src/components/atoms/form/Form.styled.ts @@ -1,16 +1,21 @@ import styled from "styled-components"; -import {commonStyles} from "../../../shared/styles/commonStyles"; +import { commonStyles } from "../../../shared/styles/commonStyles"; import COLORS from '../../../shared/styles/variables'; -import { FormProps } from "../../../../types/atoms"; +type FormProps = { + maxWidth?: string; + textAlign?: string; + color?: string; + alignItems?: string; +} export const Form = styled.form` ${commonStyles}; - max-width: ${({maxWidth}) => maxWidth || undefined}; - text-align: ${({textAlign}) => textAlign || undefined}; - color: ${({color}) => color || COLORS.WHITE}; - align-items: ${({alignItems}) => alignItems || undefined}; + max-width: ${({ maxWidth }) => maxWidth || undefined}; + text-align: ${({ textAlign }) => textAlign || undefined}; + color: ${({ color }) => color || COLORS.WHITE}; + align-items: ${({ alignItems }) => alignItems || undefined}; ` \ No newline at end of file diff --git a/src/components/atoms/img/Img.styled.ts b/src/components/atoms/img/Img.styled.ts index 3bd5afe..7b8a547 100644 --- a/src/components/atoms/img/Img.styled.ts +++ b/src/components/atoms/img/Img.styled.ts @@ -1,5 +1,16 @@ import styled from "styled-components"; -import { ImgProps } from "../../../../types/atoms"; + +type ImgProps = { + maxWidth?: string; + maxHeight?: string; + position?: string; + zIndex?: string; + top?: string; + left?: string; + m?: string; + p?: string; + display?: string; +} export const Img = styled.img` max-width: ${({maxWidth}) => maxWidth || undefined}; diff --git a/src/components/atoms/label/Label.styled.ts b/src/components/atoms/label/Label.styled.ts index a1d3f61..a5c66cd 100644 --- a/src/components/atoms/label/Label.styled.ts +++ b/src/components/atoms/label/Label.styled.ts @@ -1,7 +1,8 @@ import styled from "styled-components"; + import { commonStyles } from "../../../shared/styles/commonStyles"; -export const Label = styled.label` +export const Label = styled.label` font-size: 16px; font-weight: 500; display: block; diff --git a/src/components/atoms/link/Link.styled.ts b/src/components/atoms/link/Link.styled.ts index 21944d0..5ead228 100644 --- a/src/components/atoms/link/Link.styled.ts +++ b/src/components/atoms/link/Link.styled.ts @@ -1,6 +1,24 @@ -import styled from "styled-components"; import { Link as RouterLink } from 'react-router-dom'; -import { LinkProps } from "../../../../types/atoms"; + +import styled from "styled-components"; + +type LinkProps = { + fw?: string; + fz?: string; + padding?: string; + borderRadius?: string; + border?: string; + cursor?: string; + background?: string; + color?: string; + textDecor?: string; + lh?: string; + width?: string; + height?: string; + mb?: string; + m?: string; + outline?: string; +} export const Link = styled(RouterLink) ` font-weight: ${({ fw }) => fw || "700px"}; diff --git a/src/components/atoms/list/List.styled.ts b/src/components/atoms/list/List.styled.ts index 0c6c941..10af3af 100644 --- a/src/components/atoms/list/List.styled.ts +++ b/src/components/atoms/list/List.styled.ts @@ -1,4 +1,5 @@ import styled from 'styled-components'; + import { commonStyles } from '../../../shared/styles/commonStyles'; export const List = styled.ul` diff --git a/src/components/atoms/list/ListItem.styled.ts b/src/components/atoms/list/ListItem.styled.ts index 041fd37..2eb342b 100644 --- a/src/components/atoms/list/ListItem.styled.ts +++ b/src/components/atoms/list/ListItem.styled.ts @@ -1,4 +1,5 @@ import styled from "styled-components"; + import { commonStyles } from "../../../shared/styles/commonStyles"; export const ListItem = styled.li` diff --git a/src/components/atoms/typography/Typography.styled.ts b/src/components/atoms/typography/Typography.styled.ts index 3e66e59..3c72828 100644 --- a/src/components/atoms/typography/Typography.styled.ts +++ b/src/components/atoms/typography/Typography.styled.ts @@ -1,6 +1,12 @@ import styled, { css } from 'styled-components'; -import { commonStyles } from '../../../shared/styles/commonStyles'; -import { TypographyProps } from '../../../../types/atoms'; + +import { commonStyles, commonStylesProps } from '../../../shared/styles/commonStyles'; + +type TypographyProps = commonStylesProps & { + textAlign?: string; + letterSpacing?: string; + lh?: string; +} export const Typography = styled.p(props => { const { diff --git a/src/components/molecules/category/Category.tsx b/src/components/molecules/category/Category.tsx index 6d91696..f169e17 100644 --- a/src/components/molecules/category/Category.tsx +++ b/src/components/molecules/category/Category.tsx @@ -9,7 +9,11 @@ import ExpenseIcon from "../../../shared/assets/icons/expense.svg" import COLORS from "../../../shared/styles/variables"; -import { CategoryProps } from "../../../../types/molecules"; +import { ICategory } from "../../../../types/category"; + +type CategoryProps = { + category: ICategory; +} const Category: React.FC = ({ category }) => { const { activeCategory } = useAppSelector(state => state.category) diff --git a/src/components/molecules/charts/lineChartConfig.ts b/src/components/molecules/charts/lineChartConfig.ts index 1f8e39d..9d16ad9 100644 --- a/src/components/molecules/charts/lineChartConfig.ts +++ b/src/components/molecules/charts/lineChartConfig.ts @@ -2,7 +2,8 @@ import { ChartData, ChartOptions } from "chart.js"; import COLORS from "../../../shared/styles/variables"; -import { FilterByDaysOptions, Transactions } from "../../../store/types"; +import { Transactions } from "../../../../types/transactions"; +import { FilterByDaysOptions } from "../../../../types/common"; export const generateLabels = ( categoryTransactions: Transactions, diff --git a/src/components/molecules/popup/Popup.styled.ts b/src/components/molecules/popup/Popup.styled.ts index 7245b8f..e7e2f8e 100644 --- a/src/components/molecules/popup/Popup.styled.ts +++ b/src/components/molecules/popup/Popup.styled.ts @@ -1,6 +1,7 @@ import styled from 'styled-components' import { blackSVGtoWhite } from '../../../shared/styles/iconStyles' + import { Box } from '../../atoms/box/Box.styled' import COLORS from '../../../shared/styles/variables' diff --git a/src/components/molecules/popup/PopupEditWallet.tsx b/src/components/molecules/popup/PopupEditWallet.tsx index 385ee83..b2da1dd 100644 --- a/src/components/molecules/popup/PopupEditWallet.tsx +++ b/src/components/molecules/popup/PopupEditWallet.tsx @@ -29,7 +29,7 @@ import CrossIcon from './../../../shared/assets/icons/cross.svg'; import COLORS from "../../../shared/styles/variables"; -import { IWallet, WalletFormData } from "../../../store/types"; +import { IWallet, WalletFormData } from "../../../../types/wallet"; const PopupEditWallet: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx index e95982a..2d9d968 100644 --- a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx @@ -23,7 +23,7 @@ import BankdataInfoMessage from "./BankdataInfoMessage"; import COLORS from "../../../../shared/styles/variables"; -import { IBankData } from "../../../../store/types"; +import { IBankData } from "../../../../../types/bankdata"; const AddBankDataTab: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/molecules/popup/add-wallet/AddWalletTab.tsx b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx index ab614c7..26232ec 100644 --- a/src/components/molecules/popup/add-wallet/AddWalletTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx @@ -26,7 +26,7 @@ import BaseField from "../../base-field/BaseField"; import COLORS from "../../../../shared/styles/variables"; -import { IWallet, WalletFormData } from "../../../../store/types"; +import { IWallet, WalletFormData } from "../../../../../types/wallet"; const AddWalletTab: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx index 1240422..60789bb 100644 --- a/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx +++ b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx @@ -7,7 +7,9 @@ import PackageErrorIcon from "../../../../shared/assets/icons/package-error.svg" import COLORS from "../../../../shared/styles/variables"; -import { MessageProps } from "../../../../../types/molecules"; +type MessageProps = { + message: "success" | "error" +} const BankdataInfoMessage: React.FC = ({ message }) => { return ( diff --git a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx index b242fe6..80f4789 100644 --- a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx +++ b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx @@ -24,7 +24,7 @@ import BaseField from './../../base-field/BaseField'; import COLORS from "../../../../shared/styles/variables"; -import { PasswordChangeFormData } from "../../../../store/types"; +import { PasswordChangeFormData } from "../../../../../types/user"; const ChangePasswordTab: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/molecules/popup/edit-profile/EditProfileTab.tsx b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx index e3f9155..de9ec04 100644 --- a/src/components/molecules/popup/edit-profile/EditProfileTab.tsx +++ b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx @@ -20,9 +20,10 @@ import { Box } from "../../../atoms/box/Box.styled"; import { Button } from "../../../atoms/button/Button.styled"; import BaseField from "../../base-field/BaseField"; -import { IUser } from "../../../../store/types"; import COLORS from "../../../../shared/styles/variables"; +import { IUser } from "../../../../../types/user"; + const EditProfileTab: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/molecules/select/Select.tsx b/src/components/molecules/select/Select.tsx index b17708a..6dee657 100644 --- a/src/components/molecules/select/Select.tsx +++ b/src/components/molecules/select/Select.tsx @@ -1,9 +1,8 @@ -import ReactSelect, { StylesConfig } from 'react-select' - import COLORS from '../../../shared/styles/variables'; -import { SelectOptions } from '../../../../types/molecules'; +import ReactSelect, { StylesConfig } from 'react-select'; import { FieldError, FieldErrorsImpl, Merge } from 'react-hook-form'; +import { SelectOptions } from '../../../../types/common'; type SelectProps = { value: SelectOptions; diff --git a/src/components/molecules/tabs/filter/TabFilter.tsx b/src/components/molecules/tabs/filter/TabFilter.tsx index 5d610d5..9eaffd6 100644 --- a/src/components/molecules/tabs/filter/TabFilter.tsx +++ b/src/components/molecules/tabs/filter/TabFilter.tsx @@ -5,15 +5,7 @@ import { TabFilterWrapper } from "./TabFilter.styled"; import COLORS from '../../../../shared/styles/variables'; -import { TypeOfOutlay } from '../../../../store/types'; - -export interface IFilterButton { - filterBy: string; - onTabClick: () => void; - buttonName: string; - isActive: boolean; - typeOfOutlay?: TypeOfOutlay | ""; -}; +import { IFilterButton } from '../../../../../types/common'; type TabFilterProps = { filterButtons: IFilterButton[]; diff --git a/src/components/molecules/tabs/switch/TabSwitch.tsx b/src/components/molecules/tabs/switch/TabSwitch.tsx index 1a18462..9720083 100644 --- a/src/components/molecules/tabs/switch/TabSwitch.tsx +++ b/src/components/molecules/tabs/switch/TabSwitch.tsx @@ -5,13 +5,9 @@ import { TabSwitchWrapper } from "./TabSwitch.styled"; import COLORS from "../../../../shared/styles/variables"; -export interface ISwitchButton { - buttonName: string; - onTabClick: () => void; - isActive: boolean; -}; +import { ISwitchButton } from "../../../../../types/common"; -export type TabSwitchProps = { +type TabSwitchProps = { switchButtons: ISwitchButton[]; }; diff --git a/src/components/molecules/transaction/Transaction.tsx b/src/components/molecules/transaction/Transaction.tsx index aac8cc4..e02f372 100644 --- a/src/components/molecules/transaction/Transaction.tsx +++ b/src/components/molecules/transaction/Transaction.tsx @@ -11,9 +11,9 @@ import ExpenseIcon from "../../../shared/assets/icons/expense.svg" import COLORS from '../../../shared/styles/variables'; -import { ITransaction } from "../../../store/types"; +import { ITransaction } from '../../../../types/transactions'; -export type TransactionProps = { +type TransactionProps = { transaction: ITransaction; onClick?: () => void; isTransactionsPage?: boolean; diff --git a/src/components/molecules/wallet/Wallet.tsx b/src/components/molecules/wallet/Wallet.tsx index 4f7931c..c2b496e 100644 --- a/src/components/molecules/wallet/Wallet.tsx +++ b/src/components/molecules/wallet/Wallet.tsx @@ -6,9 +6,9 @@ import SettingsWalletIcon from '../../../shared/assets/icons/settings-wallet.svg import COLORS from "../../../shared/styles/variables"; -import { IWallet } from "../../../store/types"; +import { IWallet } from "../../../../types/wallet"; -export type WalletProps = { +type WalletProps = { wallet: IWallet; onWalletClick: () => void; isActive: boolean; diff --git a/src/components/pages/categories/Categories.tsx b/src/components/pages/categories/Categories.tsx index c34b58e..b8de3a8 100644 --- a/src/components/pages/categories/Categories.tsx +++ b/src/components/pages/categories/Categories.tsx @@ -17,7 +17,7 @@ import TabFilter from "../../molecules/tabs/filter/TabFilter"; import COLORS from "../../../shared/styles/variables"; -import { ICategory } from "../../../store/types"; +import { ICategory } from "../../../../types/category"; const Categories: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/categories/CategoriesPage.styled.ts b/src/components/pages/categories/CategoriesPage.styled.ts index 0417247..1670c6b 100644 --- a/src/components/pages/categories/CategoriesPage.styled.ts +++ b/src/components/pages/categories/CategoriesPage.styled.ts @@ -1,4 +1,5 @@ import styled from "styled-components"; + import { Box } from "../../atoms/box/Box.styled"; export const CategoriesPageWrapper = styled(Box)` diff --git a/src/components/pages/data/DataEntryPage.tsx b/src/components/pages/data/DataEntryPage.tsx index e86aa1f..ce512f1 100644 --- a/src/components/pages/data/DataEntryPage.tsx +++ b/src/components/pages/data/DataEntryPage.tsx @@ -25,7 +25,7 @@ import InterfaceImage from "../../../shared/assets/images/interface-image-full.p import COLORS from "../../../shared/styles/variables"; -import { DataEntryFormData } from "../../../store/types"; +import { DataEntryFormData } from "../../../../types/user"; const DataEntryPage: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/pages/home/Statistics.tsx b/src/components/pages/home/Statistics.tsx index dd2eb04..84d2807 100644 --- a/src/components/pages/home/Statistics.tsx +++ b/src/components/pages/home/Statistics.tsx @@ -12,7 +12,7 @@ import DoughnutChart from "../../molecules/charts/DoughnutChart"; import COLORS from "../../../shared/styles/variables"; -import { ICategoryWithTotalAmount } from "../../../store/types"; +import { ICategoryWithTotalAmount } from "../../../../types/category"; const Statistics: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/home/Transitions.tsx b/src/components/pages/home/Transitions.tsx index a2ff449..3dd0029 100644 --- a/src/components/pages/home/Transitions.tsx +++ b/src/components/pages/home/Transitions.tsx @@ -1,5 +1,4 @@ import { useAppSelector } from "../../../store/hooks"; -import { ITransaction, Transactions } from "../../../store/types"; import { filterTransactions } from "../../../shared/utils/transactions/filterTransactions"; import { @@ -14,6 +13,8 @@ import Transaction from "../../molecules/transaction/Transaction"; import COLORS from "../../../shared/styles/variables"; +import { ITransaction, Transactions } from "../../../../types/transactions"; + const renderTransactionItems = (transactions: ITransaction[]): React.ReactNode[] => { return transactions .sort((a, b) => new Date(b.created).getTime() - new Date(a.created).getTime()) diff --git a/src/components/pages/home/Wallets.tsx b/src/components/pages/home/Wallets.tsx index 1457597..6676e1c 100644 --- a/src/components/pages/home/Wallets.tsx +++ b/src/components/pages/home/Wallets.tsx @@ -14,7 +14,7 @@ import Wallet from "../../molecules/wallet/Wallet"; import COLORS from "../../../shared/styles/variables"; -import { IWallet } from "../../../store/types"; +import { IWallet } from "../../../../types/wallet"; const Wallets: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/pages/login/LoginPage.tsx b/src/components/pages/login/LoginPage.tsx index 9ee0a3c..ad37956 100644 --- a/src/components/pages/login/LoginPage.tsx +++ b/src/components/pages/login/LoginPage.tsx @@ -5,7 +5,6 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { loginUser } from "../../../store/userSlice"; -import { LoginFormData } from "../../../store/types"; import { emailFieldRules } from "../../../shared/utils/field-rules/email"; import { passwordInputRules } from "../../../shared/utils/field-rules/password"; @@ -24,6 +23,8 @@ import InterfaceImage from "../../../shared/assets/images/interface-image-full.p import COLORS from "../../../shared/styles/variables"; +import { LoginFormData } from "../../../../types/user"; + const LoginPage: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/register/RegisterPage.tsx b/src/components/pages/register/RegisterPage.tsx index 6af0a41..1dbec8e 100644 --- a/src/components/pages/register/RegisterPage.tsx +++ b/src/components/pages/register/RegisterPage.tsx @@ -26,7 +26,7 @@ import InterfaceImage from "../../../shared/assets/images/interface-image-full.p import COLORS from "../../../shared/styles/variables"; -import { RegisterFormData } from "../../../store/types"; +import { RegisterFormData } from "../../../../types/user"; const RegisterPage: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/statistics/DoughnutChartSection.tsx b/src/components/pages/statistics/DoughnutChartSection.tsx index 05185b5..7007a83 100644 --- a/src/components/pages/statistics/DoughnutChartSection.tsx +++ b/src/components/pages/statistics/DoughnutChartSection.tsx @@ -12,7 +12,7 @@ import { calculateTotalAmount } from "../../../shared/utils/statistics/calculate import COLORS from "../../../shared/styles/variables"; -import { ICategoryWithTotalAmount } from "../../../store/types"; +import { ICategoryWithTotalAmount } from "../../../../types/category"; const DoughnutChartsSection: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/statistics/LineChartSection.tsx b/src/components/pages/statistics/LineChartSection.tsx index 301bbea..6499ac0 100644 --- a/src/components/pages/statistics/LineChartSection.tsx +++ b/src/components/pages/statistics/LineChartSection.tsx @@ -13,7 +13,7 @@ import Select from "../../molecules/select/Select"; import COLORS from "../../../shared/styles/variables"; -import { SelectOptions } from "../../../../types/molecules"; +import { SelectOptions } from "../../../../types/common"; const LineChartSection: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/statistics/StatisticsHeader.tsx b/src/components/pages/statistics/StatisticsHeader.tsx index a17558c..bb4e5e4 100644 --- a/src/components/pages/statistics/StatisticsHeader.tsx +++ b/src/components/pages/statistics/StatisticsHeader.tsx @@ -8,7 +8,7 @@ import TabFilter from "../../molecules/tabs/filter/TabFilter"; import COLORS from "../../../shared/styles/variables"; -import { IFilterButton } from "../../molecules/tabs/filter/TabFilter"; +import { IFilterButton } from "../../../../types/common"; const StatisticsHeader: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/statistics/StatisticsPage.styled.ts b/src/components/pages/statistics/StatisticsPage.styled.ts index 3cb0e73..c3b247d 100644 --- a/src/components/pages/statistics/StatisticsPage.styled.ts +++ b/src/components/pages/statistics/StatisticsPage.styled.ts @@ -1,4 +1,5 @@ import styled from "styled-components"; + import { Box } from "../../atoms/box/Box.styled"; export const StatisticsPageWrapper = styled(Box)` diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index 67fe26f..b5eb15a 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -35,9 +35,12 @@ import DatePicker from './DatePicker'; import COLORS from '../../../shared/styles/variables'; -import { IWallet, TypeOfOutlay } from "../../../store/types"; -import { SelectOptions } from '../../../../types/molecules'; -import { ISwitchButton } from "../../molecules/tabs/switch/TabSwitch"; +import { IWallet } from '../../../../types/wallet'; +import { + ISwitchButton, + SelectOptions, + TypeOfOutlay +} from '../../../../types/common'; const AddTransaction: React.FC = () => { const dispatch = useAppDispatch() diff --git a/src/components/pages/transactions/Transactions.tsx b/src/components/pages/transactions/Transactions.tsx index 279ee90..e75ac89 100644 --- a/src/components/pages/transactions/Transactions.tsx +++ b/src/components/pages/transactions/Transactions.tsx @@ -8,9 +8,7 @@ import { import useFilterButtonOptions from "../../../shared/hooks/useFilterButtonOptions"; import { filterTransactions } from "../../../shared/utils/transactions/filterTransactions"; -import { - formatTransactionDateToFullDate -} from "../../../shared/utils/transactions/formatTransactionDate"; +import { formatTransactionDateToFullDate } from "../../../shared/utils/transactions/formatTransactionDate"; import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; @@ -22,7 +20,7 @@ import TabFilter from "../../molecules/tabs/filter/TabFilter"; import COLORS from "../../../shared/styles/variables"; -import { ITransaction, Transactions } from "../../../store/types"; +import { ITransaction, Transactions } from "../../../../types/transactions"; const renderTransactionItems = ( transactions: ITransaction[], diff --git a/src/consts/consts.ts b/src/consts/consts.ts deleted file mode 100644 index 2f40e5d..0000000 --- a/src/consts/consts.ts +++ /dev/null @@ -1 +0,0 @@ -export const isDev: boolean = false; \ No newline at end of file diff --git a/src/shared/hooks/useFilterButtonOptions.tsx b/src/shared/hooks/useFilterButtonOptions.tsx index 46adf02..a514772 100644 --- a/src/shared/hooks/useFilterButtonOptions.tsx +++ b/src/shared/hooks/useFilterButtonOptions.tsx @@ -9,8 +9,7 @@ import { getFilteredCategories } from "../../store/categorySlice"; -import { IFilterButton } from "../../components/molecules/tabs/filter/TabFilter"; -import { TypeOfOutlay } from "../../store/types"; +import { IFilterButton, TypeOfOutlay } from "../../../types/common"; const useFilterButtonOptions = (type: "category" | "transaction"): IFilterButton[] => { const dispatch = useAppDispatch(); diff --git a/src/shared/hooks/useSwitchButtonOptions.tsx b/src/shared/hooks/useSwitchButtonOptions.tsx index 7d84185..2b9b0c3 100644 --- a/src/shared/hooks/useSwitchButtonOptions.tsx +++ b/src/shared/hooks/useSwitchButtonOptions.tsx @@ -1,8 +1,9 @@ +import { ActionCreatorWithPayload } from "@reduxjs/toolkit"; + import { useAppDispatch } from "../../store/hooks"; -import { ISwitchButton } from "../../components/molecules/tabs/switch/TabSwitch"; -import { ICategory, TypeOfOutlay } from "../../store/types"; -import { ActionCreatorWithPayload } from "@reduxjs/toolkit"; +import { ICategory } from "../../../types/category"; +import { ISwitchButton, TypeOfOutlay } from "../../../types/common"; const useSwitchButtonOptions = ( data: ICategory, diff --git a/src/shared/utils/field-rules/password.ts b/src/shared/utils/field-rules/password.ts index c7ae05d..e765396 100644 --- a/src/shared/utils/field-rules/password.ts +++ b/src/shared/utils/field-rules/password.ts @@ -1,4 +1,5 @@ import { FieldValues, UseFormWatch } from "react-hook-form"; + import { passwordRegex } from "../regexes"; type ConfirmPasswordInputRules = { diff --git a/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts index f3bb47e..8bf9195 100644 --- a/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts +++ b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts @@ -1,4 +1,5 @@ -import { ICategory, ICategoryWithTotalAmount, Transactions } from "../../../store/types" +import { ICategory, ICategoryWithTotalAmount } from "../../../../types/category"; +import { Transactions } from "../../../../types/transactions"; export const calculateCategoriesWithTotalAmount = ( categories: ICategory[], diff --git a/src/shared/utils/statistics/calculateTotalAmount.ts b/src/shared/utils/statistics/calculateTotalAmount.ts index dd6d23e..90d3f4f 100644 --- a/src/shared/utils/statistics/calculateTotalAmount.ts +++ b/src/shared/utils/statistics/calculateTotalAmount.ts @@ -1,4 +1,4 @@ -import { Transactions } from "../../../store/types"; +import { Transactions } from "../../../../types/transactions"; export const calculateTotalAmount = (allTransactions: Transactions): string => { const transactionAmounts = Object.values(allTransactions).flatMap(transactionsArr => { diff --git a/src/shared/utils/statistics/generateNewLineChartData.ts b/src/shared/utils/statistics/generateNewLineChartData.ts index 3c00e9a..a5d908e 100644 --- a/src/shared/utils/statistics/generateNewLineChartData.ts +++ b/src/shared/utils/statistics/generateNewLineChartData.ts @@ -1,4 +1,4 @@ -import { Transactions } from "../../../store/types"; +import { Transactions } from "../../../../types/transactions"; export const generateNewLineChartData = (categoryTransactions: Transactions): { diffInDays: number, diff --git a/src/shared/utils/store/updateCategories.ts b/src/shared/utils/store/updateCategories.ts index 3e96398..f8faadd 100644 --- a/src/shared/utils/store/updateCategories.ts +++ b/src/shared/utils/store/updateCategories.ts @@ -1,7 +1,6 @@ import { PayloadAction } from "@reduxjs/toolkit"; -import { CategoryState } from "../../../store/categorySlice"; -import { ICategory } from "../../../store/types"; +import { CategoryState, ICategory } from "../../../../types/category"; export const updateCategories = ( state: CategoryState, diff --git a/src/shared/utils/store/updateChartCategories.ts b/src/shared/utils/store/updateChartCategories.ts index 2618318..83a468f 100644 --- a/src/shared/utils/store/updateChartCategories.ts +++ b/src/shared/utils/store/updateChartCategories.ts @@ -1,7 +1,7 @@ import { PayloadAction } from "@reduxjs/toolkit"; -import { StatisticsState } from "../../../store/statisticsSlice"; -import { ICategory } from "../../../store/types"; +import { StatisticsState } from "../../../../types/statistics"; +import { ICategory } from "../../../../types/category"; export const updateChartCategories = ( state: StatisticsState, diff --git a/src/shared/utils/store/updateChartCategoryTransactions.ts b/src/shared/utils/store/updateChartCategoryTransactions.ts index f0b0da8..4f8253d 100644 --- a/src/shared/utils/store/updateChartCategoryTransactions.ts +++ b/src/shared/utils/store/updateChartCategoryTransactions.ts @@ -1,7 +1,8 @@ import { PayloadAction } from "@reduxjs/toolkit"; -import { StatisticsState } from "../../../store/statisticsSlice"; -import { Transactions, TypeOfOutlay } from "../../../store/types"; +import { TypeOfOutlay } from "../../../../types/common"; +import { Transactions } from "../../../../types/transactions"; +import { StatisticsState } from "../../../../types/statistics"; export const updateChartCategoryTransactions = ( state: StatisticsState, diff --git a/src/shared/utils/store/updateChartTransactions.ts b/src/shared/utils/store/updateChartTransactions.ts index 74713de..20a415d 100644 --- a/src/shared/utils/store/updateChartTransactions.ts +++ b/src/shared/utils/store/updateChartTransactions.ts @@ -1,7 +1,7 @@ import { PayloadAction } from "@reduxjs/toolkit"; -import { StatisticsState } from "../../../store/statisticsSlice"; -import { Transactions } from "../../../store/types"; +import { StatisticsState } from "../../../../types/statistics"; +import { Transactions } from "../../../../types/transactions"; export const updateChartTransactions = ( state: StatisticsState, diff --git a/src/shared/utils/store/updateTransactions.ts b/src/shared/utils/store/updateTransactions.ts index e7b9160..6ccc997 100644 --- a/src/shared/utils/store/updateTransactions.ts +++ b/src/shared/utils/store/updateTransactions.ts @@ -1,7 +1,6 @@ import { PayloadAction } from "@reduxjs/toolkit"; -import { TransactionState } from "../../../store/transactionSlice"; -import { Transactions } from "../../../store/types"; +import { TransactionState, Transactions } from "../../../../types/transactions"; export const updateTransactions = ( state: TransactionState, diff --git a/src/shared/utils/transactions/filterTransactions.ts b/src/shared/utils/transactions/filterTransactions.ts index a7d4aad..6d603e2 100644 --- a/src/shared/utils/transactions/filterTransactions.ts +++ b/src/shared/utils/transactions/filterTransactions.ts @@ -1,4 +1,4 @@ -import { Transactions } from "../../../store/types"; +import { Transactions } from "../../../../types/transactions"; export function filterTransactions(filteredTransactions: Transactions): Transactions { const sortedTransactions: Transactions = {}; diff --git a/src/shared/utils/transactions/formatTransactionDate.ts b/src/shared/utils/transactions/formatTransactionDate.ts index a0ebad9..f97b077 100644 --- a/src/shared/utils/transactions/formatTransactionDate.ts +++ b/src/shared/utils/transactions/formatTransactionDate.ts @@ -16,7 +16,6 @@ export function formatTransactionDateToFullDate(dateStr: string): string { return `${capitalizedDayOfWeek}, ${dayOfMonthAndMonthName}`; } - export function formatTransactionDateToUTC(date: Date): string { const newDate = new Date(date); diff --git a/src/shared/utils/transactions/setSelectOptions.ts b/src/shared/utils/transactions/setSelectOptions.ts index 07ba9e3..195f46b 100644 --- a/src/shared/utils/transactions/setSelectOptions.ts +++ b/src/shared/utils/transactions/setSelectOptions.ts @@ -1,5 +1,5 @@ -import { SelectOptions } from '../../../../types/molecules'; -import { ICategory, TypeOfOutlay } from '../../../store/types'; +import { ICategory } from "../../../../types/category"; +import { SelectOptions, TypeOfOutlay } from "../../../../types/common"; export const setSelectOptions = ( typeOfOutlay: TypeOfOutlay, diff --git a/src/store/bankDataSlice.ts b/src/store/bankDataSlice.ts index 9217978..19d7c1c 100644 --- a/src/store/bankDataSlice.ts +++ b/src/store/bankDataSlice.ts @@ -1,10 +1,9 @@ import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; import { $api, BANK_DATA_PATH } from '../api/api'; +import { IBankData } from '../../types/bankdata'; -import { IBankData } from './types'; - -export type BankDataState = { +type BankDataState = { isLoading: boolean; error: string | null; bankData: IBankData[]; diff --git a/src/store/categorySlice.ts b/src/store/categorySlice.ts index 61d8228..c92fd5c 100644 --- a/src/store/categorySlice.ts +++ b/src/store/categorySlice.ts @@ -1,33 +1,13 @@ import { createSlice, createAsyncThunk, } from '@reduxjs/toolkit'; import { getUserDetails } from './userSlice'; -import { FilterByTypeOfOutlayOptions } from './transactionSlice'; import { updateCategories } from '../shared/utils/store/updateCategories'; import { $api, CATEGORY_PATH } from '../api/api'; -import { ICategory, MethodTypes } from './types'; - -export type CategoryState = { - filterByTypeOfOutlay: FilterByTypeOfOutlayOptions; - categories: { - all: ICategory[]; - income: ICategory[]; - expense: ICategory[]; - }; - totalIncomes: string; - totalExpenses: string; - activeCategory: ICategory; - addCategoryData: ICategory; - editCategoryData: ICategory; - isLoading: boolean; - error: string | null; - isAddCategorySuccess: boolean; - isEditCategorySuccess: boolean; - isDeleteCategorySuccess: boolean; - isEditCategoryOpen: boolean; -} +import { CategoryState, ICategory } from '../../types/category'; +import { MethodTypes } from '../../types/common'; type CategoryActionPayload = { method: MethodTypes; diff --git a/src/store/statisticsSlice.ts b/src/store/statisticsSlice.ts index a6771d1..893e462 100644 --- a/src/store/statisticsSlice.ts +++ b/src/store/statisticsSlice.ts @@ -9,33 +9,10 @@ import { updateChartCategoryTransactions } from '../shared/utils/store/updateCha import { $api, TRANSACTION_PATH } from '../api/api'; -import { - FilterByDaysOptions, - ICategory, - Transactions, - TypeOfOutlay -} from './types'; - -type DoughnutChartData = { - allTransactions: Transactions; - categoryTransactions: Transactions[]; - categories: ICategory[]; - data: string[], - totalAmount: string, -}; - -export type StatisticsState = { - filterByDays: FilterByDaysOptions; - incomesChart: DoughnutChartData; - expensesChart: DoughnutChartData; - allOutlaysChart: { - allTransactions: Transactions; - activeCategoryId: number; - categoryTransactions: Transactions; - }; - isLoading: boolean; - error: string | null; -}; +import { Transactions } from '../../types/transactions'; +import { ICategory } from '../../types/category'; +import { TypeOfOutlay } from '../../types/common'; +import { StatisticsState } from '../../types/statistics'; export const getFilteredCategoryTransactions = createAsyncThunk< { data: Transactions[], chartType: TypeOfOutlay }, diff --git a/src/store/transactionSlice.ts b/src/store/transactionSlice.ts index 40d1e24..cd00525 100644 --- a/src/store/transactionSlice.ts +++ b/src/store/transactionSlice.ts @@ -6,27 +6,8 @@ import { updateTransactions } from '../shared/utils/store/updateTransactions'; import { $api, TRANSACTION_PATH } from '../api/api'; -import { ITransaction, MethodTypes, Transactions } from './types'; - -export type FilterByTypeOfOutlayOptions = "all" | "income" | "expense"; - -export type TransactionState = { - filterByTypeOfOutlay: FilterByTypeOfOutlayOptions; - transactions: { - all: Transactions; - income: Transactions; - expense: Transactions; - }; - activeTransaction: ITransaction; - addTransactionData: ITransaction; - editTransactionData: ITransaction; - isLoading: boolean; - error: string | null; - isAddTransactionSuccess: boolean; - isEditTransactionSuccess: boolean; - isDeleteTransactionSuccess: boolean; - isEditTransactionOpen: boolean; -} +import { MethodTypes } from '../../types/common'; +import { ITransaction, TransactionState, Transactions } from '../../types/transactions'; type TransactionActionPayload = { method: MethodTypes; diff --git a/src/store/types.ts b/src/store/types.ts deleted file mode 100644 index c24f98c..0000000 --- a/src/store/types.ts +++ /dev/null @@ -1,120 +0,0 @@ -export type MethodTypes = "GET" | "POST" | "PUT" | "PATCH" | "DELETE"; - -export type FilterByDaysOptions = "30" | "90" | "180"; - -/* USER */ - -export interface IUser { - id?: number, - first_name: string, - last_name: string, - email?: string, - is_confirm_email?: boolean, - token?: string; -} - -export type RegisterFormData = { - first_name: string, - last_name: string, - email: string, - password: string, - password2: string, -} - -export type LoginFormData = { - email: string, - password: string, -} - -export type LoginResponse = { - user_id: string; - email: string; - token: string; -} - -export interface DataEntryFormData { - availableCash: string; - cardAccountName: string; - amountAccount: string; - userId?: number; -} - -export type NewPasswordFormData = { - uuid: string; - token: string; - password: string; -} - -/* WALLET */ - -export type TypeOfAccount = "cash" | "bank"; - -export interface IWallet { - id?: number, - title: string, - amount: string, - type_of_account: TypeOfAccount, - owner: number, -} - -export interface WalletFormData { - title: string, - amount: string, -} - -/* TRANSACTION */ - -export type TypeOfOutlay = "income" | "expense"; - -export interface ITransaction { - id?: number; - owner: number; - wallet: number; - category: number; - amount_of_funds: string; - type_of_outlay: TypeOfOutlay; - title?: string; - description?: string; - created: string; -} - -export type Transactions = { - [date: string]: ITransaction[]; -} - -export interface EditTransactionFormData { - name: string, - amount: string, -} - -export interface AddTransactionFormData { - name: string, - amount: string, -} - -/* CATEGORY */ - -export interface ICategory { - id?: number, - title: string, - type_of_outlay: TypeOfOutlay, - owner: number -} - -export interface ICategoryWithTotalAmount extends ICategory { - totalAmount: number; -} - -export interface IBankData { - id?: number; - owner: number; - wallettitle: string; - file: any; -} - -export interface PasswordChangeFormData { - old_password: string; - new_password: string; - new_password_2: string; -} - diff --git a/src/store/userSlice.ts b/src/store/userSlice.ts index 85d1f05..6307529 100644 --- a/src/store/userSlice.ts +++ b/src/store/userSlice.ts @@ -14,28 +14,15 @@ import { import { IUser, LoginFormData, - LoginResponse, PasswordChangeFormData, - RegisterFormData -} from './types'; + RegisterFormData, + UserState +} from '../../types/user'; -export type UserState = { - user: IUser; - isLoading: boolean; - isLoggedIn: boolean; - isLoggedOut: boolean; - isRegistered: boolean; - isAccountDeleted: boolean; - isProfileChanged: boolean; - isPasswordChanged: boolean; - loginError: string | null; - logoutError: string | null; - getDetailsError: string | null; - registerError: string | null; - deleteUserAccountError: string | null; - confirmEmailError: string | null; - profileChangeError: string | null; - passwordChangeError: string | null; +type LoginResponse = { + user_id: string; + email: string; + token: string; } export const registerUser = createAsyncThunk< diff --git a/src/store/walletSlice.ts b/src/store/walletSlice.ts index 91b7c36..181ff13 100644 --- a/src/store/walletSlice.ts +++ b/src/store/walletSlice.ts @@ -2,8 +2,9 @@ import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; import { $api, WALLET_PATH } from '../api/api'; -import { UserState } from './userSlice'; -import { DataEntryFormData, IWallet, MethodTypes } from './types'; +import { DataEntryFormData, UserState } from '../../types/user'; +import { MethodTypes } from '../../types/common'; +import { IWallet } from '../../types/wallet'; type WalletState = { wallets: IWallet[]; @@ -54,7 +55,11 @@ export const walletAction = createAsyncThunk< } ); -export const getWallets = createAsyncThunk( +export const getWallets = createAsyncThunk< + IWallet[], + undefined, + { rejectValue: string } +>( 'wallet/getWallets', async (_, { rejectWithValue }) => { try { diff --git a/types/atoms.ts b/types/atoms.ts deleted file mode 100644 index 564f4b8..0000000 --- a/types/atoms.ts +++ /dev/null @@ -1,81 +0,0 @@ -import { commonStylesProps } from "../src/shared/styles/commonStyles"; - -export type BoxProps = commonStylesProps & { - border?: string; - borderTop?: string; - borderRight?: string; - borderLeft?: string; - borderBottom?: string; - borderRadius?: string; - - maxWidth?: string; - maxHeight?: string; - textAlign?: string; - background?: string; // - position?: string; - zIndex?: string; - height?: string; // - flexDirection?: string; - flex?: string; // - flexBasis?: string; - overflow?: string; // -} - -export type ButtonProps = commonStylesProps & { - primary?: boolean - secondary?: boolean - disabled?: boolean -} - -export type FormProps = { - maxWidth?: string; - textAlign?: string; - color?: string; - alignItems?: string; -} - -export type LinkProps = { - fw?: string; - fz?: string; - padding?: string; - borderRadius?: string; - border?: string; - cursor?: string; - background?: string; - color?: string; - textDecor?: string; - lh?: string; - width?: string; - height?: string; - mb?: string; - m?: string; - outline?: string; -} - -export type ContainerProps = { - display?: string; - overflowX?: string; -} - -export type ImgProps = { - maxWidth?: string; - maxHeight?: string; - position?: string; - zIndex?: string; - top?: string; - left?: string; - m?: string; - p?: string; - display?: string; -} - -export type TypographyProps = commonStylesProps & { - textAlign?: string; - letterSpacing?: string; - lh?: string; -} - -export interface IOption { - value: string; - label: string; -} \ No newline at end of file diff --git a/types/bankdata.ts b/types/bankdata.ts new file mode 100644 index 0000000..e1ddb10 --- /dev/null +++ b/types/bankdata.ts @@ -0,0 +1,6 @@ +export interface IBankData { + id?: number; + owner: number; + wallettitle: string; + file: any; +} \ No newline at end of file diff --git a/types/category.ts b/types/category.ts new file mode 100644 index 0000000..4703d4b --- /dev/null +++ b/types/category.ts @@ -0,0 +1,32 @@ +import { FilterByTypeOfOutlayOptions, TypeOfOutlay } from "./common"; + +export interface ICategory { + id?: number, + title: string, + type_of_outlay: TypeOfOutlay, + owner: number +} + +export interface ICategoryWithTotalAmount extends ICategory { + totalAmount: number; +} + +export type CategoryState = { + filterByTypeOfOutlay: FilterByTypeOfOutlayOptions; + categories: { + all: ICategory[]; + income: ICategory[]; + expense: ICategory[]; + }; + totalIncomes: string; + totalExpenses: string; + activeCategory: ICategory; + addCategoryData: ICategory; + editCategoryData: ICategory; + isLoading: boolean; + error: string | null; + isAddCategorySuccess: boolean; + isEditCategorySuccess: boolean; + isDeleteCategorySuccess: boolean; + isEditCategoryOpen: boolean; +} \ No newline at end of file diff --git a/types/common.ts b/types/common.ts new file mode 100644 index 0000000..1ae80b3 --- /dev/null +++ b/types/common.ts @@ -0,0 +1,26 @@ +export type MethodTypes = "GET" | "POST" | "PUT" | "PATCH" | "DELETE"; + +export type FilterByDaysOptions = "30" | "90" | "180"; + +export type FilterByTypeOfOutlayOptions = "all" | "income" | "expense"; + +export type TypeOfOutlay = "income" | "expense"; + +export interface IFilterButton { + filterBy: string; + onTabClick: () => void; + buttonName: string; + isActive: boolean; + typeOfOutlay?: TypeOfOutlay | ""; +}; + +export interface ISwitchButton { + buttonName: string; + onTabClick: () => void; + isActive: boolean; +}; + +export type SelectOptions = { + value: number; + label: string; +} \ No newline at end of file diff --git a/types/molecules.ts b/types/molecules.ts deleted file mode 100644 index 7b8f736..0000000 --- a/types/molecules.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { ICategory, ITransaction } from "../src/store/types"; - -export type CategoryProps = { - category: ICategory; -} - -export type TransactionListProps = { - transactions: ITransaction[]; -} - -export type MessageProps = { - message: "success" | "error" -} - -export type SelectOptions = { - value: number; - label: string; -} \ No newline at end of file diff --git a/types/statistics.ts b/types/statistics.ts new file mode 100644 index 0000000..cda6b26 --- /dev/null +++ b/types/statistics.ts @@ -0,0 +1,24 @@ +import { FilterByDaysOptions } from "./common"; +import { Transactions } from "./transactions"; +import { ICategory } from "./category"; + +type DoughnutChartData = { + allTransactions: Transactions; + categoryTransactions: Transactions[]; + categories: ICategory[]; + data: string[], + totalAmount: string, +}; + +export type StatisticsState = { + filterByDays: FilterByDaysOptions; + incomesChart: DoughnutChartData; + expensesChart: DoughnutChartData; + allOutlaysChart: { + allTransactions: Transactions; + activeCategoryId: number; + categoryTransactions: Transactions; + }; + isLoading: boolean; + error: string | null; +}; \ No newline at end of file diff --git a/types/transactions.ts b/types/transactions.ts new file mode 100644 index 0000000..824f94d --- /dev/null +++ b/types/transactions.ts @@ -0,0 +1,35 @@ +import { FilterByTypeOfOutlayOptions, TypeOfOutlay } from "./common"; + +export interface ITransaction { + id?: number; + owner: number; + wallet: number; + category: number; + amount_of_funds: string; + type_of_outlay: TypeOfOutlay; + title?: string; + description?: string; + created: string; +} + +export type Transactions = { + [date: string]: ITransaction[]; +} + +export type TransactionState = { + filterByTypeOfOutlay: FilterByTypeOfOutlayOptions; + transactions: { + all: Transactions; + income: Transactions; + expense: Transactions; + }; + activeTransaction: ITransaction; + addTransactionData: ITransaction; + editTransactionData: ITransaction; + isLoading: boolean; + error: string | null; + isAddTransactionSuccess: boolean; + isEditTransactionSuccess: boolean; + isDeleteTransactionSuccess: boolean; + isEditTransactionOpen: boolean; +} \ No newline at end of file diff --git a/types/user.ts b/types/user.ts new file mode 100644 index 0000000..88807c1 --- /dev/null +++ b/types/user.ts @@ -0,0 +1,53 @@ +export interface IUser { + id?: number, + first_name: string, + last_name: string, + email?: string, + is_confirm_email?: boolean, + token?: string; +} + +export type UserState = { + user: IUser; + isLoading: boolean; + isLoggedIn: boolean; + isLoggedOut: boolean; + isRegistered: boolean; + isAccountDeleted: boolean; + isProfileChanged: boolean; + isPasswordChanged: boolean; + loginError: string | null; + logoutError: string | null; + getDetailsError: string | null; + registerError: string | null; + deleteUserAccountError: string | null; + confirmEmailError: string | null; + profileChangeError: string | null; + passwordChangeError: string | null; +} + +export type RegisterFormData = { + first_name: string, + last_name: string, + email: string, + password: string, + password2: string, +} + +export type LoginFormData = { + email: string, + password: string, +} + +export interface DataEntryFormData { + availableCash: string; + cardAccountName: string; + amountAccount: string; + userId?: number; +} + +export interface PasswordChangeFormData { + old_password: string; + new_password: string; + new_password_2: string; +} \ No newline at end of file diff --git a/types/wallet.ts b/types/wallet.ts new file mode 100644 index 0000000..55f2b36 --- /dev/null +++ b/types/wallet.ts @@ -0,0 +1,14 @@ +type TypeOfAccount = "cash" | "bank"; + +export interface IWallet { + id?: number, + title: string, + amount: string, + type_of_account: TypeOfAccount, + owner: number, +} + +export interface WalletFormData { + title: string, + amount: string, +} \ No newline at end of file diff --git a/webpack.config.ts b/webpack.config.ts index 75c84af..ac3dfd8 100644 --- a/webpack.config.ts +++ b/webpack.config.ts @@ -1,6 +1,7 @@ import path from 'path'; import { buildWebpacConfig } from './config/build/buildWebpackConfig'; -import { BuildEnv, BuildPaths } from './types/config'; + +import { BuildEnv, BuildPaths } from './config/types/types'; export default (env: BuildEnv) => { const mode = env.mode || 'development' From b620405cde3cf4b13597be1d237b6bc0b8ae8cce Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Tue, 4 Jul 2023 13:28:38 +0300 Subject: [PATCH 10/16] refactor: replace remaining function keywords --- config/build/buildDevServer.ts | 2 +- config/build/buildLoaders.ts | 2 +- config/build/buildPlugins.ts | 2 +- config/build/buildResolve.ts | 2 +- config/build/buildWebpackConfig.ts | 2 +- src/App.tsx | 2 +- .../molecules/transaction/Transaction.tsx | 2 +- src/components/pages/home/Transitions.tsx | 4 +--- .../utils/transactions/filterTransactions.ts | 24 ++++++++++++------- .../transactions/formatTransactionDate.ts | 6 ++--- .../transactions/formatTransactionTime.ts | 4 ++-- 11 files changed, 28 insertions(+), 24 deletions(-) diff --git a/config/build/buildDevServer.ts b/config/build/buildDevServer.ts index 2b19048..2426efd 100644 --- a/config/build/buildDevServer.ts +++ b/config/build/buildDevServer.ts @@ -2,7 +2,7 @@ import type { Configuration as DevServerConfiguration } from "webpack-dev-server import { BuildOptions } from "../types/types"; -export function buildDevServer(options: BuildOptions): DevServerConfiguration { +export const buildDevServer = (options: BuildOptions): DevServerConfiguration => { const { paths } = options return { diff --git a/config/build/buildLoaders.ts b/config/build/buildLoaders.ts index 48b4dee..59dab7b 100644 --- a/config/build/buildLoaders.ts +++ b/config/build/buildLoaders.ts @@ -3,7 +3,7 @@ import MiniCssExtractPlugin from "mini-css-extract-plugin"; import { BuildOptions } from '../types/types'; -export function buildLoaders({ isDev }: BuildOptions): webpack.RuleSetRule[] { +export const buildLoaders = ({ isDev }: BuildOptions): webpack.RuleSetRule[] => { const typescriptLoader = { test: /\.tsx?$/, use: 'ts-loader', diff --git a/config/build/buildPlugins.ts b/config/build/buildPlugins.ts index 3979408..be41e2f 100644 --- a/config/build/buildPlugins.ts +++ b/config/build/buildPlugins.ts @@ -5,7 +5,7 @@ import ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin'; import { BuildOptions } from "../types/types"; -export function buildPlugins(options: BuildOptions): webpack.WebpackPluginInstance[] { +export const buildPlugins = (options: BuildOptions): webpack.WebpackPluginInstance[] => { const { paths } = options const plugins = [ diff --git a/config/build/buildResolve.ts b/config/build/buildResolve.ts index 16f2400..6f5d60a 100644 --- a/config/build/buildResolve.ts +++ b/config/build/buildResolve.ts @@ -1,6 +1,6 @@ import webpack from 'webpack'; -export function buildResolve(): webpack.ResolveOptions { +export const buildResolve = (): webpack.ResolveOptions => { return { extensions: ['.tsx', '.ts', '.js'], } diff --git a/config/build/buildWebpackConfig.ts b/config/build/buildWebpackConfig.ts index a155a2c..4b4722e 100644 --- a/config/build/buildWebpackConfig.ts +++ b/config/build/buildWebpackConfig.ts @@ -7,7 +7,7 @@ import { buildDevServer } from './buildDevServer'; import { BuildOptions } from '../types/types'; -export function buildWebpacConfig(options: BuildOptions): webpack.Configuration { +export const buildWebpacConfig = (options: BuildOptions): webpack.Configuration => { const { paths, mode, isDev } = options return { diff --git a/src/App.tsx b/src/App.tsx index 40e370f..2ea1fbb 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -13,7 +13,7 @@ import CategoriesPage from './components/pages/categories/CategoriesPage'; import StatisticsPage from "./components/pages/statistics/StatisticsPage"; import NotFoundPage from "./components/pages/not-found/NotFoundPage"; -function App() { +const App = () => { const elements = useRoutes([ { path: '/', element: }, { path: '/welcome', element: }, diff --git a/src/components/molecules/transaction/Transaction.tsx b/src/components/molecules/transaction/Transaction.tsx index e02f372..339703f 100644 --- a/src/components/molecules/transaction/Transaction.tsx +++ b/src/components/molecules/transaction/Transaction.tsx @@ -1,6 +1,6 @@ import { useAppSelector } from '../../../store/hooks'; -import formatTransactionTime from '../../../shared/utils/transactions/formatTransactionTime'; +import { formatTransactionTime } from '../../../shared/utils/transactions/formatTransactionTime'; import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; diff --git a/src/components/pages/home/Transitions.tsx b/src/components/pages/home/Transitions.tsx index 3dd0029..84901d4 100644 --- a/src/components/pages/home/Transitions.tsx +++ b/src/components/pages/home/Transitions.tsx @@ -1,9 +1,7 @@ import { useAppSelector } from "../../../store/hooks"; import { filterTransactions } from "../../../shared/utils/transactions/filterTransactions"; -import { - formatTransactionDateToFullDate -} from "../../../shared/utils/transactions/formatTransactionDate"; +import { formatTransactionDateToFullDate } from "../../../shared/utils/transactions/formatTransactionDate"; import { Box } from "../../atoms/box/Box.styled"; import { List } from "../../atoms/list/List.styled"; diff --git a/src/shared/utils/transactions/filterTransactions.ts b/src/shared/utils/transactions/filterTransactions.ts index 6d603e2..c8ff9a3 100644 --- a/src/shared/utils/transactions/filterTransactions.ts +++ b/src/shared/utils/transactions/filterTransactions.ts @@ -1,15 +1,21 @@ import { Transactions } from "../../../../types/transactions"; -export function filterTransactions(filteredTransactions: Transactions): Transactions { +export const filterTransactions = (filteredTransactions: Transactions): Transactions => { const sortedTransactions: Transactions = {}; - Object.keys(filteredTransactions) - .sort((a, b) => new Date(b).getTime() - new Date(a).getTime()) - .forEach((date) => { - sortedTransactions[date] = filteredTransactions[date].slice().sort( - (a, b) => new Date(b.created).getTime() - new Date(a.created).getTime() - ); - }); + const sortedKeys = Object.keys(filteredTransactions).sort((a, b) => { + return new Date(b).getTime() - new Date(a).getTime() + }); + + sortedKeys.forEach((date) => { + const sortedItems = filteredTransactions[date] + .slice() + .sort((a, b) => { + return new Date(b.created).getTime() - new Date(a.created).getTime() + }); + + sortedTransactions[date] = sortedItems; + }); return sortedTransactions; -} \ No newline at end of file +}; \ No newline at end of file diff --git a/src/shared/utils/transactions/formatTransactionDate.ts b/src/shared/utils/transactions/formatTransactionDate.ts index f97b077..56f172a 100644 --- a/src/shared/utils/transactions/formatTransactionDate.ts +++ b/src/shared/utils/transactions/formatTransactionDate.ts @@ -1,4 +1,4 @@ -export function formatTransactionDateToFullDate(dateStr: string): string { +export const formatTransactionDateToFullDate = (dateStr: string): string => { const date = new Date(dateStr); date.setHours(date.getHours() + 3); @@ -16,7 +16,7 @@ export function formatTransactionDateToFullDate(dateStr: string): string { return `${capitalizedDayOfWeek}, ${dayOfMonthAndMonthName}`; } -export function formatTransactionDateToUTC(date: Date): string { +export const formatTransactionDateToUTC = (date: Date): string => { const newDate = new Date(date); const options = { @@ -35,7 +35,7 @@ export function formatTransactionDateToUTC(date: Date): string { return isoDate; } -export function formatTransactionDateToString(dateStr: string): Date { +export const formatTransactionDateToString = (dateStr: string): Date => { const utcDate = new Date(dateStr); utcDate.setUTCHours(utcDate.getUTCHours() + 3); diff --git a/src/shared/utils/transactions/formatTransactionTime.ts b/src/shared/utils/transactions/formatTransactionTime.ts index e850340..ff2eb60 100644 --- a/src/shared/utils/transactions/formatTransactionTime.ts +++ b/src/shared/utils/transactions/formatTransactionTime.ts @@ -1,4 +1,4 @@ -export default function formatTransactionTime(timestamp: string): string { +export const formatTransactionTime = (timestamp: string): string => { const date = new Date(timestamp); date.setHours(date.getHours() + 3); @@ -14,4 +14,4 @@ export default function formatTransactionTime(timestamp: string): string { const time = formatter.format(date); return time; -} +} \ No newline at end of file From 9a789909843d20287818747ed3b953a9bf7ea244 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Tue, 4 Jul 2023 17:15:40 +0300 Subject: [PATCH 11/16] refactor: remove inline styles --- src/components/atoms/button/ButtonPopup.ts | 6 +++--- src/components/atoms/input/Input.styled.ts | 2 +- .../molecules/base-field/BaseField.tsx | 19 +++++++++--------- .../popup/add-wallet/AddBankdataTab.tsx | 2 +- .../popup/add-wallet/PopupAddWallet.tsx | 18 ++++++++--------- .../popup/edit-profile/PopupEditProfile.tsx | 20 ++++++++----------- src/shared/styles/commonStyles.ts | 10 ++++++++++ 7 files changed, 41 insertions(+), 36 deletions(-) diff --git a/src/components/atoms/button/ButtonPopup.ts b/src/components/atoms/button/ButtonPopup.ts index ee8d3c5..0f61d1e 100644 --- a/src/components/atoms/button/ButtonPopup.ts +++ b/src/components/atoms/button/ButtonPopup.ts @@ -2,15 +2,15 @@ import styled from 'styled-components'; import COLORS from '../../../shared/styles/variables'; -export const ButtonPopup = styled.button` +export const ButtonPopup = styled.button<{ isActive: boolean }>` color: ${props => props.color || COLORS.ALMOST_BLACK_FOR_TEXT}; - font-weight: 400; + font-weight: ${props => props.isActive ? "700" : "400"}; font-size: 12px; width: 188px; height: 37px; text-align: center; background: ${COLORS.BASE_1}; border: none; - border-bottom: 2px solid ${COLORS.DIVIDER}; + border-bottom: 2px solid ${props => props.isActive ? COLORS.PRIMARY_HOVER : COLORS.DIVIDER}; cursor: pointer; ` \ No newline at end of file diff --git a/src/components/atoms/input/Input.styled.ts b/src/components/atoms/input/Input.styled.ts index 9eba3c3..0f1cc7c 100644 --- a/src/components/atoms/input/Input.styled.ts +++ b/src/components/atoms/input/Input.styled.ts @@ -6,8 +6,8 @@ import COLORS from '../../../shared/styles/variables'; export const Input = styled.input` width: 100%; - ${commonStyles}; padding: 12px 16px; + ${commonStyles} border-radius: 10px; font-weight: 400; font-size: 16px; diff --git a/src/components/molecules/base-field/BaseField.tsx b/src/components/molecules/base-field/BaseField.tsx index 1f7155e..3d0166a 100644 --- a/src/components/molecules/base-field/BaseField.tsx +++ b/src/components/molecules/base-field/BaseField.tsx @@ -1,6 +1,7 @@ import { Box } from "../../atoms/box/Box.styled"; import { Label } from "../../atoms/label/Label.styled"; import { Input } from "../../atoms/input/Input.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; import VisibilityOff from "../../../shared/assets/icons/visibility-off.svg"; import VisibilityOn from "../../../shared/assets/icons/visibility-on.svg"; @@ -51,28 +52,28 @@ const BaseField: React.FC = ({ mb="6px" textAlight="left" > + {label} {fieldType === "password" && ( - setIsPasswordVisible(!isPasswordVisible)} - style={{ - position: "absolute", - top: "16px", - right: "10px", - cursor: "pointer" - }} > {isPasswordVisible ? : } - + )} { ref={inputFileRef} onChange={(e) => setFileValue(e.target.files[0])} multiple={false} - style={{ display: "none" }} + display="none" /> {error && } diff --git a/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx index 6aa30ff..1609451 100644 --- a/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx +++ b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx @@ -64,18 +64,16 @@ const PopupAddWallet: React.FC = () => { Додати картковий рахунок - setIsAddWalletManuallyOpen(true)} - style={{ - fontWeight: isAddWalletManuallyOpen && "700", - borderBottom: isAddWalletManuallyOpen && `2px solid ${COLORS.PRIMARY_HOVER}` - }}> + setIsAddWalletManuallyOpen(true)} + isActive={isAddWalletManuallyOpen} + > Ввести дані вручну - setIsAddWalletManuallyOpen(false)} - style={{ - fontWeight: !isAddWalletManuallyOpen && "700", - borderBottom: !isAddWalletManuallyOpen && `2px solid ${COLORS.PRIMARY_HOVER}` - }}> + setIsAddWalletManuallyOpen(false)} + isActive={!isAddWalletManuallyOpen} + > Завантажити дані з файлу diff --git a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx index d395050..60c4fd4 100644 --- a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx +++ b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx @@ -15,8 +15,6 @@ import ChangePasswordTab from "./ChangePasswordTab"; import CrossIcon from '../../../../shared/assets/icons/cross.svg'; -import COLORS from "../../../../shared/styles/variables"; - const PopupEditProfile: React.FC = () => { const { setIsEditProfilePopupOpen, @@ -64,18 +62,16 @@ const PopupEditProfile: React.FC = () => { - setIsEditProfileTabOpen(true)} - style={{ - fontWeight: isEditProfileTabOpen && "700", - borderBottom: isEditProfileTabOpen && `2px solid ${COLORS.PRIMARY_HOVER}` - }}> + setIsEditProfileTabOpen(true)} + isActive={isEditProfileTabOpen} + > Дані користувача - setIsEditProfileTabOpen(false)} - style={{ - fontWeight: !isEditProfileTabOpen && "700", - borderBottom: !isEditProfileTabOpen && `2px solid ${COLORS.PRIMARY_HOVER}` - }}> + setIsEditProfileTabOpen(false)} + isActive={!isEditProfileTabOpen} + > Зміна паролю diff --git a/src/shared/styles/commonStyles.ts b/src/shared/styles/commonStyles.ts index 771a6e3..9347866 100644 --- a/src/shared/styles/commonStyles.ts +++ b/src/shared/styles/commonStyles.ts @@ -36,6 +36,11 @@ export type commonStylesProps = { borderRadius?: string; tabindex?: string; border?: string; + top?: string; + bottom?: string; + left?: string; + right?: string; + cursor?: string; } export const commonStyles = css` @@ -73,4 +78,9 @@ export const commonStyles = css` border-radius: ${({ borderRadius }) => borderRadius || undefined}; tabindex: ${({ tabindex }) => tabindex || undefined}; border: ${({ border }) => border || undefined}; + top: ${({ top }) => top || undefined}; + bottom: ${({ bottom }) => bottom || undefined}; + left: ${({ left }) => left || undefined}; + right: ${({ right }) => right || undefined}; + cursor: ${({ cursor }) => cursor || undefined}; ` \ No newline at end of file From 289bbb87c34eae5981659de7420c21db09bd88d5 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Tue, 4 Jul 2023 21:03:31 +0300 Subject: [PATCH 12/16] feat: add eslint with prettier --- .eslintignore | 22 + .eslintrc.json | 41 + .prettierignore | 22 + .prettierrc.json | 7 + commitlint.config.js | 2 +- package.json | 13 +- src/components/pages/login/LoginPage.tsx | 203 ++-- yarn.lock | 1224 +++++++++++++++++++++- 8 files changed, 1425 insertions(+), 109 deletions(-) create mode 100644 .eslintignore create mode 100644 .eslintrc.json create mode 100644 .prettierignore create mode 100644 .prettierrc.json diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..703fff4 --- /dev/null +++ b/.eslintignore @@ -0,0 +1,22 @@ +# dependencies +node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# production +/build + +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local +.idea/ + +npm-debug.log* +yarn-debug.log* +yarn-error.log* diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..7e3c16c --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,41 @@ +{ + "env": { + "browser": true, + "es2021": true + }, + "extends": ["airbnb", "prettier", "plugin:import/typescript"], + "parserOptions": { + "ecmaVersion": "latest", + "sourceType": "module", + "parser": "@typescript-eslint/parser" + }, + "parser": "@typescript-eslint/parser", + "plugins": ["@typescript-eslint", "prettier"], + "rules": { + "semi": ["error", "always"], + "prettier/prettier": ["error", { "endOfLine": "auto" }], + "react/react-in-jsx-scope": "off", + "react/jsx-filename-extension": [ + "warn", + { "extensions": [".js", ".jsx", ".ts", ".tsx"] } + ], + "no-undef": "off", + "import/extensions": [ + "error", + "ignorePackages", + { + "js": "never", + "jsx": "never", + "ts": "never", + "tsx": "never" + } + ], + "react/function-component-definition": [ + "error", + { + "namedComponents": "arrow-function", + "unnamedComponents": "arrow-function" + } + ] + } +} diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..703fff4 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,22 @@ +# dependencies +node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# production +/build + +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local +.idea/ + +npm-debug.log* +yarn-debug.log* +yarn-error.log* diff --git a/.prettierrc.json b/.prettierrc.json new file mode 100644 index 0000000..ac2b587 --- /dev/null +++ b/.prettierrc.json @@ -0,0 +1,7 @@ +{ + "semi": true, + "singleQuote": false, + "tabWidth": 2, + "useTabs": false, + "jsxBracketSameLine": true +} diff --git a/commitlint.config.js b/commitlint.config.js index 33a7b5c..5073c20 100644 --- a/commitlint.config.js +++ b/commitlint.config.js @@ -1 +1 @@ -module.exports = { extends: ['@commitlint/config-conventional'] } \ No newline at end of file +module.exports = { extends: ["@commitlint/config-conventional"] }; diff --git a/package.json b/package.json index 9447624..bef83c4 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,8 @@ "dev": "webpack serve --env mode=development --https", "build:dev": "webpack --env mode=development", "build:prod": "webpack --env mode=production", - "prepare": "husky install" + "prepare": "husky install", + "lint": "eslint . --fix" }, "keywords": [], "author": "", @@ -26,12 +27,22 @@ "@types/react-router-dom": "^5.3.3", "@types/styled-components": "^5.1.26", "@types/webpack": "^5.28.0", + "@typescript-eslint/eslint-plugin": "^5.61.0", + "@typescript-eslint/parser": "^5.61.0", "babel-loader": "^9.1.2", "css-loader": "^6.7.3", + "eslint": "^8.44.0", + "eslint-config-airbnb": "^19.0.4", + "eslint-config-prettier": "^8.8.0", + "eslint-plugin-import": "^2.27.5", + "eslint-plugin-jsx-a11y": "^6.7.1", + "eslint-plugin-prettier": "^4.2.1", + "eslint-plugin-react": "^7.32.2", "file-loader": "^6.2.0", "html-webpack-plugin": "^5.5.0", "husky": "^8.0.3", "mini-css-extract-plugin": "^2.7.3", + "prettier": "^2.8.8", "react-refresh": "^0.14.0", "style-loader": "^3.3.2", "ts-loader": "^9.4.2", diff --git a/src/components/pages/login/LoginPage.tsx b/src/components/pages/login/LoginPage.tsx index ad37956..e191120 100644 --- a/src/components/pages/login/LoginPage.tsx +++ b/src/components/pages/login/LoginPage.tsx @@ -9,12 +9,12 @@ import { loginUser } from "../../../store/userSlice"; import { emailFieldRules } from "../../../shared/utils/field-rules/email"; import { passwordInputRules } from "../../../shared/utils/field-rules/password"; -import { Box } from '../../atoms/box/Box.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { Img } from '../../atoms/img/Img.styled'; +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import { Img } from "../../atoms/img/Img.styled"; import { Container } from "../../atoms/container/Container.styled"; import { Form } from "../../atoms/form/Form.styled"; -import { Link } from '../../atoms/link/Link.styled'; +import { Link } from "../../atoms/link/Link.styled"; import { Button } from "../../atoms/button/Button.styled"; import BaseField from "../../molecules/base-field/BaseField"; @@ -26,96 +26,119 @@ import COLORS from "../../../shared/styles/variables"; import { LoginFormData } from "../../../../types/user"; const LoginPage: React.FC = () => { - const dispatch = useAppDispatch(); + const dispatch = useAppDispatch(); - const navigate = useNavigate(); + const navigate = useNavigate(); - const [showPassword, setShowPassword] = useState(false); + const [showPassword, setShowPassword] = useState(false); - const { loginError, isLoggedIn, isLoading } = useAppSelector(state => state.user) + const { loginError, isLoggedIn, isLoading } = useAppSelector( + (state) => state.user + ); - const handleSub = (data: LoginFormData) => { - dispatch(loginUser(data)); - } + const handleSub = (data: LoginFormData) => { + dispatch(loginUser(data)); + }; - const { - register, - formState: { errors, isValid }, - handleSubmit, - reset, - } = useForm({ mode: "all" }); - - useEffect(() => { - if (isLoggedIn) { - navigate('/home'); - reset(); - } - }, [isLoggedIn]); - - return ( - - - InterfaceImage - - - - Logo - - Вхід до вашого акаунту - - - - - - - - Забули пароль? - - - - - {loginError && - {loginError} - } - - - - + const { + register, + formState: { errors, isValid }, + handleSubmit, + reset, + } = useForm({ mode: "all" }); + + useEffect(() => { + if (isLoggedIn) { + navigate("/home"); + reset(); + } + }, [isLoggedIn]); + + return ( + + + InterfaceImage + + + + Logo + + Вхід до вашого акаунту + +
+ + + + + + Забули пароль? + + - - ) -} -export default LoginPage; \ No newline at end of file + {loginError && ( + + {loginError} + + )} + + +
+ + + + ); +}; + +export default LoginPage; diff --git a/yarn.lock b/yarn.lock index 4abe7eb..2d4bad9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,6 +2,11 @@ # yarn lockfile v1 +"@aashutoshrathi/word-wrap@^1.2.3": + version "1.2.6" + resolved "https://registry.yarnpkg.com/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz#bd9154aec9983f77b3a034ecaa015c2e4201f6cf" + integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA== + "@ampproject/remapping@^2.2.0": version "2.2.1" resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.2.1.tgz#99e8e11851128b8702cd57c33684f1d0f260b630" @@ -963,6 +968,13 @@ dependencies: regenerator-runtime "^0.13.11" +"@babel/runtime@^7.20.7": + version "7.22.6" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.22.6.tgz#57d64b9ae3cff1d67eb067ae117dac087f5bd438" + integrity sha512-wDb5pWm4WDdF6LFUde3Jl8WzPA+3ZbxYqkC6xAXuD3irdEHN1k0NfTRrJD8ZD378SJ61miMLCqIOXYhd8x+AJQ== + dependencies: + regenerator-runtime "^0.13.11" + "@babel/template@^7.18.10", "@babel/template@^7.20.7": version "7.20.7" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.20.7.tgz#a15090c2839a83b02aa996c0b4994005841fd5a8" @@ -1275,6 +1287,38 @@ resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.3.0.tgz#ea89004119dc42db2e1dba0f97d553f7372f6fcb" integrity sha512-AHPmaAx+RYfZz0eYu6Gviiagpmiyw98ySSlQvCUhVGDRtDFe4DBS0x1bSjdF3gqUDYOczB+yYvBTtEylYSdRhg== +"@eslint-community/eslint-utils@^4.2.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59" + integrity sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA== + dependencies: + eslint-visitor-keys "^3.3.0" + +"@eslint-community/regexpp@^4.4.0": + version "4.5.1" + resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.5.1.tgz#cdd35dce4fa1a89a4fd42b1599eb35b3af408884" + integrity sha512-Z5ba73P98O1KUYCCJTUeVpja9RcGoMdncZ6T49FCUl2lN38JtCJ+3WgIDBv0AuY4WChU5PmtJmOCTlN6FZTFKQ== + +"@eslint/eslintrc@^2.1.0": + version "2.1.0" + resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.1.0.tgz#82256f164cc9e0b59669efc19d57f8092706841d" + integrity sha512-Lj7DECXqIVCqnqjjHMPna4vn6GJcMgul/wuS0je9OZ9gsL0zzDpKPVtcG1HaDVc+9y+qgXneTeUMbCqXJNpH1A== + dependencies: + ajv "^6.12.4" + debug "^4.3.2" + espree "^9.6.0" + globals "^13.19.0" + ignore "^5.2.0" + import-fresh "^3.2.1" + js-yaml "^4.1.0" + minimatch "^3.1.2" + strip-json-comments "^3.1.1" + +"@eslint/js@8.44.0": + version "8.44.0" + resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.44.0.tgz#961a5903c74139390478bdc808bcde3fc45ab7af" + integrity sha512-Ag+9YM4ocKQx9AarydN0KY2j0ErMHNIocPDrVo8zAE44xLTjEtz81OdR68/cydGtk6m6jDb5Za3r2useMzYmSw== + "@floating-ui/core@^1.2.6": version "1.2.6" resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.2.6.tgz#d21ace437cc919cdd8f1640302fa8851e65e75c0" @@ -1292,6 +1336,25 @@ resolved "https://registry.yarnpkg.com/@hookform/resolvers/-/resolvers-3.1.0.tgz#ff83ef4aa6078173201da131ceea4c3583b67034" integrity sha512-z0A8K+Nxq+f83Whm/ajlwE6VtQlp/yPHZnXw7XWVPIGm1Vx0QV8KThU3BpbBRfAZ7/dYqCKKBNnQh85BkmBKkA== +"@humanwhocodes/config-array@^0.11.10": + version "0.11.10" + resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.10.tgz#5a3ffe32cc9306365fb3fd572596cd602d5e12d2" + integrity sha512-KVVjQmNUepDVGXNuoRRdmmEjruj0KfiGSbS8LVc12LMsWDQzRXJ0qdhN8L8uUigKpfEHRhlaQFY0ib1tnUbNeQ== + dependencies: + "@humanwhocodes/object-schema" "^1.2.1" + debug "^4.1.1" + minimatch "^3.0.5" + +"@humanwhocodes/module-importer@^1.0.1": + version "1.0.1" + resolved "https://registry.yarnpkg.com/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz#af5b2691a22b44be847b0ca81641c5fb6ad0172c" + integrity sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA== + +"@humanwhocodes/object-schema@^1.2.1": + version "1.2.1" + resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45" + integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA== + "@jridgewell/gen-mapping@^0.3.0", "@jridgewell/gen-mapping@^0.3.2": version "0.3.3" resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz#7e02e6eb5df901aaedb08514203b096614024098" @@ -1360,6 +1423,27 @@ resolved "https://registry.yarnpkg.com/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz#b2ac626d6cb9c8718ab459166d4bb405b8ffa78b" integrity sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A== +"@nodelib/fs.scandir@2.1.5": + version "2.1.5" + resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5" + integrity sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g== + dependencies: + "@nodelib/fs.stat" "2.0.5" + run-parallel "^1.1.9" + +"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2": + version "2.0.5" + resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz#5bd262af94e9d25bd1e71b05deed44876a222e8b" + integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A== + +"@nodelib/fs.walk@^1.2.3", "@nodelib/fs.walk@^1.2.8": + version "1.2.8" + resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz#e95737e8bb6746ddedf69c556953494f196fe69a" + integrity sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg== + dependencies: + "@nodelib/fs.scandir" "2.1.5" + fastq "^1.6.0" + "@pmmmwh/react-refresh-webpack-plugin@^0.5.10": version "0.5.10" resolved "https://registry.yarnpkg.com/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.10.tgz#2eba163b8e7dbabb4ce3609ab5e32ab63dda3ef8" @@ -1638,6 +1722,11 @@ resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.11.tgz#d421b6c527a3037f7c84433fd2c4229e016863d3" integrity sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ== +"@types/json5@^0.0.29": + version "0.0.29" + resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee" + integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ== + "@types/mime@*": version "3.0.1" resolved "https://registry.yarnpkg.com/@types/mime/-/mime-3.0.1.tgz#5f8f2bca0a5863cb69bc0b0acd88c96cb1d4ae10" @@ -1738,6 +1827,11 @@ resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.3.tgz#cef09e3ec9af1d63d2a6cc5b383a737e24e6dcf5" integrity sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ== +"@types/semver@^7.3.12": + version "7.5.0" + resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.0.tgz#591c1ce3a702c45ee15f47a42ade72c2fd78978a" + integrity sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw== + "@types/serve-index@^1.9.1": version "1.9.1" resolved "https://registry.yarnpkg.com/@types/serve-index/-/serve-index-1.9.1.tgz#1b5e85370a192c01ec6cec4735cf2917337a6278" @@ -1790,6 +1884,90 @@ dependencies: "@types/node" "*" +"@typescript-eslint/eslint-plugin@^5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.61.0.tgz#a1a5290cf33863b4db3fb79350b3c5275a7b1223" + integrity sha512-A5l/eUAug103qtkwccSCxn8ZRwT+7RXWkFECdA4Cvl1dOlDUgTpAOfSEElZn2uSUxhdDpnCdetrf0jvU4qrL+g== + dependencies: + "@eslint-community/regexpp" "^4.4.0" + "@typescript-eslint/scope-manager" "5.61.0" + "@typescript-eslint/type-utils" "5.61.0" + "@typescript-eslint/utils" "5.61.0" + debug "^4.3.4" + graphemer "^1.4.0" + ignore "^5.2.0" + natural-compare-lite "^1.4.0" + semver "^7.3.7" + tsutils "^3.21.0" + +"@typescript-eslint/parser@^5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-5.61.0.tgz#7fbe3e2951904bb843f8932ebedd6e0635bffb70" + integrity sha512-yGr4Sgyh8uO6fSi9hw3jAFXNBHbCtKKFMdX2IkT3ZqpKmtAq3lHS4ixB/COFuAIJpwl9/AqF7j72ZDWYKmIfvg== + dependencies: + "@typescript-eslint/scope-manager" "5.61.0" + "@typescript-eslint/types" "5.61.0" + "@typescript-eslint/typescript-estree" "5.61.0" + debug "^4.3.4" + +"@typescript-eslint/scope-manager@5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.61.0.tgz#b670006d069c9abe6415c41f754b1b5d949ef2b2" + integrity sha512-W8VoMjoSg7f7nqAROEmTt6LoBpn81AegP7uKhhW5KzYlehs8VV0ZW0fIDVbcZRcaP3aPSW+JZFua+ysQN+m/Nw== + dependencies: + "@typescript-eslint/types" "5.61.0" + "@typescript-eslint/visitor-keys" "5.61.0" + +"@typescript-eslint/type-utils@5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-5.61.0.tgz#e90799eb2045c4435ea8378cb31cd8a9fddca47a" + integrity sha512-kk8u//r+oVK2Aj3ph/26XdH0pbAkC2RiSjUYhKD+PExemG4XSjpGFeyZ/QM8lBOa7O8aGOU+/yEbMJgQv/DnCg== + dependencies: + "@typescript-eslint/typescript-estree" "5.61.0" + "@typescript-eslint/utils" "5.61.0" + debug "^4.3.4" + tsutils "^3.21.0" + +"@typescript-eslint/types@5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.61.0.tgz#e99ff11b5792d791554abab0f0370936d8ca50c0" + integrity sha512-ldyueo58KjngXpzloHUog/h9REmHl59G1b3a5Sng1GfBo14BkS3ZbMEb3693gnP1k//97lh7bKsp6/V/0v1veQ== + +"@typescript-eslint/typescript-estree@5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.61.0.tgz#4c7caca84ce95bb41aa585d46a764bcc050b92f3" + integrity sha512-Fud90PxONnnLZ36oR5ClJBLTLfU4pIWBmnvGwTbEa2cXIqj70AEDEmOmpkFComjBZ/037ueKrOdHuYmSFVD7Rw== + dependencies: + "@typescript-eslint/types" "5.61.0" + "@typescript-eslint/visitor-keys" "5.61.0" + debug "^4.3.4" + globby "^11.1.0" + is-glob "^4.0.3" + semver "^7.3.7" + tsutils "^3.21.0" + +"@typescript-eslint/utils@5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-5.61.0.tgz#5064838a53e91c754fffbddd306adcca3fe0af36" + integrity sha512-mV6O+6VgQmVE6+xzlA91xifndPW9ElFW8vbSF0xCT/czPXVhwDewKila1jOyRwa9AE19zKnrr7Cg5S3pJVrTWQ== + dependencies: + "@eslint-community/eslint-utils" "^4.2.0" + "@types/json-schema" "^7.0.9" + "@types/semver" "^7.3.12" + "@typescript-eslint/scope-manager" "5.61.0" + "@typescript-eslint/types" "5.61.0" + "@typescript-eslint/typescript-estree" "5.61.0" + eslint-scope "^5.1.1" + semver "^7.3.7" + +"@typescript-eslint/visitor-keys@5.61.0": + version "5.61.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.61.0.tgz#c79414fa42158fd23bd2bb70952dc5cdbb298140" + integrity sha512-50XQ5VdbWrX06mQXhy93WywSFZZGsv3EOjq+lqp6WC2t+j3mb6A9xYVdrRxafvK88vg9k9u+CT4l6D8PEatjKg== + dependencies: + "@typescript-eslint/types" "5.61.0" + eslint-visitor-keys "^3.3.0" + "@webassemblyjs/ast@1.11.5", "@webassemblyjs/ast@^1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.11.5.tgz#6e818036b94548c1fb53b754b5cae3c9b208281c" @@ -1957,6 +2135,11 @@ acorn-import-assertions@^1.7.6: resolved "https://registry.yarnpkg.com/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz#ba2b5939ce62c238db6d93d81c9b111b29b855e9" integrity sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw== +acorn-jsx@^5.3.2: + version "5.3.2" + resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937" + integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ== + acorn-walk@^8.1.1: version "8.2.0" resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.2.0.tgz#741210f2e2426454508853a2f44d0ab83b7f69c1" @@ -1967,6 +2150,11 @@ acorn@^8.4.1, acorn@^8.5.0, acorn@^8.7.1: resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.2.tgz#1b2f25db02af965399b9776b0c2c391276d37c4a" integrity sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw== +acorn@^8.9.0: + version "8.9.0" + resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.9.0.tgz#78a16e3b2bcc198c10822786fa6679e245db5b59" + integrity sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ== + ajv-formats@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/ajv-formats/-/ajv-formats-2.1.1.tgz#6e669400659eb74973bbf2e33327180a0996b520" @@ -1986,7 +2174,7 @@ ajv-keywords@^5.1.0: dependencies: fast-deep-equal "^3.1.3" -ajv@^6.12.5: +ajv@^6.10.0, ajv@^6.12.4, ajv@^6.12.5: version "6.12.6" resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4" integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g== @@ -2048,6 +2236,21 @@ argparse@^2.0.1: resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38" integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q== +aria-query@^5.1.3: + version "5.3.0" + resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.3.0.tgz#650c569e41ad90b51b3d7df5e5eed1c7549c103e" + integrity sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A== + dependencies: + dequal "^2.0.3" + +array-buffer-byte-length@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz#fabe8bc193fea865f317fe7807085ee0dee5aead" + integrity sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A== + dependencies: + call-bind "^1.0.2" + is-array-buffer "^3.0.1" + array-flatten@1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/array-flatten/-/array-flatten-1.1.1.tgz#9a5f699051b1e7073328f2a008968b64ea2955d2" @@ -2063,16 +2266,78 @@ array-ify@^1.0.0: resolved "https://registry.yarnpkg.com/array-ify/-/array-ify-1.0.0.tgz#9e528762b4a9066ad163a6962a364418e9626ece" integrity sha512-c5AMf34bKdvPhQ7tBGhqkgKNUzMr4WUs+WDtC2ZUGOUncbxKMTvqxYctiseW3+L4bA8ec+GcZ6/A/FW4m8ukng== +array-includes@^3.1.6: + version "3.1.6" + resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.6.tgz#9e9e720e194f198266ba9e18c29e6a9b0e4b225f" + integrity sha512-sgTbLvL6cNnw24FnbaDyjmvddQ2ML8arZsgaJhoABMoplz/4QRhtrYS+alr1BUM1Bwp6dhx8vVCBSLG+StwOFw== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + get-intrinsic "^1.1.3" + is-string "^1.0.7" + +array-union@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d" + integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw== + +array.prototype.flat@^1.3.1: + version "1.3.1" + resolved "https://registry.yarnpkg.com/array.prototype.flat/-/array.prototype.flat-1.3.1.tgz#ffc6576a7ca3efc2f46a143b9d1dda9b4b3cf5e2" + integrity sha512-roTU0KWIOmJ4DRLmwKd19Otg0/mT3qPNt0Qb3GWW8iObuZXxrjB/pzn0R3hqpRSWg4HCwqx+0vwOnWnvlOyeIA== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + es-shim-unscopables "^1.0.0" + +array.prototype.flatmap@^1.3.1: + version "1.3.1" + resolved "https://registry.yarnpkg.com/array.prototype.flatmap/-/array.prototype.flatmap-1.3.1.tgz#1aae7903c2100433cb8261cd4ed310aab5c4a183" + integrity sha512-8UGn9O1FDVvMNB0UlLv4voxRMze7+FpHyF5mSMRjWHUMlpoDViniy05870VlxhfgTnLbpuwTzvD76MTtWxB/mQ== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + es-shim-unscopables "^1.0.0" + +array.prototype.tosorted@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/array.prototype.tosorted/-/array.prototype.tosorted-1.1.1.tgz#ccf44738aa2b5ac56578ffda97c03fd3e23dd532" + integrity sha512-pZYPXPRl2PqWcsUs6LOMn+1f1532nEoPTYowBtqLwAW+W8vSVhkIGnmOX1t/UQjD6YGI0vcD2B1U7ZFGQH9jnQ== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + es-shim-unscopables "^1.0.0" + get-intrinsic "^1.1.3" + arrify@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d" integrity sha512-3CYzex9M9FGQjCGMGyi6/31c8GJbgb0qGyrx5HWxPd0aCwh4cB2YjMb2Xf9UuoogrMrlO9cTqnB5rI5GHZTcUA== +ast-types-flow@^0.0.7: + version "0.0.7" + resolved "https://registry.yarnpkg.com/ast-types-flow/-/ast-types-flow-0.0.7.tgz#f70b735c6bca1a5c9c22d982c3e39e7feba3bdad" + integrity sha512-eBvWn1lvIApYMhzQMsu9ciLfkBY499mFZlNqG+/9WR7PVlroQw0vG30cOQQbaKz3sCEc44TAOu2ykzqXSNnwag== + asynckit@^0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" integrity sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q== +available-typed-arrays@^1.0.5: + version "1.0.5" + resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz#92f95616501069d07d10edb2fc37d3e1c65123b7" + integrity sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw== + +axe-core@^4.6.2: + version "4.7.2" + resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.7.2.tgz#040a7342b20765cb18bb50b628394c21bccc17a0" + integrity sha512-zIURGIS1E1Q4pcrMjp+nnEh+16G56eG/MUllJH8yEvw7asDo7Ac9uhC9KIH5jzpITueEZolfYglnCGIuSBz39g== + axios@^1.3.4: version "1.3.6" resolved "https://registry.yarnpkg.com/axios/-/axios-1.3.6.tgz#1ace9a9fb994314b5f6327960918406fa92c6646" @@ -2082,6 +2347,13 @@ axios@^1.3.4: form-data "^4.0.0" proxy-from-env "^1.1.0" +axobject-query@^3.1.1: + version "3.2.1" + resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-3.2.1.tgz#39c378a6e3b06ca679f29138151e45b2b32da62a" + integrity sha512-jsyHu61e6N4Vbz/v18DHwWYKK0bSWLqn47eeDSKPB7m8tqMHF9YJ+mhIk2lVteyZrY8tnSj/jHOv4YiTCuCJgg== + dependencies: + dequal "^2.0.3" + babel-loader@^9.1.2: version "9.1.2" resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-9.1.2.tgz#a16a080de52d08854ee14570469905a5fc00d39c" @@ -2232,7 +2504,7 @@ bytes@3.1.2: resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.2.tgz#8b0beeb98605adf1b128fa4386403c009e0221a5" integrity sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg== -call-bind@^1.0.0: +call-bind@^1.0.0, call-bind@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c" integrity sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA== @@ -2291,7 +2563,7 @@ chalk@^2.0.0: escape-string-regexp "^1.0.5" supports-color "^5.3.0" -chalk@^4.1.0: +chalk@^4.0.0, chalk@^4.1.0: version "4.1.2" resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01" integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA== @@ -2460,6 +2732,11 @@ concat-map@0.0.1: resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b" integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg== +confusing-browser-globals@^1.0.10: + version "1.0.11" + resolved "https://registry.yarnpkg.com/confusing-browser-globals/-/confusing-browser-globals-1.0.11.tgz#ae40e9b57cdd3915408a2805ebd3a5585608dc81" + integrity sha512-JsPKdmh8ZkmnHxDk55FZ1TqVLvEQTvoByJZRN9jzI0UjxK/QgAmsphz7PGtqgPieQZ/CQcHWXCR7ATDNhGe+YA== + connect-history-api-fallback@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz#647264845251a0daf25b97ce87834cace0f5f1c8" @@ -2569,7 +2846,7 @@ create-require@^1.1.0: resolved "https://registry.yarnpkg.com/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333" integrity sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ== -cross-spawn@^7.0.3: +cross-spawn@^7.0.2, cross-spawn@^7.0.3: version "7.0.3" resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6" integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w== @@ -2647,6 +2924,11 @@ csstype@^3.0.2: resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b" integrity sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ== +damerau-levenshtein@^1.0.8: + version "1.0.8" + resolved "https://registry.yarnpkg.com/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz#b43d286ccbd36bc5b2f7ed41caf2d0aba1f8a6e7" + integrity sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA== + dargs@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/dargs/-/dargs-7.0.0.tgz#04015c41de0bcb69ec84050f3d9be0caf8d6d5cc" @@ -2664,7 +2946,14 @@ debug@2.6.9: dependencies: ms "2.0.0" -debug@^4.1.0, debug@^4.1.1: +debug@^3.2.7: + version "3.2.7" + resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a" + integrity sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ== + dependencies: + ms "^2.1.1" + +debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4: version "4.3.4" resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865" integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ== @@ -2684,6 +2973,11 @@ decamelize@^1.1.0: resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290" integrity sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA== +deep-is@^0.1.3: + version "0.1.4" + resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831" + integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ== + deepmerge@^4.2.2: version "4.3.1" resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-4.3.1.tgz#44b5f2147cd3b00d4b56137685966f26fd25dd4a" @@ -2701,6 +2995,14 @@ define-lazy-prop@^2.0.0: resolved "https://registry.yarnpkg.com/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz#3f7ae421129bcaaac9bc74905c98a0009ec9ee7f" integrity sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og== +define-properties@^1.1.3, define-properties@^1.1.4, define-properties@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.2.0.tgz#52988570670c9eacedd8064f4a990f2405849bd5" + integrity sha512-xvqAVKGfT1+UAvPwKTVw/njhdQ8ZhXK4lI0bCIuCMrp2up9nPnaDftrLtmpTazqd1o+UY4zgzU+avtMbDP+ldA== + dependencies: + has-property-descriptors "^1.0.0" + object-keys "^1.1.1" + delayed-stream@~1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" @@ -2716,6 +3018,11 @@ depd@~1.1.2: resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9" integrity sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ== +dequal@^2.0.3: + version "2.0.3" + resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be" + integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA== + destroy@1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/destroy/-/destroy-1.2.0.tgz#4803735509ad8be552934c67df614f94e66fa015" @@ -2731,6 +3038,13 @@ diff@^4.0.1: resolved "https://registry.yarnpkg.com/diff/-/diff-4.0.2.tgz#60f3aecb89d5fae520c11aa19efc2bb982aade7d" integrity sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A== +dir-glob@^3.0.1: + version "3.0.1" + resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-3.0.1.tgz#56dbf73d992a4a93ba1584f4534063fd2e41717f" + integrity sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA== + dependencies: + path-type "^4.0.0" + dns-equal@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/dns-equal/-/dns-equal-1.0.0.tgz#b39e7f1da6eb0a75ba9c17324b34753c47e0654d" @@ -2743,6 +3057,20 @@ dns-packet@^5.2.2: dependencies: "@leichtgewicht/ip-codec" "^2.0.1" +doctrine@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-2.1.0.tgz#5cd01fc101621b42c4cd7f5d1a66243716d3f39d" + integrity sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw== + dependencies: + esutils "^2.0.2" + +doctrine@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961" + integrity sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w== + dependencies: + esutils "^2.0.2" + dom-converter@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768" @@ -2818,6 +3146,11 @@ emoji-regex@^8.0.0: resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-8.0.0.tgz#e818fd69ce5ccfcb404594f842963bf53164cc37" integrity sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A== +emoji-regex@^9.2.2: + version "9.2.2" + resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-9.2.2.tgz#840c8803b0d8047f4ff0cf963176b32d4ef3ed72" + integrity sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg== + emojis-list@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78" @@ -2865,11 +3198,76 @@ error-stack-parser@^2.0.6: dependencies: stackframe "^1.3.4" +es-abstract@^1.19.0, es-abstract@^1.20.4: + version "1.21.2" + resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.21.2.tgz#a56b9695322c8a185dc25975aa3b8ec31d0e7eff" + integrity sha512-y/B5POM2iBnIxCiernH1G7rC9qQoM77lLIMQLuob0zhp8C56Po81+2Nj0WFKnd0pNReDTnkYryc+zhOzpEIROg== + dependencies: + array-buffer-byte-length "^1.0.0" + available-typed-arrays "^1.0.5" + call-bind "^1.0.2" + es-set-tostringtag "^2.0.1" + es-to-primitive "^1.2.1" + function.prototype.name "^1.1.5" + get-intrinsic "^1.2.0" + get-symbol-description "^1.0.0" + globalthis "^1.0.3" + gopd "^1.0.1" + has "^1.0.3" + has-property-descriptors "^1.0.0" + has-proto "^1.0.1" + has-symbols "^1.0.3" + internal-slot "^1.0.5" + is-array-buffer "^3.0.2" + is-callable "^1.2.7" + is-negative-zero "^2.0.2" + is-regex "^1.1.4" + is-shared-array-buffer "^1.0.2" + is-string "^1.0.7" + is-typed-array "^1.1.10" + is-weakref "^1.0.2" + object-inspect "^1.12.3" + object-keys "^1.1.1" + object.assign "^4.1.4" + regexp.prototype.flags "^1.4.3" + safe-regex-test "^1.0.0" + string.prototype.trim "^1.2.7" + string.prototype.trimend "^1.0.6" + string.prototype.trimstart "^1.0.6" + typed-array-length "^1.0.4" + unbox-primitive "^1.0.2" + which-typed-array "^1.1.9" + es-module-lexer@^1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-1.2.1.tgz#ba303831f63e6a394983fde2f97ad77b22324527" integrity sha512-9978wrXM50Y4rTMmW5kXIC09ZdXQZqkE4mxhwkd8VbzsGkXGPgV4zWuqQJgCEzYngdo2dYDa0l8xhX4fkSwJSg== +es-set-tostringtag@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/es-set-tostringtag/-/es-set-tostringtag-2.0.1.tgz#338d502f6f674301d710b80c8592de8a15f09cd8" + integrity sha512-g3OMbtlwY3QewlqAiMLI47KywjWZoEytKr8pf6iTC8uJq5bIAH52Z9pnQ8pVL6whrCto53JZDuUIsifGeLorTg== + dependencies: + get-intrinsic "^1.1.3" + has "^1.0.3" + has-tostringtag "^1.0.0" + +es-shim-unscopables@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/es-shim-unscopables/-/es-shim-unscopables-1.0.0.tgz#702e632193201e3edf8713635d083d378e510241" + integrity sha512-Jm6GPcCdC30eMLbZ2x8z2WuRwAws3zTBBKuusffYVUrNj/GVSUAZ+xKMaUpfNDR5IbyNA5LJbaecoUVbmUcB1w== + dependencies: + has "^1.0.3" + +es-to-primitive@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a" + integrity sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA== + dependencies: + is-callable "^1.1.4" + is-date-object "^1.0.1" + is-symbol "^1.0.2" + escalade@^3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.1.1.tgz#d8cfdc7000965c5a0174b4a82eaa5c0552742e40" @@ -2890,7 +3288,118 @@ escape-string-regexp@^4.0.0: resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34" integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA== -eslint-scope@5.1.1: +eslint-config-airbnb-base@^15.0.0: + version "15.0.0" + resolved "https://registry.yarnpkg.com/eslint-config-airbnb-base/-/eslint-config-airbnb-base-15.0.0.tgz#6b09add90ac79c2f8d723a2580e07f3925afd236" + integrity sha512-xaX3z4ZZIcFLvh2oUNvcX5oEofXda7giYmuplVxoOg5A7EXJMrUyqRgR+mhDhPK8LZ4PttFOBvCYDbX3sUoUig== + dependencies: + confusing-browser-globals "^1.0.10" + object.assign "^4.1.2" + object.entries "^1.1.5" + semver "^6.3.0" + +eslint-config-airbnb@^19.0.4: + version "19.0.4" + resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-19.0.4.tgz#84d4c3490ad70a0ffa571138ebcdea6ab085fdc3" + integrity sha512-T75QYQVQX57jiNgpF9r1KegMICE94VYwoFQyMGhrvc+lB8YF2E/M/PYDaQe1AJcWaEgqLE+ErXV1Og/+6Vyzew== + dependencies: + eslint-config-airbnb-base "^15.0.0" + object.assign "^4.1.2" + object.entries "^1.1.5" + +eslint-config-prettier@^8.8.0: + version "8.8.0" + resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.8.0.tgz#bfda738d412adc917fd7b038857110efe98c9348" + integrity sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA== + +eslint-import-resolver-node@^0.3.7: + version "0.3.7" + resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.7.tgz#83b375187d412324a1963d84fa664377a23eb4d7" + integrity sha512-gozW2blMLJCeFpBwugLTGyvVjNoeo1knonXAcatC6bjPBZitotxdWf7Gimr25N4c0AAOo4eOUfaG82IJPDpqCA== + dependencies: + debug "^3.2.7" + is-core-module "^2.11.0" + resolve "^1.22.1" + +eslint-module-utils@^2.7.4: + version "2.8.0" + resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.8.0.tgz#e439fee65fc33f6bba630ff621efc38ec0375c49" + integrity sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw== + dependencies: + debug "^3.2.7" + +eslint-plugin-import@^2.27.5: + version "2.27.5" + resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.27.5.tgz#876a6d03f52608a3e5bb439c2550588e51dd6c65" + integrity sha512-LmEt3GVofgiGuiE+ORpnvP+kAm3h6MLZJ4Q5HCyHADofsb4VzXFsRiWj3c0OFiV+3DWFh0qg3v9gcPlfc3zRow== + dependencies: + array-includes "^3.1.6" + array.prototype.flat "^1.3.1" + array.prototype.flatmap "^1.3.1" + debug "^3.2.7" + doctrine "^2.1.0" + eslint-import-resolver-node "^0.3.7" + eslint-module-utils "^2.7.4" + has "^1.0.3" + is-core-module "^2.11.0" + is-glob "^4.0.3" + minimatch "^3.1.2" + object.values "^1.1.6" + resolve "^1.22.1" + semver "^6.3.0" + tsconfig-paths "^3.14.1" + +eslint-plugin-jsx-a11y@^6.7.1: + version "6.7.1" + resolved "https://registry.yarnpkg.com/eslint-plugin-jsx-a11y/-/eslint-plugin-jsx-a11y-6.7.1.tgz#fca5e02d115f48c9a597a6894d5bcec2f7a76976" + integrity sha512-63Bog4iIethyo8smBklORknVjB0T2dwB8Mr/hIC+fBS0uyHdYYpzM/Ed+YC8VxTjlXHEWFOdmgwcDn1U2L9VCA== + dependencies: + "@babel/runtime" "^7.20.7" + aria-query "^5.1.3" + array-includes "^3.1.6" + array.prototype.flatmap "^1.3.1" + ast-types-flow "^0.0.7" + axe-core "^4.6.2" + axobject-query "^3.1.1" + damerau-levenshtein "^1.0.8" + emoji-regex "^9.2.2" + has "^1.0.3" + jsx-ast-utils "^3.3.3" + language-tags "=1.0.5" + minimatch "^3.1.2" + object.entries "^1.1.6" + object.fromentries "^2.0.6" + semver "^6.3.0" + +eslint-plugin-prettier@^4.2.1: + version "4.2.1" + resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz#651cbb88b1dab98bfd42f017a12fa6b2d993f94b" + integrity sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ== + dependencies: + prettier-linter-helpers "^1.0.0" + +eslint-plugin-react@^7.32.2: + version "7.32.2" + resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.32.2.tgz#e71f21c7c265ebce01bcbc9d0955170c55571f10" + integrity sha512-t2fBMa+XzonrrNkyVirzKlvn5RXzzPwRHtMvLAtVZrt8oxgnTQaYbU6SXTOO1mwQgp1y5+toMSKInnzGr0Knqg== + dependencies: + array-includes "^3.1.6" + array.prototype.flatmap "^1.3.1" + array.prototype.tosorted "^1.1.1" + doctrine "^2.1.0" + estraverse "^5.3.0" + jsx-ast-utils "^2.4.1 || ^3.0.0" + minimatch "^3.1.2" + object.entries "^1.1.6" + object.fromentries "^2.0.6" + object.hasown "^1.1.2" + object.values "^1.1.6" + prop-types "^15.8.1" + resolve "^2.0.0-next.4" + semver "^6.3.0" + string.prototype.matchall "^4.0.8" + +eslint-scope@5.1.1, eslint-scope@^5.1.1: version "5.1.1" resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.1.tgz#e786e59a66cb92b3f6c1fb0d508aab174848f48c" integrity sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw== @@ -2898,6 +3407,80 @@ eslint-scope@5.1.1: esrecurse "^4.3.0" estraverse "^4.1.1" +eslint-scope@^7.2.0: + version "7.2.0" + resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-7.2.0.tgz#f21ebdafda02352f103634b96dd47d9f81ca117b" + integrity sha512-DYj5deGlHBfMt15J7rdtyKNq/Nqlv5KfU4iodrQ019XESsRnwXH9KAE0y3cwtUHDo2ob7CypAnCqefh6vioWRw== + dependencies: + esrecurse "^4.3.0" + estraverse "^5.2.0" + +eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1: + version "3.4.1" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz#c22c48f48942d08ca824cc526211ae400478a994" + integrity sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA== + +eslint@^8.44.0: + version "8.44.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.44.0.tgz#51246e3889b259bbcd1d7d736a0c10add4f0e500" + integrity sha512-0wpHoUbDUHgNCyvFB5aXLiQVfK9B0at6gUvzy83k4kAsQ/u769TQDX6iKC+aO4upIHO9WSaA3QoXYQDHbNwf1A== + dependencies: + "@eslint-community/eslint-utils" "^4.2.0" + "@eslint-community/regexpp" "^4.4.0" + "@eslint/eslintrc" "^2.1.0" + "@eslint/js" "8.44.0" + "@humanwhocodes/config-array" "^0.11.10" + "@humanwhocodes/module-importer" "^1.0.1" + "@nodelib/fs.walk" "^1.2.8" + ajv "^6.10.0" + chalk "^4.0.0" + cross-spawn "^7.0.2" + debug "^4.3.2" + doctrine "^3.0.0" + escape-string-regexp "^4.0.0" + eslint-scope "^7.2.0" + eslint-visitor-keys "^3.4.1" + espree "^9.6.0" + esquery "^1.4.2" + esutils "^2.0.2" + fast-deep-equal "^3.1.3" + file-entry-cache "^6.0.1" + find-up "^5.0.0" + glob-parent "^6.0.2" + globals "^13.19.0" + graphemer "^1.4.0" + ignore "^5.2.0" + import-fresh "^3.0.0" + imurmurhash "^0.1.4" + is-glob "^4.0.0" + is-path-inside "^3.0.3" + js-yaml "^4.1.0" + json-stable-stringify-without-jsonify "^1.0.1" + levn "^0.4.1" + lodash.merge "^4.6.2" + minimatch "^3.1.2" + natural-compare "^1.4.0" + optionator "^0.9.3" + strip-ansi "^6.0.1" + strip-json-comments "^3.1.0" + text-table "^0.2.0" + +espree@^9.6.0: + version "9.6.0" + resolved "https://registry.yarnpkg.com/espree/-/espree-9.6.0.tgz#80869754b1c6560f32e3b6929194a3fe07c5b82f" + integrity sha512-1FH/IiruXZ84tpUlm0aCUEwMl2Ho5ilqVh0VvQXw+byAz/4SAciyHLlfmL5WYqsvD38oymdUwBss0LtK8m4s/A== + dependencies: + acorn "^8.9.0" + acorn-jsx "^5.3.2" + eslint-visitor-keys "^3.4.1" + +esquery@^1.4.2: + version "1.5.0" + resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.5.0.tgz#6ce17738de8577694edd7361c57182ac8cb0db0b" + integrity sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg== + dependencies: + estraverse "^5.1.0" + esrecurse@^4.3.0: version "4.3.0" resolved "https://registry.yarnpkg.com/esrecurse/-/esrecurse-4.3.0.tgz#7ad7964d679abb28bee72cec63758b1c5d2c9921" @@ -2910,7 +3493,7 @@ estraverse@^4.1.1: resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d" integrity sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw== -estraverse@^5.2.0: +estraverse@^5.1.0, estraverse@^5.2.0, estraverse@^5.3.0: version "5.3.0" resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.3.0.tgz#2eea5290702f26ab8fe5370370ff86c965d21123" integrity sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA== @@ -2992,16 +3575,44 @@ fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3: resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525" integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q== +fast-diff@^1.1.2: + version "1.3.0" + resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.3.0.tgz#ece407fa550a64d638536cd727e129c61616e0f0" + integrity sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw== + +fast-glob@^3.2.9: + version "3.3.0" + resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.0.tgz#7c40cb491e1e2ed5664749e87bfb516dbe8727c0" + integrity sha512-ChDuvbOypPuNjO8yIDf36x7BlZX1smcUMTTcyoIjycexOxd6DFsKsg21qVBzEmr3G7fUKIRy2/psii+CIUt7FA== + dependencies: + "@nodelib/fs.stat" "^2.0.2" + "@nodelib/fs.walk" "^1.2.3" + glob-parent "^5.1.2" + merge2 "^1.3.0" + micromatch "^4.0.4" + fast-json-stable-stringify@^2.0.0: version "2.1.0" resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633" integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw== +fast-levenshtein@^2.0.6: + version "2.0.6" + resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917" + integrity sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw== + fastest-levenshtein@^1.0.12: version "1.0.16" resolved "https://registry.yarnpkg.com/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz#210e61b6ff181de91ea9b3d1b84fdedd47e034e5" integrity sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg== +fastq@^1.6.0: + version "1.15.0" + resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.15.0.tgz#d04d07c6a2a68fe4599fea8d2e103a937fae6b3a" + integrity sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw== + dependencies: + reusify "^1.0.4" + faye-websocket@^0.11.3: version "0.11.4" resolved "https://registry.yarnpkg.com/faye-websocket/-/faye-websocket-0.11.4.tgz#7f0d9275cfdd86a1c963dc8b65fcc451edcbb1da" @@ -3009,6 +3620,13 @@ faye-websocket@^0.11.3: dependencies: websocket-driver ">=0.5.1" +file-entry-cache@^6.0.1: + version "6.0.1" + resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027" + integrity sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg== + dependencies: + flat-cache "^3.0.4" + file-loader@^6.2.0: version "6.2.0" resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-6.2.0.tgz#baef7cf8e1840df325e4390b4484879480eebe4d" @@ -3067,11 +3685,31 @@ find-up@^5.0.0: locate-path "^6.0.0" path-exists "^4.0.0" +flat-cache@^3.0.4: + version "3.0.4" + resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11" + integrity sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg== + dependencies: + flatted "^3.1.0" + rimraf "^3.0.2" + +flatted@^3.1.0: + version "3.2.7" + resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.7.tgz#609f39207cb614b89d0765b477cb2d437fbf9787" + integrity sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ== + follow-redirects@^1.0.0, follow-redirects@^1.15.0: version "1.15.2" resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.2.tgz#b460864144ba63f2681096f274c4e57026da2c13" integrity sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA== +for-each@^0.3.3: + version "0.3.3" + resolved "https://registry.yarnpkg.com/for-each/-/for-each-0.3.3.tgz#69b447e88a0a5d32c3e7084f3f1710034b21376e" + integrity sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw== + dependencies: + is-callable "^1.1.3" + form-data@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/form-data/-/form-data-4.0.0.tgz#93919daeaf361ee529584b9b31664dc12c9fa452" @@ -3120,6 +3758,21 @@ function-bind@^1.1.1: resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d" integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A== +function.prototype.name@^1.1.5: + version "1.1.5" + resolved "https://registry.yarnpkg.com/function.prototype.name/-/function.prototype.name-1.1.5.tgz#cce0505fe1ffb80503e6f9e46cc64e46a12a9621" + integrity sha512-uN7m/BzVKQnCUF/iW8jYea67v++2u7m5UgENbHRtdDVclOUP+FMPlCNdmk0h/ysGyo2tavMJEDqJAkJdRa1vMA== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.3" + es-abstract "^1.19.0" + functions-have-names "^1.2.2" + +functions-have-names@^1.2.2, functions-have-names@^1.2.3: + version "1.2.3" + resolved "https://registry.yarnpkg.com/functions-have-names/-/functions-have-names-1.2.3.tgz#0404fe4ee2ba2f607f0e0ec3c80bae994133b834" + integrity sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ== + gensync@^1.0.0-beta.2: version "1.0.0-beta.2" resolved "https://registry.yarnpkg.com/gensync/-/gensync-1.0.0-beta.2.tgz#32a6ee76c3d7f52d46b2b1ae5d93fea8580a25e0" @@ -3139,11 +3792,29 @@ get-intrinsic@^1.0.2: has "^1.0.3" has-symbols "^1.0.3" +get-intrinsic@^1.1.1, get-intrinsic@^1.1.3, get-intrinsic@^1.2.0: + version "1.2.1" + resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.1.tgz#d295644fed4505fc9cde952c37ee12b477a83d82" + integrity sha512-2DcsyfABl+gVHEfCOaTrWgyt+tb6MSEGmKq+kI5HwLbIYgjgmMcV8KQ41uaKz1xxUcn9tJtgFbQUEVcEbd0FYw== + dependencies: + function-bind "^1.1.1" + has "^1.0.3" + has-proto "^1.0.1" + has-symbols "^1.0.3" + get-stream@^6.0.0: version "6.0.1" resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-6.0.1.tgz#a262d8eef67aced57c2852ad6167526a43cbf7b7" integrity sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg== +get-symbol-description@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/get-symbol-description/-/get-symbol-description-1.0.0.tgz#7fdb81c900101fbd564dd5f1a30af5aadc1e58d6" + integrity sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw== + dependencies: + call-bind "^1.0.2" + get-intrinsic "^1.1.1" + git-raw-commits@^2.0.11: version "2.0.11" resolved "https://registry.yarnpkg.com/git-raw-commits/-/git-raw-commits-2.0.11.tgz#bc3576638071d18655e1cc60d7f524920008d723" @@ -3155,13 +3826,20 @@ git-raw-commits@^2.0.11: split2 "^3.0.0" through2 "^4.0.0" -glob-parent@~5.1.2: +glob-parent@^5.1.2, glob-parent@~5.1.2: version "5.1.2" resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.2.tgz#869832c58034fe68a4093c17dc15e8340d8401c4" integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow== dependencies: is-glob "^4.0.1" +glob-parent@^6.0.2: + version "6.0.2" + resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-6.0.2.tgz#6d237d99083950c79290f24c7642a3de9a28f9e3" + integrity sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A== + dependencies: + is-glob "^4.0.3" + glob-to-regexp@^0.4.1: version "0.4.1" resolved "https://registry.yarnpkg.com/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz#c75297087c851b9a578bd217dd59a92f59fe546e" @@ -3191,11 +3869,49 @@ globals@^11.1.0: resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e" integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA== +globals@^13.19.0: + version "13.20.0" + resolved "https://registry.yarnpkg.com/globals/-/globals-13.20.0.tgz#ea276a1e508ffd4f1612888f9d1bad1e2717bf82" + integrity sha512-Qg5QtVkCy/kv3FUSlu4ukeZDVf9ee0iXLAUYX13gbR17bnejFTzr4iS9bY7kwCf1NztRNm1t91fjOiyx4CSwPQ== + dependencies: + type-fest "^0.20.2" + +globalthis@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/globalthis/-/globalthis-1.0.3.tgz#5852882a52b80dc301b0660273e1ed082f0b6ccf" + integrity sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA== + dependencies: + define-properties "^1.1.3" + +globby@^11.1.0: + version "11.1.0" + resolved "https://registry.yarnpkg.com/globby/-/globby-11.1.0.tgz#bd4be98bb042f83d796f7e3811991fbe82a0d34b" + integrity sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g== + dependencies: + array-union "^2.1.0" + dir-glob "^3.0.1" + fast-glob "^3.2.9" + ignore "^5.2.0" + merge2 "^1.4.1" + slash "^3.0.0" + +gopd@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c" + integrity sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA== + dependencies: + get-intrinsic "^1.1.3" + graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9: version "4.2.11" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.11.tgz#4183e4e8bf08bb6e05bbb2f7d2e0c8f712ca40e3" integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ== +graphemer@^1.4.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/graphemer/-/graphemer-1.4.0.tgz#fb2f1d55e0e3a1849aeffc90c4fa0dd53a0e66c6" + integrity sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag== + handle-thing@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-2.0.1.tgz#857f79ce359580c340d43081cc648970d0bb234e" @@ -3206,6 +3922,11 @@ hard-rejection@^2.1.0: resolved "https://registry.yarnpkg.com/hard-rejection/-/hard-rejection-2.1.0.tgz#1c6eda5c1685c63942766d79bb40ae773cecd883" integrity sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA== +has-bigints@^1.0.1, has-bigints@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.2.tgz#0871bd3e3d51626f6ca0966668ba35d5602d6eaa" + integrity sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ== + has-flag@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd" @@ -3216,11 +3937,30 @@ has-flag@^4.0.0: resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b" integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ== -has-symbols@^1.0.3: +has-property-descriptors@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.0.tgz#610708600606d36961ed04c196193b6a607fa861" + integrity sha512-62DVLZGoiEBDHQyqG4w9xCuZ7eJEwNmJRWw2VY84Oedb7WFcA27fiEVe8oUQx9hAUJ4ekurquucTGwsyO1XGdQ== + dependencies: + get-intrinsic "^1.1.1" + +has-proto@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.1.tgz#1885c1305538958aff469fef37937c22795408e0" + integrity sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg== + +has-symbols@^1.0.2, has-symbols@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.3.tgz#bb7b2c4349251dce87b125f7bdf874aa7c8b39f8" integrity sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A== +has-tostringtag@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.0.tgz#7e133818a7d394734f941e73c3d3f9291e658b25" + integrity sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ== + dependencies: + has-symbols "^1.0.2" + has@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796" @@ -3374,6 +4114,11 @@ icss-utils@^5.0.0, icss-utils@^5.1.0: resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-5.1.0.tgz#c6be6858abd013d768e98366ae47e25d5887b1ae" integrity sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA== +ignore@^5.2.0: + version "5.2.4" + resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324" + integrity sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ== + immer@^9.0.21: version "9.0.21" resolved "https://registry.yarnpkg.com/immer/-/immer-9.0.21.tgz#1e025ea31a40f24fb064f1fef23e931496330176" @@ -3395,6 +4140,11 @@ import-local@^3.0.2: pkg-dir "^4.2.0" resolve-cwd "^3.0.0" +imurmurhash@^0.1.4: + version "0.1.4" + resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea" + integrity sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA== + indent-string@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/indent-string/-/indent-string-4.0.0.tgz#624f8f4497d619b2d9768531d58f4122854d7251" @@ -3423,6 +4173,15 @@ ini@^1.3.4: resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.8.tgz#a29da425b48806f34767a4efce397269af28432c" integrity sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew== +internal-slot@^1.0.3, internal-slot@^1.0.5: + version "1.0.5" + resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.5.tgz#f2a2ee21f668f8627a4667f309dc0f4fb6674986" + integrity sha512-Y+R5hJrzs52QCG2laLn4udYVnxsfny9CpOhNhUvk/SSSVyF6T27FzRbF0sroPidSu3X8oEAkOn2K804mjpt6UQ== + dependencies: + get-intrinsic "^1.2.0" + has "^1.0.3" + side-channel "^1.0.4" + interpret@^3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/interpret/-/interpret-3.1.1.tgz#5be0ceed67ca79c6c4bc5cf0d7ee843dcea110c4" @@ -3438,11 +4197,27 @@ ipaddr.js@^2.0.1: resolved "https://registry.yarnpkg.com/ipaddr.js/-/ipaddr.js-2.0.1.tgz#eca256a7a877e917aeb368b0a7497ddf42ef81c0" integrity sha512-1qTgH9NG+IIJ4yfKs2e6Pp1bZg8wbDbKHT21HrLIeYBTRLgMYKnMTPAuI3Lcs61nfx5h1xlXnbJtH1kX5/d/ng== +is-array-buffer@^3.0.1, is-array-buffer@^3.0.2: + version "3.0.2" + resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.2.tgz#f2653ced8412081638ecb0ebbd0c41c6e0aecbbe" + integrity sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w== + dependencies: + call-bind "^1.0.2" + get-intrinsic "^1.2.0" + is-typed-array "^1.1.10" + is-arrayish@^0.2.1: version "0.2.1" resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d" integrity sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg== +is-bigint@^1.0.1: + version "1.0.4" + resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.0.4.tgz#08147a1875bc2b32005d41ccd8291dffc6691df3" + integrity sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg== + dependencies: + has-bigints "^1.0.1" + is-binary-path@~2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-2.1.0.tgz#ea1f7f3b80f064236e83470f86c09c254fb45b09" @@ -3450,6 +4225,19 @@ is-binary-path@~2.1.0: dependencies: binary-extensions "^2.0.0" +is-boolean-object@^1.1.0: + version "1.1.2" + resolved "https://registry.yarnpkg.com/is-boolean-object/-/is-boolean-object-1.1.2.tgz#5c6dc200246dd9321ae4b885a114bb1f75f63719" + integrity sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA== + dependencies: + call-bind "^1.0.2" + has-tostringtag "^1.0.0" + +is-callable@^1.1.3, is-callable@^1.1.4, is-callable@^1.2.7: + version "1.2.7" + resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.7.tgz#3bc2a85ea742d9e36205dcacdd72ca1fdc51b055" + integrity sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA== + is-core-module@^2.11.0, is-core-module@^2.5.0: version "2.12.0" resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.12.0.tgz#36ad62f6f73c8253fd6472517a12483cf03e7ec4" @@ -3457,6 +4245,20 @@ is-core-module@^2.11.0, is-core-module@^2.5.0: dependencies: has "^1.0.3" +is-core-module@^2.9.0: + version "2.12.1" + resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.12.1.tgz#0c0b6885b6f80011c71541ce15c8d66cf5a4f9fd" + integrity sha512-Q4ZuBAe2FUsKtyQJoQHlvP8OvBERxO3jEmy1I7hcRXcJBGGHFh/aJBswbXuS9sgrDH2QUO8ilkwNPHvHMd8clg== + dependencies: + has "^1.0.3" + +is-date-object@^1.0.1: + version "1.0.5" + resolved "https://registry.yarnpkg.com/is-date-object/-/is-date-object-1.0.5.tgz#0841d5536e724c25597bf6ea62e1bd38298df31f" + integrity sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ== + dependencies: + has-tostringtag "^1.0.0" + is-docker@^2.0.0, is-docker@^2.1.1: version "2.2.1" resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-2.2.1.tgz#33eeabe23cfe86f14bde4408a02c0cfb853acdaa" @@ -3472,13 +4274,25 @@ is-fullwidth-code-point@^3.0.0: resolved "https://registry.yarnpkg.com/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz#f116f8064fe90b3f7844a38997c0b75051269f1d" integrity sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg== -is-glob@^4.0.1, is-glob@~4.0.1: +is-glob@^4.0.0, is-glob@^4.0.1, is-glob@^4.0.3, is-glob@~4.0.1: version "4.0.3" resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.3.tgz#64f61e42cbbb2eec2071a9dac0b28ba1e65d5084" integrity sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg== dependencies: is-extglob "^2.1.1" +is-negative-zero@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.2.tgz#7bf6f03a28003b8b3965de3ac26f664d765f3150" + integrity sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA== + +is-number-object@^1.0.4: + version "1.0.7" + resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.7.tgz#59d50ada4c45251784e9904f5246c742f07a42fc" + integrity sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ== + dependencies: + has-tostringtag "^1.0.0" + is-number@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b" @@ -3489,6 +4303,11 @@ is-obj@^2.0.0: resolved "https://registry.yarnpkg.com/is-obj/-/is-obj-2.0.0.tgz#473fb05d973705e3fd9620545018ca8e22ef4982" integrity sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w== +is-path-inside@^3.0.3: + version "3.0.3" + resolved "https://registry.yarnpkg.com/is-path-inside/-/is-path-inside-3.0.3.tgz#d231362e53a07ff2b0e0ea7fed049161ffd16283" + integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ== + is-plain-obj@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-1.1.0.tgz#71a50c8429dfca773c92a390a4a03b39fcd51d3e" @@ -3506,11 +4325,40 @@ is-plain-object@^2.0.4: dependencies: isobject "^3.0.1" +is-regex@^1.1.4: + version "1.1.4" + resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958" + integrity sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg== + dependencies: + call-bind "^1.0.2" + has-tostringtag "^1.0.0" + +is-shared-array-buffer@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz#8f259c573b60b6a32d4058a1a07430c0a7344c79" + integrity sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA== + dependencies: + call-bind "^1.0.2" + is-stream@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.1.tgz#fac1e3d53b97ad5a9d0ae9cef2389f5810a5c077" integrity sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg== +is-string@^1.0.5, is-string@^1.0.7: + version "1.0.7" + resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.0.7.tgz#0dd12bf2006f255bb58f695110eff7491eebc0fd" + integrity sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg== + dependencies: + has-tostringtag "^1.0.0" + +is-symbol@^1.0.2, is-symbol@^1.0.3: + version "1.0.4" + resolved "https://registry.yarnpkg.com/is-symbol/-/is-symbol-1.0.4.tgz#a6dac93b635b063ca6872236de88910a57af139c" + integrity sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg== + dependencies: + has-symbols "^1.0.2" + is-text-path@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/is-text-path/-/is-text-path-1.0.1.tgz#4e1aa0fb51bfbcb3e92688001397202c1775b66e" @@ -3518,6 +4366,24 @@ is-text-path@^1.0.1: dependencies: text-extensions "^1.0.0" +is-typed-array@^1.1.10, is-typed-array@^1.1.9: + version "1.1.10" + resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.10.tgz#36a5b5cb4189b575d1a3e4b08536bfb485801e3f" + integrity sha512-PJqgEHiWZvMpaFZ3uTc8kHPM4+4ADTlDniuQL7cU/UDA0Ql7F70yGfHph3cLNe+c9toaigv+DFzTJKhc2CtO6A== + dependencies: + available-typed-arrays "^1.0.5" + call-bind "^1.0.2" + for-each "^0.3.3" + gopd "^1.0.1" + has-tostringtag "^1.0.0" + +is-weakref@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/is-weakref/-/is-weakref-1.0.2.tgz#9529f383a9338205e89765e0392efc2f100f06f2" + integrity sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ== + dependencies: + call-bind "^1.0.2" + is-wsl@^2.2.0: version "2.2.0" resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-2.2.0.tgz#74a4c76e77ca9fd3f932f290c17ea326cd157271" @@ -3586,6 +4452,18 @@ json-schema-traverse@^1.0.0: resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz#ae7bcb3656ab77a73ba5c49bf654f38e6b6860e2" integrity sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug== +json-stable-stringify-without-jsonify@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651" + integrity sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw== + +json5@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.2.tgz#63d98d60f21b313b77c4d6da18bfa69d80e1d593" + integrity sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA== + dependencies: + minimist "^1.2.0" + json5@^2.1.2, json5@^2.2.2: version "2.2.3" resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283" @@ -3605,11 +4483,33 @@ jsonparse@^1.2.0: resolved "https://registry.yarnpkg.com/jsonparse/-/jsonparse-1.3.1.tgz#3f4dae4a91fac315f71062f8521cc239f1366280" integrity sha512-POQXvpdL69+CluYsillJ7SUhKvytYjW9vG/GKpnf+xP8UWgYEM/RaMzHHofbALDiKbbP1W8UEYmgGl39WkPZsg== +"jsx-ast-utils@^2.4.1 || ^3.0.0", jsx-ast-utils@^3.3.3: + version "3.3.4" + resolved "https://registry.yarnpkg.com/jsx-ast-utils/-/jsx-ast-utils-3.3.4.tgz#b896535fed5b867650acce5a9bd4135ffc7b3bf9" + integrity sha512-fX2TVdCViod6HwKEtSWGHs57oFhVfCMwieb9PuRDgjDPh5XeqJiHFFFJCHxU5cnTc3Bu/GRL+kPiFmw8XWOfKw== + dependencies: + array-includes "^3.1.6" + array.prototype.flat "^1.3.1" + object.assign "^4.1.4" + object.values "^1.1.6" + kind-of@^6.0.2, kind-of@^6.0.3: version "6.0.3" resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.3.tgz#07c05034a6c349fa06e24fa35aa76db4580ce4dd" integrity sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw== +language-subtag-registry@~0.3.2: + version "0.3.22" + resolved "https://registry.yarnpkg.com/language-subtag-registry/-/language-subtag-registry-0.3.22.tgz#2e1500861b2e457eba7e7ae86877cbd08fa1fd1d" + integrity sha512-tN0MCzyWnoz/4nHS6uxdlFWoUZT7ABptwKPQ52Ea7URk6vll88bWBVhodtnlfEuCcKWNGoc+uGbw1cwa9IKh/w== + +language-tags@=1.0.5: + version "1.0.5" + resolved "https://registry.yarnpkg.com/language-tags/-/language-tags-1.0.5.tgz#d321dbc4da30ba8bf3024e040fa5c14661f9193a" + integrity sha512-qJhlO9cGXi6hBGKoxEG/sKZDAHD5Hnu9Hs4WbOY3pCWXDhw0N8x1NenNzm2EnNLkLkk7J2SdxAkDSbb6ftT+UQ== + dependencies: + language-subtag-registry "~0.3.2" + launch-editor@^2.6.0: version "2.6.0" resolved "https://registry.yarnpkg.com/launch-editor/-/launch-editor-2.6.0.tgz#4c0c1a6ac126c572bd9ff9a30da1d2cae66defd7" @@ -3618,6 +4518,14 @@ launch-editor@^2.6.0: picocolors "^1.0.0" shell-quote "^1.7.3" +levn@^0.4.1: + version "0.4.1" + resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade" + integrity sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ== + dependencies: + prelude-ls "^1.2.1" + type-check "~0.4.0" + lines-and-columns@^1.1.6: version "1.2.4" resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632" @@ -3810,12 +4718,17 @@ merge-stream@^2.0.0: resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60" integrity sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w== +merge2@^1.3.0, merge2@^1.4.1: + version "1.4.1" + resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae" + integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg== + methods@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee" integrity sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w== -micromatch@^4.0.0, micromatch@^4.0.2: +micromatch@^4.0.0, micromatch@^4.0.2, micromatch@^4.0.4: version "4.0.5" resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.5.tgz#bc8999a7cbbf77cdc89f132f6e467051b49090c6" integrity sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA== @@ -3862,7 +4775,7 @@ minimalistic-assert@^1.0.0: resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7" integrity sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A== -minimatch@^3.1.1: +minimatch@^3.0.5, minimatch@^3.1.1, minimatch@^3.1.2: version "3.1.2" resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.1.2.tgz#19cd194bfd3e428f049a70817c038d89ab4be35b" integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw== @@ -3878,7 +4791,7 @@ minimist-options@4.1.0: is-plain-obj "^1.1.0" kind-of "^6.0.3" -minimist@^1.2.6: +minimist@^1.2.0, minimist@^1.2.6: version "1.2.8" resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c" integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA== @@ -3893,7 +4806,7 @@ ms@2.1.2: resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009" integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w== -ms@2.1.3: +ms@2.1.3, ms@^2.1.1: version "2.1.3" resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2" integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA== @@ -3911,6 +4824,16 @@ nanoid@^3.3.6: resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c" integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA== +natural-compare-lite@^1.4.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz#17b09581988979fddafe0201e931ba933c96cbb4" + integrity sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g== + +natural-compare@^1.4.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7" + integrity sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw== + negotiator@0.6.3: version "0.6.3" resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.3.tgz#58e323a72fedc0d6f9cd4d31fe49f51479590ccd" @@ -3983,11 +4906,61 @@ object-assign@^4.1.1: resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863" integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg== -object-inspect@^1.9.0: +object-inspect@^1.12.3, object-inspect@^1.9.0: version "1.12.3" resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.12.3.tgz#ba62dffd67ee256c8c086dfae69e016cd1f198b9" integrity sha512-geUvdk7c+eizMNUDkRpW1wJwgfOiOeHbxBR/hLXK1aT6zmVSO0jsQcs7fj6MGw89jC/cjGfLcNOrtMYtGqm81g== +object-keys@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e" + integrity sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA== + +object.assign@^4.1.2, object.assign@^4.1.4: + version "4.1.4" + resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.4.tgz#9673c7c7c351ab8c4d0b516f4343ebf4dfb7799f" + integrity sha512-1mxKf0e58bvyjSCtKYY4sRe9itRk3PJpquJOjeIkz885CczcI4IvJJDLPS72oowuSh+pBxUFROpX+TU++hxhZQ== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + has-symbols "^1.0.3" + object-keys "^1.1.1" + +object.entries@^1.1.5, object.entries@^1.1.6: + version "1.1.6" + resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.1.6.tgz#9737d0e5b8291edd340a3e3264bb8a3b00d5fa23" + integrity sha512-leTPzo4Zvg3pmbQ3rDK69Rl8GQvIqMWubrkxONG9/ojtFE2rD9fjMKfSI5BxW3osRH1m6VdzmqK8oAY9aT4x5w== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + +object.fromentries@^2.0.6: + version "2.0.6" + resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.6.tgz#cdb04da08c539cffa912dcd368b886e0904bfa73" + integrity sha512-VciD13dswC4j1Xt5394WR4MzmAQmlgN72phd/riNp9vtD7tp4QQWJ0R4wvclXcafgcYK8veHRed2W6XeGBvcfg== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + +object.hasown@^1.1.2: + version "1.1.2" + resolved "https://registry.yarnpkg.com/object.hasown/-/object.hasown-1.1.2.tgz#f919e21fad4eb38a57bc6345b3afd496515c3f92" + integrity sha512-B5UIT3J1W+WuWIU55h0mjlwaqxiE5vYENJXIXZ4VFe05pNYrkKuK0U/6aFcb0pKywYJh7IhfoqUfKVmrJJHZHw== + dependencies: + define-properties "^1.1.4" + es-abstract "^1.20.4" + +object.values@^1.1.6: + version "1.1.6" + resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.6.tgz#4abbaa71eba47d63589d402856f908243eea9b1d" + integrity sha512-FVVTkD1vENCsAcwNs9k6jea2uHC/X0+JcjG8YA60FN5CMaJmG95wT9jek/xX9nornqGRrBkKtzuAu2wuHpKqvw== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + obuf@^1.0.0, obuf@^1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/obuf/-/obuf-1.1.2.tgz#09bea3343d41859ebd446292d11c9d4db619084e" @@ -4028,6 +5001,18 @@ open@^8.0.9: is-docker "^2.1.1" is-wsl "^2.2.0" +optionator@^0.9.3: + version "0.9.3" + resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.3.tgz#007397d44ed1872fdc6ed31360190f81814e2c64" + integrity sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg== + dependencies: + "@aashutoshrathi/word-wrap" "^1.2.3" + deep-is "^0.1.3" + fast-levenshtein "^2.0.6" + levn "^0.4.1" + prelude-ls "^1.2.1" + type-check "^0.4.0" + p-limit@^2.2.0: version "2.3.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1" @@ -4204,6 +5189,23 @@ postcss@^8.4.19: picocolors "^1.0.0" source-map-js "^1.0.2" +prelude-ls@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" + integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g== + +prettier-linter-helpers@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz#d23d41fe1375646de2d0104d3454a3008802cf7b" + integrity sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w== + dependencies: + fast-diff "^1.1.2" + +prettier@^2.8.8: + version "2.8.8" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.8.tgz#e8c5d7e98a4305ffe3de2e1fc4aca1a71c28b1da" + integrity sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q== + pretty-error@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-4.0.0.tgz#90a703f46dd7234adb46d0f84823e9d1cb8f10d6" @@ -4217,7 +5219,7 @@ process-nextick-args@~2.0.0: resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2" integrity sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag== -prop-types@^15.6.0, prop-types@^15.6.2, prop-types@^15.7.2: +prop-types@^15.6.0, prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1: version "15.8.1" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5" integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg== @@ -4256,6 +5258,11 @@ qs@6.11.0: dependencies: side-channel "^1.0.4" +queue-microtask@^1.2.2: + version "1.2.3" + resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243" + integrity sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A== + quick-lru@^4.0.1: version "4.0.1" resolved "https://registry.yarnpkg.com/quick-lru/-/quick-lru-4.0.1.tgz#5b8878f113a58217848c6482026c73e1ba57727f" @@ -4504,6 +5511,15 @@ regenerator-transform@^0.15.1: dependencies: "@babel/runtime" "^7.8.4" +regexp.prototype.flags@^1.4.3: + version "1.5.0" + resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.5.0.tgz#fe7ce25e7e4cca8db37b6634c8a2c7009199b9cb" + integrity sha512-0SutC3pNudRKgquxGoRGIz946MZVHqbNfPjBdxeOhBrdgDKlRoXmYLQN9xRbrR09ZXWeGAdPuif7egofn6v5LA== + dependencies: + call-bind "^1.0.2" + define-properties "^1.2.0" + functions-have-names "^1.2.3" + regexpu-core@^5.3.1: version "5.3.2" resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.3.2.tgz#11a2b06884f3527aec3e93dbbf4a3b958a95546b" @@ -4583,7 +5599,7 @@ resolve-global@1.0.0, resolve-global@^1.0.0: dependencies: global-dirs "^0.1.1" -resolve@^1.10.0, resolve@^1.14.2, resolve@^1.19.0, resolve@^1.20.0: +resolve@^1.10.0, resolve@^1.14.2, resolve@^1.19.0, resolve@^1.20.0, resolve@^1.22.1: version "1.22.2" resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.2.tgz#0ed0943d4e301867955766c9f3e1ae6d01c6845f" integrity sha512-Sb+mjNHOULsBv818T40qSPeRiuWLyaGMa5ewydRLFimneixmVy2zdivRl+AF6jaYPC8ERxGDmFSiqui6SfPd+g== @@ -4592,11 +5608,25 @@ resolve@^1.10.0, resolve@^1.14.2, resolve@^1.19.0, resolve@^1.20.0: path-parse "^1.0.7" supports-preserve-symlinks-flag "^1.0.0" +resolve@^2.0.0-next.4: + version "2.0.0-next.4" + resolved "https://registry.yarnpkg.com/resolve/-/resolve-2.0.0-next.4.tgz#3d37a113d6429f496ec4752d2a2e58efb1fd4660" + integrity sha512-iMDbmAWtfU+MHpxt/I5iWI7cY6YVEZUQ3MBgPQ++XD1PELuJHIl82xBmObyP2KyQmkNB2dsqF7seoQQiAn5yDQ== + dependencies: + is-core-module "^2.9.0" + path-parse "^1.0.7" + supports-preserve-symlinks-flag "^1.0.0" + retry@^0.13.1: version "0.13.1" resolved "https://registry.yarnpkg.com/retry/-/retry-0.13.1.tgz#185b1587acf67919d63b357349e03537b2484658" integrity sha512-XQBQ3I8W1Cge0Seh+6gjj03LbmRFWuoszgK9ooCpwYIrhhoO80pfq4cUkU5DkknwfOfFteRwlZ56PYOGYyFWdg== +reusify@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76" + integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw== + rimraf@^3.0.2: version "3.0.2" resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a" @@ -4604,6 +5634,13 @@ rimraf@^3.0.2: dependencies: glob "^7.1.3" +run-parallel@^1.1.9: + version "1.2.0" + resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee" + integrity sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA== + dependencies: + queue-microtask "^1.2.2" + safe-buffer@5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1: version "5.1.2" resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d" @@ -4614,6 +5651,15 @@ safe-buffer@5.2.1, safe-buffer@>=5.1.0, safe-buffer@^5.1.0, safe-buffer@~5.2.0: resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.1.tgz#1eaf9fa9bdb1fdd4ec75f58f9cdb4e6b7827eec6" integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ== +safe-regex-test@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/safe-regex-test/-/safe-regex-test-1.0.0.tgz#793b874d524eb3640d1873aad03596db2d4f2295" + integrity sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA== + dependencies: + call-bind "^1.0.2" + get-intrinsic "^1.1.3" + is-regex "^1.1.4" + "safer-buffer@>= 2.1.2 < 3": version "2.1.2" resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a" @@ -4681,6 +5727,13 @@ semver@^7.3.4, semver@^7.3.8: dependencies: lru-cache "^6.0.0" +semver@^7.3.7: + version "7.5.3" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.3.tgz#161ce8c2c6b4b3bdca6caadc9fa3317a4c4fe88e" + integrity sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ== + dependencies: + lru-cache "^6.0.0" + send@0.18.0: version "0.18.0" resolved "https://registry.yarnpkg.com/send/-/send-0.18.0.tgz#670167cc654b05f5aa4a767f9113bb371bc706be" @@ -4783,6 +5836,11 @@ signal-exit@^3.0.3: resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9" integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ== +slash@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634" + integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q== + sockjs@^0.3.24: version "0.3.24" resolved "https://registry.yarnpkg.com/sockjs/-/sockjs-0.3.24.tgz#c9bc8995f33a111bea0395ec30aa3206bdb5ccce" @@ -4905,6 +5963,47 @@ string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: is-fullwidth-code-point "^3.0.0" strip-ansi "^6.0.1" +string.prototype.matchall@^4.0.8: + version "4.0.8" + resolved "https://registry.yarnpkg.com/string.prototype.matchall/-/string.prototype.matchall-4.0.8.tgz#3bf85722021816dcd1bf38bb714915887ca79fd3" + integrity sha512-6zOCOcJ+RJAQshcTvXPHoxoQGONa3e/Lqx90wUA+wEzX78sg5Bo+1tQo4N0pohS0erG9qtCqJDjNCQBjeWVxyg== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + get-intrinsic "^1.1.3" + has-symbols "^1.0.3" + internal-slot "^1.0.3" + regexp.prototype.flags "^1.4.3" + side-channel "^1.0.4" + +string.prototype.trim@^1.2.7: + version "1.2.7" + resolved "https://registry.yarnpkg.com/string.prototype.trim/-/string.prototype.trim-1.2.7.tgz#a68352740859f6893f14ce3ef1bb3037f7a90533" + integrity sha512-p6TmeT1T3411M8Cgg9wBTMRtY2q9+PNy9EV1i2lIXUN/btt763oIfxwN3RR8VU6wHX8j/1CFy0L+YuThm6bgOg== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + +string.prototype.trimend@^1.0.6: + version "1.0.6" + resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.6.tgz#c4a27fa026d979d79c04f17397f250a462944533" + integrity sha512-JySq+4mrPf9EsDBEDYMOb/lM7XQLulwg5R/m1r0PXEFqrV0qHvl58sdTilSXtKOflCsK2E8jxf+GKC0T07RWwQ== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + +string.prototype.trimstart@^1.0.6: + version "1.0.6" + resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.6.tgz#e90ab66aa8e4007d92ef591bbf3cd422c56bdcf4" + integrity sha512-omqjMDaY92pbn5HOX7f9IccLA+U1tA9GvtU4JrodiXFfYB7jPzzHpRzpglLAjtUV6bB557zwClJezTqnAiYnQA== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + string_decoder@^1.1.1: version "1.3.0" resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.3.0.tgz#42f114594a46cf1a8e30b0a84f56c78c3edac21e" @@ -4926,6 +6025,11 @@ strip-ansi@^6.0.0, strip-ansi@^6.0.1: dependencies: ansi-regex "^5.0.1" +strip-bom@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3" + integrity sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA== + strip-final-newline@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-2.0.0.tgz#89b852fb2fcbe936f6f4b3187afb0a12c1ab58ad" @@ -4938,6 +6042,11 @@ strip-indent@^3.0.0: dependencies: min-indent "^1.0.0" +strip-json-comments@^3.1.0, strip-json-comments@^3.1.1: + version "3.1.1" + resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006" + integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig== + style-loader@^3.3.2: version "3.3.2" resolved "https://registry.yarnpkg.com/style-loader/-/style-loader-3.3.2.tgz#eaebca714d9e462c19aa1e3599057bc363924899" @@ -5039,6 +6148,11 @@ text-extensions@^1.0.0: resolved "https://registry.yarnpkg.com/text-extensions/-/text-extensions-1.9.0.tgz#1853e45fee39c945ce6f6c36b2d659b5aabc2a26" integrity sha512-wiBrwC1EhBelW12Zy26JeOUkQ5mRu+5o8rpsJk5+2t+Y5vE7e842qtZDQ2g1NpX/29HdyFeJ4nSIhI47ENSxlQ== +text-table@^0.2.0: + version "0.2.0" + resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" + integrity sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw== + through2@^4.0.0: version "4.0.2" resolved "https://registry.yarnpkg.com/through2/-/through2-4.0.2.tgz#a7ce3ac2a7a8b0b966c80e7c49f0484c3b239764" @@ -5107,16 +6221,50 @@ ts-node@^10.8.1, ts-node@^10.9.1: v8-compile-cache-lib "^3.0.1" yn "3.1.1" +tsconfig-paths@^3.14.1: + version "3.14.2" + resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.14.2.tgz#6e32f1f79412decd261f92d633a9dc1cfa99f088" + integrity sha512-o/9iXgCYc5L/JxCHPe3Hvh8Q/2xm5Z+p18PESBU6Ff33695QnCHBEjcytY2q19ua7Mbl/DavtBOLq+oG0RCL+g== + dependencies: + "@types/json5" "^0.0.29" + json5 "^1.0.2" + minimist "^1.2.6" + strip-bom "^3.0.0" + +tslib@^1.8.1: + version "1.14.1" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00" + integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg== + tslib@^2.0.3: version "2.5.0" resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.5.0.tgz#42bfed86f5787aeb41d031866c8f402429e0fddf" integrity sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg== +tsutils@^3.21.0: + version "3.21.0" + resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623" + integrity sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA== + dependencies: + tslib "^1.8.1" + +type-check@^0.4.0, type-check@~0.4.0: + version "0.4.0" + resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1" + integrity sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew== + dependencies: + prelude-ls "^1.2.1" + type-fest@^0.18.0: version "0.18.1" resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.18.1.tgz#db4bc151a4a2cf4eebf9add5db75508db6cc841f" integrity sha512-OIAYXk8+ISY+qTOwkHtKqzAuxchoMiD9Udx+FSGQDuiRR+PJKJHc2NJAXlbhkGwTt/4/nKZxELY1w3ReWOL8mw== +type-fest@^0.20.2: + version "0.20.2" + resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4" + integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ== + type-fest@^0.6.0: version "0.6.0" resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.6.0.tgz#8d2a2370d3df886eb5c90ada1c5bf6188acf838b" @@ -5135,11 +6283,30 @@ type-is@~1.6.18: media-typer "0.3.0" mime-types "~2.1.24" +typed-array-length@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/typed-array-length/-/typed-array-length-1.0.4.tgz#89d83785e5c4098bec72e08b319651f0eac9c1bb" + integrity sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng== + dependencies: + call-bind "^1.0.2" + for-each "^0.3.3" + is-typed-array "^1.1.9" + typescript@*, "typescript@^4.6.4 || ^5.0.0": version "5.0.4" resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.0.4.tgz#b217fd20119bd61a94d4011274e0ab369058da3b" integrity sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw== +unbox-primitive@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.2.tgz#29032021057d5e6cdbd08c5129c226dff8ed6f9e" + integrity sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw== + dependencies: + call-bind "^1.0.2" + has-bigints "^1.0.2" + has-symbols "^1.0.3" + which-boxed-primitive "^1.0.2" + unicode-canonical-property-names-ecmascript@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz#301acdc525631670d39f6146e0e77ff6bbdebddc" @@ -5381,6 +6548,29 @@ websocket-extensions@>=0.1.1: resolved "https://registry.yarnpkg.com/websocket-extensions/-/websocket-extensions-0.1.4.tgz#7f8473bc839dfd87608adb95d7eb075211578a42" integrity sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg== +which-boxed-primitive@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz#13757bc89b209b049fe5d86430e21cf40a89a8e6" + integrity sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg== + dependencies: + is-bigint "^1.0.1" + is-boolean-object "^1.1.0" + is-number-object "^1.0.4" + is-string "^1.0.5" + is-symbol "^1.0.3" + +which-typed-array@^1.1.9: + version "1.1.9" + resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.9.tgz#307cf898025848cf995e795e8423c7f337efbde6" + integrity sha512-w9c4xkx6mPidwp7180ckYWfMmvxpjlZuIudNtDf4N/tTAUB8VJbX25qZoAsrtGuYNnGw3pa0AXgbGKRB8/EceA== + dependencies: + available-typed-arrays "^1.0.5" + call-bind "^1.0.2" + for-each "^0.3.3" + gopd "^1.0.1" + has-tostringtag "^1.0.0" + is-typed-array "^1.1.10" + which@^2.0.1: version "2.0.2" resolved "https://registry.yarnpkg.com/which/-/which-2.0.2.tgz#7c6a8dd0a636a0327e10b59c9286eee93f3f51b1" From afdc3c4140a3073a1f0ba9696070ce235acbc47e Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Wed, 5 Jul 2023 19:50:30 +0300 Subject: [PATCH 13/16] feat: add mocked backend server --- json-server/db.json | 145 ++++++ package.json | 2 + src/api/api.ts | 68 +-- .../molecules/charts/lineChartConfig.ts | 56 +-- .../pages/transactions/AddTransaction.tsx | 224 ++++----- .../pages/transactions/EditTransaction.tsx | 226 +++++---- .../pages/transactions/Transactions.tsx | 30 +- src/shared/utils/regexes.ts | 7 +- src/store/categorySlice.ts | 111 ++--- src/store/transactionSlice.ts | 95 ++-- src/store/walletSlice.ts | 148 +++--- yarn.lock | 453 ++++++++++++++++-- 12 files changed, 1088 insertions(+), 477 deletions(-) create mode 100644 json-server/db.json diff --git a/json-server/db.json b/json-server/db.json new file mode 100644 index 0000000..8657085 --- /dev/null +++ b/json-server/db.json @@ -0,0 +1,145 @@ +{ + "users": [ + { + "id": 0, + "first_name": "john", + "last_name": "doe", + "email": "user@gmail.com" + } + ], + "category": [ + { + "id": 0, + "title": "Подарунки та благодійність (подарунки родичам та друзям, пожертвування)", + "type_of_outlay": "income", + "owner": 0 + }, + { + "id": 1, + "title": "Розваги (кінотеатри, концерти, музеї, ігри)", + "type_of_outlay": "expense", + "owner": 0 + }, + { + "id": 2, + "title": "Техніка та електроніка (комп'ютери, смартфони, планшети)", + "type_of_outlay": "expense", + "owner": 0 + } + ], + "transactions": { + "2023-04-07": [ + { + "id": 0, + "owner": 0, + "wallet": 0, + "title": "title", + "category": 1, + "description": "New transaction", + "type_of_outlay": "expense", + "amount_of_funds": "7193", + "created": "2023-04-07T21:01:49.424000Z" + }, + { + "id": 1, + "owner": 0, + "wallet": 0, + "title": "title", + "category": 1, + "description": "New transaction", + "type_of_outlay": "expense", + "amount_of_funds": "7193", + "created": "2023-04-07T21:01:49.424000Z" + } + ], + "2023-06-10": [ + { + "id": 2, + "owner": 0, + "wallet": 1, + "title": "New transaction", + "category": 0, + "description": "New transaction", + "type_of_outlay": "income", + "amount_of_funds": "3114.79", + "created": "2023-06-10T23:01:49.424000Z" + } + ], + "2023-07-04": [ + { + "id": 3, + "owner": 0, + "wallet": 2, + "title": "New transaction", + "category": 2, + "description": "New transaction", + "type_of_outlay": "expense", + "amount_of_funds": "3114.79", + "created": "2023-06-04T23:01:49.424000Z" + } + ] + }, + "wallet": [ + { + "id": 0, + "title": "Готівка", + "amount": "13248.26", + "type_of_account": "cash", + "owner": 1 + }, + { + "id": 1, + "title": "Приват", + "amount": "3042.65", + "type_of_account": "bank", + "owner": 1 + }, + { + "id": 2, + "title": "Моно", + "amount": "5346.70", + "type_of_account": "bank", + "owner": 1 + }, + { + "id": 3, + "title": "Ощадss", + "amount": "346", + "type_of_account": "bank", + "owner": 10 + }, + { + "id": 4, + "title": "Альфа", + "amount": "2314.35", + "type_of_account": "bank", + "owner": 1 + } + ], + "charts": { + "doughnut": { + "data": ["30", "25", "20", "15", "10"], + "labels": [ + "Подарунки та благодійність", + "Охорона здоров'я та краса", + "Їжа та напої", + "Електроніка та техніка", + "Комунальні послуги" + ] + } + }, + "options": [ + { + "value": "Подарунки та благодійність (подарунки родичам та друзям, пожертвування)", + "label": "Подарунки та благодійність (подарунки родичам та друзям, пожертвування)" + }, + { + "value": "Розваги (кінотеатри, концерти, музеї, ігри)", + "label": "Розваги (кінотеатри, концерти, музеї, ігри)" + }, + { + "value": "Техніка та електроніка (комп'ютери, смартфони, планшети)", + "label": "Техніка та електроніка (комп'ютери, смартфони, планшети)" + } + ] +} diff --git a/package.json b/package.json index bef83c4..eacc1a4 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "main": "index.tsx", "scripts": { "dev": "webpack serve --env mode=development --https", + "dev:server": "yarn json-server --watch ./json-server/db.json -p 4000", "build:dev": "webpack --env mode=development", "build:prod": "webpack --env mode=production", "prepare": "husky install", @@ -41,6 +42,7 @@ "file-loader": "^6.2.0", "html-webpack-plugin": "^5.5.0", "husky": "^8.0.3", + "json-server": "^0.17.3", "mini-css-extract-plugin": "^2.7.3", "prettier": "^2.8.8", "react-refresh": "^0.14.0", diff --git a/src/api/api.ts b/src/api/api.ts index 5634423..8c7bf5f 100644 --- a/src/api/api.ts +++ b/src/api/api.ts @@ -1,55 +1,67 @@ -import axios, { InternalAxiosRequestConfig } from 'axios'; -import { Store } from '@reduxjs/toolkit'; +import axios, { InternalAxiosRequestConfig } from "axios"; +import { Store } from "@reduxjs/toolkit"; -import { IUser } from '../../types/user'; +import { IUser } from "../../types/user"; -export const BASE_URL = "https://prod.wallet.cloudns.ph:8800"; +// export const BASE_URL = "https://prod.wallet.cloudns.ph:8800"; +export const BASE_URL = "http:localhost:4000"; export const REGISTER_PATH = "/accounts/register/"; export const LOGIN_PATH = "/accounts/login/"; export const LOGOUT_PATH = "/accounts/logout/"; export const USER_DETAILS_PATH = "/accounts/get-details/"; export const CHANGE_USER_INFO_PATH = "/accounts/change-info/"; -export const CHANGE_USER_PASSWORD_PATH = "/accounts/password-reset-for-login-user/"; +export const CHANGE_USER_PASSWORD_PATH = + "/accounts/password-reset-for-login-user/"; export const PASSWORD_RESET_REQUEST_PATH = "/accounts/password-reset-request/"; export const PASSWORD_RESET_CONFIRM_PATH = "/accounts/password-reset-confirm/"; export const WALLET_PATH = "/wallet/"; -export const CATEGORY_PATH = "/wallet/category/"; -export const TRANSACTION_PATH = "/wallet/transactions/"; +// export const CATEGORY_PATH = "/wallet/category/"; +export const CATEGORY_PATH = "/category/"; +// export const TRANSACTION_PATH = "/wallet/transactions/"; +export const TRANSACTION_PATH = "/transactions/"; export const BANK_DATA_PATH = "/bankdata/"; -export const localStorageIsDataEntrySuccess = localStorage.getItem("isDataEntrySuccess") -export const userData = localStorage.getItem('userData'); -export const userDataParsed: IUser = JSON.parse(localStorage.getItem('userData')); +export const localStorageIsDataEntrySuccess = + localStorage.getItem("isDataEntrySuccess"); +export const userData = localStorage.getItem("userData"); +export const userDataParsed: IUser = JSON.parse( + localStorage.getItem("userData") +); export const userId = userDataParsed?.id; -export const token = localStorage.getItem('token'); +export const token = localStorage.getItem("token"); let store: Store; export const injectStore = (_store: Store) => { - store = _store -} + store = _store; +}; export const $api = axios.create({ baseURL: BASE_URL, headers: { "Content-Type": "application/json", - "Accept": "application/json", - } + Accept: "application/json", + }, }); -$api.interceptors.request.use((config: InternalAxiosRequestConfig): InternalAxiosRequestConfig => { - const userState = store.getState().user; - let currentToken: string | undefined; +$api.interceptors.request.use( + (config: InternalAxiosRequestConfig): InternalAxiosRequestConfig => { + const userState = store.getState().user; + let currentToken: string | undefined; - if (userState?.isAccountDeleted === true || userState?.isLoggedOut === true) { - currentToken = undefined - } else { - currentToken = userState?.user?.token || token - } + if ( + userState?.isAccountDeleted === true || + userState?.isLoggedOut === true + ) { + currentToken = undefined; + } else { + currentToken = userState?.user?.token || token; + } - if (currentToken) { - config.headers.Authorization = `Token ${currentToken}`; - } + if (currentToken) { + config.headers.Authorization = `Token ${currentToken}`; + } - return config -}); \ No newline at end of file + return config; + } +); diff --git a/src/components/molecules/charts/lineChartConfig.ts b/src/components/molecules/charts/lineChartConfig.ts index 9d16ad9..2fed5be 100644 --- a/src/components/molecules/charts/lineChartConfig.ts +++ b/src/components/molecules/charts/lineChartConfig.ts @@ -12,13 +12,13 @@ export const generateLabels = ( const labels: string[] = []; if (Object.keys(categoryTransactions)?.length > 0) { - for (let i = 0; i < (parseInt(filterByDays)); i++) { + for (let i = 0; i < parseInt(filterByDays); i++) { const date = new Date(); date.setDate(date.getDate() - i); const label = date.toLocaleDateString("uk-UA", { month: "short", - day: "numeric" + day: "numeric", }); labels.push(label); @@ -26,50 +26,52 @@ export const generateLabels = ( } return labels; -} +}; export const setPointValues = ( filterByDays: FilterByDaysOptions, setPointHitRadiusValue: React.Dispatch>, - setPointBorderWidthValue: React.Dispatch>, + setPointBorderWidthValue: React.Dispatch> ) => { switch (filterByDays) { case "30": - setPointHitRadiusValue(30) - setPointBorderWidthValue(4) + setPointHitRadiusValue(4); + setPointBorderWidthValue(30); break; case "90": - setPointHitRadiusValue(15) - setPointBorderWidthValue(3) + setPointHitRadiusValue(3); + setPointBorderWidthValue(15); break; case "180": - setPointHitRadiusValue(8) - setPointBorderWidthValue(2) + setPointHitRadiusValue(2); + setPointBorderWidthValue(8); break; default: break; } -} +}; export const setLineChartConfig = ( data: number[], labels: string[], pointBorderWidthValue: number, - pointHitRadiusValue: number, -): { chartData: ChartData, chartOptions: ChartOptions } => { + pointHitRadiusValue: number +): { chartData: ChartData; chartOptions: ChartOptions } => { const chartData: ChartData = { - labels: labels, - datasets: [{ - label: 'Витрати або надходження за категорією', - data, - fill: false, - borderColor: COLORS.PRIMARY, - tension: 0.4, - pointBackgroundColor: COLORS.PRIMARY, - pointBorderWidth: pointBorderWidthValue, - pointHitRadius: pointHitRadiusValue, - }] - } + labels, + datasets: [ + { + label: "Витрати або надходження за категорією", + data, + fill: false, + borderColor: COLORS.PRIMARY, + tension: 0.4, + pointBackgroundColor: COLORS.PRIMARY, + pointBorderWidth: pointBorderWidthValue, + pointHitRadius: pointHitRadiusValue, + }, + ], + }; const chartOptions: ChartOptions = { plugins: { @@ -113,5 +115,5 @@ export const setLineChartConfig = ( }, }; - return { chartData, chartOptions } -} \ No newline at end of file + return { chartData, chartOptions }; +}; diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index b5eb15a..54ac734 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -1,27 +1,23 @@ -import { useEffect, useState } from 'react'; +import { useEffect, useState } from "react"; -import { useForm } from 'react-hook-form'; +import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { getFilteredCategories } from '../../../store/categorySlice'; +import { getFilteredCategories } from "../../../store/categorySlice"; import { setActiveTransaction, setAddTransactionData, - transactionAction + transactionAction, } from "../../../store/transactionSlice"; -import { - formatTransactionDateToUTC -} from '../../../shared/utils/transactions/formatTransactionDate'; -import { - setSelectOptions -} from '../../../shared/utils/transactions/setSelectOptions'; -import { amountFieldRules } from '../../../shared/utils/field-rules/amount'; -import { setDetailsFieldRules } from '../../../shared/utils/field-rules/details'; +import { formatTransactionDateToUTC } from "../../../shared/utils/transactions/formatTransactionDate"; +import { setSelectOptions } from "../../../shared/utils/transactions/setSelectOptions"; +import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; +import { setDetailsFieldRules } from "../../../shared/utils/field-rules/details"; -import { userId } from '../../../api/api'; +import { userId } from "../../../api/api"; -import { Form } from '../../atoms/form/Form.styled'; +import { Form } from "../../atoms/form/Form.styled"; import { Box } from "../../atoms/box/Box.styled"; import { Button } from "../../atoms/button/Button.styled"; import { Label } from "../../atoms/label/Label.styled"; @@ -30,43 +26,48 @@ import { Typography } from "../../atoms/typography/Typography.styled"; import Select from "../../molecules/select/Select"; import Wallet from "../../molecules/wallet/Wallet"; import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; -import BaseField from '../../molecules/base-field/BaseField'; -import DatePicker from './DatePicker'; +import BaseField from "../../molecules/base-field/BaseField"; +import DatePicker from "./DatePicker"; -import COLORS from '../../../shared/styles/variables'; +import COLORS from "../../../shared/styles/variables"; -import { IWallet } from '../../../../types/wallet'; +import { IWallet } from "../../../../types/wallet"; import { ISwitchButton, SelectOptions, - TypeOfOutlay -} from '../../../../types/common'; + TypeOfOutlay, +} from "../../../../types/common"; const AddTransaction: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); - const { addTransactionData, isLoading } = useAppSelector(state => state.transaction); - const { categories } = useAppSelector(state => state.category); - const { wallets } = useAppSelector(state => state.wallet); - const { user } = useAppSelector(state => state.user); + const { addTransactionData, isLoading } = useAppSelector( + (state) => state.transaction + ); + const { categories } = useAppSelector((state) => state.category); + const { wallets } = useAppSelector((state) => state.wallet); + const { user } = useAppSelector((state) => state.user); - const selectedCategory = categories.all.find((c) => c.id === addTransactionData?.category) + const selectedCategory = categories.all.find( + (c) => c.id === addTransactionData?.category + ); - const [selectedCategoryValues, setSelectedCategoryValues] = useState({ - value: selectedCategory?.id, - label: selectedCategory?.title, - }); + const [selectedCategoryValues, setSelectedCategoryValues] = + useState({ + value: selectedCategory?.id, + label: selectedCategory?.title, + }); const isValid = Object.keys(addTransactionData || {})?.length >= 4; const selectOptions = setSelectOptions( addTransactionData?.type_of_outlay, categories - ) + ); const setSwitchButtonOptions = ( buttonName: string, - typeOfOutlay: TypeOfOutlay, + typeOfOutlay: TypeOfOutlay ): ISwitchButton => { return { buttonName, @@ -74,22 +75,24 @@ const AddTransaction: React.FC = () => { onTabClick: () => { if (addTransactionData?.type_of_outlay === typeOfOutlay) { return; - }; - dispatch(setAddTransactionData({ - type_of_outlay: typeOfOutlay, - category: categories[typeOfOutlay][0]?.id - })); + } + dispatch( + setAddTransactionData({ + type_of_outlay: typeOfOutlay, + category: categories[typeOfOutlay][0]?.id, + }) + ); setSelectedCategoryValues({ value: categories[typeOfOutlay][0]?.id, - label: categories[typeOfOutlay][0]?.title - }) + label: categories[typeOfOutlay][0]?.title, + }); }, - } - } + }; + }; const switchButtons: ISwitchButton[] = [ - setSwitchButtonOptions('Витрата', "expense"), - setSwitchButtonOptions('Надходження', "income"), + setSwitchButtonOptions("Витрата", "expense"), + setSwitchButtonOptions("Надходження", "income"), ]; const onWalletClick = (wallet: IWallet) => { @@ -100,36 +103,36 @@ const AddTransaction: React.FC = () => { dispatch(setAddTransactionData({ category: selectedValue?.value })); setSelectedCategoryValues({ value: selectedValue?.value, - label: selectedValue?.label + label: selectedValue?.label, }); - } + }; - const handleSub = ( - data: { - amount: string, - category: number, - title?: string - } - ) => { + const handleSub = (data: { + amount: string; + category: number; + title?: string; + }) => { let transactionTitle; - if (!getValues('title')) { + if (!getValues("title")) { transactionTitle = "New transaction"; } else { transactionTitle = data.title; } dispatch(setActiveTransaction(null)); - dispatch(transactionAction({ - data: { - ...addTransactionData, - amount_of_funds: data?.amount, - owner: user?.id || userId, - title: transactionTitle - }, - method: "POST" - })) - } + dispatch( + transactionAction({ + data: { + ...addTransactionData, + amount_of_funds: data?.amount, + owner: user?.id || userId, + title: transactionTitle, + }, + method: "POST", + }) + ); + }; const { register, @@ -141,64 +144,58 @@ const AddTransaction: React.FC = () => { } = useForm({ mode: "all" }); useEffect(() => { - clearErrors('category'); - setValue('category', addTransactionData?.category); + clearErrors("category"); + setValue("category", addTransactionData?.category); }, [addTransactionData?.category]); useEffect(() => { - dispatch(getFilteredCategories("?type_of_outlay=income")) - dispatch(getFilteredCategories("?type_of_outlay=expense")) + dispatch(getFilteredCategories("?type_of_outlay=income")); + dispatch(getFilteredCategories("?type_of_outlay=expense")); - dispatch(setAddTransactionData({ - created: formatTransactionDateToUTC(new Date()), - type_of_outlay: "expense", - category: categories.expense[0]?.id - })) + dispatch( + setAddTransactionData({ + created: formatTransactionDateToUTC(new Date()), + type_of_outlay: "expense", + category: categories.expense[0]?.id, + }) + ); }, []); useEffect(() => { setSelectedCategoryValues({ value: categories.expense[0]?.id, - label: categories.expense[0]?.title - }) - dispatch(setAddTransactionData({ - created: formatTransactionDateToUTC(new Date()), - type_of_outlay: "expense", - category: categories.expense[0]?.id - })) - setValue('category', selectedCategoryValues) + label: categories.expense[0]?.title, + }); + dispatch( + setAddTransactionData({ + created: formatTransactionDateToUTC(new Date()), + type_of_outlay: "expense", + category: categories.expense[0]?.id, + }) + ); + setValue("category", selectedCategoryValues); }, [categories.expense]); return ( - + Додати транзакцію - + - + Тип транзакції - + Час транзакції @@ -221,13 +218,15 @@ const AddTransaction: React.FC = () => {
- + @@ -173,7 +238,10 @@ const EditTransaction: React.FC = () => { label="Деталі (не обовʼязково)" errors={errors} name="title" - registerOptions={register('title', setDetailsFieldRules(clearErrors))} + registerOptions={register( + "title", + setDetailsFieldRules(clearErrors) + )} /> @@ -182,7 +250,7 @@ const EditTransaction: React.FC = () => { label="Сума" errors={errors} name="amount" - registerOptions={register('amount', amountFieldRules)} + registerOptions={register("amount", amountFieldRules)} /> @@ -190,15 +258,13 @@ const EditTransaction: React.FC = () => { primary width="100%" type="submit" - disabled={!isValid || !!errors?.amount || isLoading} - > + disabled={!isValid || !!errors?.amount || isLoading}> Зберегти @@ -211,6 +277,6 @@ const EditTransaction: React.FC = () => { ); -} +}; export default EditTransaction; diff --git a/src/components/pages/transactions/Transactions.tsx b/src/components/pages/transactions/Transactions.tsx index e75ac89..16abf4d 100644 --- a/src/components/pages/transactions/Transactions.tsx +++ b/src/components/pages/transactions/Transactions.tsx @@ -2,7 +2,7 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setActiveTransaction, setEditTransactionData, - setIsEditTransactionOpen + setIsEditTransactionOpen, } from "../../../store/transactionSlice"; import useFilterButtonOptions from "../../../shared/hooks/useFilterButtonOptions"; @@ -27,14 +27,15 @@ const renderTransactionItems = ( onTransactionClick: (transaction: ITransaction) => void ): React.ReactNode[] => { return transactions - .sort((a, b) => new Date(b.created).getTime() - new Date(a.created).getTime()) + .sort((a, b) => { + return new Date(b.created).getTime() - new Date(a.created).getTime(); + }) .map((transaction) => ( onTransactionClick(transaction)} - borderRadius="8px" - > + borderRadius="8px"> @@ -44,10 +45,9 @@ const renderTransactionItems = ( const Transactions: React.FC = () => { const dispatch = useAppDispatch(); - const { - transactions, - filterByTypeOfOutlay - } = useAppSelector(state => state.transaction); + const { transactions, filterByTypeOfOutlay } = useAppSelector( + (state) => state.transaction + ); const filterButtons = useFilterButtonOptions("transaction"); @@ -55,7 +55,7 @@ const Transactions: React.FC = () => { dispatch(setActiveTransaction(transaction)); dispatch(setEditTransactionData(transaction)); dispatch(setIsEditTransactionOpen(true)); - } + }; const transactionsData = (): Transactions => { let filteredTransactions: Transactions = {}; @@ -91,8 +91,7 @@ const Transactions: React.FC = () => { mr="10px" fw="600" color={COLORS.DARK_FOR_TEXT} - fz="12px" - > + fz="12px"> Відобразити @@ -106,9 +105,8 @@ const Transactions: React.FC = () => { borderRadius="16px" grow="1" overflow="auto" - height="100px" - > - {Object.entries(transactionsData).map(([date, transactions]) => ( + height="100px"> + {Object.entries(transactionsData()).map(([date, transactions]) => ( {formatTransactionDateToFullDate(date)} @@ -121,6 +119,6 @@ const Transactions: React.FC = () => { ); -} +}; -export default Transactions; \ No newline at end of file +export default Transactions; diff --git a/src/shared/utils/regexes.ts b/src/shared/utils/regexes.ts index 8558649..31d5dc8 100644 --- a/src/shared/utils/regexes.ts +++ b/src/shared/utils/regexes.ts @@ -4,9 +4,10 @@ export const twoSymbolsRegex = /^.{2,}$/; export const nameRegex = /^[A-Za-zА-Яа-яІіЇїЄєҐґ\s-']{2,}$/; -export const titleRegex = /^(?=.*[A-Za-zА-Яа-яІіЇїЄєҐґ])[A-Za-zА-Яа-яІіЇїЄєҐґ0-9\s-'()]+$/; +export const titleRegex = + /^(?=.*[A-Za-zА-Яа-яІіЇїЄєҐґ])[A-Za-zА-Яа-яІіЇїЄєҐґ0-9\s-',()]+$/; export const passwordRegex = - /^(?=.*[A-Za-z])(?=.*\d)(?=.*[!\"#$%&'()*+,-.\/:;<=>?@[\\\]^_`{|}~])[A-Za-z\d!\"#$%&'()*+,-.\/:;<=>?@[\\\]^_`{|}~]{8,}$/; + /^(?=.*[A-Za-z])(?=.*\d)(?=.*[!"#$%&'()*+,-./:;<=>?@[\\\]^_`{|}~])[A-Za-z\d!"#$%&'()*+,-./:;<=>?@[\\\]^_`{|}~]{8,}$/; -export const emailRegex = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/ \ No newline at end of file +export const emailRegex = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; diff --git a/src/store/categorySlice.ts b/src/store/categorySlice.ts index c92fd5c..2f306fa 100644 --- a/src/store/categorySlice.ts +++ b/src/store/categorySlice.ts @@ -1,86 +1,77 @@ -import { createSlice, createAsyncThunk, } from '@reduxjs/toolkit'; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; -import { getUserDetails } from './userSlice'; +import { getUserDetails } from "./userSlice"; -import { updateCategories } from '../shared/utils/store/updateCategories'; +import { updateCategories } from "../shared/utils/store/updateCategories"; -import { $api, CATEGORY_PATH } from '../api/api'; +import { $api, CATEGORY_PATH } from "../api/api"; -import { CategoryState, ICategory } from '../../types/category'; -import { MethodTypes } from '../../types/common'; +import { CategoryState, ICategory } from "../../types/category"; +import { MethodTypes } from "../../types/common"; type CategoryActionPayload = { method: MethodTypes; data?: ICategory; id?: string; -} +}; export const categoryAction = createAsyncThunk< ICategory[], CategoryActionPayload, { rejectValue: string } ->( - 'category/categoryAction', - async (payload, { rejectWithValue }) => { - const { method, data, id } = payload; - - if (method !== "GET") { - try { - const response = await $api({ - method, - url: `${CATEGORY_PATH}${id ? (id + '/') : ''}`, - data: data || {}, - }); - - return response?.data; - } catch (error) { - return rejectWithValue('Помилка'); - } - } +>("category/categoryAction", async (payload, { rejectWithValue }) => { + const { method, data, id } = payload; + if (method !== "GET") { try { - const response = await $api.get(CATEGORY_PATH); + const response = await $api({ + method, + url: `${CATEGORY_PATH}${id ? `${id}/` : ""}`, + data: data || {}, + }); + return response?.data; } catch (error) { - return rejectWithValue('Помилка'); + return rejectWithValue("Помилка"); } } -); + + try { + const response = await $api.get(CATEGORY_PATH); + return response?.data; + } catch (error) { + return rejectWithValue("Помилка"); + } +}); export const getCategories = createAsyncThunk< ICategory[], undefined, { rejectValue: string } ->( - 'category/getCategories', - async (_, { rejectWithValue }) => { - try { - const response = await $api.get(CATEGORY_PATH); - return response?.data; - } catch (error) { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - } +>("category/getCategories", async (_, { rejectWithValue }) => { + try { + const response = await $api.get(CATEGORY_PATH); + return response?.data; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); } -); +}); export const getFilteredCategories = createAsyncThunk< - { data: ICategory[], params: string }, + { data: ICategory[]; params: string }, string, { rejectValue: string } ->( - 'transaction/getFilteredCategories', - async (params, { rejectWithValue }) => { - try { - const response = await $api.get(`${CATEGORY_PATH}${params}`); - const data = response?.data; - return { data, params }; - } catch (error) { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - } +>("transaction/getFilteredCategories", async (params, { rejectWithValue }) => { + try { + const response = await $api.get(`${CATEGORY_PATH}${params}`); + const data = response?.data; + return { data, params }; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); } -); +}); const initialState: CategoryState = { filterByTypeOfOutlay: "all", @@ -100,10 +91,10 @@ const initialState: CategoryState = { isEditCategorySuccess: false, isDeleteCategorySuccess: false, isEditCategoryOpen: false, -} +}; const categorySlice = createSlice({ - name: 'category', + name: "category", initialState, reducers: { resetCategoryState: (state) => { @@ -132,13 +123,13 @@ const categorySlice = createSlice({ state.addCategoryData = { ...state.addCategoryData, ...action.payload, - } + }; }, setEditCategoryData: (state, action) => { state.editCategoryData = { ...state.editCategoryData, ...action.payload, - } + }; }, setSuccessStatus: (state, action) => { state.isAddCategorySuccess = action.payload; @@ -187,7 +178,7 @@ const categorySlice = createSlice({ state.error = null; }) .addCase(getFilteredCategories.fulfilled, (state, action) => { - updateCategories(state, action) + updateCategories(state, action); state.isLoading = false; }) .addCase(getFilteredCategories.rejected, (state, action) => { @@ -205,8 +196,8 @@ const categorySlice = createSlice({ .addCase(getUserDetails.rejected, (state, action) => { state.isLoading = false; state.error = action.payload; - }) - } + }); + }, }); export const { @@ -220,7 +211,7 @@ export const { setAddCategoryData, setEditCategoryData, setSuccessStatus, - setIsEditCategoryOpen + setIsEditCategoryOpen, } = categorySlice.actions; export default categorySlice.reducer; diff --git a/src/store/transactionSlice.ts b/src/store/transactionSlice.ts index cd00525..d3c365b 100644 --- a/src/store/transactionSlice.ts +++ b/src/store/transactionSlice.ts @@ -1,70 +1,69 @@ -import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; -import { getUserDetails } from './userSlice'; +import { getUserDetails } from "./userSlice"; -import { updateTransactions } from '../shared/utils/store/updateTransactions'; +import { updateTransactions } from "../shared/utils/store/updateTransactions"; -import { $api, TRANSACTION_PATH } from '../api/api'; +import { $api, TRANSACTION_PATH } from "../api/api"; -import { MethodTypes } from '../../types/common'; -import { ITransaction, TransactionState, Transactions } from '../../types/transactions'; +import { MethodTypes } from "../../types/common"; +import { + ITransaction, + TransactionState, + Transactions, +} from "../../types/transactions"; type TransactionActionPayload = { method: MethodTypes; data?: ITransaction; id?: string; -} +}; export const transactionAction = createAsyncThunk< Transactions, TransactionActionPayload, { rejectValue: string } ->( - 'transaction/transactionAction', - async (payload, { rejectWithValue }) => { - const { method, data, id } = payload; - - try { - if (method !== "GET") { - const response = await $api({ - method, - url: `${TRANSACTION_PATH}${id ? (id + '/') : ''}`, - data: data || {}, - }); - return response.data; - } else { - const response = await $api.get(TRANSACTION_PATH); - return response.data; - } - } catch (error) { - return rejectWithValue('Помилка'); +>("transaction/transactionAction", async (payload, { rejectWithValue }) => { + const { method, data, id } = payload; + + try { + if (method !== "GET") { + const response = await $api({ + method, + url: `${TRANSACTION_PATH}${id ? `${id}/` : ""}`, + data: data || {}, + }); + return response.data; } + + const response = await $api.get(TRANSACTION_PATH); + + return response.data; + } catch (error) { + return rejectWithValue("Помилка"); } -); +}); export const getTransactions = createAsyncThunk< Transactions, undefined, { rejectValue: string } ->( - 'transaction/getTransactions', - async (_, { rejectWithValue }) => { - try { - const response = await $api.get(TRANSACTION_PATH); - return response.data; - } catch (error) { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - } +>("transaction/getTransactions", async (_, { rejectWithValue }) => { + try { + const response = await $api.get(TRANSACTION_PATH); + return response.data; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); } -); +}); export const getFilteredTransactions = createAsyncThunk< - { data: Transactions, params: string }, + { data: Transactions; params: string }, string, { rejectValue: string } >( - 'transaction/getFilteredTransactions', + "transaction/getFilteredTransactions", async (params, { rejectWithValue }) => { try { const res = await $api.get(`${TRANSACTION_PATH}${params}`); @@ -93,10 +92,10 @@ const initialState: TransactionState = { isEditTransactionSuccess: false, isDeleteTransactionSuccess: false, isEditTransactionOpen: false, -} +}; const transactionSlice = createSlice({ - name: 'transaction', + name: "transaction", initialState, reducers: { resetTransactionState: () => { @@ -119,13 +118,13 @@ const transactionSlice = createSlice({ state.addTransactionData = { ...state.addTransactionData, ...action.payload, - } + }; }, setEditTransactionData: (state, action) => { state.editTransactionData = { ...state.editTransactionData, ...action.payload, - } + }; }, setSuccessStatus: (state, action) => { state.isAddTransactionSuccess = action.payload; @@ -175,7 +174,7 @@ const transactionSlice = createSlice({ }) .addCase(getFilteredTransactions.fulfilled, (state, action) => { state.isLoading = false; - updateTransactions(state, action) + updateTransactions(state, action); }) .addCase(getFilteredTransactions.rejected, (state, action) => { state.isLoading = false; @@ -192,8 +191,8 @@ const transactionSlice = createSlice({ .addCase(getUserDetails.rejected, (state, action) => { state.isLoading = false; state.error = action.payload; - }) - } + }); + }, }); export const { @@ -205,7 +204,7 @@ export const { setAddTransactionData, setEditTransactionData, setSuccessStatus, - setIsEditTransactionOpen + setIsEditTransactionOpen, } = transactionSlice.actions; export default transactionSlice.reducer; diff --git a/src/store/walletSlice.ts b/src/store/walletSlice.ts index 181ff13..e95dd78 100644 --- a/src/store/walletSlice.ts +++ b/src/store/walletSlice.ts @@ -1,10 +1,10 @@ -import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; -import { $api, WALLET_PATH } from '../api/api'; +import { $api, WALLET_PATH } from "../api/api"; -import { DataEntryFormData, UserState } from '../../types/user'; -import { MethodTypes } from '../../types/common'; -import { IWallet } from '../../types/wallet'; +import { DataEntryFormData, UserState } from "../../types/user"; +import { MethodTypes } from "../../types/common"; +import { IWallet } from "../../types/wallet"; type WalletState = { wallets: IWallet[]; @@ -16,101 +16,97 @@ type WalletState = { isEditWalletSuccess: boolean; isDeleteWalletSuccess: boolean; entryDataError: string | null; -} +}; type WalletActionPayload = { method: MethodTypes; data?: IWallet; id?: string; -} +}; export const walletAction = createAsyncThunk< IWallet[], WalletActionPayload, { rejectValue: string } ->( - 'wallet/walletAction', - async (payload, { rejectWithValue }) => { - const { method, data, id } = payload; - - if (method !== "GET") { - try { - const response = await $api({ - method, - url: `${WALLET_PATH}${id ? (id + '/') : ''}`, - data: data || {}, - }); - return response.data; - } catch (error) { - return rejectWithValue('Помилка'); - } - } +>("wallet/walletAction", async (payload, { rejectWithValue }) => { + const { method, data, id } = payload; + if (method !== "GET") { try { - const response = await $api.get(WALLET_PATH); + const response = await $api({ + method, + url: `${WALLET_PATH}${id ? `${id}/` : ""}`, + data: data || {}, + }); return response.data; } catch (error) { - return rejectWithValue(`Помилка`); + return rejectWithValue("Помилка"); } } -); + + try { + const response = await $api.get(WALLET_PATH); + return response.data; + } catch (error) { + return rejectWithValue(`Помилка`); + } +}); export const getWallets = createAsyncThunk< IWallet[], undefined, { rejectValue: string } ->( - 'wallet/getWallets', - async (_, { rejectWithValue }) => { - try { - const response = await $api.get(WALLET_PATH); - return response.data; - } catch (error) { - return rejectWithValue("error in get wallets"); - } +>("wallet/getWallets", async (_, { rejectWithValue }) => { + try { + const response = await $api.get(WALLET_PATH); + return response.data; + } catch (error) { + return rejectWithValue("error in get wallets"); } -); +}); export const postEntryData = createAsyncThunk< undefined, DataEntryFormData, - { rejectValue: string, state: { user: UserState } } ->( - 'wallet/postEntryData', - async (data, { rejectWithValue }) => { - const { amountAccount, availableCash, cardAccountName, userId } = data; - - if (!userId) { - return rejectWithValue('Помилка при внесенні рахунків. Спочатку створіть акаунт.'); - } - - const cashWallet: IWallet = { - title: "Готівка", - amount: availableCash, - owner: userId, - type_of_account: "cash", - }; - const bankWallet: IWallet = { - title: cardAccountName, - amount: amountAccount, - owner: userId, - type_of_account: "bank", - }; - - try { - const postCashWalletResponse = await $api.post(WALLET_PATH, cashWallet); - const postBankWalletResponse = await $api.post(WALLET_PATH, bankWallet); - - if (postCashWalletResponse.status !== 201 || postBankWalletResponse.status !== 201) { - return rejectWithValue('Can\'t create wallets. Server error.'); - } + { rejectValue: string; state: { user: UserState } } +>("wallet/postEntryData", async (data, { rejectWithValue }) => { + const { amountAccount, availableCash, cardAccountName, userId } = data; + + if (!userId) { + return rejectWithValue( + "Помилка при внесенні рахунків. Спочатку створіть акаунт." + ); + } - localStorage.setItem("isDataEntrySuccess", "true"); - } catch (error) { - return rejectWithValue('Помилка при створенні рахунку'); + const cashWallet: IWallet = { + title: "Готівка", + amount: availableCash, + owner: userId, + type_of_account: "cash", + }; + const bankWallet: IWallet = { + title: cardAccountName, + amount: amountAccount, + owner: userId, + type_of_account: "bank", + }; + + try { + const postCashWalletResponse = await $api.post(WALLET_PATH, cashWallet); + const postBankWalletResponse = await $api.post(WALLET_PATH, bankWallet); + + if ( + postCashWalletResponse.status !== 201 || + postBankWalletResponse.status !== 201 + ) { + return rejectWithValue("Can't create wallets. Server error."); } + + localStorage.setItem("isDataEntrySuccess", "true"); + } catch (error) { + return rejectWithValue("Помилка при створенні рахунку"); } -); +}); const initialState: WalletState = { wallets: [], @@ -122,10 +118,10 @@ const initialState: WalletState = { isEditWalletSuccess: false, isDeleteWalletSuccess: false, entryDataError: null, -} +}; const walletSlice = createSlice({ - name: 'wallet', + name: "wallet", initialState, reducers: { resetWalletState: (state) => { @@ -172,7 +168,7 @@ const walletSlice = createSlice({ state.wallets = action.payload; }) .addCase(getWallets.rejected, (state, action) => { - state.error = action.payload + state.error = action.payload; }) .addCase(postEntryData.pending, (state) => { @@ -186,8 +182,8 @@ const walletSlice = createSlice({ .addCase(postEntryData.rejected, (state, action) => { state.isLoading = false; state.entryDataError = action.payload; - }) - } + }); + }, }); export const { diff --git a/yarn.lock b/yarn.lock index 2d4bad9..ba1b7c7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2122,7 +2122,7 @@ JSONStream@^1.0.4: jsonparse "^1.2.0" through ">=2.2.7 <3" -accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.8: +accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7, accepts@~1.3.8: version "1.3.8" resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.8.tgz#0bf0be125b67014adcb0b0921e62db7bffe16b2e" integrity sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw== @@ -2416,6 +2416,13 @@ balanced-match@^1.0.0: resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw== +basic-auth@~2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/basic-auth/-/basic-auth-2.0.1.tgz#b998279bf47ce38344b4f3cf916d4679bbf51e3a" + integrity sha512-NF+epuEdnUYVlGuhaxbbq+dvJttwLnGY+YixlXlME5KpQ5W3CnXA5cVTneY3SPbPDRkcjMbifrwmFYcClgOZeg== + dependencies: + safe-buffer "5.1.2" + batch@0.6.1: version "0.6.1" resolved "https://registry.yarnpkg.com/batch/-/batch-0.6.1.tgz#dc34314f4e679318093fc760272525f94bf25c16" @@ -2449,6 +2456,24 @@ body-parser@1.20.1: type-is "~1.6.18" unpipe "1.0.0" +body-parser@^1.19.0: + version "1.20.2" + resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.2.tgz#6feb0e21c4724d06de7ff38da36dad4f57a747fd" + integrity sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA== + dependencies: + bytes "3.1.2" + content-type "~1.0.5" + debug "2.6.9" + depd "2.0.0" + destroy "1.2.0" + http-errors "2.0.0" + iconv-lite "0.4.24" + on-finished "2.4.1" + qs "6.11.0" + raw-body "2.5.2" + type-is "~1.6.18" + unpipe "1.0.0" + bonjour-service@^1.0.11: version "1.1.1" resolved "https://registry.yarnpkg.com/bonjour-service/-/bonjour-service-1.1.1.tgz#960948fa0e0153f5d26743ab15baf8e33752c135" @@ -2494,6 +2519,13 @@ buffer-from@^1.0.0: resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.2.tgz#2b146a6fd72e80b4f55d255f35ed59a3a9a41bd5" integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ== +builtins@^5.0.1: + version "5.0.1" + resolved "https://registry.yarnpkg.com/builtins/-/builtins-5.0.1.tgz#87f6db9ab0458be728564fa81d876d8d74552fa9" + integrity sha512-qwVpFEHNfhYJIzNRBvd2C1kyo6jz3ZSMPyyuR47OPdiKWlbYnZNyDWuyR175qDnAJLiCo5fBBqPb3RiXgWlkOQ== + dependencies: + semver "^7.0.0" + bytes@3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048" @@ -2563,7 +2595,7 @@ chalk@^2.0.0: escape-string-regexp "^1.0.5" supports-color "^5.3.0" -chalk@^4.0.0, chalk@^4.1.0: +chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.2: version "4.1.2" resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01" integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA== @@ -2742,6 +2774,11 @@ connect-history-api-fallback@^2.0.0: resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz#647264845251a0daf25b97ce87834cace0f5f1c8" integrity sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA== +connect-pause@^0.1.1: + version "0.1.1" + resolved "https://registry.yarnpkg.com/connect-pause/-/connect-pause-0.1.1.tgz#b269b2bb82ddb1ac3db5099c0fb582aba99fb37a" + integrity sha512-a1gSWQBQD73krFXdUEYJom2RTFrWUL3YvXDCRkyv//GVXc79cdW9MngtRuN9ih4FDKBtfJAJId+BbDuX+1rh2w== + content-disposition@0.5.4: version "0.5.4" resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.4.tgz#8b82b4efac82512a02bb0b1dcec9d2c5e8eb5bfe" @@ -2749,7 +2786,7 @@ content-disposition@0.5.4: dependencies: safe-buffer "5.2.1" -content-type@~1.0.4: +content-type@~1.0.4, content-type@~1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.5.tgz#8b773162656d1d1086784c8f23a54ce6d73d7918" integrity sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA== @@ -2815,6 +2852,14 @@ core-util-is@~1.0.0: resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.3.tgz#a6042d3634c2b27e9328f837b965fac83808db85" integrity sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ== +cors@^2.8.5: + version "2.8.5" + resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29" + integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g== + dependencies: + object-assign "^4" + vary "^1" + cosmiconfig-typescript-loader@^4.0.0: version "4.3.0" resolved "https://registry.yarnpkg.com/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-4.3.0.tgz#c4259ce474c9df0f32274ed162c0447c951ef073" @@ -2939,6 +2984,13 @@ date-fns@^2.0.1, date-fns@^2.24.0, date-fns@^2.29.3: resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.29.3.tgz#27402d2fc67eb442b511b70bbdf98e6411cd68a8" integrity sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA== +debug@*, debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4: + version "4.3.4" + resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865" + integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ== + dependencies: + ms "2.1.2" + debug@2.6.9: version "2.6.9" resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f" @@ -2946,6 +2998,13 @@ debug@2.6.9: dependencies: ms "2.0.0" +debug@3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261" + integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g== + dependencies: + ms "2.0.0" + debug@^3.2.7: version "3.2.7" resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a" @@ -2953,13 +3012,6 @@ debug@^3.2.7: dependencies: ms "^2.1.1" -debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4: - version "4.3.4" - resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865" - integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ== - dependencies: - ms "2.1.2" - decamelize-keys@^1.1.0: version "1.1.1" resolved "https://registry.yarnpkg.com/decamelize-keys/-/decamelize-keys-1.1.1.tgz#04a2d523b2f18d80d0158a43b895d56dff8d19d8" @@ -3008,7 +3060,7 @@ delayed-stream@~1.0.0: resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" integrity sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ== -depd@2.0.0: +depd@2.0.0, depd@~2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/depd/-/depd-2.0.0.tgz#b696163cc757560d09cf22cc8fad1571b79e76df" integrity sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw== @@ -3198,6 +3250,14 @@ error-stack-parser@^2.0.6: dependencies: stackframe "^1.3.4" +errorhandler@^1.5.1: + version "1.5.1" + resolved "https://registry.yarnpkg.com/errorhandler/-/errorhandler-1.5.1.tgz#b9ba5d17cf90744cd1e851357a6e75bf806a9a91" + integrity sha512-rcOwbfvP1WTViVoUjcfZicVzjhjTuhSMntHh6mW3IrEiyE6mJyXvsToJUJGlGlw/2xU9P5whlWNGlIDVeCiT4A== + dependencies: + accepts "~1.3.7" + escape-html "~1.0.3" + es-abstract@^1.19.0, es-abstract@^1.20.4: version "1.21.2" resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.21.2.tgz#a56b9695322c8a185dc25975aa3b8ec31d0e7eff" @@ -3312,6 +3372,16 @@ eslint-config-prettier@^8.8.0: resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.8.0.tgz#bfda738d412adc917fd7b038857110efe98c9348" integrity sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA== +eslint-config-standard-jsx@^11.0.0: + version "11.0.0" + resolved "https://registry.yarnpkg.com/eslint-config-standard-jsx/-/eslint-config-standard-jsx-11.0.0.tgz#70852d395731a96704a592be5b0bfaccfeded239" + integrity sha512-+1EV/R0JxEK1L0NGolAr8Iktm3Rgotx3BKwgaX+eAuSX8D952LULKtjgZD3F+e6SvibONnhLwoTi9DPxN5LvvQ== + +eslint-config-standard@17.1.0: + version "17.1.0" + resolved "https://registry.yarnpkg.com/eslint-config-standard/-/eslint-config-standard-17.1.0.tgz#40ffb8595d47a6b242e07cbfd49dc211ed128975" + integrity sha512-IwHwmaBNtDK4zDHQukFDW5u/aTb8+meQWZvNFWkiGmbWjD6bqyuSSBxxXKkCftCUzc1zwCH2m/baCNDLGmuO5Q== + eslint-import-resolver-node@^0.3.7: version "0.3.7" resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.7.tgz#83b375187d412324a1963d84fa664377a23eb4d7" @@ -3328,6 +3398,14 @@ eslint-module-utils@^2.7.4: dependencies: debug "^3.2.7" +eslint-plugin-es@^4.1.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-es/-/eslint-plugin-es-4.1.0.tgz#f0822f0c18a535a97c3e714e89f88586a7641ec9" + integrity sha512-GILhQTnjYE2WorX5Jyi5i4dz5ALWxBIdQECVQavL6s7cI76IZTDWleTHkxz/QT3kvcs2QlGHvKLYsSlPOlPXnQ== + dependencies: + eslint-utils "^2.0.0" + regexpp "^3.0.0" + eslint-plugin-import@^2.27.5: version "2.27.5" resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.27.5.tgz#876a6d03f52608a3e5bb439c2550588e51dd6c65" @@ -3371,6 +3449,20 @@ eslint-plugin-jsx-a11y@^6.7.1: object.fromentries "^2.0.6" semver "^6.3.0" +eslint-plugin-n@^15.7.0: + version "15.7.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-n/-/eslint-plugin-n-15.7.0.tgz#e29221d8f5174f84d18f2eb94765f2eeea033b90" + integrity sha512-jDex9s7D/Qial8AGVIHq4W7NswpUD5DPDL2RH8Lzd9EloWUuvUkHfv4FRLMipH5q2UtyurorBkPeNi1wVWNh3Q== + dependencies: + builtins "^5.0.1" + eslint-plugin-es "^4.1.0" + eslint-utils "^3.0.0" + ignore "^5.1.1" + is-core-module "^2.11.0" + minimatch "^3.1.2" + resolve "^1.22.1" + semver "^7.3.8" + eslint-plugin-prettier@^4.2.1: version "4.2.1" resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz#651cbb88b1dab98bfd42f017a12fa6b2d993f94b" @@ -3378,6 +3470,11 @@ eslint-plugin-prettier@^4.2.1: dependencies: prettier-linter-helpers "^1.0.0" +eslint-plugin-promise@^6.1.1: + version "6.1.1" + resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz#269a3e2772f62875661220631bd4dafcb4083816" + integrity sha512-tjqWDwVZQo7UIPMeDReOpUgHCmCiH+ePnVT+5zVapL0uuHnegBUs2smM13CzOs2Xb5+MHMRFTs9v24yjba4Oig== + eslint-plugin-react@^7.32.2: version "7.32.2" resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.32.2.tgz#e71f21c7c265ebce01bcbc9d0955170c55571f10" @@ -3415,12 +3512,36 @@ eslint-scope@^7.2.0: esrecurse "^4.3.0" estraverse "^5.2.0" +eslint-utils@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.1.0.tgz#d2de5e03424e707dc10c74068ddedae708741b27" + integrity sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg== + dependencies: + eslint-visitor-keys "^1.1.0" + +eslint-utils@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-3.0.0.tgz#8aebaface7345bb33559db0a1f13a1d2d48c3672" + integrity sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA== + dependencies: + eslint-visitor-keys "^2.0.0" + +eslint-visitor-keys@^1.1.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e" + integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ== + +eslint-visitor-keys@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303" + integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw== + eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1: version "3.4.1" resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz#c22c48f48942d08ca824cc526211ae400478a994" integrity sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA== -eslint@^8.44.0: +eslint@^8.41.0, eslint@^8.44.0: version "8.44.0" resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.44.0.tgz#51246e3889b259bbcd1d7d736a0c10add4f0e500" integrity sha512-0wpHoUbDUHgNCyvFB5aXLiQVfK9B0at6gUvzy83k4kAsQ/u769TQDX6iKC+aO4upIHO9WSaA3QoXYQDHbNwf1A== @@ -3533,7 +3654,15 @@ execa@^5.0.0: signal-exit "^3.0.3" strip-final-newline "^2.0.0" -express@^4.17.3: +express-urlrewrite@^1.4.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/express-urlrewrite/-/express-urlrewrite-1.4.0.tgz#985ee022773bac7ed32126f1cf9ec8ee48e1290a" + integrity sha512-PI5h8JuzoweS26vFizwQl6UTF25CAHSggNv0J25Dn/IKZscJHWZzPrI5z2Y2jgOzIaw2qh8l6+/jUcig23Z2SA== + dependencies: + debug "*" + path-to-regexp "^1.0.3" + +express@^4.17.1, express@^4.17.3: version "4.18.2" resolved "https://registry.yarnpkg.com/express/-/express-4.18.2.tgz#3fabe08296e930c796c19e3c516979386ba9fd59" integrity sha512-5/PsL6iGPdfQ/lKM1UuielYgv3BUoJfz1aUwU9vHZ+J7gyvwdQXFEBIEIaxeGf0GIcreATNyBExtalisDbuMqQ== @@ -3669,6 +3798,13 @@ find-root@^1.1.0: resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4" integrity sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng== +find-up@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/find-up/-/find-up-3.0.0.tgz#49169f1d7993430646da61ecc5ae355c21c97b73" + integrity sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg== + dependencies: + locate-path "^3.0.0" + find-up@^4.0.0, find-up@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/find-up/-/find-up-4.1.0.tgz#97afe7d6cdc0bc5928584b7c8d7b16e8a9aa5d19" @@ -3802,6 +3938,11 @@ get-intrinsic@^1.1.1, get-intrinsic@^1.1.3, get-intrinsic@^1.2.0: has-proto "^1.0.1" has-symbols "^1.0.3" +get-stdin@^8.0.0: + version "8.0.0" + resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-8.0.0.tgz#cbad6a73feb75f6eeb22ba9e01f89aa28aa97a53" + integrity sha512-sY22aA6xchAzprjyqmSEQv4UbAAzRN0L2dQB0NlN5acTTK9Don6nhoc3eAbUnpZiCANAMfd/+40kVdKfFygohg== + get-stream@^6.0.0: version "6.0.1" resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-6.0.1.tgz#a262d8eef67aced57c2852ad6167526a43cbf7b7" @@ -3902,7 +4043,7 @@ gopd@^1.0.1: dependencies: get-intrinsic "^1.1.3" -graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9: +graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.3, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9: version "4.2.11" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.11.tgz#4183e4e8bf08bb6e05bbb2f7d2e0c8f712ca40e3" integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ== @@ -4114,7 +4255,7 @@ icss-utils@^5.0.0, icss-utils@^5.1.0: resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-5.1.0.tgz#c6be6858abd013d768e98366ae47e25d5887b1ae" integrity sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA== -ignore@^5.2.0: +ignore@^5.1.1, ignore@^5.2.0: version "5.2.4" resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324" integrity sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ== @@ -4325,6 +4466,11 @@ is-plain-object@^2.0.4: dependencies: isobject "^3.0.1" +is-promise@^2.1.0: + version "2.2.2" + resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.2.2.tgz#39ab959ccbf9a774cf079f7b40c7a26f763135f1" + integrity sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ== + is-regex@^1.1.4: version "1.1.4" resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958" @@ -4391,6 +4537,11 @@ is-wsl@^2.2.0: dependencies: is-docker "^2.0.0" +isarray@0.0.1: + version "0.0.1" + resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf" + integrity sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ== + isarray@~1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11" @@ -4415,6 +4566,11 @@ jest-worker@^27.4.5: merge-stream "^2.0.0" supports-color "^8.0.0" +jju@^1.1.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/jju/-/jju-1.4.0.tgz#a3abe2718af241a2b2904f84a625970f389ae32a" + integrity sha512-8wb9Yw966OSxApiCt0K3yNJL8pnNeIv+OEq2YMidz4FKP6nonSRoOXc80iXY4JaN2FC11B9qsNmDsm+ZOfMROA== + "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" @@ -4437,11 +4593,23 @@ jsesc@~0.5.0: resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d" integrity sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA== +json-parse-better-errors@^1.0.1: + version "1.0.2" + resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" + integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw== + json-parse-even-better-errors@^2.3.0, json-parse-even-better-errors@^2.3.1: version "2.3.1" resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d" integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w== +json-parse-helpfulerror@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz#13f14ce02eed4e981297b64eb9e3b932e2dd13dc" + integrity sha512-XgP0FGR77+QhUxjXkwOMkC94k3WtqEBfcnjWqhRd82qTat4SWKRE+9kUnynz/shm3I4ea2+qISvTIeGTNU7kJg== + dependencies: + jju "^1.1.0" + json-schema-traverse@^0.4.1: version "0.4.1" resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660" @@ -4452,6 +4620,32 @@ json-schema-traverse@^1.0.0: resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz#ae7bcb3656ab77a73ba5c49bf654f38e6b6860e2" integrity sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug== +json-server@^0.17.3: + version "0.17.3" + resolved "https://registry.yarnpkg.com/json-server/-/json-server-0.17.3.tgz#c641884189aad59f101f7ad9f519fa3c4c3cff14" + integrity sha512-LDNOvleTv3rPAcefzXZpXMDZshV0FtSzWo8ZjnTOhKm4OCiUvsYGrGrfz4iHXIFd+UbRgFHm6gcOHI/BSZ/3fw== + dependencies: + body-parser "^1.19.0" + chalk "^4.1.2" + compression "^1.7.4" + connect-pause "^0.1.1" + cors "^2.8.5" + errorhandler "^1.5.1" + express "^4.17.1" + express-urlrewrite "^1.4.0" + json-parse-helpfulerror "^1.0.3" + lodash "^4.17.21" + lodash-id "^0.14.1" + lowdb "^1.0.0" + method-override "^3.0.0" + morgan "^1.10.0" + nanoid "^3.1.23" + please-upgrade-node "^3.2.0" + pluralize "^8.0.0" + server-destroy "^1.0.1" + standard "^17.0.0" + yargs "^17.0.1" + json-stable-stringify-without-jsonify@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651" @@ -4531,6 +4725,17 @@ lines-and-columns@^1.1.6: resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632" integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg== +load-json-file@^5.2.0: + version "5.3.0" + resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-5.3.0.tgz#4d3c1e01fa1c03ea78a60ac7af932c9ce53403f3" + integrity sha512-cJGP40Jc/VXUsp8/OrnyKyTZ1y6v/dphm3bioS+RrKXjK2BB6wHUd6JptZEFDGgGahMT+InnZO5i1Ei9mpC8Bw== + dependencies: + graceful-fs "^4.1.15" + parse-json "^4.0.0" + pify "^4.0.1" + strip-bom "^3.0.0" + type-fest "^0.3.0" + loader-runner@^4.2.0: version "4.3.0" resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.3.0.tgz#c1b4a163b99f614830353b16755e7149ac2314e1" @@ -4545,6 +4750,14 @@ loader-utils@^2.0.0, loader-utils@^2.0.4: emojis-list "^3.0.0" json5 "^2.1.2" +locate-path@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-3.0.0.tgz#dbec3b3ab759758071b58fe59fc41871af21400e" + integrity sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A== + dependencies: + p-locate "^3.0.0" + path-exists "^3.0.0" + locate-path@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-5.0.0.tgz#1afba396afd676a6d42504d0a67a3a7eb9f62aa0" @@ -4559,6 +4772,11 @@ locate-path@^6.0.0: dependencies: p-locate "^5.0.0" +lodash-id@^0.14.1: + version "0.14.1" + resolved "https://registry.yarnpkg.com/lodash-id/-/lodash-id-0.14.1.tgz#dffa1f1f8b90d1803bb0d70b7d7547e10751e80b" + integrity sha512-ikQPBTiq/d5m6dfKQlFdIXFzvThPi2Be9/AHxktOnDSfSxE1j9ICbBT5Elk1ke7HSTgM38LHTpmJovo9/klnLg== + lodash.camelcase@^4.3.0: version "4.3.0" resolved "https://registry.yarnpkg.com/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz#b28aa6288a2b9fc651035c7711f65ab6190331a6" @@ -4614,7 +4832,7 @@ lodash.upperfirst@^4.3.1: resolved "https://registry.yarnpkg.com/lodash.upperfirst/-/lodash.upperfirst-4.3.1.tgz#1365edf431480481ef0d1c68957a5ed99d49f7ce" integrity sha512-sReKOYJIJf74dhJONhU4e0/shzi1trVbSWDOhKYE5XV2O+H7Sb2Dihwuc7xWxVl+DgFPyTqIN3zMfT9cq5iWDg== -lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21: +lodash@4, lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21: version "4.17.21" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== @@ -4626,6 +4844,17 @@ loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0: dependencies: js-tokens "^3.0.0 || ^4.0.0" +lowdb@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/lowdb/-/lowdb-1.0.0.tgz#5243be6b22786ccce30e50c9a33eac36b20c8064" + integrity sha512-2+x8esE/Wb9SQ1F9IHaYWfsC9FIecLOPrK4g17FGEayjUWH172H6nwicRovGvSE2CPZouc2MCIqCI7h9d+GftQ== + dependencies: + graceful-fs "^4.1.3" + is-promise "^2.1.0" + lodash "4" + pify "^3.0.0" + steno "^0.4.1" + lower-case@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-2.0.2.tgz#6fa237c63dbdc4a82ca0fd882e4722dc5e634e28" @@ -4723,6 +4952,16 @@ merge2@^1.3.0, merge2@^1.4.1: resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae" integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg== +method-override@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/method-override/-/method-override-3.0.0.tgz#6ab0d5d574e3208f15b0c9cf45ab52000468d7a2" + integrity sha512-IJ2NNN/mSl9w3kzWB92rcdHpz+HjkxhDJWNDBqSlas+zQdP8wBiJzITPg08M/k2uVvMow7Sk41atndNtt/PHSA== + dependencies: + debug "3.1.0" + methods "~1.1.2" + parseurl "~1.3.2" + vary "~1.1.2" + methods@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee" @@ -4796,6 +5035,17 @@ minimist@^1.2.0, minimist@^1.2.6: resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c" integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA== +morgan@^1.10.0: + version "1.10.0" + resolved "https://registry.yarnpkg.com/morgan/-/morgan-1.10.0.tgz#091778abc1fc47cd3509824653dae1faab6b17d7" + integrity sha512-AbegBVI4sh6El+1gNwvD5YIck7nSA36weD7xvIxG4in80j/UoK8AEGaWnnz8v1GxonMCltmlNs5ZKbGvl9b1XQ== + dependencies: + basic-auth "~2.0.1" + debug "2.6.9" + depd "~2.0.0" + on-finished "~2.3.0" + on-headers "~1.0.2" + ms@2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8" @@ -4819,7 +5069,7 @@ multicast-dns@^7.2.5: dns-packet "^5.2.2" thunky "^1.0.2" -nanoid@^3.3.6: +nanoid@^3.1.23, nanoid@^3.3.6: version "3.3.6" resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c" integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA== @@ -4901,7 +5151,7 @@ nth-check@^2.0.1: dependencies: boolbase "^1.0.0" -object-assign@^4.1.1: +object-assign@^4, object-assign@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863" integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg== @@ -4973,6 +5223,13 @@ on-finished@2.4.1: dependencies: ee-first "1.1.1" +on-finished@~2.3.0: + version "2.3.0" + resolved "https://registry.yarnpkg.com/on-finished/-/on-finished-2.3.0.tgz#20f1336481b083cd75337992a16971aa2d906947" + integrity sha512-ikqdkGAAyf/X/gPhXGvfgAytDZtDbr+bkNUJ0N9h5MI/dmdgCs3l6hoHrcUv41sRKew3jIwrp4qQDXiK99Utww== + dependencies: + ee-first "1.1.1" + on-headers@~1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.2.tgz#772b0ae6aaa525c399e489adfad90c403eb3c28f" @@ -5013,7 +5270,7 @@ optionator@^0.9.3: prelude-ls "^1.2.1" type-check "^0.4.0" -p-limit@^2.2.0: +p-limit@^2.0.0, p-limit@^2.2.0: version "2.3.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1" integrity sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w== @@ -5027,6 +5284,13 @@ p-limit@^3.0.2: dependencies: yocto-queue "^0.1.0" +p-locate@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-3.0.0.tgz#322d69a05c0264b25997d9f40cd8a891ab0064a4" + integrity sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ== + dependencies: + p-limit "^2.0.0" + p-locate@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-4.1.0.tgz#a3428bb7088b3a60292f66919278b7c297ad4f07" @@ -5069,6 +5333,14 @@ parent-module@^1.0.0: dependencies: callsites "^3.0.0" +parse-json@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-4.0.0.tgz#be35f5425be1f7f6c747184f98a788cb99477ee0" + integrity sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw== + dependencies: + error-ex "^1.3.1" + json-parse-better-errors "^1.0.1" + parse-json@^5.0.0: version "5.2.0" resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.2.0.tgz#c76fc66dee54231c962b22bcc8a72cf2f99753cd" @@ -5092,6 +5364,11 @@ pascal-case@^3.1.2: no-case "^3.0.4" tslib "^2.0.3" +path-exists@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515" + integrity sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ== + path-exists@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-4.0.0.tgz#513bdbe2d3b95d7762e8c1137efa195c6c61b5b3" @@ -5117,6 +5394,13 @@ path-to-regexp@0.1.7: resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" integrity sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ== +path-to-regexp@^1.0.3: + version "1.8.0" + resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.8.0.tgz#887b3ba9d84393e87a0a0b9f4cb756198b53548a" + integrity sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA== + dependencies: + isarray "0.0.1" + path-type@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b" @@ -5132,6 +5416,24 @@ picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.0, picomatch@^2.3.1: resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42" integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA== +pify@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176" + integrity sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg== + +pify@^4.0.1: + version "4.0.1" + resolved "https://registry.yarnpkg.com/pify/-/pify-4.0.1.tgz#4b2cd25c50d598735c50292224fd8c6df41e3231" + integrity sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g== + +pkg-conf@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/pkg-conf/-/pkg-conf-3.1.0.tgz#d9f9c75ea1bae0e77938cde045b276dac7cc69ae" + integrity sha512-m0OTbR/5VPNPqO1ph6Fqbj7Hv6QU7gR/tQW40ZqrL1rjgCU85W6C1bJn0BItuJqnR98PWzw7Z8hHeChD1WrgdQ== + dependencies: + find-up "^3.0.0" + load-json-file "^5.2.0" + pkg-dir@^4.1.0, pkg-dir@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-4.2.0.tgz#f099133df7ede422e81d1d8448270eeb3e4261f3" @@ -5139,6 +5441,18 @@ pkg-dir@^4.1.0, pkg-dir@^4.2.0: dependencies: find-up "^4.0.0" +please-upgrade-node@^3.2.0: + version "3.2.0" + resolved "https://registry.yarnpkg.com/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz#aeddd3f994c933e4ad98b99d9a556efa0e2fe942" + integrity sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg== + dependencies: + semver-compare "^1.0.0" + +pluralize@^8.0.0: + version "8.0.0" + resolved "https://registry.yarnpkg.com/pluralize/-/pluralize-8.0.0.tgz#1a6fa16a38d12a1901e0320fa017051c539ce3b1" + integrity sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA== + postcss-modules-extract-imports@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d" @@ -5290,6 +5604,16 @@ raw-body@2.5.1: iconv-lite "0.4.24" unpipe "1.0.0" +raw-body@2.5.2: + version "2.5.2" + resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.5.2.tgz#99febd83b90e08975087e8f1f9419a149366b68a" + integrity sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA== + dependencies: + bytes "3.1.2" + http-errors "2.0.0" + iconv-lite "0.4.24" + unpipe "1.0.0" + react-currency-input-field@^3.6.10: version "3.6.10" resolved "https://registry.yarnpkg.com/react-currency-input-field/-/react-currency-input-field-3.6.10.tgz#f04663a2074b894735edb6d9fae95499727596b1" @@ -5520,6 +5844,11 @@ regexp.prototype.flags@^1.4.3: define-properties "^1.2.0" functions-have-names "^1.2.3" +regexpp@^3.0.0: + version "3.2.0" + resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.2.0.tgz#0425a2768d8f23bad70ca4b90461fa2f1213e1b2" + integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg== + regexpu-core@^5.3.1: version "5.3.2" resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.3.2.tgz#11a2b06884f3527aec3e93dbbf4a3b958a95546b" @@ -5703,6 +6032,11 @@ selfsigned@^2.1.1: dependencies: node-forge "^1" +semver-compare@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/semver-compare/-/semver-compare-1.0.0.tgz#0dee216a1c941ab37e9efb1788f6afc5ff5537fc" + integrity sha512-YM3/ITh2MJ5MtzaM429anh+x2jiLVjqILF4m4oyQB18W7Ggea7BfqdH/wGMK7dDiMghv/6WG7znWMwUDzJiXow== + "semver@2 || 3 || 4 || 5": version "5.7.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7" @@ -5720,6 +6054,13 @@ semver@^6.0.0, semver@^6.1.1, semver@^6.1.2, semver@^6.3.0: resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d" integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw== +semver@^7.0.0, semver@^7.3.7: + version "7.5.3" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.3.tgz#161ce8c2c6b4b3bdca6caadc9fa3317a4c4fe88e" + integrity sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ== + dependencies: + lru-cache "^6.0.0" + semver@^7.3.4, semver@^7.3.8: version "7.5.0" resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.0.tgz#ed8c5dc8efb6c629c88b23d41dc9bf40c1d96cd0" @@ -5727,13 +6068,6 @@ semver@^7.3.4, semver@^7.3.8: dependencies: lru-cache "^6.0.0" -semver@^7.3.7: - version "7.5.3" - resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.3.tgz#161ce8c2c6b4b3bdca6caadc9fa3317a4c4fe88e" - integrity sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ== - dependencies: - lru-cache "^6.0.0" - send@0.18.0: version "0.18.0" resolved "https://registry.yarnpkg.com/send/-/send-0.18.0.tgz#670167cc654b05f5aa4a767f9113bb371bc706be" @@ -5783,6 +6117,11 @@ serve-static@1.15.0: parseurl "~1.3.3" send "0.18.0" +server-destroy@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/server-destroy/-/server-destroy-1.0.1.tgz#f13bf928e42b9c3e79383e61cc3998b5d14e6cdd" + integrity sha512-rb+9B5YBIEzYcD6x2VKidaa+cqYBJQKnU4oe4E3ANwRRN56yk/ua1YCJT1n21NTS8w6CcOclAKNP3PhdCXKYtQ== + setprototypeof@1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/setprototypeof/-/setprototypeof-1.1.0.tgz#d0bd85536887b6fe7c0d818cb962d9d91c54e656" @@ -5944,6 +6283,31 @@ stackframe@^1.3.4: resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.3.4.tgz#b881a004c8c149a5e8efef37d51b16e412943310" integrity sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw== +standard-engine@^15.0.0: + version "15.1.0" + resolved "https://registry.yarnpkg.com/standard-engine/-/standard-engine-15.1.0.tgz#717409a002edd13cd57f6554fdd3464d9a22a774" + integrity sha512-VHysfoyxFu/ukT+9v49d4BRXIokFRZuH3z1VRxzFArZdjSCFpro6rEIU3ji7e4AoAtuSfKBkiOmsrDqKW5ZSRw== + dependencies: + get-stdin "^8.0.0" + minimist "^1.2.6" + pkg-conf "^3.1.0" + xdg-basedir "^4.0.0" + +standard@^17.0.0: + version "17.1.0" + resolved "https://registry.yarnpkg.com/standard/-/standard-17.1.0.tgz#829eeeb3139ad50714294d3531592d60ad1286af" + integrity sha512-jaDqlNSzLtWYW4lvQmU0EnxWMUGQiwHasZl5ZEIwx3S/ijZDjZOzs1y1QqKwKs5vqnFpGtizo4NOYX2s0Voq/g== + dependencies: + eslint "^8.41.0" + eslint-config-standard "17.1.0" + eslint-config-standard-jsx "^11.0.0" + eslint-plugin-import "^2.27.5" + eslint-plugin-n "^15.7.0" + eslint-plugin-promise "^6.1.1" + eslint-plugin-react "^7.32.2" + standard-engine "^15.0.0" + version-guard "^1.1.1" + statuses@2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/statuses/-/statuses-2.0.1.tgz#55cb000ccf1d48728bd23c685a063998cf1a1b63" @@ -5954,6 +6318,13 @@ statuses@2.0.1: resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c" integrity sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA== +steno@^0.4.1: + version "0.4.4" + resolved "https://registry.yarnpkg.com/steno/-/steno-0.4.4.tgz#071105bdfc286e6615c0403c27e9d7b5dcb855cb" + integrity sha512-EEHMVYHNXFHfGtgjNITnka0aHhiAlo93F7z2/Pwd+g0teG9CnM3JIINM7hVVB5/rhw9voufD7Wukwgtw2uqh6w== + dependencies: + graceful-fs "^4.1.3" + string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" @@ -6265,6 +6636,11 @@ type-fest@^0.20.2: resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4" integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ== +type-fest@^0.3.0: + version "0.3.1" + resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.3.1.tgz#63d00d204e059474fe5e1b7c011112bbd1dc29e1" + integrity sha512-cUGJnCdr4STbePCgqNFbpVNCepa+kAVohJs1sLhxzdH+gnEoOd8VhbYa7pD3zZYGiURWM2xzEII3fQcRizDkYQ== + type-fest@^0.6.0: version "0.6.0" resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.6.0.tgz#8d2a2370d3df886eb5c90ada1c5bf6188acf838b" @@ -6398,11 +6774,16 @@ validate-npm-package-license@^3.0.1: spdx-correct "^3.0.0" spdx-expression-parse "^3.0.0" -vary@~1.1.2: +vary@^1, vary@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc" integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg== +version-guard@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/version-guard/-/version-guard-1.1.1.tgz#7a6e87a1babff1b43d6a7b0fd239731e278262fa" + integrity sha512-MGQLX89UxmYHgDvcXyjBI0cbmoW+t/dANDppNPrno64rYr8nH4SHSuElQuSYdXGEs0mUzdQe1BY+FhVPNsAmJQ== + warning@^4.0.2: version "4.0.3" resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3" @@ -6602,6 +6983,11 @@ ws@^8.13.0: resolved "https://registry.yarnpkg.com/ws/-/ws-8.13.0.tgz#9a9fb92f93cf41512a0735c8f4dd09b8a1211cd0" integrity sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA== +xdg-basedir@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-4.0.0.tgz#4bc8d9984403696225ef83a1573cbbcb4e79db13" + integrity sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q== + y18n@^5.0.5: version "5.0.8" resolved "https://registry.yarnpkg.com/y18n/-/y18n-5.0.8.tgz#7f4934d0f7ca8c56f95314939ddcd2dd91ce1d55" @@ -6645,6 +7031,19 @@ yargs@^17.0.0: y18n "^5.0.5" yargs-parser "^21.1.1" +yargs@^17.0.1: + version "17.7.2" + resolved "https://registry.yarnpkg.com/yargs/-/yargs-17.7.2.tgz#991df39aca675a192b816e1e0363f9d75d2aa269" + integrity sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w== + dependencies: + cliui "^8.0.1" + escalade "^3.1.1" + get-caller-file "^2.0.5" + require-directory "^2.1.1" + string-width "^4.2.3" + y18n "^5.0.5" + yargs-parser "^21.1.1" + yn@3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/yn/-/yn-3.1.1.tgz#1e87401a09d767c1d5eab26a6e4c185182d2eb50" From fcc5ad049c1ef3f337d2f3df6d5f4c138b841ed9 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Thu, 13 Jul 2023 15:13:51 +0300 Subject: [PATCH 14/16] refactor: lint fixible problems --- .eslintrc.json | 5 +- config/build/buildDevServer.ts | 12 +- config/build/buildLoaders.ts | 37 +- config/build/buildPlugins.ts | 26 +- config/build/buildResolve.ts | 10 +- config/build/buildWebpackConfig.ts | 28 +- config/types/types.ts | 4 +- package.json | 2 +- src/App.tsx | 51 +- src/components/atoms/box/Box.styled.ts | 11 +- src/components/atoms/button/Button.styled.ts | 47 +- src/components/atoms/button/ButtonLink.ts | 10 +- src/components/atoms/button/ButtonPopup.ts | 13 +- .../atoms/button/ButtonTransparent.styled.ts | 6 +- .../atoms/container/Container.styled.ts | 4 +- src/components/atoms/form/Form.styled.ts | 8 +- src/components/atoms/img/Img.styled.ts | 22 +- src/components/atoms/input/Input.styled.ts | 8 +- .../atoms/input/InputDate.styled.ts | 6 +- src/components/atoms/label/Label.styled.ts | 2 +- src/components/atoms/link/Link.styled.ts | 8 +- src/components/atoms/link/LinkMenu.styled.ts | 14 +- src/components/atoms/list/List.styled.ts | 6 +- src/components/atoms/list/ListItem.styled.ts | 2 +- .../atoms/typography/Typography.styled.ts | 25 +- .../molecules/base-field/BaseField.tsx | 16 +- .../molecules/category/Category.tsx | 21 +- .../molecules/charts/DoughnutChart.tsx | 26 +- src/components/molecules/charts/LineChart.tsx | 25 +- .../molecules/charts/doughnutChartConfig.ts | 64 +- .../molecules/header/Header.styled.ts | 10 +- src/components/molecules/header/Header.tsx | 40 +- .../molecules/popup/Popup.styled.ts | 14 +- .../molecules/popup/PopupDeleteAccount.tsx | 193 +++--- .../molecules/popup/PopupEditWallet.tsx | 294 ++++----- .../popup/add-wallet/AddBankdataTab.tsx | 62 +- .../popup/add-wallet/AddWalletTab.tsx | 65 +- .../popup/add-wallet/BankdataInfoMessage.tsx | 40 +- .../popup/add-wallet/PopupAddWallet.tsx | 152 +++-- .../popup/edit-profile/ChangePasswordTab.tsx | 37 +- .../popup/edit-profile/EditProfileTab.tsx | 29 +- .../popup/edit-profile/PopupEditProfile.tsx | 160 +++-- src/components/molecules/select/Select.tsx | 41 +- .../molecules/tabs/filter/TabFilter.styled.ts | 6 +- .../molecules/tabs/filter/TabFilter.tsx | 34 +- .../molecules/tabs/switch/TabSwitch.styled.ts | 4 +- .../molecules/tabs/switch/TabSwitch.tsx | 36 +- .../molecules/tabs/tabWrapperStyles.ts | 2 +- .../molecules/transaction/Transaction.tsx | 105 ++-- .../transaction/TransactionWrapper.ts | 8 +- .../molecules/wallet/Wallet.styled.ts | 21 +- src/components/molecules/wallet/Wallet.tsx | 33 +- .../pages/2FA/TwoFactorAuthenticationPage.tsx | 194 +++--- .../pages/categories/AddCategory.tsx | 64 +- .../pages/categories/Categories.tsx | 26 +- .../pages/categories/CategoriesPage.styled.ts | 2 +- .../pages/categories/CategoriesPage.tsx | 34 +- .../pages/categories/EditCategory.tsx | 80 ++- src/components/pages/data/DataEntryPage.tsx | 275 +++++---- src/components/pages/home/HomePage.styled.ts | 2 +- src/components/pages/home/HomePage.tsx | 58 +- src/components/pages/home/Statistics.tsx | 89 +-- src/components/pages/home/Transitions.tsx | 29 +- src/components/pages/home/Wallets.tsx | 64 +- .../pages/not-found/NotFoundPage.tsx | 14 +- .../pages/password-recovery/EmailStep.tsx | 51 +- .../password-recovery/NewPasswordStep.tsx | 73 ++- .../password-recovery/PasswordRecovery.tsx | 22 +- .../pages/password-recovery/ResetLinkStep.tsx | 40 +- .../pages/register/RegisterPage.tsx | 244 ++++---- .../pages/statistics/DoughnutChartSection.tsx | 80 +-- .../pages/statistics/LineChartSection.tsx | 54 +- .../pages/statistics/StatisticsHeader.tsx | 44 +- .../pages/statistics/StatisticsPage.styled.ts | 2 +- .../pages/statistics/StatisticsPage.tsx | 47 +- .../pages/transactions/AddTransaction.tsx | 42 +- .../pages/transactions/DatePicker.tsx | 55 +- .../pages/transactions/EditTransaction.tsx | 40 +- .../pages/transactions/Transactions.tsx | 11 +- .../transactions/TransactionsPage.styled.ts | 2 +- .../pages/transactions/TransactionsPage.tsx | 26 +- src/components/pages/welcome/WelcomePage.tsx | 97 +-- src/contexts/PopupContext.tsx | 74 +-- src/global.d.ts | 13 +- src/index.tsx | 18 +- src/shared/hooks/useFilterButtonOptions.tsx | 61 +- src/shared/hooks/useSwitchButtonOptions.tsx | 26 +- src/shared/styles/commonStyles.ts | 18 +- src/shared/styles/fontStyles.ts | 56 +- src/shared/styles/globalStyles.ts | 2 +- src/shared/styles/iconStyles.ts | 5 +- src/shared/styles/variables.ts | 2 +- src/shared/utils/field-rules/amount.ts | 12 +- src/shared/utils/field-rules/email.ts | 4 +- src/shared/utils/field-rules/name.ts | 4 +- src/shared/utils/field-rules/password.ts | 22 +- src/shared/utils/field-rules/title.ts | 12 +- .../calculateCategoriesWithTotalAmount.ts | 13 +- .../utils/statistics/calculateTotalAmount.ts | 16 +- .../statistics/generateNewLineChartData.ts | 33 +- src/shared/utils/store/updateCategories.ts | 4 +- .../utils/store/updateChartCategories.ts | 4 +- .../store/updateChartCategoryTransactions.ts | 4 +- .../utils/store/updateChartTransactions.ts | 10 +- src/shared/utils/store/updateTransactions.ts | 4 +- .../utils/transactions/filterTransactions.ts | 18 +- .../transactions/formatTransactionDate.ts | 30 +- .../transactions/formatTransactionTime.ts | 10 +- .../utils/transactions/setSelectOptions.ts | 4 +- src/store/bankDataSlice.ts | 69 +-- src/store/categorySlice.ts | 4 +- src/store/hooks.ts | 6 +- src/store/passwordRecoverySlice.ts | 28 +- src/store/statisticsSlice.ts | 48 +- src/store/store.ts | 17 +- src/store/transactionSlice.ts | 4 +- src/store/userSlice.ts | 560 +++++++++--------- src/store/walletSlice.ts | 4 +- types/bankdata.ts | 2 +- types/category.ts | 10 +- types/common.ts | 6 +- types/statistics.ts | 6 +- types/transactions.ts | 4 +- types/user.ts | 32 +- types/wallet.ts | 16 +- webpack.config.ts | 22 +- 126 files changed, 2648 insertions(+), 2435 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index 7e3c16c..2ff0132 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -19,7 +19,6 @@ "warn", { "extensions": [".js", ".jsx", ".ts", ".tsx"] } ], - "no-undef": "off", "import/extensions": [ "error", "ignorePackages", @@ -36,6 +35,8 @@ "namedComponents": "arrow-function", "unnamedComponents": "arrow-function" } - ] + ], + "no-undef": "off", + "no-param-reassign": "off" } } diff --git a/config/build/buildDevServer.ts b/config/build/buildDevServer.ts index 2426efd..b9d564b 100644 --- a/config/build/buildDevServer.ts +++ b/config/build/buildDevServer.ts @@ -2,8 +2,10 @@ import type { Configuration as DevServerConfiguration } from "webpack-dev-server import { BuildOptions } from "../types/types"; -export const buildDevServer = (options: BuildOptions): DevServerConfiguration => { - const { paths } = options +export const buildDevServer = ( + options: BuildOptions +): DevServerConfiguration => { + const { paths } = options; return { port: options.port, @@ -12,6 +14,6 @@ export const buildDevServer = (options: BuildOptions): DevServerConfiguration => historyApiFallback: true, static: { directory: paths.output, - } - } -} \ No newline at end of file + }, + }; +}; diff --git a/config/build/buildLoaders.ts b/config/build/buildLoaders.ts index 59dab7b..f775551 100644 --- a/config/build/buildLoaders.ts +++ b/config/build/buildLoaders.ts @@ -1,34 +1,33 @@ -import webpack from 'webpack'; +import webpack from "webpack"; import MiniCssExtractPlugin from "mini-css-extract-plugin"; -import { BuildOptions } from '../types/types'; +import { BuildOptions } from "../types/types"; -export const buildLoaders = ({ isDev }: BuildOptions): webpack.RuleSetRule[] => { +export const buildLoaders = ({ + isDev, +}: BuildOptions): webpack.RuleSetRule[] => { const typescriptLoader = { test: /\.tsx?$/, - use: 'ts-loader', + use: "ts-loader", exclude: /node_modules/, }; const styleLoader = { test: /\.css$/, - use: [ - isDev ? 'style-loader' : MiniCssExtractPlugin.loader, - 'css-loader', - ], + use: [isDev ? "style-loader" : MiniCssExtractPlugin.loader, "css-loader"], }; const svgLoader = { test: /\.svg$/, - use: '@svgr/webpack', + use: "@svgr/webpack", }; const graphicsLoader = { test: /\.(png|jpe?g|gif)$/i, use: { - loader: 'file-loader', + loader: "file-loader", options: { - outputPath: 'assets', + outputPath: "assets", }, }, }; @@ -36,9 +35,9 @@ export const buildLoaders = ({ isDev }: BuildOptions): webpack.RuleSetRule[] => const fontsLoader = { test: /\.(ttf)$/i, use: { - loader: 'file-loader', + loader: "file-loader", options: { - outputPath: 'fonts', + outputPath: "fonts", }, }, }; @@ -47,12 +46,12 @@ export const buildLoaders = ({ isDev }: BuildOptions): webpack.RuleSetRule[] => test: /\.m?js$/, exclude: /node_modules/, use: { - loader: 'babel-loader', + loader: "babel-loader", options: { - presets: [ - ['@babel/preset-env', { targets: 'defaults' }], - ], - plugins: [isDev && require.resolve('react-refresh/babel')].filter(Boolean), + presets: [["@babel/preset-env", { targets: "defaults" }]], + plugins: [isDev && require.resolve("react-refresh/babel")].filter( + Boolean + ), }, }, }; @@ -65,4 +64,4 @@ export const buildLoaders = ({ isDev }: BuildOptions): webpack.RuleSetRule[] => styleLoader, babelLoader, ]; -} +}; diff --git a/config/build/buildPlugins.ts b/config/build/buildPlugins.ts index be41e2f..19e78eb 100644 --- a/config/build/buildPlugins.ts +++ b/config/build/buildPlugins.ts @@ -1,29 +1,31 @@ import webpack from "webpack"; -import HtmlWebpackPlugin from 'html-webpack-plugin'; -import MiniCssExtractPlugin from 'mini-css-extract-plugin'; -import ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin'; +import HtmlWebpackPlugin from "html-webpack-plugin"; +import MiniCssExtractPlugin from "mini-css-extract-plugin"; +import ReactRefreshWebpackPlugin from "@pmmmwh/react-refresh-webpack-plugin"; import { BuildOptions } from "../types/types"; -export const buildPlugins = (options: BuildOptions): webpack.WebpackPluginInstance[] => { - const { paths } = options +export const buildPlugins = ( + options: BuildOptions +): webpack.WebpackPluginInstance[] => { + const { paths } = options; const plugins = [ new MiniCssExtractPlugin({ - filename: 'css/[name].[contenthash:8].css', - chunkFilename: 'css/[name].[contenthash:8].css', + filename: "css/[name].[contenthash:8].css", + chunkFilename: "css/[name].[contenthash:8].css", }), new webpack.ProgressPlugin(), new HtmlWebpackPlugin({ template: paths.html, - favicon: "./src/shared/assets/icons/logo.svg" + favicon: "./src/shared/assets/icons/logo.svg", }), - ] + ]; if (options.isDev) { - plugins.push(new webpack.HotModuleReplacementPlugin()) - plugins.push(new ReactRefreshWebpackPlugin()) + plugins.push(new webpack.HotModuleReplacementPlugin()); + plugins.push(new ReactRefreshWebpackPlugin()); } return plugins; -} \ No newline at end of file +}; diff --git a/config/build/buildResolve.ts b/config/build/buildResolve.ts index 6f5d60a..cb0244c 100644 --- a/config/build/buildResolve.ts +++ b/config/build/buildResolve.ts @@ -1,7 +1,5 @@ -import webpack from 'webpack'; +import webpack from "webpack"; -export const buildResolve = (): webpack.ResolveOptions => { - return { - extensions: ['.tsx', '.ts', '.js'], - } -} \ No newline at end of file +export const buildResolve = (): webpack.ResolveOptions => ({ + extensions: [".tsx", ".ts", ".js"], +}); diff --git a/config/build/buildWebpackConfig.ts b/config/build/buildWebpackConfig.ts index 4b4722e..b5ebf43 100644 --- a/config/build/buildWebpackConfig.ts +++ b/config/build/buildWebpackConfig.ts @@ -1,29 +1,31 @@ -import webpack from 'webpack'; +import webpack from "webpack"; -import { buildLoaders } from './buildLoaders'; -import { buildResolve } from './buildResolve'; -import { buildPlugins } from './buildPlugins'; -import { buildDevServer } from './buildDevServer'; +import { buildLoaders } from "./buildLoaders"; +import { buildResolve } from "./buildResolve"; +import { buildPlugins } from "./buildPlugins"; +import { buildDevServer } from "./buildDevServer"; -import { BuildOptions } from '../types/types'; +import { BuildOptions } from "../types/types"; -export const buildWebpacConfig = (options: BuildOptions): webpack.Configuration => { - const { paths, mode, isDev } = options +export const buildWebpacConfig = ( + options: BuildOptions +): webpack.Configuration => { + const { paths, mode, isDev } = options; return { mode, entry: paths.entry, devServer: isDev ? buildDevServer(options) : undefined, output: { - filename: '[name].[contenthash].js', + filename: "[name].[contenthash].js", path: paths.output, - publicPath: '/', + publicPath: "/", clean: true, }, module: { - rules: buildLoaders(options) + rules: buildLoaders(options), }, resolve: buildResolve(), plugins: buildPlugins(options), - } -} \ No newline at end of file + }; +}; diff --git a/config/types/types.ts b/config/types/types.ts index 2c21c75..5a96b6c 100644 --- a/config/types/types.ts +++ b/config/types/types.ts @@ -1,4 +1,4 @@ -export type BuildMode = 'development' | 'production' +export type BuildMode = "development" | "production"; export interface BuildPaths { entry: string; @@ -16,4 +16,4 @@ export interface BuildOptions { export interface BuildEnv { mode?: BuildMode; port?: number; -} \ No newline at end of file +} diff --git a/package.json b/package.json index eacc1a4..3930fdb 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "build:dev": "webpack --env mode=development", "build:prod": "webpack --env mode=production", "prepare": "husky install", - "lint": "eslint . --fix" + "lint": "eslint . --fix --ext js,ts,tsx" }, "keywords": [], "author": "", diff --git a/src/App.tsx b/src/App.tsx index 2ea1fbb..b218080 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -6,35 +6,40 @@ import WelcomePage from "./components/pages/welcome/WelcomePage"; import LoginPage from "./components/pages/login/LoginPage"; import RegisterPage from "./components/pages/register/RegisterPage"; import HomePage from "./components/pages/home/HomePage"; -import TransactionsPage from './components/pages/transactions/TransactionsPage'; +import TransactionsPage from "./components/pages/transactions/TransactionsPage"; import DataEntryPage from "./components/pages/data/DataEntryPage"; import PasswordRecovery from "./components/pages/password-recovery/PasswordRecovery"; -import CategoriesPage from './components/pages/categories/CategoriesPage'; +import CategoriesPage from "./components/pages/categories/CategoriesPage"; import StatisticsPage from "./components/pages/statistics/StatisticsPage"; import NotFoundPage from "./components/pages/not-found/NotFoundPage"; const App = () => { const elements = useRoutes([ - { path: '/', element: }, - { path: '/welcome', element: }, - { path: '/register', element: }, - { path: '/data-entry', element: }, - { path: '/login', element: }, - { path: '/password-recovery/:uid?/:resetToken?', element: }, - { path: '/password-reset-confirm/:uid?/:resetToken?', element: }, - { path: '/home', element: }, - { path: '/email-confirm/:uid?/:confirmToken?', element: }, - { path: '/transactions', element: }, - { path: '/categories', element: }, - { path: '/statistics', element: }, - { path: '*', element: }, - ]) + { path: "/", element: }, + { path: "/welcome", element: }, + { path: "/register", element: }, + { path: "/data-entry", element: }, + { path: "/login", element: }, + { + path: "/password-recovery/:uid?/:resetToken?", + element: , + }, + { + path: "/password-reset-confirm/:uid?/:resetToken?", + element: , + }, + { path: "/home", element: }, + { + path: "/email-confirm/:uid?/:confirmToken?", + element: , + }, + { path: "/transactions", element: }, + { path: "/categories", element: }, + { path: "/statistics", element: }, + { path: "*", element: }, + ]); - return ( - - {elements} - - ); -} + return {elements}; +}; -export default App; \ No newline at end of file +export default App; diff --git a/src/components/atoms/box/Box.styled.ts b/src/components/atoms/box/Box.styled.ts index 492cd07..853bd4d 100644 --- a/src/components/atoms/box/Box.styled.ts +++ b/src/components/atoms/box/Box.styled.ts @@ -1,6 +1,9 @@ import styled from "styled-components"; -import { commonStyles, commonStylesProps } from "../../../shared/styles/commonStyles"; +import { + commonStyles, + commonStylesProps, +} from "../../../shared/styles/commonStyles"; type BoxProps = commonStylesProps & { border?: string; @@ -21,7 +24,7 @@ type BoxProps = commonStylesProps & { flex?: string; flexBasis?: string; overflow?: string; -} +}; export const Box = styled.div` ${commonStyles}; @@ -33,7 +36,7 @@ export const Box = styled.div` max-width: ${({ maxWidth }) => maxWidth || undefined}; max-height: ${({ maxHeight }) => maxHeight || undefined}; - text-align: ${({ textAlign }) => textAlign || 'left'}; + text-align: ${({ textAlign }) => textAlign || "left"}; background: ${({ background }) => background || undefined}; position: ${({ position }) => position || "static"}; z-index: ${({ zIndex }) => zIndex || 0}; @@ -41,4 +44,4 @@ export const Box = styled.div` flex-direction: ${({ flexDirection }) => flexDirection || undefined}; flex: ${({ flex }) => flex || undefined}; flex-basis: ${({ flexBasis }) => flexBasis || undefined}; -` \ No newline at end of file +`; diff --git a/src/components/atoms/button/Button.styled.ts b/src/components/atoms/button/Button.styled.ts index 2ad6bfa..4e65785 100644 --- a/src/components/atoms/button/Button.styled.ts +++ b/src/components/atoms/button/Button.styled.ts @@ -1,14 +1,17 @@ -import styled, { css } from "styled-components" +import styled, { css } from "styled-components"; -import { commonStyles, commonStylesProps } from "../../../shared/styles/commonStyles" +import { + commonStyles, + commonStylesProps, +} from "../../../shared/styles/commonStyles"; -import COLORS from "../../../shared/styles/variables" +import COLORS from "../../../shared/styles/variables"; type ButtonProps = commonStylesProps & { - primary?: boolean - secondary?: boolean - disabled?: boolean -} + primary?: boolean; + secondary?: boolean; + disabled?: boolean; +}; export const buttonStyles = css` ${({ primary, secondary, disabled }) => ` @@ -18,36 +21,48 @@ export const buttonStyles = css` border-radius: 12px; cursor: pointer; - ${primary ? ` + ${ + primary + ? ` color: ${COLORS.WHITE}; background-color: ${COLORS.PRIMARY}; border: none; &:hover { background-color: ${COLORS.PRIMARY_HOVER}; } - ` : secondary ? ` + ` + : secondary + ? ` border: 2px solid ${COLORS.PRIMARY}; background-color: ${COLORS.WHITE}; &:hover { border-color: ${COLORS.PRIMARY_HOVER}; } - ` : undefined + ` + : undefined } - ${disabled ? ` + ${ + disabled + ? ` cursor: not-allowed; pointer-events: none; - ` + (primary ? ` + ${ + primary + ? ` background-color: ${COLORS.DISABLED}; - ` : ` + ` + : ` border-color: ${COLORS.DISABLED}; color: ${COLORS.DISABLED}; - ` ) : undefined + ` + }` + : undefined } `} -` +`; export const Button = styled.button` ${commonStyles} ${buttonStyles} -` \ No newline at end of file +`; diff --git a/src/components/atoms/button/ButtonLink.ts b/src/components/atoms/button/ButtonLink.ts index 4415841..c994490 100644 --- a/src/components/atoms/button/ButtonLink.ts +++ b/src/components/atoms/button/ButtonLink.ts @@ -1,14 +1,14 @@ -import styled from 'styled-components'; +import styled from "styled-components"; -import { ButtonTransparent } from './ButtonTransparent.styled'; +import { ButtonTransparent } from "./ButtonTransparent.styled"; -import COLORS from '../../../shared/styles/variables'; +import COLORS from "../../../shared/styles/variables"; export const ButtonLink = styled(ButtonTransparent)` - color: ${props => props.color || COLORS.PRIMARY}; + color: ${(props) => props.color || COLORS.PRIMARY}; font-weight: 600; &:hover { text-decoration: underline; } -` \ No newline at end of file +`; diff --git a/src/components/atoms/button/ButtonPopup.ts b/src/components/atoms/button/ButtonPopup.ts index 0f61d1e..7309911 100644 --- a/src/components/atoms/button/ButtonPopup.ts +++ b/src/components/atoms/button/ButtonPopup.ts @@ -1,16 +1,17 @@ -import styled from 'styled-components'; +import styled from "styled-components"; -import COLORS from '../../../shared/styles/variables'; +import COLORS from "../../../shared/styles/variables"; export const ButtonPopup = styled.button<{ isActive: boolean }>` - color: ${props => props.color || COLORS.ALMOST_BLACK_FOR_TEXT}; - font-weight: ${props => props.isActive ? "700" : "400"}; + color: ${(props) => props.color || COLORS.ALMOST_BLACK_FOR_TEXT}; + font-weight: ${(props) => (props.isActive ? "700" : "400")}; font-size: 12px; width: 188px; height: 37px; text-align: center; background: ${COLORS.BASE_1}; border: none; - border-bottom: 2px solid ${props => props.isActive ? COLORS.PRIMARY_HOVER : COLORS.DIVIDER}; + border-bottom: 2px solid + ${(props) => (props.isActive ? COLORS.PRIMARY_HOVER : COLORS.DIVIDER)}; cursor: pointer; -` \ No newline at end of file +`; diff --git a/src/components/atoms/button/ButtonTransparent.styled.ts b/src/components/atoms/button/ButtonTransparent.styled.ts index ff731ba..a7f66bd 100644 --- a/src/components/atoms/button/ButtonTransparent.styled.ts +++ b/src/components/atoms/button/ButtonTransparent.styled.ts @@ -1,5 +1,5 @@ -import styled from 'styled-components'; -import { commonStyles } from '../../../shared/styles/commonStyles'; +import styled from "styled-components"; +import { commonStyles } from "../../../shared/styles/commonStyles"; export const ButtonTransparent = styled.button` ${commonStyles} @@ -9,4 +9,4 @@ export const ButtonTransparent = styled.button` cursor: pointer; background: transparent; display: flex; -` \ No newline at end of file +`; diff --git a/src/components/atoms/container/Container.styled.ts b/src/components/atoms/container/Container.styled.ts index 5ba37db..f8a7ed0 100644 --- a/src/components/atoms/container/Container.styled.ts +++ b/src/components/atoms/container/Container.styled.ts @@ -3,9 +3,9 @@ import styled from "styled-components"; type ContainerProps = { display?: string; overflowX?: string; -} +}; export const Container = styled.div` display: ${({ display }) => display || undefined}; overflow-x: ${({ overflowX }) => overflowX || undefined}; -` \ No newline at end of file +`; diff --git a/src/components/atoms/form/Form.styled.ts b/src/components/atoms/form/Form.styled.ts index cfb2fc6..1814523 100644 --- a/src/components/atoms/form/Form.styled.ts +++ b/src/components/atoms/form/Form.styled.ts @@ -2,20 +2,20 @@ import styled from "styled-components"; import { commonStyles } from "../../../shared/styles/commonStyles"; -import COLORS from '../../../shared/styles/variables'; +import COLORS from "../../../shared/styles/variables"; type FormProps = { maxWidth?: string; textAlign?: string; color?: string; alignItems?: string; -} +}; export const Form = styled.form` ${commonStyles}; - + max-width: ${({ maxWidth }) => maxWidth || undefined}; text-align: ${({ textAlign }) => textAlign || undefined}; color: ${({ color }) => color || COLORS.WHITE}; align-items: ${({ alignItems }) => alignItems || undefined}; -` \ No newline at end of file +`; diff --git a/src/components/atoms/img/Img.styled.ts b/src/components/atoms/img/Img.styled.ts index 7b8a547..2d1a108 100644 --- a/src/components/atoms/img/Img.styled.ts +++ b/src/components/atoms/img/Img.styled.ts @@ -10,16 +10,16 @@ type ImgProps = { m?: string; p?: string; display?: string; -} +}; export const Img = styled.img` - max-width: ${({maxWidth}) => maxWidth || undefined}; - max-height: ${({maxHeight}) => maxHeight || undefined}; - position: ${({position}) => position || undefined}; - z-index: ${({zIndex}) => zIndex || 0}; - top: ${({top}) => top || undefined}; - left: ${({left}) => left || undefined}; - margin: ${({m}) => m || '0px 0px 0px 0px'}; - padding: ${({p}) => p || '0px 0px 0px 0px'}; - display: ${({display}) => display || undefined}; -` \ No newline at end of file + max-width: ${({ maxWidth }) => maxWidth || undefined}; + max-height: ${({ maxHeight }) => maxHeight || undefined}; + position: ${({ position }) => position || undefined}; + z-index: ${({ zIndex }) => zIndex || 0}; + top: ${({ top }) => top || undefined}; + left: ${({ left }) => left || undefined}; + margin: ${({ m }) => m || "0px 0px 0px 0px"}; + padding: ${({ p }) => p || "0px 0px 0px 0px"}; + display: ${({ display }) => display || undefined}; +`; diff --git a/src/components/atoms/input/Input.styled.ts b/src/components/atoms/input/Input.styled.ts index 0f1cc7c..c1257e0 100644 --- a/src/components/atoms/input/Input.styled.ts +++ b/src/components/atoms/input/Input.styled.ts @@ -1,8 +1,8 @@ -import styled from 'styled-components'; +import styled from "styled-components"; -import { commonStyles } from '../../../shared/styles/commonStyles'; +import { commonStyles } from "../../../shared/styles/commonStyles"; -import COLORS from '../../../shared/styles/variables'; +import COLORS from "../../../shared/styles/variables"; export const Input = styled.input` width: 100%; @@ -17,7 +17,7 @@ export const Input = styled.input` border-color: ${COLORS.PRIMARY}; outline: none; } - + &.error { border: 2px solid ${COLORS.ALERT_1}; background-color: ${COLORS.ALERT_2}; diff --git a/src/components/atoms/input/InputDate.styled.ts b/src/components/atoms/input/InputDate.styled.ts index 51114ba..052af4f 100644 --- a/src/components/atoms/input/InputDate.styled.ts +++ b/src/components/atoms/input/InputDate.styled.ts @@ -1,8 +1,8 @@ -import styled from 'styled-components'; +import styled from "styled-components"; -import { commonStyles } from '../../../shared/styles/commonStyles'; +import { commonStyles } from "../../../shared/styles/commonStyles"; -import COLORS from '../../../shared/styles/variables'; +import COLORS from "../../../shared/styles/variables"; export const DateInput = styled.button` ${commonStyles} diff --git a/src/components/atoms/label/Label.styled.ts b/src/components/atoms/label/Label.styled.ts index a5c66cd..2a807ac 100644 --- a/src/components/atoms/label/Label.styled.ts +++ b/src/components/atoms/label/Label.styled.ts @@ -8,4 +8,4 @@ export const Label = styled.label` display: block; margin-bottom: 8px; ${commonStyles} -` \ No newline at end of file +`; diff --git a/src/components/atoms/link/Link.styled.ts b/src/components/atoms/link/Link.styled.ts index 5ead228..fcc78c6 100644 --- a/src/components/atoms/link/Link.styled.ts +++ b/src/components/atoms/link/Link.styled.ts @@ -1,4 +1,4 @@ -import { Link as RouterLink } from 'react-router-dom'; +import { Link as RouterLink } from "react-router-dom"; import styled from "styled-components"; @@ -18,9 +18,9 @@ type LinkProps = { mb?: string; m?: string; outline?: string; -} +}; -export const Link = styled(RouterLink) ` +export const Link = styled(RouterLink)` font-weight: ${({ fw }) => fw || "700px"}; font-size: ${({ fz }) => fz || "18px"}; border-radius: ${({ borderRadius }) => borderRadius || "16px"}; @@ -39,4 +39,4 @@ export const Link = styled(RouterLink) ` &:hover { text-decoration: underline; } -` \ No newline at end of file +`; diff --git a/src/components/atoms/link/LinkMenu.styled.ts b/src/components/atoms/link/LinkMenu.styled.ts index 1890035..7bde050 100644 --- a/src/components/atoms/link/LinkMenu.styled.ts +++ b/src/components/atoms/link/LinkMenu.styled.ts @@ -1,6 +1,6 @@ -import { Link as RouterLink } from 'react-router-dom'; +import { Link as RouterLink } from "react-router-dom"; -import styled from "styled-components" +import styled from "styled-components"; import { blackSVGtoWhite } from "../../../shared/styles/iconStyles"; @@ -13,7 +13,9 @@ export const LinkMenu = styled(RouterLink)` align-items: center; text-decoration: none; - ${({ to }) => (to === window.location.pathname ? ` + ${({ to }) => + to === window.location.pathname + ? ` background-color: ${COLORS.PRIMARY}; > span { color: ${COLORS.WHITE}; @@ -22,8 +24,8 @@ export const LinkMenu = styled(RouterLink)` svg { ${blackSVGtoWhite}; } - ` : undefined - )} + ` + : undefined} &:hover { background-color: ${COLORS.PRIMARY_HOVER}; @@ -45,4 +47,4 @@ export const LinkMenu = styled(RouterLink)` font-size: 14px; font-weight: 600; } -` \ No newline at end of file +`; diff --git a/src/components/atoms/list/List.styled.ts b/src/components/atoms/list/List.styled.ts index 10af3af..a42c2f4 100644 --- a/src/components/atoms/list/List.styled.ts +++ b/src/components/atoms/list/List.styled.ts @@ -1,6 +1,6 @@ -import styled from 'styled-components'; +import styled from "styled-components"; -import { commonStyles } from '../../../shared/styles/commonStyles'; +import { commonStyles } from "../../../shared/styles/commonStyles"; export const List = styled.ul` margin: 0; @@ -8,4 +8,4 @@ export const List = styled.ul` ${commonStyles} list-style: none; -`; \ No newline at end of file +`; diff --git a/src/components/atoms/list/ListItem.styled.ts b/src/components/atoms/list/ListItem.styled.ts index 2eb342b..98edcb2 100644 --- a/src/components/atoms/list/ListItem.styled.ts +++ b/src/components/atoms/list/ListItem.styled.ts @@ -4,4 +4,4 @@ import { commonStyles } from "../../../shared/styles/commonStyles"; export const ListItem = styled.li` ${commonStyles} -`; \ No newline at end of file +`; diff --git a/src/components/atoms/typography/Typography.styled.ts b/src/components/atoms/typography/Typography.styled.ts index 3c72828..6c6e401 100644 --- a/src/components/atoms/typography/Typography.styled.ts +++ b/src/components/atoms/typography/Typography.styled.ts @@ -1,24 +1,23 @@ -import styled, { css } from 'styled-components'; +import styled, { css } from "styled-components"; -import { commonStyles, commonStylesProps } from '../../../shared/styles/commonStyles'; +import { + commonStyles, + commonStylesProps, +} from "../../../shared/styles/commonStyles"; type TypographyProps = commonStylesProps & { textAlign?: string; letterSpacing?: string; lh?: string; -} +}; -export const Typography = styled.p(props => { - const { - textAlign, - letterSpacing, - lh - } = props +export const Typography = styled.p((props) => { + const { textAlign, letterSpacing, lh } = props; return css` ${commonStyles} - text-align: ${textAlign || 'left'}; - letter-spacing: ${letterSpacing || 'normal'}; + text-align: ${textAlign || "left"}; + letter-spacing: ${letterSpacing || "normal"}; line-height: ${lh || undefined}; - ` -}) \ No newline at end of file + `; +}); diff --git a/src/components/molecules/base-field/BaseField.tsx b/src/components/molecules/base-field/BaseField.tsx index 3d0166a..fb293c1 100644 --- a/src/components/molecules/base-field/BaseField.tsx +++ b/src/components/molecules/base-field/BaseField.tsx @@ -1,3 +1,4 @@ +import { FieldErrors, UseFormRegisterReturn } from "react-hook-form"; import { Box } from "../../atoms/box/Box.styled"; import { Label } from "../../atoms/label/Label.styled"; import { Input } from "../../atoms/input/Input.styled"; @@ -8,8 +9,6 @@ import VisibilityOn from "../../../shared/assets/icons/visibility-on.svg"; import COLORS from "../../../shared/styles/variables"; -import { FieldErrors, UseFormRegisterReturn } from 'react-hook-form' - type BaseFieldProps = { fieldType: "text" | "email" | "password"; name: string; @@ -35,9 +34,8 @@ const BaseField: React.FC = ({ if (fieldType === "password") { if (isPasswordVisible) { return "text"; - } else { - return "password"; } + return "password"; } return "text"; }; @@ -50,9 +48,7 @@ const BaseField: React.FC = ({ lh="16px" color={COLORS.ALMOST_BLACK_FOR_TEXT} mb="6px" - textAlight="left" - > - + textAlight="left"> {label} @@ -63,8 +59,7 @@ const BaseField: React.FC = ({ top="16px" right="10px" cursor="pointer" - onClick={() => setIsPasswordVisible(!isPasswordVisible)} - > + onClick={() => setIsPasswordVisible(!isPasswordVisible)}> {isPasswordVisible ? : } )} @@ -86,8 +81,7 @@ const BaseField: React.FC = ({ fz="13px" height="14px" width="300px" - mb="20px" - > + mb="20px"> {errors?.[name] && <>{errors?.[name]?.message || "Error!"}} diff --git a/src/components/molecules/category/Category.tsx b/src/components/molecules/category/Category.tsx index f169e17..a110eba 100644 --- a/src/components/molecules/category/Category.tsx +++ b/src/components/molecules/category/Category.tsx @@ -4,8 +4,8 @@ import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; import { CategoryWrapper } from "./CategoryWrapper"; -import IncomeIcon from "../../../shared/assets/icons/income.svg" -import ExpenseIcon from "../../../shared/assets/icons/expense.svg" +import IncomeIcon from "../../../shared/assets/icons/income.svg"; +import ExpenseIcon from "../../../shared/assets/icons/expense.svg"; import COLORS from "../../../shared/styles/variables"; @@ -13,10 +13,10 @@ import { ICategory } from "../../../../types/category"; type CategoryProps = { category: ICategory; -} +}; const Category: React.FC = ({ category }) => { - const { activeCategory } = useAppSelector(state => state.category) + const { activeCategory } = useAppSelector((state) => state.category); const isActive = category?.id === activeCategory?.id; const isIncome = category?.type_of_outlay === "income"; @@ -28,8 +28,7 @@ const Category: React.FC = ({ category }) => { as="h5" fw="600" fz="16px" - color={isActive ? COLORS.WHITE : COLORS.DARK_FOR_TEXT} - > + color={isActive ? COLORS.WHITE : COLORS.DARK_FOR_TEXT}> {category.title} @@ -40,8 +39,7 @@ const Category: React.FC = ({ category }) => { alignItems="center" p="3px 6px" bgColor={COLORS.WHITE} - borderRadius="6px" - > + borderRadius="6px"> = ({ category }) => { textAlign="right" fz="14px" fw="600" - mr="6px" - > + mr="6px"> {isIncome ? "Надходження" : "Витрата"} {isIncome ? : } @@ -58,6 +55,6 @@ const Category: React.FC = ({ category }) => { ); -} +}; -export default Category; \ No newline at end of file +export default Category; diff --git a/src/components/molecules/charts/DoughnutChart.tsx b/src/components/molecules/charts/DoughnutChart.tsx index 4a1be7f..758e62e 100644 --- a/src/components/molecules/charts/DoughnutChart.tsx +++ b/src/components/molecules/charts/DoughnutChart.tsx @@ -1,7 +1,7 @@ import { useEffect, useRef } from "react"; import { Chart } from "chart.js/auto"; -import ChartDataLabels from 'chartjs-plugin-datalabels'; +import ChartDataLabels from "chartjs-plugin-datalabels"; import { useAppSelector } from "../../../store/hooks"; @@ -15,33 +15,31 @@ type DoughnutChartProps = { data: string[]; labels: string[]; isHomePage?: boolean; -} +}; const DoughnutChart: React.FC = ({ data, labels, - isHomePage + isHomePage, }) => { const chartRef = useRef(null); const chart = useRef(); - const { - incomesChart, - expensesChart, - allOutlaysChart - } = useAppSelector(state => state.statistics); + const { incomesChart, expensesChart, allOutlaysChart } = useAppSelector( + (state) => state.statistics + ); - const { chartData, chartOptions } = getDoughnutChartConfig(data, labels) + const { chartData, chartOptions } = getDoughnutChartConfig(data, labels); useEffect(() => { - const myDoughnutChartRef = chartRef.current.getContext('2d'); + const myDoughnutChartRef = chartRef.current.getContext("2d"); if (chart.current) { chart.current.destroy(); // Destroy the previous chart instance } chart.current = new Chart(myDoughnutChartRef, { - type: 'doughnut', + type: "doughnut", data: chartData, options: chartOptions, plugins: [ChartDataLabels], @@ -69,7 +67,11 @@ const DoughnutChart: React.FC = ({ return ( - + ); diff --git a/src/components/molecules/charts/LineChart.tsx b/src/components/molecules/charts/LineChart.tsx index 8554dd0..9ee927b 100644 --- a/src/components/molecules/charts/LineChart.tsx +++ b/src/components/molecules/charts/LineChart.tsx @@ -7,14 +7,13 @@ import { useAppSelector } from "../../../store/hooks"; import { generateLabels, setLineChartConfig, - setPointValues + setPointValues, } from "./lineChartConfig"; const LineChart: React.FC<{ data: number[] }> = ({ data }) => { - const { - filterByDays, - allOutlaysChart, - } = useAppSelector(state => state.statistics) + const { filterByDays, allOutlaysChart } = useAppSelector( + (state) => state.statistics + ); const chartRef = useRef(null); const chart = useRef(null); @@ -35,18 +34,17 @@ const LineChart: React.FC<{ data: number[] }> = ({ data }) => { const labels = generateLabels( allOutlaysChart.categoryTransactions, filterByDays - ) + ); - setLabels(labels) + setLabels(labels); setPointValues( filterByDays, setPointHitRadiusValue, setPointBorderWidthValue - ) + ); }, [allOutlaysChart.categoryTransactions]); - useEffect(() => { const myLineChartRef = chartRef.current.getContext("2d"); @@ -80,8 +78,13 @@ const LineChart: React.FC<{ data: number[] }> = ({ data }) => { ]); return ( - + ); }; -export default LineChart; \ No newline at end of file +export default LineChart; diff --git a/src/components/molecules/charts/doughnutChartConfig.ts b/src/components/molecules/charts/doughnutChartConfig.ts index e0f6338..b22fa2c 100644 --- a/src/components/molecules/charts/doughnutChartConfig.ts +++ b/src/components/molecules/charts/doughnutChartConfig.ts @@ -4,66 +4,66 @@ import COLORS from "../../../shared/styles/variables"; const calculatePercentage = (value: number, ctx: any): string => { let sum = 0; - let dataArr = ctx.chart.data.datasets[0].data; + const dataArr = ctx.chart.data.datasets[0].data; let percentage: number = 0; dataArr.map((data: number) => { - if (typeof data === 'number') { + if (typeof data === "number") { sum += data; } }); - if (typeof value === 'number') { + if (typeof value === "number") { percentage = parseInt(((value * 100) / sum).toFixed()); } - return percentage + '%'; -} + return `${percentage}%`; +}; export const getDoughnutChartConfig = ( data: string[], labels: string[] -): { chartData: ChartData, chartOptions: ChartOptions } => { +): { chartData: ChartData; chartOptions: ChartOptions } => { const chartData: ChartData = { - labels: labels, + labels, datasets: [ { - data: data?.map(value => parseFloat(value)), + data: data?.map((value) => parseFloat(value)), backgroundColor: [ - '#7380F0', - '#5DD9AD', - '#E5FC6D', - '#FAB471', - '#D95DB2', - '#6EE4E6', - '#A3FC6D', - '#F2CA68', - '#F06C6F', - '#926DFC', + "#7380F0", + "#5DD9AD", + "#E5FC6D", + "#FAB471", + "#D95DB2", + "#6EE4E6", + "#A3FC6D", + "#F2CA68", + "#F06C6F", + "#926DFC", ], hoverBackgroundColor: [ - '#7380F0dd', - '#5DD9ADdd', - '#E5FC6Ddd', - '#FAB471dd', - '#D95DB2dd', - '#6EE4E6dd', - '#A3FC6Ddd', - '#F2CA68dd', - '#F06C6Fdd', - '#926DFCdd', + "#7380F0dd", + "#5DD9ADdd", + "#E5FC6Ddd", + "#FAB471dd", + "#D95DB2dd", + "#6EE4E6dd", + "#A3FC6Ddd", + "#F2CA68dd", + "#F06C6Fdd", + "#926DFCdd", ], borderWidth: 0, }, ], - } + }; const chartOptions: ChartOptions = { plugins: { tooltip: { callbacks: { label: (context: any) => { - const label = context?.dataset?.label || ''; + const label = context?.dataset?.label || ""; const value = context?.formattedValue; return `${label} ${value}₴`; }, @@ -96,5 +96,5 @@ export const getDoughnutChartConfig = ( }, }; - return { chartData, chartOptions } -} \ No newline at end of file + return { chartData, chartOptions }; +}; diff --git a/src/components/molecules/header/Header.styled.ts b/src/components/molecules/header/Header.styled.ts index 9748008..357911c 100644 --- a/src/components/molecules/header/Header.styled.ts +++ b/src/components/molecules/header/Header.styled.ts @@ -1,7 +1,7 @@ import styled from "styled-components"; -import { Box } from './../../atoms/box/Box.styled'; -import { Typography } from './../../atoms/typography/Typography.styled'; +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; import { List } from "../../atoms/list/List.styled"; import COLORS from "../../../shared/styles/variables"; @@ -12,14 +12,14 @@ export const HeaderWrapper = styled.nav` padding: 12px 50px; border-bottom: 2px solid ${COLORS.DIVIDER}; margin-bottom: 20px; - + ${Box} { > a { display: flex; align-items: center; gap: 5px; text-decoration: none; - + ${Typography} { user-select: none; font-weight: 800; @@ -33,4 +33,4 @@ export const HeaderWrapper = styled.nav` flex-grow: 1; align-items: center; } -` \ No newline at end of file +`; diff --git a/src/components/molecules/header/Header.tsx b/src/components/molecules/header/Header.tsx index e335316..ca288ed 100644 --- a/src/components/molecules/header/Header.tsx +++ b/src/components/molecules/header/Header.tsx @@ -4,32 +4,36 @@ import { Link, useNavigate } from "react-router-dom"; import { PopupContext } from "../../../contexts/PopupContext"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { logoutUser, resetUserState, setIsLoggedOut } from "../../../store/userSlice"; +import { + logoutUser, + resetUserState, + setIsLoggedOut, +} from "../../../store/userSlice"; import { resetWalletState } from "../../../store/walletSlice"; import { resetCategoryState } from "../../../store/categorySlice"; import { resetTransactionState } from "../../../store/transactionSlice"; import { resetStatisticsState } from "../../../store/statisticsSlice"; -import { HeaderWrapper } from './Header.styled'; +import { HeaderWrapper } from "./Header.styled"; import { LinkMenu } from "../../atoms/link/LinkMenu.styled"; -import { Box } from './../../atoms/box/Box.styled'; +import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; -import { List } from './../../atoms/list/List.styled'; -import { ListItem } from './../../atoms/list/ListItem.styled'; +import { List } from "../../atoms/list/List.styled"; +import { ListItem } from "../../atoms/list/ListItem.styled"; import { ButtonTransparent } from "../../atoms/button/ButtonTransparent.styled"; import PopupEditProfile from "../popup/edit-profile/PopupEditProfile"; import PopupDeleteAccount from "../popup/PopupDeleteAccount"; -import LogoIcon from '../../../shared/assets/icons/logo.svg' -import HomeIcon from '../../../shared/assets/icons/home.svg' -import RouteIcon from '../../../shared/assets/icons/route.svg' -import FolderCheckIcon from '../../../shared/assets/icons/folder-check.svg' -import PieChartIcon from '../../../shared/assets/icons/pie-chart.svg' -import SettingsIcon from '../../../shared/assets/icons/settings-header.svg' -import LogoutIcon from '../../../shared/assets/icons/logout.svg' +import LogoIcon from "../../../shared/assets/icons/logo.svg"; +import HomeIcon from "../../../shared/assets/icons/home.svg"; +import RouteIcon from "../../../shared/assets/icons/route.svg"; +import FolderCheckIcon from "../../../shared/assets/icons/folder-check.svg"; +import PieChartIcon from "../../../shared/assets/icons/pie-chart.svg"; +import SettingsIcon from "../../../shared/assets/icons/settings-header.svg"; +import LogoutIcon from "../../../shared/assets/icons/logout.svg"; const Header: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); const navigate = useNavigate(); const { @@ -38,7 +42,7 @@ const Header: React.FC = () => { isDeleteAccountPopupOpen, } = useContext(PopupContext); - const { isLoggedOut } = useAppSelector(state => state.user) + const { isLoggedOut } = useAppSelector((state) => state.user); useEffect(() => { if (isLoggedOut) { @@ -48,7 +52,7 @@ const Header: React.FC = () => { dispatch(resetStatisticsState()); dispatch(resetUserState()); dispatch(setIsLoggedOut(true)); - navigate('/welcome'); + navigate("/welcome"); } }, [isLoggedOut]); @@ -58,7 +62,7 @@ const Header: React.FC = () => { const handleLogOutClick = () => { dispatch(logoutUser()); - } + }; return ( <> @@ -111,6 +115,6 @@ const Header: React.FC = () => { {isDeleteAccountPopupOpen && } ); -} +}; -export default Header; \ No newline at end of file +export default Header; diff --git a/src/components/molecules/popup/Popup.styled.ts b/src/components/molecules/popup/Popup.styled.ts index e7e2f8e..0bd173b 100644 --- a/src/components/molecules/popup/Popup.styled.ts +++ b/src/components/molecules/popup/Popup.styled.ts @@ -1,10 +1,10 @@ -import styled from 'styled-components' +import styled from "styled-components"; -import { blackSVGtoWhite } from '../../../shared/styles/iconStyles' +import { blackSVGtoWhite } from "../../../shared/styles/iconStyles"; -import { Box } from '../../atoms/box/Box.styled' +import { Box } from "../../atoms/box/Box.styled"; -import COLORS from '../../../shared/styles/variables' +import COLORS from "../../../shared/styles/variables"; export const PopupWrapper = styled(Box)` position: absolute; @@ -17,14 +17,14 @@ export const PopupWrapper = styled(Box)` align-items: center; background-color: ${COLORS.GREY_50}66; - >${Box} { + > ${Box} { display: flex; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); padding: 32px; border-radius: 16px; background: ${COLORS.BASE_1}; position: relative; - + > button { top: 15px; right: 15px; @@ -41,4 +41,4 @@ export const PopupWrapper = styled(Box)` } } } -` \ No newline at end of file +`; diff --git a/src/components/molecules/popup/PopupDeleteAccount.tsx b/src/components/molecules/popup/PopupDeleteAccount.tsx index 8c8568b..602fab6 100644 --- a/src/components/molecules/popup/PopupDeleteAccount.tsx +++ b/src/components/molecules/popup/PopupDeleteAccount.tsx @@ -1,5 +1,5 @@ import { useContext, useEffect } from "react"; -import { useNavigate } from 'react-router-dom'; +import { useNavigate } from "react-router-dom"; import { useForm } from "react-hook-form"; @@ -7,10 +7,10 @@ import { PopupContext } from "../../../contexts/PopupContext"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { - deleteUserAccount, - resetDeleteUserAccountError, - resetUserState, - setIsAccountDeleted + deleteUserAccount, + resetDeleteUserAccountError, + resetUserState, + setIsAccountDeleted, } from "../../../store/userSlice"; import { resetWalletState } from "../../../store/walletSlice"; import { resetCategoryState } from "../../../store/categorySlice"; @@ -18,104 +18,103 @@ import { resetTransactionState } from "../../../store/transactionSlice"; import { resetStatisticsState } from "../../../store/statisticsSlice"; import { Box } from "../../atoms/box/Box.styled"; -import { Button } from '../../atoms/button/Button.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; +import { Button } from "../../atoms/button/Button.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; import { Form } from "../../atoms/form/Form.styled"; import { PopupWrapper } from "./Popup.styled"; -import CrossIcon from './../../../shared/assets/icons/cross.svg'; +import CrossIcon from "../../../shared/assets/icons/cross.svg"; const PopupDeleteAccount: React.FC = () => { - const dispatch = useAppDispatch(); - const navigate = useNavigate(); - - const { setIsDeleteAccountPopupOpen, setIsEditProfilePopupOpen } = useContext(PopupContext); - const { isAccountDeleted, isLoading } = useAppSelector(state => state.user) - - const { handleSubmit } = useForm(); - - useEffect(() => { - if (isAccountDeleted) { - dispatch(resetWalletState()); - dispatch(resetCategoryState()); - dispatch(resetTransactionState()); - dispatch(resetStatisticsState()); - dispatch(resetUserState()); - dispatch(setIsAccountDeleted(true)); - handleCloseClick(); - setIsEditProfilePopupOpen(false); - navigate('/welcome'); - } - }, [isAccountDeleted]); - - const handleCloseClick = () => { - dispatch(resetDeleteUserAccountError()); - setIsDeleteAccountPopupOpen(false); + const dispatch = useAppDispatch(); + const navigate = useNavigate(); + + const { setIsDeleteAccountPopupOpen, setIsEditProfilePopupOpen } = + useContext(PopupContext); + const { isAccountDeleted, isLoading } = useAppSelector((state) => state.user); + + const { handleSubmit } = useForm(); + + const handleCloseClick = () => { + dispatch(resetDeleteUserAccountError()); + setIsDeleteAccountPopupOpen(false); + }; + + const handleSub = () => { + dispatch(deleteUserAccount()); + }; + + useEffect(() => { + if (isAccountDeleted) { + dispatch(resetWalletState()); + dispatch(resetCategoryState()); + dispatch(resetTransactionState()); + dispatch(resetStatisticsState()); + dispatch(resetUserState()); + dispatch(setIsAccountDeleted(true)); + handleCloseClick(); + setIsEditProfilePopupOpen(false); + navigate("/welcome"); + } + }, [isAccountDeleted]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === "Escape") { + handleCloseClick(); + } }; - const handleSub = () => { - dispatch(deleteUserAccount()); - } + window.addEventListener("keydown", handleKeyPress); - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - - window.addEventListener('keydown', handleKeyPress); - - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - return ( - - event.stopPropagation()}> - - - Видалення аккаунту - - - Ви збираєтесь видалити свій обліковий запис, цей процес
- незворотній і всі ваші дані та інформація будуть втрачені.

- Підтвердіть операцію. - - - - - - - - - + return () => { + window.removeEventListener("keydown", handleKeyPress); + }; + }, []); + + return ( + + event.stopPropagation()}> + + + Видалення аккаунту + + + Ви збираєтесь видалити свій обліковий запис, цей процес
+ незворотній і всі ваші дані та інформація будуть втрачені. +

+ Підтвердіть операцію. + +
+ + + - - ); -} - -export default PopupDeleteAccount; \ No newline at end of file +
+ + + + + ); +}; + +export default PopupDeleteAccount; diff --git a/src/components/molecules/popup/PopupEditWallet.tsx b/src/components/molecules/popup/PopupEditWallet.tsx index b2da1dd..6ba8229 100644 --- a/src/components/molecules/popup/PopupEditWallet.tsx +++ b/src/components/molecules/popup/PopupEditWallet.tsx @@ -6,10 +6,10 @@ import { PopupContext } from "../../../contexts/PopupContext"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { - resetError, - setActiveWallet, - setSuccessStatus, - walletAction + resetError, + setActiveWallet, + setSuccessStatus, + walletAction, } from "../../../store/walletSlice"; import { titleFieldRules } from "../../../shared/utils/field-rules/title"; @@ -18,148 +18,166 @@ import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; import { userId } from "../../../api/api"; import { Box } from "../../atoms/box/Box.styled"; -import { Button } from '../../atoms/button/Button.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; +import { Button } from "../../atoms/button/Button.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; import { ButtonLink } from "../../atoms/button/ButtonLink"; import { Form } from "../../atoms/form/Form.styled"; import { PopupWrapper } from "./Popup.styled"; import BaseField from "../base-field/BaseField"; -import CrossIcon from './../../../shared/assets/icons/cross.svg'; +import CrossIcon from "../../../shared/assets/icons/cross.svg"; import COLORS from "../../../shared/styles/variables"; import { IWallet, WalletFormData } from "../../../../types/wallet"; const PopupEditWallet: React.FC = () => { - const dispatch = useAppDispatch() - - const { setIsEditWalletPopupOpen } = useContext(PopupContext); - - const { - error, - isEditWalletSuccess, - isDeleteWalletSuccess, - activeWallet, - isLoading - } = useAppSelector(state => state.wallet); - - const { user } = useAppSelector(state => state.user); - - const { - register, - formState: { errors, isValid }, - handleSubmit, - } = useForm({ mode: "all" }); - - const handleCloseClick = () => { - setIsEditWalletPopupOpen(false); - dispatch(setActiveWallet(null)); - dispatch(resetError()); - dispatch(setSuccessStatus(false)); - }; - - const handleDeleteWallet = () => { - dispatch(setSuccessStatus(false)); - dispatch(walletAction({ - method: "DELETE", - id: String(activeWallet?.id) - })); - }; - - const handleSub = (data: WalletFormData) => { - const wallet: IWallet = { - title: data.title, - amount: data.amount, - type_of_account: activeWallet.type_of_account, - owner: user?.id || userId, - } - - dispatch(walletAction({ - data: wallet, - method: "PUT", - id: String(activeWallet?.id) - })) - } - - useEffect(() => { - if (isEditWalletSuccess || isDeleteWalletSuccess) { - handleCloseClick() - } - }, [isEditWalletSuccess, isDeleteWalletSuccess]); - - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - - window.addEventListener('keydown', handleKeyPress); - - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - return ( - - event.stopPropagation()}> - - - Редагування рахунку - -
- - - - - - {error && {error}} - - - - - -
- - {activeWallet?.type_of_account === "bank" && ( - - Видалити рахунок - - )} - - - - - ); -} - -export default PopupEditWallet; \ No newline at end of file + const dispatch = useAppDispatch(); + + const { setIsEditWalletPopupOpen } = useContext(PopupContext); + + const { + error, + isEditWalletSuccess, + isDeleteWalletSuccess, + activeWallet, + isLoading, + } = useAppSelector((state) => state.wallet); + + const { user } = useAppSelector((state) => state.user); + + const { + register, + formState: { errors, isValid }, + handleSubmit, + } = useForm({ mode: "all" }); + + const handleCloseClick = () => { + setIsEditWalletPopupOpen(false); + dispatch(setActiveWallet(null)); + dispatch(resetError()); + dispatch(setSuccessStatus(false)); + }; + + const handleDeleteWallet = () => { + dispatch(setSuccessStatus(false)); + dispatch( + walletAction({ + method: "DELETE", + id: String(activeWallet?.id), + }) + ); + }; + + const handleSub = (data: WalletFormData) => { + const wallet: IWallet = { + title: data.title, + amount: data.amount, + type_of_account: activeWallet.type_of_account, + owner: user?.id || userId, + }; + + dispatch( + walletAction({ + data: wallet, + method: "PUT", + id: String(activeWallet?.id), + }) + ); + }; + + useEffect(() => { + if (isEditWalletSuccess || isDeleteWalletSuccess) { + handleCloseClick(); + } + }, [isEditWalletSuccess, isDeleteWalletSuccess]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === "Escape") { + handleCloseClick(); + } + }; + + window.addEventListener("keydown", handleKeyPress); + + return () => { + window.removeEventListener("keydown", handleKeyPress); + }; + }, []); + + return ( + + event.stopPropagation()}> + + + Редагування рахунку + +
+ + + + + + {error && ( + + {error} + + )} + + + + + +
+ + {activeWallet?.type_of_account === "bank" && ( + + Видалити рахунок + + )} + + + + + ); +}; + +export default PopupEditWallet; diff --git a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx index 0753ee0..afc37f8 100644 --- a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx @@ -5,7 +5,10 @@ import { useForm } from "react-hook-form"; import { PopupContext } from "../../../../contexts/PopupContext"; import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; -import { setBankDataSuccessStatus, sendBankData } from "../../../../store/bankDataSlice"; +import { + setBankDataSuccessStatus, + sendBankData, +} from "../../../../store/bankDataSlice"; import { setSuccessStatus } from "../../../../store/userSlice"; import { setActiveWallet, resetError } from "../../../../store/walletSlice"; @@ -26,7 +29,7 @@ import COLORS from "../../../../shared/styles/variables"; import { IBankData } from "../../../../../types/bankdata"; const AddBankDataTab: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); const [fileValue, setFileValue] = useState(); @@ -35,19 +38,17 @@ const AddBankDataTab: React.FC = () => { const { setIsAddWalletPopupOpen } = useContext(PopupContext); - const { - error, - isAddWalletSuccess, - isLoading - } = useAppSelector(state => state.wallet); - const { user } = useAppSelector(state => state.user); - const { isAddBankDataSuccess } = useAppSelector(state => state.bankData); + const { error, isAddWalletSuccess, isLoading } = useAppSelector( + (state) => state.wallet + ); + const { user } = useAppSelector((state) => state.user); + const { isAddBankDataSuccess } = useAppSelector((state) => state.bankData); const { register, formState: { errors, isValid }, handleSubmit, - reset + reset, } = useForm({ mode: "all" }); const handleCloseClick = () => { @@ -61,12 +62,12 @@ const AddBankDataTab: React.FC = () => { const handleSubmitBankData = (data: IBankData) => { const formData: any = new FormData(); - formData.append('file', fileValue); - formData.append('owner', user?.id || userId); - formData.append('wallettitle', data.wallettitle); + formData.append("file", fileValue); + formData.append("owner", user?.id || userId); + formData.append("wallettitle", data.wallettitle); dispatch(sendBankData(formData)); - } + }; useEffect(() => { if (isAddBankDataSuccess) { @@ -77,15 +78,15 @@ const AddBankDataTab: React.FC = () => { useEffect(() => { const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() + if (event.key === "Escape") { + handleCloseClick(); } - } + }; - window.addEventListener('keydown', handleKeyPress); + window.addEventListener("keydown", handleKeyPress); return () => { - window.removeEventListener('keydown', handleKeyPress); + window.removeEventListener("keydown", handleKeyPress); }; }, []); @@ -97,7 +98,7 @@ const AddBankDataTab: React.FC = () => { label="Введіть назву карткового рахунку" errors={errors} name="wallettitle" - registerOptions={register('wallettitle', titleFieldRules)} + registerOptions={register("wallettitle", titleFieldRules)} width="325px" /> @@ -105,8 +106,7 @@ const AddBankDataTab: React.FC = () => { primary onClick={() => inputFileRef.current.click()} width="376px" - type="button" - > + type="button"> Вибрати файл даних @@ -126,7 +126,11 @@ const AddBankDataTab: React.FC = () => { - {error && {error}} + {error && ( + + {error} + + )} { justifyContent="space-between" borderTop={`2px solid ${COLORS.ALERT_1}`} pt="51px" - mb="25px" - > + mb="25px"> - ) -} + ); +}; -export default AddBankDataTab; \ No newline at end of file +export default AddBankDataTab; diff --git a/src/components/molecules/popup/add-wallet/AddWalletTab.tsx b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx index 26232ec..50e6ee1 100644 --- a/src/components/molecules/popup/add-wallet/AddWalletTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx @@ -10,7 +10,7 @@ import { resetError, setActiveWallet, setSuccessStatus, - walletAction + walletAction, } from "../../../../store/walletSlice"; import { titleFieldRules } from "../../../../shared/utils/field-rules/title"; @@ -29,23 +29,21 @@ import COLORS from "../../../../shared/styles/variables"; import { IWallet, WalletFormData } from "../../../../../types/wallet"; const AddWalletTab: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); const { setIsAddWalletPopupOpen } = useContext(PopupContext); - const { - error, - isAddWalletSuccess, - isLoading - } = useAppSelector(state => state.wallet); + const { error, isAddWalletSuccess, isLoading } = useAppSelector( + (state) => state.wallet + ); - const { user } = useAppSelector(state => state.user); + const { user } = useAppSelector((state) => state.user); const { register, formState: { errors, isValid }, handleSubmit, - reset + reset, } = useForm({ mode: "all" }); const handleCloseClick = () => { @@ -63,13 +61,15 @@ const AddWalletTab: React.FC = () => { amount: data.amount, type_of_account: "bank", owner: user?.id || userId, - } + }; - dispatch(walletAction({ - data: wallet, - method: "POST", - })) - } + dispatch( + walletAction({ + data: wallet, + method: "POST", + }) + ); + }; useEffect(() => { if (isAddWalletSuccess) { @@ -79,15 +79,15 @@ const AddWalletTab: React.FC = () => { useEffect(() => { const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() + if (event.key === "Escape") { + handleCloseClick(); } - } + }; - window.addEventListener('keydown', handleKeyPress); + window.addEventListener("keydown", handleKeyPress); return () => { - window.removeEventListener('keydown', handleKeyPress); + window.removeEventListener("keydown", handleKeyPress); }; }, []); @@ -99,7 +99,7 @@ const AddWalletTab: React.FC = () => { label="Введіть назву карткового рахунку" errors={errors} name="title" - registerOptions={register('title', titleFieldRules)} + registerOptions={register("title", titleFieldRules)} width="325px" /> { label="Введіть суму коштів на рахунку" errors={errors} name="amount" - registerOptions={register('amount', amountFieldRules)} + registerOptions={register("amount", amountFieldRules)} width="325px" />
- {error && {error}} + {error && ( + + {error} + + )} { justifyContent="space-between" borderTop={`2px solid ${COLORS.DIVIDER}`} pt="51px" - mb="25px" - > - - ) -} + ); +}; -export default AddWalletTab; \ No newline at end of file +export default AddWalletTab; diff --git a/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx index 60789bb..a804d53 100644 --- a/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx +++ b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx @@ -1,4 +1,3 @@ - import { Box } from "../../../atoms/box/Box.styled"; import { Typography } from "../../../atoms/typography/Typography.styled"; @@ -8,30 +7,19 @@ import PackageErrorIcon from "../../../../shared/assets/icons/package-error.svg" import COLORS from "../../../../shared/styles/variables"; type MessageProps = { - message: "success" | "error" -} + message: "success" | "error"; +}; -const BankdataInfoMessage: React.FC = ({ message }) => { - return ( - - {message === "success" ? ( - - ) : ( - - )} - - {message === "success" ? ( - "Файл успішно додано" - ) : ( - "Виникла помилка" - )} - - - ); -} +const BankdataInfoMessage: React.FC = ({ message }) => ( + + {message === "success" ? : } + + {message === "success" ? "Файл успішно додано" : "Виникла помилка"} + + +); -export default BankdataInfoMessage; \ No newline at end of file +export default BankdataInfoMessage; diff --git a/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx index 1609451..f9c5559 100644 --- a/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx +++ b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx @@ -4,92 +4,90 @@ import { PopupContext } from "../../../../contexts/PopupContext"; import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; import { setBankDataSuccessStatus } from "../../../../store/bankDataSlice"; -import { resetError, setActiveWallet, setSuccessStatus } from "../../../../store/walletSlice"; +import { + resetError, + setActiveWallet, + setSuccessStatus, +} from "../../../../store/walletSlice"; import { Box } from "../../../atoms/box/Box.styled"; import { Button } from "../../../atoms/button/Button.styled"; import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; -import { Typography } from '../../../atoms/typography/Typography.styled'; +import { Typography } from "../../../atoms/typography/Typography.styled"; import { PopupWrapper } from "../Popup.styled"; import AddWalletTab from "./AddWalletTab"; import AddBankDataTab from "./AddBankdataTab"; -import CrossIcon from '../../../../shared/assets/icons/cross.svg'; +import CrossIcon from "../../../../shared/assets/icons/cross.svg"; import COLORS from "../../../../shared/styles/variables"; const PopupAddWallet: React.FC = () => { - const dispatch = useAppDispatch() - - const [isAddWalletManuallyOpen, setIsAddWalletManuallyOpen] = useState(true); - - const { setIsAddWalletPopupOpen } = useContext(PopupContext); - - const { isAddWalletSuccess } = useAppSelector(state => state.wallet); - - const handleCloseClick = () => { - dispatch(setActiveWallet(null)); - dispatch(resetError()); - dispatch(setSuccessStatus(false)); - dispatch(setBankDataSuccessStatus(false)); - setIsAddWalletPopupOpen(false); - }; - - useEffect(() => { - if (isAddWalletSuccess) { - handleCloseClick(); - dispatch(setSuccessStatus(false)); - } - }, [isAddWalletSuccess]); - - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - - window.addEventListener('keydown', handleKeyPress); - - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - return ( - - event.stopPropagation()}> - - - Додати картковий рахунок - - - setIsAddWalletManuallyOpen(true)} - isActive={isAddWalletManuallyOpen} - > - Ввести дані вручну - - setIsAddWalletManuallyOpen(false)} - isActive={!isAddWalletManuallyOpen} - > - Завантажити дані з файлу - - - - {isAddWalletManuallyOpen ? ( - - ) : ( - - )} - - - - - ); -} - -export default PopupAddWallet; \ No newline at end of file + const dispatch = useAppDispatch(); + + const [isAddWalletManuallyOpen, setIsAddWalletManuallyOpen] = useState(true); + + const { setIsAddWalletPopupOpen } = useContext(PopupContext); + + const { isAddWalletSuccess } = useAppSelector((state) => state.wallet); + + const handleCloseClick = () => { + dispatch(setActiveWallet(null)); + dispatch(resetError()); + dispatch(setSuccessStatus(false)); + dispatch(setBankDataSuccessStatus(false)); + setIsAddWalletPopupOpen(false); + }; + + useEffect(() => { + if (isAddWalletSuccess) { + handleCloseClick(); + dispatch(setSuccessStatus(false)); + } + }, [isAddWalletSuccess]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === "Escape") { + handleCloseClick(); + } + }; + + window.addEventListener("keydown", handleKeyPress); + + return () => { + window.removeEventListener("keydown", handleKeyPress); + }; + }, []); + + return ( + + event.stopPropagation()}> + + + Додати картковий рахунок + + + setIsAddWalletManuallyOpen(true)} + isActive={isAddWalletManuallyOpen}> + Ввести дані вручну + + setIsAddWalletManuallyOpen(false)} + isActive={!isAddWalletManuallyOpen}> + Завантажити дані з файлу + + + + {isAddWalletManuallyOpen ? : } + + + + + ); +}; + +export default PopupAddWallet; diff --git a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx index 80f4789..7b72803 100644 --- a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx +++ b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx @@ -1,6 +1,6 @@ import { useContext, useEffect, useState } from "react"; -import { useForm } from 'react-hook-form'; +import { useForm } from "react-hook-form"; import { PopupContext } from "../../../../contexts/PopupContext"; @@ -8,19 +8,19 @@ import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; import { changeUserPassword, resetProfileEditErrors, - setSuccessStatus + setSuccessStatus, } from "../../../../store/userSlice"; import { confirmPasswordInputRules, - passwordInputRules + passwordInputRules, } from "../../../../shared/utils/field-rules/password"; import { Form } from "../../../atoms/form/Form.styled"; import { Box } from "../../../atoms/box/Box.styled"; import { Typography } from "../../../atoms/typography/Typography.styled"; import { Button } from "../../../atoms/button/Button.styled"; -import BaseField from './../../base-field/BaseField'; +import BaseField from "../../base-field/BaseField"; import COLORS from "../../../../shared/styles/variables"; @@ -33,11 +33,9 @@ const ChangePasswordTab: React.FC = () => { const [showPassword, setShowPassword] = useState(false); const [showConfirmPassword, setShowConfirmPassword] = useState(false); - const { - isLoading, - isPasswordChanged, - passwordChangeError - } = useAppSelector(state => state.user) + const { isLoading, isPasswordChanged, passwordChangeError } = useAppSelector( + (state) => state.user + ); const { setIsEditProfilePopupOpen } = useContext(PopupContext); @@ -48,18 +46,18 @@ const ChangePasswordTab: React.FC = () => { const handleSubmitChangePassword = (data: PasswordChangeFormData) => { dispatch(changeUserPassword(data)); - } + }; const { register, formState: { errors, isValid }, handleSubmit, - watch + watch, } = useForm({ mode: "all" }); useEffect(() => { if (isPasswordChanged) { - dispatch(setSuccessStatus(false)) + dispatch(setSuccessStatus(false)); handleCloseClick(); } }, [isPasswordChanged]); @@ -113,9 +111,12 @@ const ChangePasswordTab: React.FC = () => { gap="35px" borderTop={`2px solid ${COLORS.DIVIDER}`} pt="24px" - mb="24px" - > - - ) -} + ); +}; -export default ChangePasswordTab; \ No newline at end of file +export default ChangePasswordTab; diff --git a/src/components/molecules/popup/edit-profile/EditProfileTab.tsx b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx index de9ec04..56b8058 100644 --- a/src/components/molecules/popup/edit-profile/EditProfileTab.tsx +++ b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx @@ -8,7 +8,7 @@ import { useAppDispatch, useAppSelector } from "../../../../store/hooks"; import { changeUserProfile, resetProfileEditErrors, - setSuccessStatus + setSuccessStatus, } from "../../../../store/userSlice"; import { nameFieldRules } from "../../../../shared/utils/field-rules/name"; @@ -29,7 +29,9 @@ const EditProfileTab: React.FC = () => { const { setIsEditProfilePopupOpen } = useContext(PopupContext); - const { isProfileChanged, isLoading, user } = useAppSelector(state => state.user); + const { isProfileChanged, isLoading, user } = useAppSelector( + (state) => state.user + ); const handleCloseClick = () => { dispatch(resetProfileEditErrors()); @@ -37,18 +39,18 @@ const EditProfileTab: React.FC = () => { }; const handleSubmitChangeProfile = (data: IUser) => { - dispatch(changeUserProfile(data)) - } + dispatch(changeUserProfile(data)); + }; const { register, formState: { errors, isValid }, - handleSubmit + handleSubmit, } = useForm({ mode: "all" }); useEffect(() => { if (isProfileChanged) { - dispatch(setSuccessStatus(false)) + dispatch(setSuccessStatus(false)); handleCloseClick(); } }, [isProfileChanged]); @@ -89,9 +91,12 @@ const EditProfileTab: React.FC = () => { gap="35px" borderTop={`2px solid ${COLORS.DIVIDER}`} pt="24px" - mb="24px" - > - - ) -} + ); +}; -export default EditProfileTab; \ No newline at end of file +export default EditProfileTab; diff --git a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx index 60c4fd4..b611de9 100644 --- a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx +++ b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx @@ -5,95 +5,87 @@ import { PopupContext } from "../../../../contexts/PopupContext"; import { useAppSelector } from "../../../../store/hooks"; import { Box } from "../../../atoms/box/Box.styled"; -import { Button } from '../../../atoms/button/Button.styled'; +import { Button } from "../../../atoms/button/Button.styled"; import { PopupWrapper } from "../Popup.styled"; import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; -import { Typography } from '../../../atoms/typography/Typography.styled'; +import { Typography } from "../../../atoms/typography/Typography.styled"; import { ButtonLink } from "../../../atoms/button/ButtonLink"; import EditProfileTab from "./EditProfileTab"; import ChangePasswordTab from "./ChangePasswordTab"; -import CrossIcon from '../../../../shared/assets/icons/cross.svg'; +import CrossIcon from "../../../../shared/assets/icons/cross.svg"; const PopupEditProfile: React.FC = () => { - const { - setIsEditProfilePopupOpen, - setIsDeleteAccountPopupOpen - } = useContext(PopupContext); - - const { isProfileChanged } = useAppSelector(state => state.user); - - const [isEditProfileTabOpen, setIsEditProfileTabOpen] = useState(true); - - const handleCloseClick = () => { - setIsEditProfilePopupOpen(false); - }; - - const onDeleteAccountClick = () => { - setIsDeleteAccountPopupOpen(true); - } - - useEffect(() => { - if (isProfileChanged) { - handleCloseClick(); - } - }, [isProfileChanged]); - - useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - handleCloseClick() - } - } - - window.addEventListener('keydown', handleKeyPress); - - return () => { - window.removeEventListener('keydown', handleKeyPress); - }; - }, []); - - return ( - - event.stopPropagation()}> - - - Налаштування профілю - - - - setIsEditProfileTabOpen(true)} - isActive={isEditProfileTabOpen} - > - Дані користувача - - setIsEditProfileTabOpen(false)} - isActive={!isEditProfileTabOpen} - > - Зміна паролю - - - - {isEditProfileTabOpen ? ( - - ) : ( - - )} - - - - Видалити аккаунт - - - - - - - ); -} - -export default PopupEditProfile; \ No newline at end of file + const { setIsEditProfilePopupOpen, setIsDeleteAccountPopupOpen } = + useContext(PopupContext); + + const { isProfileChanged } = useAppSelector((state) => state.user); + + const [isEditProfileTabOpen, setIsEditProfileTabOpen] = useState(true); + + const handleCloseClick = () => { + setIsEditProfilePopupOpen(false); + }; + + const onDeleteAccountClick = () => { + setIsDeleteAccountPopupOpen(true); + }; + + useEffect(() => { + if (isProfileChanged) { + handleCloseClick(); + } + }, [isProfileChanged]); + + useEffect(() => { + const handleKeyPress = (event: KeyboardEvent) => { + if (event.key === "Escape") { + handleCloseClick(); + } + }; + + window.addEventListener("keydown", handleKeyPress); + + return () => { + window.removeEventListener("keydown", handleKeyPress); + }; + }, []); + + return ( + + event.stopPropagation()}> + + + Налаштування профілю + + + + setIsEditProfileTabOpen(true)} + isActive={isEditProfileTabOpen}> + Дані користувача + + setIsEditProfileTabOpen(false)} + isActive={!isEditProfileTabOpen}> + Зміна паролю + + + + {isEditProfileTabOpen ? : } + + + + Видалити аккаунт + + + + + + + ); +}; + +export default PopupEditProfile; diff --git a/src/components/molecules/select/Select.tsx b/src/components/molecules/select/Select.tsx index 6dee657..a87e9e1 100644 --- a/src/components/molecules/select/Select.tsx +++ b/src/components/molecules/select/Select.tsx @@ -1,36 +1,37 @@ -import COLORS from '../../../shared/styles/variables'; - -import ReactSelect, { StylesConfig } from 'react-select'; -import { FieldError, FieldErrorsImpl, Merge } from 'react-hook-form'; -import { SelectOptions } from '../../../../types/common'; +import ReactSelect, { StylesConfig } from "react-select"; +import { FieldError, FieldErrorsImpl, Merge } from "react-hook-form"; +import COLORS from "../../../shared/styles/variables"; +import { SelectOptions } from "../../../../types/common"; type SelectProps = { value: SelectOptions; options: SelectOptions[]; - onCategoryChange: (e: React.ChangeEvent<{ value: string; label: string }>) => void; + onCategoryChange: ( + e: React.ChangeEvent<{ value: string; label: string }> + ) => void; width?: string; isError?: FieldError | Merge>; -} +}; const Select: React.FC = ({ value, options, onCategoryChange, width, - isError + isError, }) => { const customStyles: StylesConfig = { control: (baseStyles) => ({ ...baseStyles, color: COLORS.ALMOST_BLACK_FOR_TEXT, background: isError ? COLORS.ALERT_2 : COLORS.WHITE, - fontSize: '16px', + fontSize: "16px", border: `2px solid ${isError ? COLORS.ALERT_1 : COLORS.PRIMARY_2}`, - outline: 'none', - borderRadius: '12px', + outline: "none", + borderRadius: "12px", padding: "3px 8px", width, - '&:hover': { + "&:hover": { border: `2px solid ${COLORS.PRIMARY}`, }, }), @@ -38,19 +39,19 @@ const Select: React.FC = ({ ...baseStyles, color: COLORS.ALMOST_BLACK_FOR_TEXT, background: COLORS.WHITE, - fontSize: '16px', + fontSize: "16px", border: `2px solid ${COLORS.PRIMARY_2}`, - borderRadius: '12px', - marginTop: '4px', + borderRadius: "12px", + marginTop: "4px", }), option: (baseStyles, state) => ({ ...baseStyles, color: COLORS.ALMOST_BLACK_FOR_TEXT, background: state.isSelected ? COLORS.MENU_BUTTON_HOVER : COLORS.WHITE, - '&:hover': { + "&:hover": { background: state.isSelected ? COLORS.MENU_BUTTON_HOVER : COLORS.BASE_2, - } - }) + }, + }), }; return ( @@ -62,6 +63,6 @@ const Select: React.FC = ({ noOptionsMessage={() => "Категорію не знайдено"} /> ); -} +}; -export default Select; \ No newline at end of file +export default Select; diff --git a/src/components/molecules/tabs/filter/TabFilter.styled.ts b/src/components/molecules/tabs/filter/TabFilter.styled.ts index 319ef1b..658e5ff 100644 --- a/src/components/molecules/tabs/filter/TabFilter.styled.ts +++ b/src/components/molecules/tabs/filter/TabFilter.styled.ts @@ -33,6 +33,6 @@ export const TabFilterWrapper = styled(Box)` background-color: ${COLORS.BASE_1}; } } - } - } -` \ No newline at end of file + } + } +`; diff --git a/src/components/molecules/tabs/filter/TabFilter.tsx b/src/components/molecules/tabs/filter/TabFilter.tsx index 9eaffd6..ddfe3ea 100644 --- a/src/components/molecules/tabs/filter/TabFilter.tsx +++ b/src/components/molecules/tabs/filter/TabFilter.tsx @@ -1,38 +1,36 @@ -import { Link } from './../../../atoms/link/Link.styled'; +import { Link } from "../../../atoms/link/Link.styled"; import { List } from "../../../atoms/list/List.styled"; import { ListItem } from "../../../atoms/list/ListItem.styled"; import { TabFilterWrapper } from "./TabFilter.styled"; -import COLORS from '../../../../shared/styles/variables'; +import COLORS from "../../../../shared/styles/variables"; -import { IFilterButton } from '../../../../../types/common'; +import { IFilterButton } from "../../../../../types/common"; type TabFilterProps = { filterButtons: IFilterButton[]; }; -const TabFilter: React.FC = ({ filterButtons }) => { - return ( - - - {filterButtons.map(({ filterBy, onTabClick, buttonName, isActive }, index) => ( +const TabFilter: React.FC = ({ filterButtons }) => ( + + + {filterButtons.map( + ({ filterBy, onTabClick, buttonName, isActive }, index) => ( + textAlight="center"> + onClick={onTabClick}> {buttonName} - ))} - - - ); -}; + ) + )} + + +); -export default TabFilter; \ No newline at end of file +export default TabFilter; diff --git a/src/components/molecules/tabs/switch/TabSwitch.styled.ts b/src/components/molecules/tabs/switch/TabSwitch.styled.ts index 85298c4..d969c85 100644 --- a/src/components/molecules/tabs/switch/TabSwitch.styled.ts +++ b/src/components/molecules/tabs/switch/TabSwitch.styled.ts @@ -36,5 +36,5 @@ export const TabSwitchWrapper = styled(Box)` } } } - } -` \ No newline at end of file + } +`; diff --git a/src/components/molecules/tabs/switch/TabSwitch.tsx b/src/components/molecules/tabs/switch/TabSwitch.tsx index 9720083..be7f565 100644 --- a/src/components/molecules/tabs/switch/TabSwitch.tsx +++ b/src/components/molecules/tabs/switch/TabSwitch.tsx @@ -11,26 +11,18 @@ type TabSwitchProps = { switchButtons: ISwitchButton[]; }; -const TabSwitch: React.FC = ({ switchButtons }) => { - return ( - - - {switchButtons.map(({ buttonName, onTabClick, isActive }, index) => ( - - - {buttonName} - - - ))} - - - ); -} +const TabSwitch: React.FC = ({ switchButtons }) => ( + + + {switchButtons.map(({ buttonName, onTabClick, isActive }, index) => ( + + + {buttonName} + + + ))} + + +); -export default TabSwitch; \ No newline at end of file +export default TabSwitch; diff --git a/src/components/molecules/tabs/tabWrapperStyles.ts b/src/components/molecules/tabs/tabWrapperStyles.ts index 3b59c79..ab31971 100644 --- a/src/components/molecules/tabs/tabWrapperStyles.ts +++ b/src/components/molecules/tabs/tabWrapperStyles.ts @@ -5,4 +5,4 @@ export const tabWrapperStyles = css` background-color: rgba(115, 127, 239, 0.3); display: flex; align-items: center; -` \ No newline at end of file +`; diff --git a/src/components/molecules/transaction/Transaction.tsx b/src/components/molecules/transaction/Transaction.tsx index 339703f..4d92592 100644 --- a/src/components/molecules/transaction/Transaction.tsx +++ b/src/components/molecules/transaction/Transaction.tsx @@ -1,46 +1,48 @@ -import { useAppSelector } from '../../../store/hooks'; +import { useAppSelector } from "../../../store/hooks"; -import { formatTransactionTime } from '../../../shared/utils/transactions/formatTransactionTime'; +import { formatTransactionTime } from "../../../shared/utils/transactions/formatTransactionTime"; import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; -import { TransactionWrapper } from './TransactionWrapper'; +import { TransactionWrapper } from "./TransactionWrapper"; -import IncomeIcon from "../../../shared/assets/icons/income.svg" -import ExpenseIcon from "../../../shared/assets/icons/expense.svg" +import IncomeIcon from "../../../shared/assets/icons/income.svg"; +import ExpenseIcon from "../../../shared/assets/icons/expense.svg"; -import COLORS from '../../../shared/styles/variables'; +import COLORS from "../../../shared/styles/variables"; -import { ITransaction } from '../../../../types/transactions'; +import { ITransaction } from "../../../../types/transactions"; type TransactionProps = { transaction: ITransaction; onClick?: () => void; isTransactionsPage?: boolean; -} +}; -const Transaction: React.FC = ({ transaction, isTransactionsPage }) => { - const { activeTransaction } = useAppSelector(state => state.transaction) - const { categories } = useAppSelector(state => state.category) - const { wallets } = useAppSelector(state => state.wallet) +const Transaction: React.FC = ({ + transaction, + isTransactionsPage, +}) => { + const { activeTransaction } = useAppSelector((state) => state.transaction); + const { categories } = useAppSelector((state) => state.category); + const { wallets } = useAppSelector((state) => state.wallet); const isActive = transaction?.id === activeTransaction?.id; const isIncome = transaction?.type_of_outlay === "income"; - const transactionCategoryTitle: string = categories.all?.find(category => { - return category.id === transaction.category; - })?.title; + const transactionCategoryTitle: string = categories.all?.find( + (category) => category.id === transaction.category + )?.title; - const transactionWalletTitle: string = wallets?.find(wallet => { - return wallet.id === transaction.wallet - })?.title; + const transactionWalletTitle: string = wallets?.find( + (wallet) => wallet.id === transaction.wallet + )?.title; return ( + isTransactionsPage={isTransactionsPage}> @@ -48,18 +50,22 @@ const Transaction: React.FC = ({ transaction, isTransactionsPa as="h4" fw="500" fz="14px" - color={isTransactionsPage && isActive ? COLORS.WHITE : COLORS.DARK_FOR_TEXT} - m="0 0 16px 0" - > + color={ + isTransactionsPage && isActive + ? COLORS.WHITE + : COLORS.DARK_FOR_TEXT + } + m="0 0 16px 0"> {transactionWalletTitle}
+ color={ + isTransactionsPage && isActive ? COLORS.WHITE : COLORS.DISABLED + } + m="0 0 16px 0"> ({formatTransactionTime(transaction?.created)}) @@ -67,8 +73,11 @@ const Transaction: React.FC = ({ transaction, isTransactionsPa as="h5" fw="600" fz="16px" - color={isTransactionsPage && isActive ? COLORS.WHITE : COLORS.ALMOST_BLACK_FOR_TEXT} - > + color={ + isTransactionsPage && isActive + ? COLORS.WHITE + : COLORS.ALMOST_BLACK_FOR_TEXT + }> {transactionCategoryTitle} @@ -77,8 +86,7 @@ const Transaction: React.FC = ({ transaction, isTransactionsPa display="flex" direction="column" alignItems="flex-end" - pl="50px" - > + pl="50px"> = ({ transaction, isTransactionsPa mb="9px" bgColor={COLORS.WHITE} gap="4px" - borderRadius="6px" - > + borderRadius="6px"> + fw="600"> {isIncome ? "Надходження" : "Витрата"} {isIncome ? : } @@ -103,10 +109,11 @@ const Transaction: React.FC = ({ transaction, isTransactionsPa textAlign="right" fz="16px" fw="600" - color={isTransactionsPage && - isActive ? COLORS.WHITE : COLORS.DARK_FOR_TEXT - } - > + color={ + isTransactionsPage && isActive + ? COLORS.WHITE + : COLORS.DARK_FOR_TEXT + }> {transaction?.amount_of_funds} ₴ @@ -118,30 +125,32 @@ const Transaction: React.FC = ({ transaction, isTransactionsPa direction="column" borderTop={`2px solid ${COLORS.DIVIDER}`} mt="20px" - pt="15px" - > + pt="15px"> + mb="15px"> Деталі: + color={ + isTransactionsPage && isActive + ? COLORS.WHITE + : COLORS.ALMOST_BLACK_FOR_TEXT + }> {transaction?.title} )} - ); -} +}; -export default Transaction; \ No newline at end of file +export default Transaction; diff --git a/src/components/molecules/transaction/TransactionWrapper.ts b/src/components/molecules/transaction/TransactionWrapper.ts index 5f50912..c21c70f 100644 --- a/src/components/molecules/transaction/TransactionWrapper.ts +++ b/src/components/molecules/transaction/TransactionWrapper.ts @@ -6,15 +6,17 @@ import COLORS from "../../../shared/styles/variables"; type TransactionWrapperProps = { isTransactionsPage: boolean; -} +}; -export const TransactionWrapper = styled(Box) ` +export const TransactionWrapper = styled(Box)` display: flex; flex-direction: column; border-radius: 8px; padding: 17px; - ${({ isTransactionsPage }) => isTransactionsPage && ` + ${({ isTransactionsPage }) => + isTransactionsPage && + ` &:hover { background-color: ${COLORS.PRIMARY_HOVER}; diff --git a/src/components/molecules/wallet/Wallet.styled.ts b/src/components/molecules/wallet/Wallet.styled.ts index 057b7bc..fac65ea 100644 --- a/src/components/molecules/wallet/Wallet.styled.ts +++ b/src/components/molecules/wallet/Wallet.styled.ts @@ -3,41 +3,42 @@ import styled from "styled-components"; import { blackSVGtoWhite } from "../../../shared/styles/iconStyles"; import { commonStyles } from "../../../shared/styles/commonStyles"; -import { ButtonTransparent } from '../../atoms/button/ButtonTransparent.styled'; +import { ButtonTransparent } from "../../atoms/button/ButtonTransparent.styled"; import COLORS from "../../../shared/styles/variables"; type WalletButtonProps = { isActive: boolean; -} +}; const transactionsPath = window.location.pathname === "/transactions"; -export const WalletButton = styled(ButtonTransparent) ` +export const WalletButton = styled(ButtonTransparent)` ${commonStyles} - background: ${({ isActive }) => isActive ? COLORS.PRIMARY : COLORS.WHITE}; + background: ${({ isActive }) => (isActive ? COLORS.PRIMARY : COLORS.WHITE)}; width: 100%; display: flex; justify-content: space-between; align-items: center; text-decoration: none; - padding: ${transactionsPath ? '15px' : '20px 15px'}; + padding: ${transactionsPath ? "15px" : "20px 15px"}; border-radius: 8px; * { - color: ${({ isActive }) => isActive ? COLORS.WHITE : COLORS.ALMOST_BLACK_FOR_TEXT}; + color: ${({ isActive }) => + isActive ? COLORS.WHITE : COLORS.ALMOST_BLACK_FOR_TEXT}; } svg { - opacity: ${({ isActive }) => isActive && '1'}; + opacity: ${({ isActive }) => isActive && "1"}; ${({ isActive }) => isActive && blackSVGtoWhite}; } - + &:hover { background-color: ${COLORS.PRIMARY_HOVER}; * { - color: ${({ isActive }) => isActive ? COLORS.WHITE : COLORS.WHITE}; + color: ${({ isActive }) => (isActive ? COLORS.WHITE : COLORS.WHITE)}; } svg { @@ -45,4 +46,4 @@ export const WalletButton = styled(ButtonTransparent) ` ${blackSVGtoWhite} } } -` +`; diff --git a/src/components/molecules/wallet/Wallet.tsx b/src/components/molecules/wallet/Wallet.tsx index c2b496e..5a59cd3 100644 --- a/src/components/molecules/wallet/Wallet.tsx +++ b/src/components/molecules/wallet/Wallet.tsx @@ -2,7 +2,7 @@ import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; import { WalletButton } from "./Wallet.styled"; -import SettingsWalletIcon from '../../../shared/assets/icons/settings-wallet.svg' +import SettingsWalletIcon from "../../../shared/assets/icons/settings-wallet.svg"; import COLORS from "../../../shared/styles/variables"; @@ -12,7 +12,7 @@ type WalletProps = { wallet: IWallet; onWalletClick: () => void; isActive: boolean; -} +}; const Wallet: React.FC = ({ wallet, onWalletClick, isActive }) => { const homePath = window.location.pathname === "/home"; @@ -23,42 +23,27 @@ const Wallet: React.FC = ({ wallet, onWalletClick, isActive }) => { display="flex" direction="column" alignItems="start" - p={homePath && wallet?.type_of_account === "cash" && "10px 0"} - > + p={homePath && wallet?.type_of_account === "cash" && "10px 0"}> {homePath ? ( wallet?.type_of_account === "bank" && ( - + {wallet?.title} ) ) : ( - + {wallet?.title} )} - - {wallet?.amount && (wallet?.amount + " ₴")} + + {wallet?.amount && `${wallet?.amount} ₴`} {homePath && } ); -} +}; -export default Wallet; \ No newline at end of file +export default Wallet; diff --git a/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx b/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx index 9388b78..8d26e99 100644 --- a/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx +++ b/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx @@ -5,9 +5,9 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { getUserDetails } from "../../../store/userSlice"; -import { Box } from '../../atoms/box/Box.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { Img } from '../../atoms/img/Img.styled'; +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import { Img } from "../../atoms/img/Img.styled"; import { Container } from "../../atoms/container/Container.styled"; import { Form } from "../../atoms/form/Form.styled"; import { Button } from "../../atoms/button/Button.styled"; @@ -20,90 +20,118 @@ import InterfaceImage from "../../../shared/assets/images/interface-image-full.p import COLORS from "../../../shared/styles/variables"; const TwoFactorAuthenticationPage: React.FC = () => { - const dispatch = useAppDispatch(); + const dispatch = useAppDispatch(); - const [count, setCount] = useState(60); + const [count, setCount] = useState(60); - const { isLoading } = useAppSelector(state => state.user); + const { isLoading } = useAppSelector((state) => state.user); - const intervalRef = useRef(null); + const intervalRef = useRef(null); - const handleSub = (data: {}) => { - reset(); - } + const handleSub = (data: {}) => { + reset(); + }; - const { - register, - formState: { errors, isValid }, - handleSubmit, - reset, - } = useForm({ mode: "all" }); - - useEffect(() => { - dispatch(getUserDetails()); - - intervalRef.current = setInterval(() => { - setCount(count => count - 1); - }, 1000); - - return () => clearInterval(intervalRef.current); - }, []); - - useEffect(() => { - if (count === 0) { - clearInterval(intervalRef.current); - } - }, [count]); - - return ( - - - InterfaceImage - - - - Logo - - Вхід до вашого акаунту - - - Введіть код якій вам було надіслано - -
- - - - - 0 ? COLORS.DISABLED : COLORS.PRIMARY}> - Надіслати код ще раз {count > 0 ? count : null} - - - - - -
+ const { + register, + formState: { errors, isValid }, + handleSubmit, + reset, + } = useForm({ mode: "all" }); + + useEffect(() => { + dispatch(getUserDetails()); + + intervalRef.current = setInterval(() => { + setCount((count) => count - 1); + }, 1000); + + return () => clearInterval(intervalRef.current); + }, []); + + useEffect(() => { + if (count === 0) { + clearInterval(intervalRef.current); + } + }, [count]); + + return ( + + + InterfaceImage + + + + Logo + + Вхід до вашого акаунту + + + Введіть код якій вам було надіслано + +
+ + + + + 0 ? COLORS.DISABLED : COLORS.PRIMARY}> + Надіслати код ще раз {count > 0 ? count : null} + + - - ) -} - -export default TwoFactorAuthenticationPage; \ No newline at end of file + +
+ + + + ); +}; + +export default TwoFactorAuthenticationPage; diff --git a/src/components/pages/categories/AddCategory.tsx b/src/components/pages/categories/AddCategory.tsx index 26ce0c1..1af7b57 100644 --- a/src/components/pages/categories/AddCategory.tsx +++ b/src/components/pages/categories/AddCategory.tsx @@ -3,8 +3,11 @@ import { useEffect } from "react"; import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { setAddCategoryData } from "../../../store/categorySlice"; -import { categoryAction, setActiveCategory } from "../../../store/categorySlice"; +import { + setAddCategoryData, + categoryAction, + setActiveCategory, +} from "../../../store/categorySlice"; import useSwitchButtonOptions from "../../../shared/hooks/useSwitchButtonOptions"; @@ -22,10 +25,12 @@ import BaseField from "../../molecules/base-field/BaseField"; import COLORS from "../../../shared/styles/variables"; const AddCategory: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); - const { addCategoryData, isLoading } = useAppSelector(state => state.category); - const { user } = useAppSelector(state => state.user); + const { addCategoryData, isLoading } = useAppSelector( + (state) => state.category + ); + const { user } = useAppSelector((state) => state.user); const isValid = Object.keys(addCategoryData || {})?.length >= 1; @@ -36,15 +41,17 @@ const AddCategory: React.FC = () => { const handleSub = (data: { title: string }) => { dispatch(setActiveCategory({})); - dispatch(categoryAction({ - data: { - ...addCategoryData, - title: data?.title, - owner: user?.id || userId, - }, - method: "POST" - })) - } + dispatch( + categoryAction({ + data: { + ...addCategoryData, + title: data?.title, + owner: user?.id || userId, + }, + method: "POST", + }) + ); + }; const { register, @@ -53,18 +60,12 @@ const AddCategory: React.FC = () => { } = useForm({ mode: "all" }); useEffect(() => { - dispatch(setAddCategoryData({ type_of_outlay: "expense" })) + dispatch(setAddCategoryData({ type_of_outlay: "expense" })); }, []); return ( - + Додати категорію { direction="column" bgColor={COLORS.BASE_2} borderRadius="16px" - p="15px" - > + p="15px"> - + Тип категорії @@ -92,7 +87,7 @@ const AddCategory: React.FC = () => { errors={errors} fieldType="text" name="title" - registerOptions={register('title', titleFieldRules)} + registerOptions={register("title", titleFieldRules)} /> @@ -100,8 +95,7 @@ const AddCategory: React.FC = () => { primary width="100%" type="submit" - disabled={!isValid || !!errors?.title || isLoading} - > + disabled={!isValid || !!errors?.title || isLoading}> Зберегти @@ -109,6 +103,6 @@ const AddCategory: React.FC = () => { ); -} +}; -export default AddCategory; \ No newline at end of file +export default AddCategory; diff --git a/src/components/pages/categories/Categories.tsx b/src/components/pages/categories/Categories.tsx index b8de3a8..fd7bece 100644 --- a/src/components/pages/categories/Categories.tsx +++ b/src/components/pages/categories/Categories.tsx @@ -2,7 +2,7 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setActiveCategory, setEditCategoryData, - setIsEditCategoryOpen + setIsEditCategoryOpen, } from "../../../store/categorySlice"; import useFilterButtonOptions from "../../../shared/hooks/useFilterButtonOptions"; @@ -22,10 +22,9 @@ import { ICategory } from "../../../../types/category"; const Categories: React.FC = () => { const dispatch = useAppDispatch(); - const { - categories, - filterByTypeOfOutlay - } = useAppSelector(state => state.category); + const { categories, filterByTypeOfOutlay } = useAppSelector( + (state) => state.category + ); const filterButtons = useFilterButtonOptions("category"); @@ -33,7 +32,7 @@ const Categories: React.FC = () => { dispatch(setActiveCategory(category)); dispatch(setEditCategoryData(category)); dispatch(setIsEditCategoryOpen(true)); - } + }; const categoriesData = (): ICategory[] => { switch (filterByTypeOfOutlay) { @@ -46,7 +45,7 @@ const Categories: React.FC = () => { default: break; } - } + }; return ( @@ -59,8 +58,7 @@ const Categories: React.FC = () => { mr="10px" fw="600" fz="12px" - color={COLORS.DARK_FOR_TEXT} - > + color={COLORS.DARK_FOR_TEXT}> Відобразити @@ -74,16 +72,14 @@ const Categories: React.FC = () => { grow="1" overflow="auto" height="100px" - p="15px" - > + p="15px"> {categoriesData()?.map((category, index) => ( onCategoryClick(category)} - borderRadius="8px" - > + borderRadius="8px"> @@ -92,6 +88,6 @@ const Categories: React.FC = () => { ); -} +}; -export default Categories; \ No newline at end of file +export default Categories; diff --git a/src/components/pages/categories/CategoriesPage.styled.ts b/src/components/pages/categories/CategoriesPage.styled.ts index 1670c6b..4356e47 100644 --- a/src/components/pages/categories/CategoriesPage.styled.ts +++ b/src/components/pages/categories/CategoriesPage.styled.ts @@ -7,4 +7,4 @@ export const CategoriesPageWrapper = styled(Box)` box-sizing: border-box; display: flex; flex-direction: column; -` \ No newline at end of file +`; diff --git a/src/components/pages/categories/CategoriesPage.tsx b/src/components/pages/categories/CategoriesPage.tsx index cd71432..e8b11e4 100644 --- a/src/components/pages/categories/CategoriesPage.tsx +++ b/src/components/pages/categories/CategoriesPage.tsx @@ -1,20 +1,20 @@ -import { useEffect } from 'react' -import { useNavigate } from 'react-router-dom'; +import { useEffect } from "react"; +import { useNavigate } from "react-router-dom"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { getCategories } from "../../../store/categorySlice"; -import { token } from '../../../api/api'; +import { token } from "../../../api/api"; import { Box } from "../../atoms/box/Box.styled"; -import Header from '../../molecules/header/Header'; -import Categories from './Categories'; -import EditCategory from './EditCategory'; -import AddCategory from './AddCategory'; +import Header from "../../molecules/header/Header"; +import Categories from "./Categories"; +import EditCategory from "./EditCategory"; +import AddCategory from "./AddCategory"; import { CategoriesPageWrapper } from "./CategoriesPage.styled"; const CategoriesPage: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); const navigate = useNavigate(); const { @@ -22,13 +22,13 @@ const CategoriesPage: React.FC = () => { isEditCategorySuccess, isDeleteCategorySuccess, isEditCategoryOpen, - isLoading - } = useAppSelector(state => state.category); + isLoading, + } = useAppSelector((state) => state.category); - const { isLoggedIn, isRegistered } = useAppSelector(state => state.user); + const { isLoggedIn, isRegistered } = useAppSelector((state) => state.user); if (!token && !isRegistered && !isLoggedIn) { - navigate("/welcome") + navigate("/welcome"); } useEffect(() => { @@ -42,7 +42,11 @@ const CategoriesPage: React.FC = () => { }, [isLoading]); useEffect(() => { - if (isAddCategorySuccess || isEditCategorySuccess || isDeleteCategorySuccess) { + if ( + isAddCategorySuccess || + isEditCategorySuccess || + isDeleteCategorySuccess + ) { dispatch(getCategories()); } }, [isAddCategorySuccess, isEditCategorySuccess, isDeleteCategorySuccess]); @@ -58,6 +62,6 @@ const CategoriesPage: React.FC = () => { ); -} +}; -export default CategoriesPage; \ No newline at end of file +export default CategoriesPage; diff --git a/src/components/pages/categories/EditCategory.tsx b/src/components/pages/categories/EditCategory.tsx index cdb54ba..a11f37a 100644 --- a/src/components/pages/categories/EditCategory.tsx +++ b/src/components/pages/categories/EditCategory.tsx @@ -9,7 +9,7 @@ import { resetActiveCategoryState, setActiveCategory, setEditCategoryData, - setIsEditCategoryOpen + setIsEditCategoryOpen, } from "../../../store/categorySlice"; import { titleFieldRules } from "../../../shared/utils/field-rules/title"; @@ -25,13 +25,11 @@ import BaseField from "../../molecules/base-field/BaseField"; import COLORS from "../../../shared/styles/variables"; const EditCategory: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); - const { - activeCategory, - editCategoryData, - isLoading - } = useAppSelector(state => state.category) + const { activeCategory, editCategoryData, isLoading } = useAppSelector( + (state) => state.category + ); const isValid = Object.keys(editCategoryData || {})?.length >= 2; @@ -51,47 +49,45 @@ const EditCategory: React.FC = () => { const handleCancelEditCategory = () => { dispatch(setIsEditCategoryOpen(false)); dispatch(resetActiveCategoryState({})); - } + }; const handleDeleteCategory = () => { dispatch(setIsEditCategoryOpen(false)); - dispatch(categoryAction({ - method: "DELETE", - id: String(activeCategory?.id) - })); + dispatch( + categoryAction({ + method: "DELETE", + id: String(activeCategory?.id), + }) + ); dispatch(setActiveCategory({})); - } + }; const handleSub = (data: { title: string }) => { const editCategoryDataNoId = { ...editCategoryData, - title: data?.title + title: data?.title, }; delete editCategoryDataNoId.id; dispatch(setIsEditCategoryOpen(false)); - dispatch(resetActiveCategoryState({})) - dispatch(categoryAction({ - data: editCategoryDataNoId, - method: "PUT", - id: String(editCategoryData?.id) - })); - } + dispatch(resetActiveCategoryState({})); + dispatch( + categoryAction({ + data: editCategoryDataNoId, + method: "PUT", + id: String(editCategoryData?.id), + }) + ); + }; useEffect(() => { - clearErrors('title') - setValue('title', editCategoryData?.title) + clearErrors("title"); + setValue("title", editCategoryData?.title); }, [editCategoryData?.title]); return ( - + Редагування категорії { display="flex" direction="column" borderRadius="16px" - p="15px" - > + p="15px"> - + Тип категорії @@ -118,21 +108,17 @@ const EditCategory: React.FC = () => { label="Назва категорії" errors={errors} name="title" - registerOptions={register('title', titleFieldRules)} + registerOptions={register("title", titleFieldRules)} /> - @@ -145,6 +131,6 @@ const EditCategory: React.FC = () => { ); -} +}; -export default EditCategory; \ No newline at end of file +export default EditCategory; diff --git a/src/components/pages/data/DataEntryPage.tsx b/src/components/pages/data/DataEntryPage.tsx index ce512f1..1529355 100644 --- a/src/components/pages/data/DataEntryPage.tsx +++ b/src/components/pages/data/DataEntryPage.tsx @@ -10,11 +10,15 @@ import { getUserDetails } from "../../../store/userSlice"; import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; import { titleFieldRules } from "../../../shared/utils/field-rules/title"; -import { localStorageIsDataEntrySuccess, token, userId } from "../../../api/api"; - -import { Box } from '../../atoms/box/Box.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { Img } from '../../atoms/img/Img.styled'; +import { + localStorageIsDataEntrySuccess, + token, + userId, +} from "../../../api/api"; + +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import { Img } from "../../atoms/img/Img.styled"; import { Container } from "../../atoms/container/Container.styled"; import { Form } from "../../atoms/form/Form.styled"; import { Button } from "../../atoms/button/Button.styled"; @@ -28,122 +32,157 @@ import COLORS from "../../../shared/styles/variables"; import { DataEntryFormData } from "../../../../types/user"; const DataEntryPage: React.FC = () => { - const dispatch = useAppDispatch() - const navigate = useNavigate(); - - const { - isEntryDataSuccess, - entryDataError, - isLoading - } = useAppSelector(state => state.wallet) - - const { - user, - getDetailsError, - isRegistered - } = useAppSelector(state => state.user) - - if (!isRegistered && localStorageIsDataEntrySuccess) { - navigate("/home") + const dispatch = useAppDispatch(); + const navigate = useNavigate(); + + const { isEntryDataSuccess, entryDataError, isLoading } = useAppSelector( + (state) => state.wallet + ); + + const { user, getDetailsError, isRegistered } = useAppSelector( + (state) => state.user + ); + + if (!isRegistered && localStorageIsDataEntrySuccess) { + navigate("/home"); + } + + const handleSub = (data: DataEntryFormData) => { + const resultData: DataEntryFormData = { + ...data, + userId: user?.id || userId, + }; + + dispatch(postEntryData(resultData)); + }; + + const { + register, + formState: { errors, isValid }, + handleSubmit, + reset, + } = useForm({ mode: "all" }); + + useEffect(() => { + if (isEntryDataSuccess) { + reset(); + navigate("/home"); } + }, []); - const handleSub = (data: DataEntryFormData) => { - const resultData: DataEntryFormData = { - ...data, - userId: user?.id || userId, - } - - dispatch(postEntryData(resultData)) + useEffect(() => { + if (isEntryDataSuccess) { + reset(); + navigate("/home"); } + }, [isEntryDataSuccess]); - const { - register, - formState: { errors, isValid }, - handleSubmit, - reset, - } = useForm({ mode: "all" }); - - useEffect(() => { - if (isEntryDataSuccess) { - reset(); - navigate('/home'); - } - }, []); - - useEffect(() => { - if (isEntryDataSuccess) { - reset(); - navigate('/home'); - } - }, [isEntryDataSuccess]); - - useEffect(() => { - if (user?.token !== "" || token) { - dispatch(getUserDetails()) - } - }, [user?.token]); - - return ( - - - InterfaceImage - - - - Logo - - Дякуємо за реєстрацію! - - - Ви можете внести актуальні дані по
вашому готівковому та картковому
рахунках. - -
- - - - - - - - Додаткові карткові рахунки ви зможете
внести пізніше. - - - - {getDetailsError && - {JSON.stringify(getDetailsError)}} - - {entryDataError && - {JSON.stringify(entryDataError)}} - - -
- + useEffect(() => { + if (user?.token !== "" || token) { + dispatch(getUserDetails()); + } + }, [user?.token]); + + return ( + + + InterfaceImage + + + + Logo + + Дякуємо за реєстрацію! + + + Ви можете внести актуальні дані по
вашому готівковому та + картковому
рахунках. + +
+ + + + + + + + Додаткові карткові рахунки ви зможете
внести пізніше. + - - ) -} -export default DataEntryPage; \ No newline at end of file + {getDetailsError && ( + + {JSON.stringify(getDetailsError)} + + )} + + {entryDataError && ( + + {JSON.stringify(entryDataError)} + + )} + + +
+ + + + ); +}; + +export default DataEntryPage; diff --git a/src/components/pages/home/HomePage.styled.ts b/src/components/pages/home/HomePage.styled.ts index accdea2..3a45153 100644 --- a/src/components/pages/home/HomePage.styled.ts +++ b/src/components/pages/home/HomePage.styled.ts @@ -9,4 +9,4 @@ export const HomePageWrapper = styled.div` > div > div > div { flex-grow: 1; } -` \ No newline at end of file +`; diff --git a/src/components/pages/home/HomePage.tsx b/src/components/pages/home/HomePage.tsx index 862890a..0008a42 100644 --- a/src/components/pages/home/HomePage.tsx +++ b/src/components/pages/home/HomePage.tsx @@ -6,13 +6,19 @@ import { PopupContext } from "../../../contexts/PopupContext"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { getWallets } from "../../../store/walletSlice"; import { getUserDetails } from "../../../store/userSlice"; -import { getFilteredTransactions, getTransactions } from "../../../store/transactionSlice"; -import { getCategories, getFilteredCategories } from "../../../store/categorySlice"; +import { + getFilteredTransactions, + getTransactions, +} from "../../../store/transactionSlice"; +import { + getCategories, + getFilteredCategories, +} from "../../../store/categorySlice"; import { token } from "../../../api/api"; import { Box } from "../../atoms/box/Box.styled"; -import Header from '../../molecules/header/Header'; +import Header from "../../molecules/header/Header"; import PopupAddWallet from "../../molecules/popup/add-wallet/PopupAddWallet"; import PopupEditWallet from "../../molecules/popup/PopupEditWallet"; import Wallets from "./Wallets"; @@ -24,41 +30,35 @@ const HomePage: React.FC = () => { const dispatch = useAppDispatch(); const navigate = useNavigate(); - const { - isAddWalletPopupOpen, - isEditWalletPopupOpen, - } = useContext(PopupContext); + const { isAddWalletPopupOpen, isEditWalletPopupOpen } = + useContext(PopupContext); const { isAddWalletSuccess, isEditWalletSuccess, isDeleteWalletSuccess, - isLoading: isWalletActionLoading - } = useAppSelector(state => state.wallet); + isLoading: isWalletActionLoading, + } = useAppSelector((state) => state.wallet); - const { - isLoggedIn, - isRegistered - } = useAppSelector(state => state.user); + const { isLoggedIn, isRegistered } = useAppSelector((state) => state.user); - const { - isLoading: isBankDataLoading, - isAddBankDataSuccess - } = useAppSelector(state => state.bankData); + const { isLoading: isBankDataLoading, isAddBankDataSuccess } = useAppSelector( + (state) => state.bankData + ); if (!token && !isRegistered && !isLoggedIn) { - navigate("/welcome") + navigate("/welcome"); } useEffect(() => { if (isLoggedIn) { - dispatch(getUserDetails()) + dispatch(getUserDetails()); } dispatch(getWallets()); dispatch(getTransactions()); - dispatch(getFilteredCategories("?type_of_outlay=income")) - dispatch(getFilteredCategories("?type_of_outlay=expense")) + dispatch(getFilteredCategories("?type_of_outlay=income")); + dispatch(getFilteredCategories("?type_of_outlay=expense")); dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); }, []); @@ -74,14 +74,24 @@ const HomePage: React.FC = () => { }, [isWalletActionLoading, isBankDataLoading]); useEffect(() => { - if (isAddWalletSuccess || isEditWalletSuccess || isDeleteWalletSuccess || isAddBankDataSuccess) { + if ( + isAddWalletSuccess || + isEditWalletSuccess || + isDeleteWalletSuccess || + isAddBankDataSuccess + ) { dispatch(getWallets()); dispatch(getTransactions()); dispatch(getCategories()); dispatch(getFilteredTransactions("?type_of_outlay=expense&days=30")); dispatch(getFilteredTransactions("?type_of_outlay=income&days=30")); } - }, [isAddWalletSuccess, isEditWalletSuccess, isDeleteWalletSuccess, isAddBankDataSuccess]); + }, [ + isAddWalletSuccess, + isEditWalletSuccess, + isDeleteWalletSuccess, + isAddBankDataSuccess, + ]); return ( <> @@ -100,4 +110,4 @@ const HomePage: React.FC = () => { ); }; -export default HomePage; \ No newline at end of file +export default HomePage; diff --git a/src/components/pages/home/Statistics.tsx b/src/components/pages/home/Statistics.tsx index 84d2807..67569b0 100644 --- a/src/components/pages/home/Statistics.tsx +++ b/src/components/pages/home/Statistics.tsx @@ -1,7 +1,10 @@ import { useRef, useEffect } from "react"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { setTotalIncomes, setTotalExpenses } from "../../../store/categorySlice"; +import { + setTotalIncomes, + setTotalExpenses, +} from "../../../store/categorySlice"; import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; import { calculateCategoriesWithTotalAmount } from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; @@ -17,11 +20,9 @@ import { ICategoryWithTotalAmount } from "../../../../types/category"; const Statistics: React.FC = () => { const dispatch = useAppDispatch(); - const { - incomesChart, - expensesChart, - isLoading - } = useAppSelector(state => state.statistics); + const { incomesChart, expensesChart, isLoading } = useAppSelector( + (state) => state.statistics + ); const incomesLabels = useRef(null); const expensesLabels = useRef(null); @@ -29,43 +30,51 @@ const Statistics: React.FC = () => { const incomesData = useRef(null); const expensesData = useRef(null); - const incomeCategoriesWithTotalAmount = useRef(null); - const expenseCategoriesWithTotalAmount = useRef(null); + const incomeCategoriesWithTotalAmount = + useRef(null); + const expenseCategoriesWithTotalAmount = + useRef(null); - const totalIncomesAmount: string = calculateTotalAmount(incomesChart?.allTransactions); - const totalExpensesAmount: string = calculateTotalAmount(expensesChart?.allTransactions); + const totalIncomesAmount: string = calculateTotalAmount( + incomesChart?.allTransactions + ); + const totalExpensesAmount: string = calculateTotalAmount( + expensesChart?.allTransactions + ); useEffect(() => { if (incomesChart.categories && incomesChart.allTransactions) { - incomeCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( - incomesChart.categories, - incomesChart.allTransactions, - ) - - incomesLabels.current = incomeCategoriesWithTotalAmount.current.map(c => { - return c.title - }) - incomesData.current = incomeCategoriesWithTotalAmount.current.map(c => { - return c.totalAmount - }) + incomeCategoriesWithTotalAmount.current = + calculateCategoriesWithTotalAmount( + incomesChart.categories, + incomesChart.allTransactions + ); + + incomesLabels.current = incomeCategoriesWithTotalAmount.current.map( + (c) => c.title + ); + incomesData.current = incomeCategoriesWithTotalAmount.current.map( + (c) => c.totalAmount + ); } }, [incomesChart.categories, incomesChart.allTransactions]); useEffect(() => { if (expensesChart.categories && expensesChart.allTransactions) { - expenseCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( - expensesChart.categories, - expensesChart.allTransactions, - ) - - expensesLabels.current = expenseCategoriesWithTotalAmount.current.map(c => { - return c.title - }) - expensesData.current = expenseCategoriesWithTotalAmount.current.map(c => { - return c.totalAmount - }) + expenseCategoriesWithTotalAmount.current = + calculateCategoriesWithTotalAmount( + expensesChart.categories, + expensesChart.allTransactions + ); + + expensesLabels.current = expenseCategoriesWithTotalAmount.current.map( + (c) => c.title + ); + expensesData.current = expenseCategoriesWithTotalAmount.current.map( + (c) => c.totalAmount + ); } - }, [expensesChart.categories, expensesChart.allTransactions]) + }, [expensesChart.categories, expensesChart.allTransactions]); useEffect(() => { if (!isLoading) { @@ -80,12 +89,7 @@ const Statistics: React.FC = () => { return ( - + Статистика за останній місяць { borderRadius="16px" overflow="auto" height="100px" - p="15px" - > + p="15px"> @@ -134,6 +137,6 @@ const Statistics: React.FC = () => { ); -} +}; -export default Statistics; \ No newline at end of file +export default Statistics; diff --git a/src/components/pages/home/Transitions.tsx b/src/components/pages/home/Transitions.tsx index 84901d4..0514c51 100644 --- a/src/components/pages/home/Transitions.tsx +++ b/src/components/pages/home/Transitions.tsx @@ -13,33 +13,31 @@ import COLORS from "../../../shared/styles/variables"; import { ITransaction, Transactions } from "../../../../types/transactions"; -const renderTransactionItems = (transactions: ITransaction[]): React.ReactNode[] => { - return transactions - .sort((a, b) => new Date(b.created).getTime() - new Date(a.created).getTime()) +const renderTransactionItems = ( + transactions: ITransaction[] +): React.ReactNode[] => + transactions + .sort( + (a, b) => new Date(b.created).getTime() - new Date(a.created).getTime() + ) .map((transaction) => ( )); -}; const Transactions: React.FC = () => { - const { transactions } = useAppSelector(state => state.transaction) + const { transactions } = useAppSelector((state) => state.transaction); const transactionsData = (): Transactions => { const filteredTransactions: Transactions = transactions.all; - return filterTransactions(filteredTransactions) + return filterTransactions(filteredTransactions); }; return ( - + Останні транзакції { height="100px" bgColor={COLORS.BASE_2} p="15px" - borderRadius="16px" - > + borderRadius="16px"> {Object.entries(transactionsData).map(([date, transactions]) => ( @@ -66,6 +63,6 @@ const Transactions: React.FC = () => { ); -} +}; -export default Transactions; \ No newline at end of file +export default Transactions; diff --git a/src/components/pages/home/Wallets.tsx b/src/components/pages/home/Wallets.tsx index 6676e1c..c8e1e9d 100644 --- a/src/components/pages/home/Wallets.tsx +++ b/src/components/pages/home/Wallets.tsx @@ -17,40 +17,31 @@ import COLORS from "../../../shared/styles/variables"; import { IWallet } from "../../../../types/wallet"; const Wallets: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); - const { - setIsAddWalletPopupOpen, - setIsEditWalletPopupOpen - } = useContext(PopupContext); + const { setIsAddWalletPopupOpen, setIsEditWalletPopupOpen } = + useContext(PopupContext); - const { - wallets, - activeWallet, - isLoading - } = useAppSelector(state => state.wallet) + const { wallets, activeWallet, isLoading } = useAppSelector( + (state) => state.wallet + ); - const cashWallet = wallets?.find(wallet => { - return wallet?.type_of_account === "cash"; - }) + const cashWallet = wallets?.find( + (wallet) => wallet?.type_of_account === "cash" + ); - const bankWallets = wallets?.filter(wallet => { - return wallet?.type_of_account === "bank"; - }) + const bankWallets = wallets?.filter( + (wallet) => wallet?.type_of_account === "bank" + ); const onWalletClick = (wallet: IWallet) => { - setIsEditWalletPopupOpen(true) + setIsEditWalletPopupOpen(true); dispatch(setActiveWallet(wallet)); }; return ( - + Рахунки { borderRadius="16px" grow="1" overflow="auto" - height="100px" - > + height="100px"> - + mb="20px"> + {cashWallet?.title || "Готівка"} { /> - + Картки @@ -106,13 +85,12 @@ const Wallets: React.FC = () => { ); -} +}; -export default Wallets; \ No newline at end of file +export default Wallets; diff --git a/src/components/pages/not-found/NotFoundPage.tsx b/src/components/pages/not-found/NotFoundPage.tsx index a0c9394..a774b33 100644 --- a/src/components/pages/not-found/NotFoundPage.tsx +++ b/src/components/pages/not-found/NotFoundPage.tsx @@ -1,11 +1,9 @@ import { Typography } from "../../atoms/typography/Typography.styled"; -const NotFoundPage = () => { - return ( - - Сторінка не знайдена - - ); -} +const NotFoundPage = () => ( + + Сторінка не знайдена + +); -export default NotFoundPage; \ No newline at end of file +export default NotFoundPage; diff --git a/src/components/pages/password-recovery/EmailStep.tsx b/src/components/pages/password-recovery/EmailStep.tsx index 47c88c1..5c9b29b 100644 --- a/src/components/pages/password-recovery/EmailStep.tsx +++ b/src/components/pages/password-recovery/EmailStep.tsx @@ -20,7 +20,7 @@ import COLORS from "../../../shared/styles/variables"; const EmailStep: React.FC = () => { const dispatch = useAppDispatch(); - const { isLoading } = useAppSelector(state => state.passwordRecovery) + const { isLoading } = useAppSelector((state) => state.passwordRecovery); const { register, @@ -30,27 +30,49 @@ const EmailStep: React.FC = () => { const handleSub = (data: { email: string }) => { dispatch(requestPasswordReset(data)); - } + }; return ( - + InterfaceImage - Logo - Відновлення пароля - Введіть пошту на яку ви реєстрували
ваш аккаунт -
@@ -59,11 +81,16 @@ const EmailStep: React.FC = () => { label="Пошта" errors={errors} name="email" - registerOptions={register('email', emailFieldRules)} + registerOptions={register("email", emailFieldRules)} /> - @@ -71,7 +98,7 @@ const EmailStep: React.FC = () => { - ) -} + ); +}; -export default EmailStep; \ No newline at end of file +export default EmailStep; diff --git a/src/components/pages/password-recovery/NewPasswordStep.tsx b/src/components/pages/password-recovery/NewPasswordStep.tsx index 8ad29fb..f504624 100644 --- a/src/components/pages/password-recovery/NewPasswordStep.tsx +++ b/src/components/pages/password-recovery/NewPasswordStep.tsx @@ -8,7 +8,7 @@ import { confirmPasswordReset } from "../../../store/passwordRecoverySlice"; import { confirmPasswordInputRules, - passwordInputRules + passwordInputRules, } from "../../../shared/utils/field-rules/password"; import { Box } from "../../atoms/box/Box.styled"; @@ -25,24 +25,28 @@ import logo from "../../../shared/assets/images/logo.png"; import COLORS from "../../../shared/styles/variables"; const NewPasswordStep: React.FC<{ - uid: string, - resetToken: string + uid: string; + resetToken: string; }> = ({ uid, resetToken }) => { const dispatch = useAppDispatch(); const navigate = useNavigate(); - const { isNewPasswordSet, isLoading } = useAppSelector(state => state.passwordRecovery) + const { isNewPasswordSet, isLoading } = useAppSelector( + (state) => state.passwordRecovery + ); const [showPassword, setShowPassword] = useState(false); const [showConfirmPassword, setShowConfirmPassword] = useState(false); - const handleSub = (data: { password: string, confirmPassword: string }) => { - dispatch(confirmPasswordReset({ - uid, - token: resetToken, - new_password: data?.password, - })) - } + const handleSub = (data: { password: string; confirmPassword: string }) => { + dispatch( + confirmPasswordReset({ + uid, + token: resetToken, + new_password: data?.password, + }) + ); + }; const { register, @@ -53,28 +57,51 @@ const NewPasswordStep: React.FC<{ useEffect(() => { if (isNewPasswordSet) { - navigate('/login') + navigate("/login"); } }, [isNewPasswordSet]); return ( - + InterfaceImage - Logo - Створення нового пароля - Введіть новий пароль для вашого
аккаунту - @@ -101,7 +128,11 @@ const NewPasswordStep: React.FC<{ /> - @@ -109,7 +140,7 @@ const NewPasswordStep: React.FC<{ - ) -} + ); +}; -export default NewPasswordStep; \ No newline at end of file +export default NewPasswordStep; diff --git a/src/components/pages/password-recovery/PasswordRecovery.tsx b/src/components/pages/password-recovery/PasswordRecovery.tsx index 8b275f8..ae2858f 100644 --- a/src/components/pages/password-recovery/PasswordRecovery.tsx +++ b/src/components/pages/password-recovery/PasswordRecovery.tsx @@ -7,17 +7,19 @@ import EmailStep from "./EmailStep"; import ResetLinkStep from "./ResetLinkStep"; const PasswordRecovery: React.FC = () => { - const { uid, resetToken } = useParams<{ uid: string, resetToken: string }>(); + const { uid, resetToken } = useParams<{ uid: string; resetToken: string }>(); - const { isResetLinkStepOpen } = useAppSelector(state => state.passwordRecovery); + const { isResetLinkStepOpen } = useAppSelector( + (state) => state.passwordRecovery + ); - return ( - (uid && resetToken) ? ( - - ) : ( - isResetLinkStepOpen ? : - ) + return uid && resetToken ? ( + + ) : isResetLinkStepOpen ? ( + + ) : ( + ); -} +}; -export default PasswordRecovery; \ No newline at end of file +export default PasswordRecovery; diff --git a/src/components/pages/password-recovery/ResetLinkStep.tsx b/src/components/pages/password-recovery/ResetLinkStep.tsx index a6ca7ac..12f7b2f 100644 --- a/src/components/pages/password-recovery/ResetLinkStep.tsx +++ b/src/components/pages/password-recovery/ResetLinkStep.tsx @@ -17,35 +17,53 @@ const ResetLinkStep: React.FC = () => { return ( - + InterfaceImage - Logo - Відновлення пароля - - Посилання для скидання пароля надіслано на вашу
електронну адресу. Якщо посилання не - прийшло, то ви
можете надіслати його знову. + Посилання для скидання пароля надіслано на вашу
електронну + адресу. Якщо посилання не прийшло, то ви
можете надіслати + його знову. dispatch(setIsResetLinkStepOpen(false))} fz="14px" - m="0 auto" - > + m="0 auto"> Надіслати знову - ) -} + ); +}; -export default ResetLinkStep; \ No newline at end of file +export default ResetLinkStep; diff --git a/src/components/pages/register/RegisterPage.tsx b/src/components/pages/register/RegisterPage.tsx index 1dbec8e..8e33183 100644 --- a/src/components/pages/register/RegisterPage.tsx +++ b/src/components/pages/register/RegisterPage.tsx @@ -1,21 +1,21 @@ import { useState, useEffect } from "react"; -import { useNavigate } from 'react-router-dom'; +import { useNavigate } from "react-router-dom"; import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { registerUser } from '../../../store/userSlice'; +import { registerUser } from "../../../store/userSlice"; import { nameFieldRules } from "../../../shared/utils/field-rules/name"; import { emailFieldRules } from "../../../shared/utils/field-rules/email"; import { - confirmPasswordInputRules, - passwordInputRules + confirmPasswordInputRules, + passwordInputRules, } from "../../../shared/utils/field-rules/password"; -import { Box } from '../../atoms/box/Box.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { Img } from '../../atoms/img/Img.styled'; +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import { Img } from "../../atoms/img/Img.styled"; import { Container } from "../../atoms/container/Container.styled"; import { Form } from "../../atoms/form/Form.styled"; import { Button } from "../../atoms/button/Button.styled"; @@ -29,114 +29,138 @@ import COLORS from "../../../shared/styles/variables"; import { RegisterFormData } from "../../../../types/user"; const RegisterPage: React.FC = () => { - const dispatch = useAppDispatch(); + const dispatch = useAppDispatch(); - const { registerError, isRegistered, isLoading } = useAppSelector(state => state.user) + const { registerError, isRegistered, isLoading } = useAppSelector( + (state) => state.user + ); - const navigate = useNavigate(); + const navigate = useNavigate(); - const [showPassword, setShowPassword] = useState(false); - const [showConfirmPassword, setShowConfirmPassword] = useState(false); + const [showPassword, setShowPassword] = useState(false); + const [showConfirmPassword, setShowConfirmPassword] = useState(false); - const { - register, - formState: { errors, isValid }, - handleSubmit, - reset, - watch, - } = useForm({ mode: "all" }); + const { + register, + formState: { errors, isValid }, + handleSubmit, + reset, + watch, + } = useForm({ mode: "all" }); - useEffect(() => { - if (isRegistered) { - navigate('/data-entry'); - reset(); - } - }, [isRegistered]); - - const handleSub = (data: RegisterFormData) => { - dispatch(registerUser(data)); + useEffect(() => { + if (isRegistered) { + navigate("/data-entry"); + reset(); } - - return ( - - - InterfaceImage + }, [isRegistered]); + + const handleSub = (data: RegisterFormData) => { + dispatch(registerUser(data)); + }; + + return ( + + + InterfaceImage + + + + Logo + + Реєстрація нового користувача + + + + + + + + + + - - - Logo - - Реєстрація нового користувача - - - - - - - - - - - - - {registerError && ( - - - {registerError} - - - )} - - - - - - - - - ) -} -export default RegisterPage; \ No newline at end of file + {registerError && ( + + + {registerError} + + + )} + + + + + + +
+ + ); +}; + +export default RegisterPage; diff --git a/src/components/pages/statistics/DoughnutChartSection.tsx b/src/components/pages/statistics/DoughnutChartSection.tsx index 7007a83..028b79f 100644 --- a/src/components/pages/statistics/DoughnutChartSection.tsx +++ b/src/components/pages/statistics/DoughnutChartSection.tsx @@ -1,7 +1,10 @@ import { useRef, useEffect } from "react"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { setTotalIncomes, setTotalExpenses } from "../../../store/categorySlice"; +import { + setTotalIncomes, + setTotalExpenses, +} from "../../../store/categorySlice"; import { Box } from "../../atoms/box/Box.styled"; import { Typography } from "../../atoms/typography/Typography.styled"; @@ -17,7 +20,9 @@ import { ICategoryWithTotalAmount } from "../../../../types/category"; const DoughnutChartsSection: React.FC = () => { const dispatch = useAppDispatch(); - const { incomesChart, expensesChart, isLoading } = useAppSelector(state => state.statistics); + const { incomesChart, expensesChart, isLoading } = useAppSelector( + (state) => state.statistics + ); const incomesLabels = useRef(null); const expensesLabels = useRef(null); @@ -25,43 +30,51 @@ const DoughnutChartsSection: React.FC = () => { const incomesData = useRef(null); const expensesData = useRef(null); - const incomeCategoriesWithTotalAmount = useRef(null); - const expenseCategoriesWithTotalAmount = useRef(null); + const incomeCategoriesWithTotalAmount = + useRef(null); + const expenseCategoriesWithTotalAmount = + useRef(null); - const totalIncomesAmount: string = calculateTotalAmount(incomesChart?.allTransactions); - const totalExpensesAmount: string = calculateTotalAmount(expensesChart?.allTransactions); + const totalIncomesAmount: string = calculateTotalAmount( + incomesChart?.allTransactions + ); + const totalExpensesAmount: string = calculateTotalAmount( + expensesChart?.allTransactions + ); useEffect(() => { if (incomesChart.categories && incomesChart.allTransactions) { - incomeCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( - incomesChart.categories, - incomesChart.allTransactions, - ) - - incomesLabels.current = incomeCategoriesWithTotalAmount.current.map(c => { - return c.title - }) - incomesData.current = incomeCategoriesWithTotalAmount.current.map(c => { - return c.totalAmount - }) + incomeCategoriesWithTotalAmount.current = + calculateCategoriesWithTotalAmount( + incomesChart.categories, + incomesChart.allTransactions + ); + + incomesLabels.current = incomeCategoriesWithTotalAmount.current.map( + (c) => c.title + ); + incomesData.current = incomeCategoriesWithTotalAmount.current.map( + (c) => c.totalAmount + ); } }, [incomesChart.categories, incomesChart.allTransactions]); useEffect(() => { if (expensesChart.categories && expensesChart.allTransactions) { - expenseCategoriesWithTotalAmount.current = calculateCategoriesWithTotalAmount( - expensesChart.categories, - expensesChart.allTransactions, - ) - - expensesLabels.current = expenseCategoriesWithTotalAmount.current.map(c => { - return c.title - }) - expensesData.current = expenseCategoriesWithTotalAmount.current.map(c => { - return c.totalAmount - }) + expenseCategoriesWithTotalAmount.current = + calculateCategoriesWithTotalAmount( + expensesChart.categories, + expensesChart.allTransactions + ); + + expensesLabels.current = expenseCategoriesWithTotalAmount.current.map( + (c) => c.title + ); + expensesData.current = expenseCategoriesWithTotalAmount.current.map( + (c) => c.totalAmount + ); } - }, [expensesChart.categories, expensesChart.allTransactions]) + }, [expensesChart.categories, expensesChart.allTransactions]); useEffect(() => { if (!isLoading) { @@ -80,10 +93,9 @@ const DoughnutChartsSection: React.FC = () => { gap="32px" pb="20px" mb="20px" - borderBottom={`2px solid ${COLORS.DIVIDER}`} - > + borderBottom={`2px solid ${COLORS.DIVIDER}`}> - + Витрати: @@ -112,6 +124,6 @@ const DoughnutChartsSection: React.FC = () => { ); -} +}; -export default DoughnutChartsSection; \ No newline at end of file +export default DoughnutChartsSection; diff --git a/src/components/pages/statistics/LineChartSection.tsx b/src/components/pages/statistics/LineChartSection.tsx index 6499ac0..63de6a1 100644 --- a/src/components/pages/statistics/LineChartSection.tsx +++ b/src/components/pages/statistics/LineChartSection.tsx @@ -18,10 +18,14 @@ import { SelectOptions } from "../../../../types/common"; const LineChartSection: React.FC = () => { const dispatch = useAppDispatch(); - const { filterByDays, allOutlaysChart } = useAppSelector(state => state.statistics); - const { categories } = useAppSelector(state => state.category); + const { filterByDays, allOutlaysChart } = useAppSelector( + (state) => state.statistics + ); + const { categories } = useAppSelector((state) => state.category); - const selectedCategory = categories.all.find((c) => c.id === allOutlaysChart.activeCategoryId) + const selectedCategory = categories.all.find( + (c) => c.id === allOutlaysChart.activeCategoryId + ); const [selectedCategoryValues, setSelectedCategoryValues] = useState({ value: selectedCategory?.id, @@ -30,27 +34,27 @@ const LineChartSection: React.FC = () => { const [chartData, setChartData] = useState([]); - const options: SelectOptions[] = categories.all?.map(({ id, title }) => { - return { value: id, label: title } - }) + const options: SelectOptions[] = categories.all?.map(({ id, title }) => ({ + value: id, + label: title, + })); const onCategoryChange = (e: any): void => { if (e.value !== allOutlaysChart?.activeCategoryId) { - setSelectedCategoryValues({ value: e.value, label: e.label }) - dispatch(setActiveCategoryId(e.value)) - dispatch(getFilteredTransactions( - `?category=${e.value}&days=${filterByDays}` - )) + setSelectedCategoryValues({ value: e.value, label: e.label }); + dispatch(setActiveCategoryId(e.value)); + dispatch( + getFilteredTransactions(`?category=${e.value}&days=${filterByDays}`) + ); } - } + }; useEffect(() => { const newChartData: number[] = new Array(parseInt(filterByDays)).fill(0); - const { - diffInDays, - totalAmount - } = generateNewLineChartData(allOutlaysChart.categoryTransactions) + const { diffInDays, totalAmount } = generateNewLineChartData( + allOutlaysChart.categoryTransactions + ); newChartData[diffInDays] = totalAmount; @@ -59,15 +63,17 @@ const LineChartSection: React.FC = () => { useEffect(() => { if (allOutlaysChart?.activeCategoryId) { - dispatch(getFilteredTransactions( - `?category=${allOutlaysChart?.activeCategoryId}&days=${filterByDays}` - )) + dispatch( + getFilteredTransactions( + `?category=${allOutlaysChart?.activeCategoryId}&days=${filterByDays}` + ) + ); } else { setSelectedCategoryValues({ value: categories.all[0]?.id, - label: categories.all[0]?.title - }) - dispatch(setActiveCategoryId(categories.all[0]?.id)) + label: categories.all[0]?.title, + }); + dispatch(setActiveCategoryId(categories.all[0]?.id)); } }, [allOutlaysChart?.activeCategoryId, filterByDays, categories.all]); @@ -89,6 +95,6 @@ const LineChartSection: React.FC = () => { ); -} +}; -export default LineChartSection; \ No newline at end of file +export default LineChartSection; diff --git a/src/components/pages/statistics/StatisticsHeader.tsx b/src/components/pages/statistics/StatisticsHeader.tsx index bb4e5e4..1364407 100644 --- a/src/components/pages/statistics/StatisticsHeader.tsx +++ b/src/components/pages/statistics/StatisticsHeader.tsx @@ -13,26 +13,27 @@ import { IFilterButton } from "../../../../types/common"; const StatisticsHeader: React.FC = () => { const dispatch = useAppDispatch(); - const { filterByDays } = useAppSelector(state => state.statistics); - - const setFilterButtonOptions = (buttonName: string, days: string): IFilterButton => { - return { - buttonName, - filterBy: `?days=${days}`, - isActive: filterByDays === days, - onTabClick: () => { - if (filterByDays === days) return; - dispatch(setFilterByDays(days)); - dispatch(getFilteredTransactions(`?type_of_outlay=expense&days=${days}`)); - dispatch(getFilteredTransactions(`?type_of_outlay=income&days=${days}`)); - }, - } - } + const { filterByDays } = useAppSelector((state) => state.statistics); + + const setFilterButtonOptions = ( + buttonName: string, + days: string + ): IFilterButton => ({ + buttonName, + filterBy: `?days=${days}`, + isActive: filterByDays === days, + onTabClick: () => { + if (filterByDays === days) return; + dispatch(setFilterByDays(days)); + dispatch(getFilteredTransactions(`?type_of_outlay=expense&days=${days}`)); + dispatch(getFilteredTransactions(`?type_of_outlay=income&days=${days}`)); + }, + }); const filterButtons: IFilterButton[] = [ - setFilterButtonOptions('1 місяць', '30'), - setFilterButtonOptions('3 місяці', '90'), - setFilterButtonOptions('Півроку', '180'), + setFilterButtonOptions("1 місяць", "30"), + setFilterButtonOptions("3 місяці", "90"), + setFilterButtonOptions("Півроку", "180"), ]; return ( @@ -45,13 +46,12 @@ const StatisticsHeader: React.FC = () => { mr="10px" fw="600" fz="12px" - color={COLORS.DARK_FOR_TEXT} - > + color={COLORS.DARK_FOR_TEXT}> Відобразити дані за період ); -} +}; -export default StatisticsHeader; \ No newline at end of file +export default StatisticsHeader; diff --git a/src/components/pages/statistics/StatisticsPage.styled.ts b/src/components/pages/statistics/StatisticsPage.styled.ts index c3b247d..8a9b996 100644 --- a/src/components/pages/statistics/StatisticsPage.styled.ts +++ b/src/components/pages/statistics/StatisticsPage.styled.ts @@ -7,4 +7,4 @@ export const StatisticsPageWrapper = styled(Box)` box-sizing: border-box; display: flex; flex-direction: column; -` \ No newline at end of file +`; diff --git a/src/components/pages/statistics/StatisticsPage.tsx b/src/components/pages/statistics/StatisticsPage.tsx index 8cf67f0..1a9314a 100644 --- a/src/components/pages/statistics/StatisticsPage.tsx +++ b/src/components/pages/statistics/StatisticsPage.tsx @@ -2,13 +2,19 @@ import { useEffect } from "react"; import { useNavigate } from "react-router-dom"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { getFilteredTransactions, getTransactions } from "../../../store/transactionSlice"; -import { getCategories, getFilteredCategories } from "../../../store/categorySlice"; +import { + getFilteredTransactions, + getTransactions, +} from "../../../store/transactionSlice"; +import { + getCategories, + getFilteredCategories, +} from "../../../store/categorySlice"; import { token } from "../../../api/api"; import { Box } from "../../atoms/box/Box.styled"; -import Header from '../../molecules/header/Header'; +import Header from "../../molecules/header/Header"; import StatisticsHeader from "./StatisticsHeader"; import DoughnutChartsSection from "./DoughnutChartSection"; import LineChartSection from "./LineChartSection"; @@ -20,28 +26,35 @@ const StatisticsPage: React.FC = () => { const dispatch = useAppDispatch(); const navigate = useNavigate(); - const { categories } = useAppSelector(state => state.category); - const { isLoggedIn, isRegistered } = useAppSelector(state => state.user); - const { allOutlaysChart, filterByDays } = useAppSelector(state => state.statistics); + const { categories } = useAppSelector((state) => state.category); + const { isLoggedIn, isRegistered } = useAppSelector((state) => state.user); + const { allOutlaysChart, filterByDays } = useAppSelector( + (state) => state.statistics + ); - const activeCategoryId = categories.all?.length > 0 && !allOutlaysChart?.activeCategoryId; + const activeCategoryId = + categories.all?.length > 0 && !allOutlaysChart?.activeCategoryId; if (!token && !isRegistered && !isLoggedIn) { - navigate("/welcome") + navigate("/welcome"); } useEffect(() => { - dispatch(getCategories()) - dispatch(getTransactions()) - dispatch(getFilteredCategories("?type_of_outlay=income")) - dispatch(getFilteredCategories("?type_of_outlay=expense")) - dispatch(getFilteredTransactions(`?type_of_outlay=income&days=${filterByDays}`)); - dispatch(getFilteredTransactions(`?type_of_outlay=expense&days=${filterByDays}`)); + dispatch(getCategories()); + dispatch(getTransactions()); + dispatch(getFilteredCategories("?type_of_outlay=income")); + dispatch(getFilteredCategories("?type_of_outlay=expense")); + dispatch( + getFilteredTransactions(`?type_of_outlay=income&days=${filterByDays}`) + ); + dispatch( + getFilteredTransactions(`?type_of_outlay=expense&days=${filterByDays}`) + ); }, []); useEffect(() => { if (activeCategoryId) { - dispatch(getFilteredTransactions(`?category=${categories?.all[0]?.id}`)) + dispatch(getFilteredTransactions(`?category=${categories?.all[0]?.id}`)); } }, [categories.all]); @@ -58,6 +71,6 @@ const StatisticsPage: React.FC = () => { ); -} +}; -export default StatisticsPage; \ No newline at end of file +export default StatisticsPage; diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index 54ac734..eb73c2d 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -68,27 +68,25 @@ const AddTransaction: React.FC = () => { const setSwitchButtonOptions = ( buttonName: string, typeOfOutlay: TypeOfOutlay - ): ISwitchButton => { - return { - buttonName, - isActive: addTransactionData?.type_of_outlay === typeOfOutlay, - onTabClick: () => { - if (addTransactionData?.type_of_outlay === typeOfOutlay) { - return; - } - dispatch( - setAddTransactionData({ - type_of_outlay: typeOfOutlay, - category: categories[typeOfOutlay][0]?.id, - }) - ); - setSelectedCategoryValues({ - value: categories[typeOfOutlay][0]?.id, - label: categories[typeOfOutlay][0]?.title, - }); - }, - }; - }; + ): ISwitchButton => ({ + buttonName, + isActive: addTransactionData?.type_of_outlay === typeOfOutlay, + onTabClick: () => { + if (addTransactionData?.type_of_outlay === typeOfOutlay) { + return; + } + dispatch( + setAddTransactionData({ + type_of_outlay: typeOfOutlay, + category: categories[typeOfOutlay][0]?.id, + }) + ); + setSelectedCategoryValues({ + value: categories[typeOfOutlay][0]?.id, + label: categories[typeOfOutlay][0]?.title, + }); + }, + }); const switchButtons: ISwitchButton[] = [ setSwitchButtonOptions("Витрата", "expense"), @@ -237,7 +235,7 @@ const AddTransaction: React.FC = () => { fz="13px" height="14px" m="0 0 20px 0"> - {errors?.category && <>{errors?.category?.message || "Error!"}} + {(errors?.category && errors?.category?.message) || "Error!"} diff --git a/src/components/pages/transactions/DatePicker.tsx b/src/components/pages/transactions/DatePicker.tsx index 6158f54..010c992 100644 --- a/src/components/pages/transactions/DatePicker.tsx +++ b/src/components/pages/transactions/DatePicker.tsx @@ -2,40 +2,50 @@ import { forwardRef, useState } from "react"; import ReactDatePicker, { registerLocale } from "react-datepicker"; import "react-datepicker/dist/react-datepicker.css"; -import uk from 'date-fns/locale/uk'; -registerLocale('uk', uk) +import uk from "date-fns/locale/uk"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; -import { setAddTransactionData, setEditTransactionData } from "../../../store/transactionSlice"; +import { + setAddTransactionData, + setEditTransactionData, +} from "../../../store/transactionSlice"; import { formatTransactionDateToString, - formatTransactionDateToUTC + formatTransactionDateToUTC, } from "../../../shared/utils/transactions/formatTransactionDate"; import { DateInput } from "../../atoms/input/InputDate.styled"; -const DatePicker: React.FC<{ isEditTrapsactionOpen?: boolean }> = ({ isEditTrapsactionOpen }) => { - const dispatch = useAppDispatch() +registerLocale("uk", uk); + +const DatePicker: React.FC<{ isEditTrapsactionOpen?: boolean }> = ({ + isEditTrapsactionOpen, +}) => { + const dispatch = useAppDispatch(); - const { editTransactionData, addTransactionData } = useAppSelector(state => state.transaction) + const { editTransactionData, addTransactionData } = useAppSelector( + (state) => state.transaction + ); const [startDate] = useState(new Date()); const formattedDate = editTransactionData?.created ? formatTransactionDateToString(editTransactionData?.created) : addTransactionData?.created - ? formatTransactionDateToString(addTransactionData?.created) - : startDate; + ? formatTransactionDateToString(addTransactionData?.created) + : startDate; const onDateChange = (date: Date) => { const actionData = { - created: formatTransactionDateToUTC(date) + created: formatTransactionDateToUTC(date), }; - dispatch(isEditTrapsactionOpen - ? setEditTransactionData(actionData) - : setAddTransactionData(actionData)) + dispatch( + isEditTrapsactionOpen + ? setEditTransactionData(actionData) + : setAddTransactionData(actionData) + ); }; return ( @@ -51,15 +61,14 @@ const DatePicker: React.FC<{ isEditTrapsactionOpen?: boolean }> = ({ isEditTraps customInput={} /> ); -} +}; -const CustomDateInput = forwardRef(( - { value, onClick }, - ref -) => ( - - {value} - -)); +const CustomDateInput = forwardRef( + ({ value, onClick }, ref) => ( + + {value} + + ) +); -export default DatePicker; \ No newline at end of file +export default DatePicker; diff --git a/src/components/pages/transactions/EditTransaction.tsx b/src/components/pages/transactions/EditTransaction.tsx index d4d3e20..cb0d69f 100644 --- a/src/components/pages/transactions/EditTransaction.tsx +++ b/src/components/pages/transactions/EditTransaction.tsx @@ -65,27 +65,25 @@ const EditTransaction: React.FC = () => { const setSwitchButtonOptions = ( buttonName: string, typeOfOutlay: TypeOfOutlay - ): ISwitchButton => { - return { - buttonName, - isActive: editTransactionData?.type_of_outlay === typeOfOutlay, - onTabClick: () => { - if (editTransactionData?.type_of_outlay === typeOfOutlay) { - return; - } - dispatch( - setEditTransactionData({ - type_of_outlay: typeOfOutlay, - category: categories[typeOfOutlay][0]?.id, - }) - ); - setSelectedCategoryValues({ - value: categories[typeOfOutlay][0]?.id, - label: categories[typeOfOutlay][0]?.title, - }); - }, - }; - }; + ): ISwitchButton => ({ + buttonName, + isActive: editTransactionData?.type_of_outlay === typeOfOutlay, + onTabClick: () => { + if (editTransactionData?.type_of_outlay === typeOfOutlay) { + return; + } + dispatch( + setEditTransactionData({ + type_of_outlay: typeOfOutlay, + category: categories[typeOfOutlay][0]?.id, + }) + ); + setSelectedCategoryValues({ + value: categories[typeOfOutlay][0]?.id, + label: categories[typeOfOutlay][0]?.title, + }); + }, + }); const switchButtons: ISwitchButton[] = [ setSwitchButtonOptions("Витрата", "expense"), diff --git a/src/components/pages/transactions/Transactions.tsx b/src/components/pages/transactions/Transactions.tsx index 16abf4d..e107233 100644 --- a/src/components/pages/transactions/Transactions.tsx +++ b/src/components/pages/transactions/Transactions.tsx @@ -25,11 +25,11 @@ import { ITransaction, Transactions } from "../../../../types/transactions"; const renderTransactionItems = ( transactions: ITransaction[], onTransactionClick: (transaction: ITransaction) => void -): React.ReactNode[] => { - return transactions - .sort((a, b) => { - return new Date(b.created).getTime() - new Date(a.created).getTime(); - }) +): React.ReactNode[] => + transactions + .sort( + (a, b) => new Date(b.created).getTime() - new Date(a.created).getTime() + ) .map((transaction) => ( )); -}; const Transactions: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/transactions/TransactionsPage.styled.ts b/src/components/pages/transactions/TransactionsPage.styled.ts index 9c1392d..e2002c0 100644 --- a/src/components/pages/transactions/TransactionsPage.styled.ts +++ b/src/components/pages/transactions/TransactionsPage.styled.ts @@ -5,4 +5,4 @@ export const TransactionsPageWrapper = styled.div` box-sizing: border-box; display: flex; flex-direction: column; -` \ No newline at end of file +`; diff --git a/src/components/pages/transactions/TransactionsPage.tsx b/src/components/pages/transactions/TransactionsPage.tsx index 52b7d09..bc33bf1 100644 --- a/src/components/pages/transactions/TransactionsPage.tsx +++ b/src/components/pages/transactions/TransactionsPage.tsx @@ -16,7 +16,7 @@ import AddTransaction from "./AddTransaction"; import { TransactionsPageWrapper } from "./TransactionsPage.styled"; const TransactionsPage: React.FC = () => { - const dispatch = useAppDispatch() + const dispatch = useAppDispatch(); const navigate = useNavigate(); const { @@ -24,13 +24,13 @@ const TransactionsPage: React.FC = () => { isEditTransactionSuccess, isDeleteTransactionSuccess, isEditTransactionOpen, - isLoading - } = useAppSelector(state => state.transaction); + isLoading, + } = useAppSelector((state) => state.transaction); - const { isLoggedIn, isRegistered } = useAppSelector(state => state.user); + const { isLoggedIn, isRegistered } = useAppSelector((state) => state.user); if (!token && !isRegistered && !isLoggedIn) { - navigate("/welcome") + navigate("/welcome"); } useEffect(() => { @@ -46,11 +46,19 @@ const TransactionsPage: React.FC = () => { }, [isLoading]); useEffect(() => { - if (isAddTransactionSuccess || isEditTransactionSuccess || isDeleteTransactionSuccess) { + if ( + isAddTransactionSuccess || + isEditTransactionSuccess || + isDeleteTransactionSuccess + ) { dispatch(getTransactions()); dispatch(getWallets()); } - }, [isAddTransactionSuccess, isEditTransactionSuccess, isDeleteTransactionSuccess]); + }, [ + isAddTransactionSuccess, + isEditTransactionSuccess, + isDeleteTransactionSuccess, + ]); return ( @@ -63,6 +71,6 @@ const TransactionsPage: React.FC = () => { ); -} +}; -export default TransactionsPage; \ No newline at end of file +export default TransactionsPage; diff --git a/src/components/pages/welcome/WelcomePage.tsx b/src/components/pages/welcome/WelcomePage.tsx index 6275c43..6838bf4 100644 --- a/src/components/pages/welcome/WelcomePage.tsx +++ b/src/components/pages/welcome/WelcomePage.tsx @@ -1,9 +1,9 @@ import { useNavigate } from "react-router-dom"; import { Button } from "../../atoms/button/Button.styled"; -import { Box } from '../../atoms/box/Box.styled'; -import { Typography } from '../../atoms/typography/Typography.styled'; -import { Img } from '../../atoms/img/Img.styled'; +import { Box } from "../../atoms/box/Box.styled"; +import { Typography } from "../../atoms/typography/Typography.styled"; +import { Img } from "../../atoms/img/Img.styled"; import { Container } from "../../atoms/container/Container.styled"; import logo from "../../../shared/assets/images/logo.png"; @@ -12,32 +12,48 @@ import InterfaceImage from "../../../shared/assets/images/interface-image-full.p import COLORS from "../../../shared/styles/variables"; const WelcomePage = () => { - const navigate = useNavigate(); + const navigate = useNavigate(); - const handleEnterClick = () => { - navigate('/login'); - } + const handleEnterClick = () => { + navigate("/login"); + }; - const handleRegisterClick = () => { - navigate('/register'); - } + const handleRegisterClick = () => { + navigate("/register"); + }; - const handleShowDemoClick = () => { - window.location.replace("https://spendwise-test.vercel.app/home"); - } + const handleShowDemoClick = () => { + window.location.replace("https://spendwise-test.vercel.app/home"); + }; - return ( - - - InterfaceImage - - - - Logo - - Контролюйте свої кошти з програмою
обліку персональних фінансів! - - {/* + return ( + + + InterfaceImage + + + + Logo + + Контролюйте свої кошти з програмою
обліку персональних + фінансів! + + {/* Для початку потрібно пройти невеличку реєстрацію @@ -47,18 +63,23 @@ const WelcomePage = () => { */} - - Сервер тимчасово недоступний - - - - - - - - ); -} + + Сервер тимчасово недоступний + + + + + + + + ); +}; export default WelcomePage; diff --git a/src/contexts/PopupContext.tsx b/src/contexts/PopupContext.tsx index f893d33..b4d5003 100644 --- a/src/contexts/PopupContext.tsx +++ b/src/contexts/PopupContext.tsx @@ -1,49 +1,51 @@ -import { createContext, useState } from 'react'; +import { createContext, useState } from "react"; type PopupContextType = { - isAddWalletPopupOpen: boolean; - setIsAddWalletPopupOpen: React.Dispatch>; - isEditWalletPopupOpen: boolean; - setIsEditWalletPopupOpen: React.Dispatch>; - isEditProfilePopupOpen: boolean; - setIsEditProfilePopupOpen: React.Dispatch>; - isDeleteAccountPopupOpen: boolean; - setIsDeleteAccountPopupOpen: React.Dispatch>; + isAddWalletPopupOpen: boolean; + setIsAddWalletPopupOpen: React.Dispatch>; + isEditWalletPopupOpen: boolean; + setIsEditWalletPopupOpen: React.Dispatch>; + isEditProfilePopupOpen: boolean; + setIsEditProfilePopupOpen: React.Dispatch>; + isDeleteAccountPopupOpen: boolean; + setIsDeleteAccountPopupOpen: React.Dispatch>; }; export const PopupContext = createContext({ - isAddWalletPopupOpen: false, - setIsAddWalletPopupOpen: () => { }, - isEditWalletPopupOpen: false, - setIsEditWalletPopupOpen: () => { }, - isEditProfilePopupOpen: false, - setIsEditProfilePopupOpen: () => { }, - isDeleteAccountPopupOpen: false, - setIsDeleteAccountPopupOpen: () => { }, + isAddWalletPopupOpen: false, + setIsAddWalletPopupOpen: () => {}, + isEditWalletPopupOpen: false, + setIsEditWalletPopupOpen: () => {}, + isEditProfilePopupOpen: false, + setIsEditProfilePopupOpen: () => {}, + isDeleteAccountPopupOpen: false, + setIsDeleteAccountPopupOpen: () => {}, }); type PopupProviderProps = { - children: JSX.Element | JSX.Element[] + children: JSX.Element | JSX.Element[]; }; export const PopupProvider: React.FC = ({ children }) => { - const [isAddWalletPopupOpen, setIsAddWalletPopupOpen] = useState(false); - const [isEditWalletPopupOpen, setIsEditWalletPopupOpen] = useState(false); - const [isEditProfilePopupOpen, setIsEditProfilePopupOpen] = useState(false); - const [isDeleteAccountPopupOpen, setIsDeleteAccountPopupOpen] = useState(false); + const [isAddWalletPopupOpen, setIsAddWalletPopupOpen] = useState(false); + const [isEditWalletPopupOpen, setIsEditWalletPopupOpen] = useState(false); + const [isEditProfilePopupOpen, setIsEditProfilePopupOpen] = useState(false); + const [isDeleteAccountPopupOpen, setIsDeleteAccountPopupOpen] = + useState(false); - return ( - - {children} - - ); + return ( + + {children} + + ); }; diff --git a/src/global.d.ts b/src/global.d.ts index 3ac3663..0736c56 100644 --- a/src/global.d.ts +++ b/src/global.d.ts @@ -1,9 +1,10 @@ -declare module '*.jpg'; -declare module '*.jpeg'; -declare module '*.png'; +declare module "*.jpg"; +declare module "*.jpeg"; +declare module "*.png"; declare module "*.svg" { import { ReactElement, SVGProps } from "react"; + const content: (props: SVGProps) => ReactElement; export default content; } @@ -11,6 +12,6 @@ declare module "*.svg" { declare const __DEV__: boolean; declare const __API_URL__: string; -declare module '*.ttf'; -declare module '*.woff'; -declare module '*.woff2'; \ No newline at end of file +declare module "*.ttf"; +declare module "*.woff"; +declare module "*.woff2"; diff --git a/src/index.tsx b/src/index.tsx index a4d2aef..1c9f17b 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,15 +1,15 @@ -import ReactDOM from 'react-dom/client'; -import { GlobalStyles } from './shared/styles/globalStyles'; -import App from './App'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import store from './store/store'; -import { injectStore } from './api/api' +import ReactDOM from "react-dom/client"; +import { BrowserRouter } from "react-router-dom"; +import { Provider } from "react-redux"; +import { GlobalStyles } from "./shared/styles/globalStyles"; +import App from "./App"; +import store from "./store/store"; +import { injectStore } from "./api/api"; injectStore(store); const root = ReactDOM.createRoot( - document.getElementById('root') as HTMLElement + document.getElementById("root") as HTMLElement ); root.render( @@ -19,4 +19,4 @@ root.render( -); \ No newline at end of file +); diff --git a/src/shared/hooks/useFilterButtonOptions.tsx b/src/shared/hooks/useFilterButtonOptions.tsx index a514772..31f6774 100644 --- a/src/shared/hooks/useFilterButtonOptions.tsx +++ b/src/shared/hooks/useFilterButtonOptions.tsx @@ -2,55 +2,56 @@ import { useAppDispatch, useAppSelector } from "../../store/hooks"; import { setFilterByTypeOfOutlay, - getFilteredTransactions + getFilteredTransactions, } from "../../store/transactionSlice"; import { setFilterByTypeOfOutlay as setCateogryFilterByTypeOfOutlay, - getFilteredCategories + getFilteredCategories, } from "../../store/categorySlice"; import { IFilterButton, TypeOfOutlay } from "../../../types/common"; -const useFilterButtonOptions = (type: "category" | "transaction"): IFilterButton[] => { +const useFilterButtonOptions = ( + type: "category" | "transaction" +): IFilterButton[] => { const dispatch = useAppDispatch(); - const { filterByTypeOfOutlay } = useAppSelector(state => state.transaction); - const { - filterByTypeOfOutlay: categoryFilterByTypeOfOutlay - } = useAppSelector(state => state.category); + const { filterByTypeOfOutlay } = useAppSelector((state) => state.transaction); + const { filterByTypeOfOutlay: categoryFilterByTypeOfOutlay } = useAppSelector( + (state) => state.category + ); - const outlayType = type === "transaction" - ? filterByTypeOfOutlay - : categoryFilterByTypeOfOutlay + const outlayType = + type === "transaction" + ? filterByTypeOfOutlay + : categoryFilterByTypeOfOutlay; const setFilterButtonOptions = ( buttonName: string, - typeOfOutlay: TypeOfOutlay | "", - ): IFilterButton => { - return { - buttonName, - typeOfOutlay, - filterBy: typeOfOutlay ? `?type_of_outlay=${typeOfOutlay}` : "", - isActive: outlayType === (typeOfOutlay || "all"), - onTabClick: () => { - if (type === "transaction") { - dispatch(setFilterByTypeOfOutlay(typeOfOutlay || "all")); - dispatch(getFilteredTransactions(typeOfOutlay)); - } else { - dispatch(setCateogryFilterByTypeOfOutlay(typeOfOutlay || "all")); - dispatch(getFilteredCategories(typeOfOutlay)); - } + typeOfOutlay: TypeOfOutlay | "" + ): IFilterButton => ({ + buttonName, + typeOfOutlay, + filterBy: typeOfOutlay ? `?type_of_outlay=${typeOfOutlay}` : "", + isActive: outlayType === (typeOfOutlay || "all"), + onTabClick: () => { + if (type === "transaction") { + dispatch(setFilterByTypeOfOutlay(typeOfOutlay || "all")); + dispatch(getFilteredTransactions(typeOfOutlay)); + } else { + dispatch(setCateogryFilterByTypeOfOutlay(typeOfOutlay || "all")); + dispatch(getFilteredCategories(typeOfOutlay)); } - } - } + }, + }); const filterButtons: IFilterButton[] = [ setFilterButtonOptions("Всі транзакції", ""), setFilterButtonOptions("Витрати", "expense"), - setFilterButtonOptions("Надходження", "income") + setFilterButtonOptions("Надходження", "income"), ]; return filterButtons; -} +}; -export default useFilterButtonOptions; \ No newline at end of file +export default useFilterButtonOptions; diff --git a/src/shared/hooks/useSwitchButtonOptions.tsx b/src/shared/hooks/useSwitchButtonOptions.tsx index 2b9b0c3..eb4dcb9 100644 --- a/src/shared/hooks/useSwitchButtonOptions.tsx +++ b/src/shared/hooks/useSwitchButtonOptions.tsx @@ -13,23 +13,21 @@ const useSwitchButtonOptions = ( const setSwitchButtonOptions = ( buttonName: string, - typeOfOutlay: TypeOfOutlay, - ): ISwitchButton => { - return { - buttonName, - isActive: data?.type_of_outlay === typeOfOutlay, - onTabClick: () => { - dispatch(dataHandler({ type_of_outlay: typeOfOutlay })); - }, - } - } + typeOfOutlay: TypeOfOutlay + ): ISwitchButton => ({ + buttonName, + isActive: data?.type_of_outlay === typeOfOutlay, + onTabClick: () => { + dispatch(dataHandler({ type_of_outlay: typeOfOutlay })); + }, + }); const switchButtons: ISwitchButton[] = [ - setSwitchButtonOptions('Витрата', "expense"), - setSwitchButtonOptions('Надходження', "income") + setSwitchButtonOptions("Витрата", "expense"), + setSwitchButtonOptions("Надходження", "income"), ]; return switchButtons; -} +}; -export default useSwitchButtonOptions; \ No newline at end of file +export default useSwitchButtonOptions; diff --git a/src/shared/styles/commonStyles.ts b/src/shared/styles/commonStyles.ts index 9347866..2b300b7 100644 --- a/src/shared/styles/commonStyles.ts +++ b/src/shared/styles/commonStyles.ts @@ -41,7 +41,7 @@ export type commonStylesProps = { left?: string; right?: string; cursor?: string; -} +}; export const commonStyles = css` margin: ${({ m }) => m || undefined}; @@ -58,16 +58,16 @@ export const commonStyles = css` width: ${({ width }) => width || undefined}; height: ${({ height }) => height || undefined}; line-height: ${({ lh }) => lh || undefined}; - + text-align: ${({ textAlight }) => textAlight || undefined}; - display: ${({ display }) => display || 'block'}; - flex: ${({ flex }) => flex || 'flex'}; - flex-direction: ${({ direction }) => direction || 'block'}; - gap: ${({ gap }) => gap || 'block'}; - background-color: ${({ bgColor }) => bgColor || 'transparent'}; + display: ${({ display }) => display || "block"}; + flex: ${({ flex }) => flex || "flex"}; + flex-direction: ${({ direction }) => direction || "block"}; + gap: ${({ gap }) => gap || "block"}; + background-color: ${({ bgColor }) => bgColor || "transparent"}; flex-grow: ${({ grow }) => grow || undefined}; flex-basis: ${({ basis }) => basis || undefined}; - flex-wrap: ${({ wrap }) => wrap && "wrap" || undefined}; + flex-wrap: ${({ wrap }) => (wrap && "wrap") || undefined}; justify-content: ${({ justifyContent }) => justifyContent || undefined}; align-items: ${({ alignItems }) => alignItems || undefined}; font-size: ${({ fz }) => fz || undefined}; @@ -83,4 +83,4 @@ export const commonStyles = css` left: ${({ left }) => left || undefined}; right: ${({ right }) => right || undefined}; cursor: ${({ cursor }) => cursor || undefined}; -` \ No newline at end of file +`; diff --git a/src/shared/styles/fontStyles.ts b/src/shared/styles/fontStyles.ts index e21546b..9bcbeb6 100644 --- a/src/shared/styles/fontStyles.ts +++ b/src/shared/styles/fontStyles.ts @@ -1,76 +1,76 @@ import { css } from "styled-components"; -import InterThin from '../fonts/Inter/static/Inter-Thin.ttf' -import InterExtraLight from '../fonts/Inter/static/Inter-ExtraLight.ttf' -import InterLight from '../fonts/Inter/static/Inter-Light.ttf' -import InterRegular from '../fonts/Inter/static/Inter-Regular.ttf' -import InterMedium from '../fonts/Inter/static/Inter-Medium.ttf' -import InterSemiBold from '../fonts/Inter/static/Inter-SemiBold.ttf' -import InterBold from '../fonts/Inter/static/Inter-Bold.ttf' -import InterExtraBold from '../fonts/Inter/static/Inter-ExtraBold.ttf' -import InterBlack from '../fonts/Inter/static/Inter-Black.ttf' +import InterThin from "../fonts/Inter/static/Inter-Thin.ttf"; +import InterExtraLight from "../fonts/Inter/static/Inter-ExtraLight.ttf"; +import InterLight from "../fonts/Inter/static/Inter-Light.ttf"; +import InterRegular from "../fonts/Inter/static/Inter-Regular.ttf"; +import InterMedium from "../fonts/Inter/static/Inter-Medium.ttf"; +import InterSemiBold from "../fonts/Inter/static/Inter-SemiBold.ttf"; +import InterBold from "../fonts/Inter/static/Inter-Bold.ttf"; +import InterExtraBold from "../fonts/Inter/static/Inter-ExtraBold.ttf"; +import InterBlack from "../fonts/Inter/static/Inter-Black.ttf"; export const fontStyles = css` @font-face { - font-family: 'Inter'; - src: url(${InterThin}) format('truetype'); + font-family: "Inter"; + src: url(${InterThin}) format("truetype"); font-weight: 100; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterExtraLight}) format('truetype'); + font-family: "Inter"; + src: url(${InterExtraLight}) format("truetype"); font-weight: 200; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterLight}) format('truetype'); + font-family: "Inter"; + src: url(${InterLight}) format("truetype"); font-weight: 300; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterRegular}) format('truetype'); + font-family: "Inter"; + src: url(${InterRegular}) format("truetype"); font-weight: 400; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterMedium}) format('truetype'); + font-family: "Inter"; + src: url(${InterMedium}) format("truetype"); font-weight: 500; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterSemiBold}) format('truetype'); + font-family: "Inter"; + src: url(${InterSemiBold}) format("truetype"); font-weight: 600; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterBold}) format('truetype'); + font-family: "Inter"; + src: url(${InterBold}) format("truetype"); font-weight: 700; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterExtraBold}) format('truetype'); + font-family: "Inter"; + src: url(${InterExtraBold}) format("truetype"); font-weight: 800; font-style: normal; } @font-face { - font-family: 'Inter'; - src: url(${InterBlack}) format('truetype'); + font-family: "Inter"; + src: url(${InterBlack}) format("truetype"); font-weight: 900; font-style: normal; } -` \ No newline at end of file +`; diff --git a/src/shared/styles/globalStyles.ts b/src/shared/styles/globalStyles.ts index 250922a..ac3a2c4 100644 --- a/src/shared/styles/globalStyles.ts +++ b/src/shared/styles/globalStyles.ts @@ -33,4 +33,4 @@ export const GlobalStyles = createGlobalStyle` scrollbar-width: thin; scrollbar-color: #ccc #f5f5f5; -` \ No newline at end of file +`; diff --git a/src/shared/styles/iconStyles.ts b/src/shared/styles/iconStyles.ts index cb45da7..eaef96f 100644 --- a/src/shared/styles/iconStyles.ts +++ b/src/shared/styles/iconStyles.ts @@ -1,5 +1,6 @@ import { css } from "styled-components"; export const blackSVGtoWhite = css` - filter: invert(100%) sepia(0%) saturate(3410%) hue-rotate(161deg) brightness(113%) contrast(100%); -` \ No newline at end of file + filter: invert(100%) sepia(0%) saturate(3410%) hue-rotate(161deg) + brightness(113%) contrast(100%); +`; diff --git a/src/shared/styles/variables.ts b/src/shared/styles/variables.ts index d97ccb7..630ddc9 100644 --- a/src/shared/styles/variables.ts +++ b/src/shared/styles/variables.ts @@ -21,4 +21,4 @@ const COLORS = { GRADIENT: `linear-gradient(130.59deg, #A96BF8 0%, #725DD9 19.48%, #737FEF 39.78%, #5D8AD9 60.07%, #6BC3F8 77.93%)`, }; -export default COLORS; \ No newline at end of file +export default COLORS; diff --git a/src/shared/utils/field-rules/amount.ts b/src/shared/utils/field-rules/amount.ts index 9b0efa2..0f8b057 100644 --- a/src/shared/utils/field-rules/amount.ts +++ b/src/shared/utils/field-rules/amount.ts @@ -1,13 +1,15 @@ import { moneyAmountRegex } from "../regexes"; export const amountFieldRules = { - required: 'Обов\'язкове поле для заповнення', + required: "Обов'язкове поле для заповнення", pattern: { value: moneyAmountRegex, - message: 'Сума може бути від 1 до 8 цифр перед крапкою та до 2 цифр після крапки', + message: + "Сума може бути від 1 до 8 цифр перед крапкою та до 2 цифр після крапки", }, min: { - value: 0.00, - message: 'Сума може бути додатньою від 1 до 8 цифр перед крапкою та до 2 цифр після крапки' + value: 0.0, + message: + "Сума може бути додатньою від 1 до 8 цифр перед крапкою та до 2 цифр після крапки", }, -} +}; diff --git a/src/shared/utils/field-rules/email.ts b/src/shared/utils/field-rules/email.ts index 1e88149..78e71a0 100644 --- a/src/shared/utils/field-rules/email.ts +++ b/src/shared/utils/field-rules/email.ts @@ -1,9 +1,9 @@ import { emailRegex } from "../regexes"; export const emailFieldRules = { - required: 'Обов\'язкове поле для заповнення', + required: "Обов'язкове поле для заповнення", pattern: { value: emailRegex, message: "Назва повинна бути не менше 2 літер", }, -} \ No newline at end of file +}; diff --git a/src/shared/utils/field-rules/name.ts b/src/shared/utils/field-rules/name.ts index e8c8242..ecdce45 100644 --- a/src/shared/utils/field-rules/name.ts +++ b/src/shared/utils/field-rules/name.ts @@ -1,9 +1,9 @@ import { nameRegex } from "../regexes"; export const nameFieldRules = { - required: 'Обов\'язкове поле для заповнення', + required: "Обов'язкове поле для заповнення", pattern: { value: nameRegex, message: "Назва повинна бути не менше 2 літер", }, -} \ No newline at end of file +}; diff --git a/src/shared/utils/field-rules/password.ts b/src/shared/utils/field-rules/password.ts index e765396..5142349 100644 --- a/src/shared/utils/field-rules/password.ts +++ b/src/shared/utils/field-rules/password.ts @@ -8,23 +8,21 @@ type ConfirmPasswordInputRules = { }; export const passwordInputRules = { - required: 'Обов\'язкове поле для заповнення', + required: "Обов'язкове поле для заповнення", pattern: { value: passwordRegex, - message: `Пароль повинен містити не менше 8 символів, 1 літеру, 1 цифру та 1 спеціальний символ` + message: `Пароль повинен містити не менше 8 символів, 1 літеру, 1 цифру та 1 спеціальний символ`, }, }; export const confirmPasswordInputRules = ( watchFunc: UseFormWatch, passwordName: string -): ConfirmPasswordInputRules => { - return { - required: 'Обов\'язкове поле для заповнення', - validate: (val: string) => { - if (watchFunc(passwordName) !== val) { - return "Паролі не співпадають"; - } - }, - }; -}; +): ConfirmPasswordInputRules => ({ + required: "Обов'язкове поле для заповнення", + validate: (val: string) => { + if (watchFunc(passwordName) !== val) { + return "Паролі не співпадають"; + } + }, +}); diff --git a/src/shared/utils/field-rules/title.ts b/src/shared/utils/field-rules/title.ts index 6b672f5..91974df 100644 --- a/src/shared/utils/field-rules/title.ts +++ b/src/shared/utils/field-rules/title.ts @@ -1,9 +1,11 @@ import { titleRegex, twoSymbolsRegex } from "../regexes"; export const titleFieldRules = { - required: 'Обов\'язкове поле для заповнення', + required: "Обов'язкове поле для заповнення", validate: { - hasTwoSymbols: (value: string) => twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів', - hasTwoLetters: (value: string) => titleRegex.test(value) || 'Повинно бути не менше 2 літер', - } -} + hasTwoSymbols: (value: string) => + twoSymbolsRegex.test(value) || "Повинно бути не менше 2 символів", + hasTwoLetters: (value: string) => + titleRegex.test(value) || "Повинно бути не менше 2 літер", + }, +}; diff --git a/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts index 8bf9195..859ae89 100644 --- a/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts +++ b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts @@ -1,11 +1,14 @@ -import { ICategory, ICategoryWithTotalAmount } from "../../../../types/category"; +import { + ICategory, + ICategoryWithTotalAmount, +} from "../../../../types/category"; import { Transactions } from "../../../../types/transactions"; export const calculateCategoriesWithTotalAmount = ( categories: ICategory[], allTransactions: Transactions -): ICategoryWithTotalAmount[] => { - return categories +): ICategoryWithTotalAmount[] => + categories .flatMap((category) => { const transactionsForCategory = Object.values(allTransactions) .flat() @@ -18,8 +21,7 @@ export const calculateCategoriesWithTotalAmount = ( return []; } const totalAmount = transactionsForCategory.reduce( - (sum, transaction) => - sum + parseFloat(transaction.amount_of_funds), + (sum, transaction) => sum + parseFloat(transaction.amount_of_funds), 0 ); return { @@ -31,4 +33,3 @@ export const calculateCategoriesWithTotalAmount = ( }; }) .filter((category) => category.totalAmount > 0); -} \ No newline at end of file diff --git a/src/shared/utils/statistics/calculateTotalAmount.ts b/src/shared/utils/statistics/calculateTotalAmount.ts index 90d3f4f..f0ba0e3 100644 --- a/src/shared/utils/statistics/calculateTotalAmount.ts +++ b/src/shared/utils/statistics/calculateTotalAmount.ts @@ -1,13 +1,17 @@ import { Transactions } from "../../../../types/transactions"; export const calculateTotalAmount = (allTransactions: Transactions): string => { - const transactionAmounts = Object.values(allTransactions).flatMap(transactionsArr => { - return transactionsArr.map(transaction => { - return parseFloat(transaction.amount_of_funds) - }) - }) + const transactionAmounts = Object.values(allTransactions).flatMap( + (transactionsArr) => + transactionsArr.map((transaction) => + parseFloat(transaction.amount_of_funds) + ) + ); - const totalAmount = transactionAmounts.reduce((sum, amount) => sum + amount, 0); + const totalAmount = transactionAmounts.reduce( + (sum, amount) => sum + amount, + 0 + ); return totalAmount.toFixed(2); }; diff --git a/src/shared/utils/statistics/generateNewLineChartData.ts b/src/shared/utils/statistics/generateNewLineChartData.ts index a5d908e..9a07539 100644 --- a/src/shared/utils/statistics/generateNewLineChartData.ts +++ b/src/shared/utils/statistics/generateNewLineChartData.ts @@ -1,24 +1,29 @@ import { Transactions } from "../../../../types/transactions"; -export const generateNewLineChartData = (categoryTransactions: Transactions): { - diffInDays: number, - totalAmount: number +export const generateNewLineChartData = ( + categoryTransactions: Transactions +): { + diffInDays: number; + totalAmount: number; } => { let diffInDays = null; let totalAmount = null; - Object.entries(categoryTransactions)?.forEach(([dateStr, transactionsArr]) => { - const targetDate = new Date(dateStr); - const currentDate = new Date(); + Object.entries(categoryTransactions)?.forEach( + ([dateStr, transactionsArr]) => { + const targetDate = new Date(dateStr); + const currentDate = new Date(); - const diffInTime = targetDate.getTime() - currentDate.getTime(); + const diffInTime = targetDate.getTime() - currentDate.getTime(); - diffInDays = Math.abs(Math.ceil(diffInTime / (1000 * 60 * 60 * 24))); + diffInDays = Math.abs(Math.ceil(diffInTime / (1000 * 60 * 60 * 24))); - totalAmount = transactionsArr.reduce((acc, transaction) => { - return acc + parseInt(transaction.amount_of_funds); - }, 0); - }); + totalAmount = transactionsArr.reduce( + (acc, transaction) => acc + parseInt(transaction.amount_of_funds), + 0 + ); + } + ); - return { diffInDays, totalAmount } -} \ No newline at end of file + return { diffInDays, totalAmount }; +}; diff --git a/src/shared/utils/store/updateCategories.ts b/src/shared/utils/store/updateCategories.ts index f8faadd..fbb95d4 100644 --- a/src/shared/utils/store/updateCategories.ts +++ b/src/shared/utils/store/updateCategories.ts @@ -4,7 +4,7 @@ import { CategoryState, ICategory } from "../../../../types/category"; export const updateCategories = ( state: CategoryState, - action: PayloadAction<{ data: ICategory[], params: string }> + action: PayloadAction<{ data: ICategory[]; params: string }> ) => { const { data, params } = action.payload; @@ -21,4 +21,4 @@ export const updateCategories = ( default: break; } -} \ No newline at end of file +}; diff --git a/src/shared/utils/store/updateChartCategories.ts b/src/shared/utils/store/updateChartCategories.ts index 83a468f..33b87a4 100644 --- a/src/shared/utils/store/updateChartCategories.ts +++ b/src/shared/utils/store/updateChartCategories.ts @@ -5,7 +5,7 @@ import { ICategory } from "../../../../types/category"; export const updateChartCategories = ( state: StatisticsState, - action: PayloadAction<{ data: ICategory[], params: string }> + action: PayloadAction<{ data: ICategory[]; params: string }> ) => { const { data, params } = action.payload; @@ -19,4 +19,4 @@ export const updateChartCategories = ( default: break; } -} \ No newline at end of file +}; diff --git a/src/shared/utils/store/updateChartCategoryTransactions.ts b/src/shared/utils/store/updateChartCategoryTransactions.ts index 4f8253d..5b13e46 100644 --- a/src/shared/utils/store/updateChartCategoryTransactions.ts +++ b/src/shared/utils/store/updateChartCategoryTransactions.ts @@ -6,7 +6,7 @@ import { StatisticsState } from "../../../../types/statistics"; export const updateChartCategoryTransactions = ( state: StatisticsState, - action: PayloadAction<{ data: Transactions[], chartType: TypeOfOutlay }> + action: PayloadAction<{ data: Transactions[]; chartType: TypeOfOutlay }> ) => { const { data, chartType } = action.payload; @@ -20,4 +20,4 @@ export const updateChartCategoryTransactions = ( default: break; } -} \ No newline at end of file +}; diff --git a/src/shared/utils/store/updateChartTransactions.ts b/src/shared/utils/store/updateChartTransactions.ts index 20a415d..7430f2d 100644 --- a/src/shared/utils/store/updateChartTransactions.ts +++ b/src/shared/utils/store/updateChartTransactions.ts @@ -5,15 +5,15 @@ import { Transactions } from "../../../../types/transactions"; export const updateChartTransactions = ( state: StatisticsState, - action: PayloadAction<{ data: Transactions, params: string }> + action: PayloadAction<{ data: Transactions; params: string }> ) => { const { data, params } = action.payload; - if (params.startsWith('?category=')) { + if (params.startsWith("?category=")) { state.allOutlaysChart.categoryTransactions = data; - } else if (params.startsWith('?type_of_outlay=income')) { + } else if (params.startsWith("?type_of_outlay=income")) { state.incomesChart.allTransactions = data; - } else if (params.startsWith('?type_of_outlay=expense')) { + } else if (params.startsWith("?type_of_outlay=expense")) { state.expensesChart.allTransactions = data; } -} \ No newline at end of file +}; diff --git a/src/shared/utils/store/updateTransactions.ts b/src/shared/utils/store/updateTransactions.ts index 6ccc997..f0d1098 100644 --- a/src/shared/utils/store/updateTransactions.ts +++ b/src/shared/utils/store/updateTransactions.ts @@ -4,7 +4,7 @@ import { TransactionState, Transactions } from "../../../../types/transactions"; export const updateTransactions = ( state: TransactionState, - action: PayloadAction<{ data: Transactions, params: string }> + action: PayloadAction<{ data: Transactions; params: string }> ) => { const { data, params } = action.payload; @@ -21,4 +21,4 @@ export const updateTransactions = ( default: break; } -} \ No newline at end of file +}; diff --git a/src/shared/utils/transactions/filterTransactions.ts b/src/shared/utils/transactions/filterTransactions.ts index c8ff9a3..fbafe0c 100644 --- a/src/shared/utils/transactions/filterTransactions.ts +++ b/src/shared/utils/transactions/filterTransactions.ts @@ -1,21 +1,23 @@ import { Transactions } from "../../../../types/transactions"; -export const filterTransactions = (filteredTransactions: Transactions): Transactions => { +export const filterTransactions = ( + filteredTransactions: Transactions +): Transactions => { const sortedTransactions: Transactions = {}; - const sortedKeys = Object.keys(filteredTransactions).sort((a, b) => { - return new Date(b).getTime() - new Date(a).getTime() - }); + const sortedKeys = Object.keys(filteredTransactions).sort( + (a, b) => new Date(b).getTime() - new Date(a).getTime() + ); sortedKeys.forEach((date) => { const sortedItems = filteredTransactions[date] .slice() - .sort((a, b) => { - return new Date(b.created).getTime() - new Date(a.created).getTime() - }); + .sort( + (a, b) => new Date(b.created).getTime() - new Date(a.created).getTime() + ); sortedTransactions[date] = sortedItems; }); return sortedTransactions; -}; \ No newline at end of file +}; diff --git a/src/shared/utils/transactions/formatTransactionDate.ts b/src/shared/utils/transactions/formatTransactionDate.ts index 56f172a..d426fee 100644 --- a/src/shared/utils/transactions/formatTransactionDate.ts +++ b/src/shared/utils/transactions/formatTransactionDate.ts @@ -3,18 +3,24 @@ export const formatTransactionDateToFullDate = (dateStr: string): string => { date.setHours(date.getHours() + 3); const options = { - day: 'numeric', - month: 'long', - timeZone: 'Europe/Kiev', - locale: 'uk-UA', + day: "numeric", + month: "long", + timeZone: "Europe/Kiev", + locale: "uk-UA", } as const; - const dayOfMonthAndMonthName = new Intl.DateTimeFormat('uk-UA', options).format(date); - const dayOfWeek = new Intl.DateTimeFormat('uk-UA', { weekday: 'long' }).format(date); - const capitalizedDayOfWeek = dayOfWeek.charAt(0).toUpperCase() + dayOfWeek.slice(1); + const dayOfMonthAndMonthName = new Intl.DateTimeFormat( + "uk-UA", + options + ).format(date); + const dayOfWeek = new Intl.DateTimeFormat("uk-UA", { + weekday: "long", + }).format(date); + const capitalizedDayOfWeek = + dayOfWeek.charAt(0).toUpperCase() + dayOfWeek.slice(1); return `${capitalizedDayOfWeek}, ${dayOfMonthAndMonthName}`; -} +}; export const formatTransactionDateToUTC = (date: Date): string => { const newDate = new Date(date); @@ -29,15 +35,17 @@ export const formatTransactionDateToUTC = (date: Date): string => { timeZone: "UTC", } as const; - const formattedDate = new Intl.DateTimeFormat("en-US", options).format(newDate); + const formattedDate = new Intl.DateTimeFormat("en-US", options).format( + newDate + ); const isoDate = new Date(formattedDate).toISOString(); return isoDate; -} +}; export const formatTransactionDateToString = (dateStr: string): Date => { const utcDate = new Date(dateStr); utcDate.setUTCHours(utcDate.getUTCHours() + 3); return utcDate; -} \ No newline at end of file +}; diff --git a/src/shared/utils/transactions/formatTransactionTime.ts b/src/shared/utils/transactions/formatTransactionTime.ts index ff2eb60..dbe6ef0 100644 --- a/src/shared/utils/transactions/formatTransactionTime.ts +++ b/src/shared/utils/transactions/formatTransactionTime.ts @@ -3,15 +3,15 @@ export const formatTransactionTime = (timestamp: string): string => { date.setHours(date.getHours() + 3); const options = { - hour: 'numeric', - minute: 'numeric', - timeZone: 'Europe/Kiev', + hour: "numeric", + minute: "numeric", + timeZone: "Europe/Kiev", hour12: false, } as const; - const formatter = new Intl.DateTimeFormat('uk-UA', options); + const formatter = new Intl.DateTimeFormat("uk-UA", options); const time = formatter.format(date); return time; -} \ No newline at end of file +}; diff --git a/src/shared/utils/transactions/setSelectOptions.ts b/src/shared/utils/transactions/setSelectOptions.ts index 195f46b..2fe392f 100644 --- a/src/shared/utils/transactions/setSelectOptions.ts +++ b/src/shared/utils/transactions/setSelectOptions.ts @@ -17,7 +17,5 @@ export const setSelectOptions = ( categoriesArr = categories.income; } - return categoriesArr?.map(({ id, title }) => { - return { value: id, label: title }; - }); + return categoriesArr?.map(({ id, title }) => ({ value: id, label: title })); }; diff --git a/src/store/bankDataSlice.ts b/src/store/bankDataSlice.ts index 19d7c1c..601cb0c 100644 --- a/src/store/bankDataSlice.ts +++ b/src/store/bankDataSlice.ts @@ -1,66 +1,61 @@ -import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; -import { $api, BANK_DATA_PATH } from '../api/api'; -import { IBankData } from '../../types/bankdata'; +import { $api, BANK_DATA_PATH } from "../api/api"; + +import { IBankData } from "../../types/bankdata"; type BankDataState = { isLoading: boolean; error: string | null; bankData: IBankData[]; isAddBankDataSuccess: boolean; -} +}; export const getBankData = createAsyncThunk< IBankData[], undefined, { rejectValue: string } ->( - 'bankData/getBankData', - async (_, { rejectWithValue }) => { - try { - const res = await $api.get(BANK_DATA_PATH); - return res?.data; - } catch (error) { - return rejectWithValue('Помилка'); - } +>("bankData/getBankData", async (_, { rejectWithValue }) => { + try { + const res = await $api.get(BANK_DATA_PATH); + return res?.data; + } catch (error) { + return rejectWithValue("Помилка"); } -); +}); export const sendBankData = createAsyncThunk< undefined, IBankData, { rejectValue: string } ->( - 'bankData/sendBankData', - async (payload, { rejectWithValue }) => { - try { - const response = await $api.post(BANK_DATA_PATH, payload, { - headers: { - 'content-type': 'multipart/form-data', - } - }); +>("bankData/sendBankData", async (payload, { rejectWithValue }) => { + try { + const response = await $api.post(BANK_DATA_PATH, payload, { + headers: { + "content-type": "multipart/form-data", + }, + }); - return response?.data; - } catch (error) { - return rejectWithValue('Помилка'); - } + return response?.data; + } catch (error) { + return rejectWithValue("Помилка"); } -); +}); const initialState: BankDataState = { isLoading: false, error: null, bankData: null, isAddBankDataSuccess: false, -} +}; const passwordRecoverySlice = createSlice({ - name: 'bankData', + name: "bankData", initialState, reducers: { setBankDataSuccessStatus(state, action) { state.isAddBankDataSuccess = action.payload; - } + }, }, extraReducers: (builder) => { builder @@ -70,7 +65,7 @@ const passwordRecoverySlice = createSlice({ }) .addCase(getBankData.fulfilled, (state, action) => { state.isLoading = false; - state.bankData = action.payload + state.bankData = action.payload; }) .addCase(getBankData.rejected, (state, action) => { state.isLoading = false; @@ -88,12 +83,10 @@ const passwordRecoverySlice = createSlice({ .addCase(sendBankData.rejected, (state, action) => { state.isLoading = false; state.error = action.payload; - }) - } + }); + }, }); -export const { - setBankDataSuccessStatus -} = passwordRecoverySlice.actions +export const { setBankDataSuccessStatus } = passwordRecoverySlice.actions; -export default passwordRecoverySlice.reducer; \ No newline at end of file +export default passwordRecoverySlice.reducer; diff --git a/src/store/categorySlice.ts b/src/store/categorySlice.ts index 2f306fa..ba2d337 100644 --- a/src/store/categorySlice.ts +++ b/src/store/categorySlice.ts @@ -97,9 +97,7 @@ const categorySlice = createSlice({ name: "category", initialState, reducers: { - resetCategoryState: (state) => { - return initialState; - }, + resetCategoryState: (state) => initialState, resetError: (state) => { state.error = null; }, diff --git a/src/store/hooks.ts b/src/store/hooks.ts index 9437aba..a47f239 100644 --- a/src/store/hooks.ts +++ b/src/store/hooks.ts @@ -1,6 +1,6 @@ -import { useDispatch, useSelector, TypedUseSelectorHook } from 'react-redux'; +import { useDispatch, useSelector, TypedUseSelectorHook } from "react-redux"; -import type { RootState, AppDispatch } from './store'; +import type { RootState, AppDispatch } from "./store"; export const useAppDispatch = () => useDispatch(); -export const useAppSelector: TypedUseSelectorHook = useSelector; \ No newline at end of file +export const useAppSelector: TypedUseSelectorHook = useSelector; diff --git a/src/store/passwordRecoverySlice.ts b/src/store/passwordRecoverySlice.ts index ef6ca03..7d49a94 100644 --- a/src/store/passwordRecoverySlice.ts +++ b/src/store/passwordRecoverySlice.ts @@ -1,10 +1,10 @@ -import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; import { $api, PASSWORD_RESET_CONFIRM_PATH, - PASSWORD_RESET_REQUEST_PATH -} from '../api/api'; + PASSWORD_RESET_REQUEST_PATH, +} from "../api/api"; type PasswordRecoveryState = { email: string; @@ -12,20 +12,20 @@ type PasswordRecoveryState = { error: string | null; isResetLinkStepOpen: boolean; isNewPasswordSet: boolean; -} +}; type confirmPasswordResetPayload = { uid: string; token: string; new_password: string; -} +}; export const requestPasswordReset = createAsyncThunk< undefined, { email: string }, { rejectValue: string } >( - 'passwordRecovery/requestPasswordReset', + "passwordRecovery/requestPasswordReset", async (payload, { rejectWithValue }) => { try { const response = await $api.post(PASSWORD_RESET_REQUEST_PATH, payload); @@ -42,7 +42,7 @@ export const confirmPasswordReset = createAsyncThunk< confirmPasswordResetPayload, { rejectValue: string } >( - 'passwordRecovery/confirmPasswordReset', + "passwordRecovery/confirmPasswordReset", async (payload, { rejectWithValue }) => { try { const response = await $api.post(PASSWORD_RESET_CONFIRM_PATH, payload); @@ -60,20 +60,20 @@ const initialState: PasswordRecoveryState = { error: null, isResetLinkStepOpen: false, isNewPasswordSet: false, -} +}; const passwordRecoverySlice = createSlice({ - name: 'passwordRecovery', + name: "passwordRecovery", initialState, reducers: { setIsResetLinkStepOpen(state, action) { state.isResetLinkStepOpen = action.payload; - } + }, }, extraReducers: (builder) => { builder .addCase(requestPasswordReset.pending, (state, action) => { - state.email = action.payload + state.email = action.payload; state.isLoading = true; state.error = null; }) @@ -97,10 +97,10 @@ const passwordRecoverySlice = createSlice({ .addCase(confirmPasswordReset.rejected, (state, action) => { state.isLoading = false; state.error = action.payload; - }) - } + }); + }, }); export const { setIsResetLinkStepOpen } = passwordRecoverySlice.actions; -export default passwordRecoverySlice.reducer; \ No newline at end of file +export default passwordRecoverySlice.reducer; diff --git a/src/store/statisticsSlice.ts b/src/store/statisticsSlice.ts index 893e462..ba6bb05 100644 --- a/src/store/statisticsSlice.ts +++ b/src/store/statisticsSlice.ts @@ -1,25 +1,25 @@ -import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'; +import { createAsyncThunk, createSlice } from "@reduxjs/toolkit"; -import { getFilteredTransactions } from './transactionSlice'; -import { getFilteredCategories } from './categorySlice'; +import { getFilteredTransactions } from "./transactionSlice"; +import { getFilteredCategories } from "./categorySlice"; -import { updateChartCategories } from '../shared/utils/store/updateChartCategories'; -import { updateChartTransactions } from '../shared/utils/store/updateChartTransactions'; -import { updateChartCategoryTransactions } from '../shared/utils/store/updateChartCategoryTransactions'; +import { updateChartCategories } from "../shared/utils/store/updateChartCategories"; +import { updateChartTransactions } from "../shared/utils/store/updateChartTransactions"; +import { updateChartCategoryTransactions } from "../shared/utils/store/updateChartCategoryTransactions"; -import { $api, TRANSACTION_PATH } from '../api/api'; +import { $api, TRANSACTION_PATH } from "../api/api"; -import { Transactions } from '../../types/transactions'; -import { ICategory } from '../../types/category'; -import { TypeOfOutlay } from '../../types/common'; -import { StatisticsState } from '../../types/statistics'; +import { Transactions } from "../../types/transactions"; +import { ICategory } from "../../types/category"; +import { TypeOfOutlay } from "../../types/common"; +import { StatisticsState } from "../../types/statistics"; export const getFilteredCategoryTransactions = createAsyncThunk< - { data: Transactions[], chartType: TypeOfOutlay }, - { chartType: TypeOfOutlay, categories: ICategory[], filterByDays: string }, + { data: Transactions[]; chartType: TypeOfOutlay }, + { chartType: TypeOfOutlay; categories: ICategory[]; filterByDays: string }, { rejectValue: string } >( - 'statistics/getFilteredCategoryTransactions', + "statistics/getFilteredCategoryTransactions", async (payload, { rejectWithValue }) => { const { chartType, categories, filterByDays } = payload; @@ -31,14 +31,14 @@ export const getFilteredCategoryTransactions = createAsyncThunk< ); return response.data; } catch (error) { - throw new Error('Помилка'); + throw new Error("Помилка"); } }); const data = await Promise.all(promises); return { data, chartType }; } catch (error) { - return rejectWithValue('Помилка'); + return rejectWithValue("Помилка"); } } ); @@ -69,12 +69,10 @@ const initialState: StatisticsState = { }; const statisticsSlice = createSlice({ - name: 'statistics', + name: "statistics", initialState, reducers: { - resetStatisticsState: () => { - return initialState; - }, + resetStatisticsState: () => initialState, resetError: (state) => { state.error = null; }, @@ -105,7 +103,7 @@ const statisticsSlice = createSlice({ state.error = null; }) .addCase(getFilteredCategories.fulfilled, (state, action) => { - updateChartCategories(state, action) + updateChartCategories(state, action); state.isLoading = false; }) .addCase(getFilteredCategories.rejected, (state, action) => { @@ -119,7 +117,7 @@ const statisticsSlice = createSlice({ }) .addCase(getFilteredTransactions.fulfilled, (state, action) => { state.isLoading = false; - updateChartTransactions(state, action) + updateChartTransactions(state, action); }) .addCase(getFilteredTransactions.rejected, (state, action) => { state.isLoading = false; @@ -132,13 +130,13 @@ const statisticsSlice = createSlice({ }) .addCase(getFilteredCategoryTransactions.fulfilled, (state, action) => { state.isLoading = false; - updateChartCategoryTransactions(state, action) + updateChartCategoryTransactions(state, action); }) .addCase(getFilteredCategoryTransactions.rejected, (state, action) => { state.isLoading = false; state.error = action.payload; - }) - } + }); + }, }); export const { diff --git a/src/store/store.ts b/src/store/store.ts index c351ebb..7c211ba 100644 --- a/src/store/store.ts +++ b/src/store/store.ts @@ -1,12 +1,12 @@ -import { configureStore } from '@reduxjs/toolkit'; +import { configureStore } from "@reduxjs/toolkit"; -import userReducer from './userSlice'; -import walletReducer from './walletSlice'; -import transactionReducer from './transactionSlice'; -import categoryReducer from './categorySlice'; -import statisticsReducer from './statisticsSlice'; -import passwordRecoveryReducer from './passwordRecoverySlice'; -import bankDataReducer from './bankDataSlice'; +import userReducer from "./userSlice"; +import walletReducer from "./walletSlice"; +import transactionReducer from "./transactionSlice"; +import categoryReducer from "./categorySlice"; +import statisticsReducer from "./statisticsSlice"; +import passwordRecoveryReducer from "./passwordRecoverySlice"; +import bankDataReducer from "./bankDataSlice"; const store = configureStore({ reducer: { @@ -24,4 +24,3 @@ export default store; export type RootState = ReturnType; export type AppDispatch = typeof store.dispatch; - diff --git a/src/store/transactionSlice.ts b/src/store/transactionSlice.ts index d3c365b..467b037 100644 --- a/src/store/transactionSlice.ts +++ b/src/store/transactionSlice.ts @@ -98,9 +98,7 @@ const transactionSlice = createSlice({ name: "transaction", initialState, reducers: { - resetTransactionState: () => { - return initialState; - }, + resetTransactionState: () => initialState, resetError: (state) => { state.error = null; }, diff --git a/src/store/userSlice.ts b/src/store/userSlice.ts index 6307529..d83305e 100644 --- a/src/store/userSlice.ts +++ b/src/store/userSlice.ts @@ -1,325 +1,305 @@ -import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; import { - $api, - CHANGE_USER_INFO_PATH, - LOGIN_PATH, - LOGOUT_PATH, - REGISTER_PATH, - USER_DETAILS_PATH, - userDataParsed, - CHANGE_USER_PASSWORD_PATH -} from '../api/api'; + $api, + CHANGE_USER_INFO_PATH, + LOGIN_PATH, + LOGOUT_PATH, + REGISTER_PATH, + USER_DETAILS_PATH, + userDataParsed, + CHANGE_USER_PASSWORD_PATH, +} from "../api/api"; import { - IUser, - LoginFormData, - PasswordChangeFormData, - RegisterFormData, - UserState -} from '../../types/user'; + IUser, + LoginFormData, + PasswordChangeFormData, + RegisterFormData, + UserState, +} from "../../types/user"; type LoginResponse = { - user_id: string; - email: string; - token: string; -} + user_id: string; + email: string; + token: string; +}; export const registerUser = createAsyncThunk< - any, - RegisterFormData, - { rejectValue: string } ->( - 'user/registerUser', - async (registerData, { rejectWithValue }) => { - try { - const response = await $api.post(REGISTER_PATH, registerData); - const user = response.data; - localStorage.clear(); - localStorage.setItem('token', user.token); - localStorage.setItem('userData', JSON.stringify(user)); - return user; - } catch (error) { - return rejectWithValue("Акаунт із вказаною поштою вже існує"); - } - } -); + any, + RegisterFormData, + { rejectValue: string } +>("user/registerUser", async (registerData, { rejectWithValue }) => { + try { + const response = await $api.post(REGISTER_PATH, registerData); + const user = response.data; + localStorage.clear(); + localStorage.setItem("token", user.token); + localStorage.setItem("userData", JSON.stringify(user)); + return user; + } catch (error) { + return rejectWithValue("Акаунт із вказаною поштою вже існує"); + } +}); export const loginUser = createAsyncThunk< - LoginResponse, - LoginFormData, - { rejectValue: string } ->( - 'user/loginUser', - async (loginData, { rejectWithValue }) => { - try { - const response = await $api.post(LOGIN_PATH, loginData); - const userInfo = response.data; - localStorage.setItem('token', userInfo.token); - localStorage.setItem("isDataEntrySuccess", "true"); - return userInfo; - } catch (error) { - return rejectWithValue('Будь ласка, введіть дані, вказані при реєстрації'); - } - } -); + LoginResponse, + LoginFormData, + { rejectValue: string } +>("user/loginUser", async (loginData, { rejectWithValue }) => { + try { + const response = await $api.post(LOGIN_PATH, loginData); + const userInfo = response.data; + localStorage.setItem("token", userInfo.token); + localStorage.setItem("isDataEntrySuccess", "true"); + return userInfo; + } catch (error) { + return rejectWithValue("Будь ласка, введіть дані, вказані при реєстрації"); + } +}); export const logoutUser = createAsyncThunk< - undefined, - undefined, - { rejectValue: string } ->( - 'user/logoutUser', - async (_, { rejectWithValue }) => { - try { - await $api.get(LOGOUT_PATH); - localStorage.clear(); - return undefined; - } catch (error) { - return rejectWithValue("Помилка"); - } - } -); + undefined, + undefined, + { rejectValue: string } +>("user/logoutUser", async (_, { rejectWithValue }) => { + try { + await $api.get(LOGOUT_PATH); + localStorage.clear(); + return undefined; + } catch (error) { + return rejectWithValue("Помилка"); + } +}); export const getUserDetails = createAsyncThunk< - IUser, - undefined, - { rejectValue: string } ->( - 'user/getUserDetails', - async (_, { rejectWithValue }) => { - try { - const response = await $api.get(USER_DETAILS_PATH); - const userData = response.data; - localStorage.setItem('userData', JSON.stringify(userData)); - return userData; - } catch (error) { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - } - } -); + IUser, + undefined, + { rejectValue: string } +>("user/getUserDetails", async (_, { rejectWithValue }) => { + try { + const response = await $api.get(USER_DETAILS_PATH); + const userData = response.data; + localStorage.setItem("userData", JSON.stringify(userData)); + return userData; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } +}); export const deleteUserAccount = createAsyncThunk< - undefined, - undefined, - { rejectValue: string } ->( - 'user/deleteUserAccount', - async (_, { rejectWithValue }) => { - try { - await $api.delete(USER_DETAILS_PATH); - localStorage.clear(); - return undefined; - } catch (error) { - const errorMessage = error.response.data; - return rejectWithValue(errorMessage); - } - } -); + undefined, + undefined, + { rejectValue: string } +>("user/deleteUserAccount", async (_, { rejectWithValue }) => { + try { + await $api.delete(USER_DETAILS_PATH); + localStorage.clear(); + return undefined; + } catch (error) { + const errorMessage = error.response.data; + return rejectWithValue(errorMessage); + } +}); export const changeUserProfile = createAsyncThunk< - IUser, - IUser, - { rejectValue: string } ->( - 'user/changeUserProfile', - async (payload, { rejectWithValue }) => { - try { - const response = await $api.put(CHANGE_USER_INFO_PATH, payload); - const newUserInfo = response.data; - localStorage.setItem('userData', JSON.stringify({ - ...userDataParsed, - ...newUserInfo - })); - return newUserInfo; - } catch (error) { - return rejectWithValue('Помилка'); - } - } -); + IUser, + IUser, + { rejectValue: string } +>("user/changeUserProfile", async (payload, { rejectWithValue }) => { + try { + const response = await $api.put(CHANGE_USER_INFO_PATH, payload); + const newUserInfo = response.data; + localStorage.setItem( + "userData", + JSON.stringify({ + ...userDataParsed, + ...newUserInfo, + }) + ); + return newUserInfo; + } catch (error) { + return rejectWithValue("Помилка"); + } +}); export const changeUserPassword = createAsyncThunk< - { old_password: string }, - PasswordChangeFormData, - { rejectValue: string } ->( - 'user/changeUserPassword', - async (payload, { rejectWithValue }) => { - try { - const response = await $api.post(CHANGE_USER_PASSWORD_PATH, payload); - return response.data; - } catch (error) { - return rejectWithValue("Введіть пароль, вказаний при реєстрації"); - } - } -); + { old_password: string }, + PasswordChangeFormData, + { rejectValue: string } +>("user/changeUserPassword", async (payload, { rejectWithValue }) => { + try { + const response = await $api.post(CHANGE_USER_PASSWORD_PATH, payload); + return response.data; + } catch (error) { + return rejectWithValue("Введіть пароль, вказаний при реєстрації"); + } +}); const initialState: UserState = { - user: null, - isLoading: false, - isRegistered: false, - isLoggedIn: false, - isLoggedOut: false, - isAccountDeleted: false, - isProfileChanged: false, - isPasswordChanged: false, - registerError: null, - loginError: null, - logoutError: null, - getDetailsError: null, - deleteUserAccountError: null, - confirmEmailError: null, - profileChangeError: null, - passwordChangeError: null, -} + user: null, + isLoading: false, + isRegistered: false, + isLoggedIn: false, + isLoggedOut: false, + isAccountDeleted: false, + isProfileChanged: false, + isPasswordChanged: false, + registerError: null, + loginError: null, + logoutError: null, + getDetailsError: null, + deleteUserAccountError: null, + confirmEmailError: null, + profileChangeError: null, + passwordChangeError: null, +}; const userSlice = createSlice({ - name: 'user', - initialState, - reducers: { - resetUserState: () => { - return initialState; - }, - resetDeleteUserAccountError: (state) => { - state.deleteUserAccountError = null; - }, - resetProfileEditErrors: (state) => { - state.profileChangeError = null; - state.passwordChangeError = null; - }, - setSuccessStatus: (state, action) => { - state.isProfileChanged = action.payload; - state.isPasswordChanged = action.payload; - }, - setIsLoggedOut: (state, action) => { - state.isLoggedOut = action.payload; - }, - setIsAccountDeleted: (state, action) => { - state.isAccountDeleted = action.payload; - }, - }, - extraReducers: (builder) => { - builder - .addCase(registerUser.pending, (state) => { - state.isLoading = true; - state.registerError = null; - }) - .addCase(registerUser.fulfilled, (state, action) => { - state.user = action.payload; - state.isLoading = false; - state.isLoggedOut = false; - state.isRegistered = true; - state.isAccountDeleted = false; - }) - .addCase(registerUser.rejected, (state, action) => { - state.registerError = action.payload; - state.isLoading = false; - }) + name: "user", + initialState, + reducers: { + resetUserState: () => initialState, + resetDeleteUserAccountError: (state) => { + state.deleteUserAccountError = null; + }, + resetProfileEditErrors: (state) => { + state.profileChangeError = null; + state.passwordChangeError = null; + }, + setSuccessStatus: (state, action) => { + state.isProfileChanged = action.payload; + state.isPasswordChanged = action.payload; + }, + setIsLoggedOut: (state, action) => { + state.isLoggedOut = action.payload; + }, + setIsAccountDeleted: (state, action) => { + state.isAccountDeleted = action.payload; + }, + }, + extraReducers: (builder) => { + builder + .addCase(registerUser.pending, (state) => { + state.isLoading = true; + state.registerError = null; + }) + .addCase(registerUser.fulfilled, (state, action) => { + state.user = action.payload; + state.isLoading = false; + state.isLoggedOut = false; + state.isRegistered = true; + state.isAccountDeleted = false; + }) + .addCase(registerUser.rejected, (state, action) => { + state.registerError = action.payload; + state.isLoading = false; + }) - .addCase(loginUser.pending, (state) => { - state.isLoading = true; - }) - .addCase(loginUser.fulfilled, (state, action) => { - state.user = { - ...state.user, - ...action.payload - } - state.isLoading = false; - state.isLoggedOut = false; - state.isAccountDeleted = false; - state.isLoggedIn = true; - }) - .addCase(loginUser.rejected, (state, action) => { - state.isLoading = false; - state.loginError = action.payload; - }) + .addCase(loginUser.pending, (state) => { + state.isLoading = true; + }) + .addCase(loginUser.fulfilled, (state, action) => { + state.user = { + ...state.user, + ...action.payload, + }; + state.isLoading = false; + state.isLoggedOut = false; + state.isAccountDeleted = false; + state.isLoggedIn = true; + }) + .addCase(loginUser.rejected, (state, action) => { + state.isLoading = false; + state.loginError = action.payload; + }) - .addCase(logoutUser.pending, (state) => { - state.isLoading = true; - }) - .addCase(logoutUser.fulfilled, (state) => { - state.isLoading = false; - state.isLoggedIn = false; - state.isLoggedOut = true; - state.isRegistered = false; - state.user = null; - }) - .addCase(logoutUser.rejected, (state, action) => { - state.isLoading = false; - state.logoutError = action.payload; - }) + .addCase(logoutUser.pending, (state) => { + state.isLoading = true; + }) + .addCase(logoutUser.fulfilled, (state) => { + state.isLoading = false; + state.isLoggedIn = false; + state.isLoggedOut = true; + state.isRegistered = false; + state.user = null; + }) + .addCase(logoutUser.rejected, (state, action) => { + state.isLoading = false; + state.logoutError = action.payload; + }) - .addCase(getUserDetails.pending, (state) => { - state.isLoading = true; - state.getDetailsError = null; - }) - .addCase(getUserDetails.fulfilled, (state, action) => { - state.user = { - ...state.user, - ...action.payload - }; - state.isLoading = false; - state.getDetailsError = null; - }) - .addCase(getUserDetails.rejected, (state, action) => { - state.isLoading = false; - state.getDetailsError = action.payload; - }) + .addCase(getUserDetails.pending, (state) => { + state.isLoading = true; + state.getDetailsError = null; + }) + .addCase(getUserDetails.fulfilled, (state, action) => { + state.user = { + ...state.user, + ...action.payload, + }; + state.isLoading = false; + state.getDetailsError = null; + }) + .addCase(getUserDetails.rejected, (state, action) => { + state.isLoading = false; + state.getDetailsError = action.payload; + }) - .addCase(deleteUserAccount.pending, (state) => { - state.isLoading = true; - }) - .addCase(deleteUserAccount.fulfilled, (state) => { - state.isLoading = false; - state.isLoggedIn = false; - state.isRegistered = false; - state.isAccountDeleted = true; - }) - .addCase(deleteUserAccount.rejected, (state, action) => { - state.isLoading = false; - state.deleteUserAccountError = action.payload; - }) + .addCase(deleteUserAccount.pending, (state) => { + state.isLoading = true; + }) + .addCase(deleteUserAccount.fulfilled, (state) => { + state.isLoading = false; + state.isLoggedIn = false; + state.isRegistered = false; + state.isAccountDeleted = true; + }) + .addCase(deleteUserAccount.rejected, (state, action) => { + state.isLoading = false; + state.deleteUserAccountError = action.payload; + }) - .addCase(changeUserProfile.pending, (state) => { - state.isLoading = true; - state.profileChangeError = null; - }) - .addCase(changeUserProfile.fulfilled, (state, action) => { - state.isLoading = false; - state.user = { - ...state.user, - ...action.payload - }; - state.isProfileChanged = true; - }) - .addCase(changeUserProfile.rejected, (state, action) => { - state.isLoading = false; - state.profileChangeError = action.payload - }) + .addCase(changeUserProfile.pending, (state) => { + state.isLoading = true; + state.profileChangeError = null; + }) + .addCase(changeUserProfile.fulfilled, (state, action) => { + state.isLoading = false; + state.user = { + ...state.user, + ...action.payload, + }; + state.isProfileChanged = true; + }) + .addCase(changeUserProfile.rejected, (state, action) => { + state.isLoading = false; + state.profileChangeError = action.payload; + }) - .addCase(changeUserPassword.pending, (state) => { - state.isLoading = true; - state.passwordChangeError = null; - }) - .addCase(changeUserPassword.fulfilled, (state) => { - state.isLoading = false; - state.isPasswordChanged = true; - }) - .addCase(changeUserPassword.rejected, (state, action) => { - state.isLoading = false; - state.passwordChangeError = action.payload - }) - } + .addCase(changeUserPassword.pending, (state) => { + state.isLoading = true; + state.passwordChangeError = null; + }) + .addCase(changeUserPassword.fulfilled, (state) => { + state.isLoading = false; + state.isPasswordChanged = true; + }) + .addCase(changeUserPassword.rejected, (state, action) => { + state.isLoading = false; + state.passwordChangeError = action.payload; + }); + }, }); export const { - resetUserState, - resetDeleteUserAccountError, - setSuccessStatus, - resetProfileEditErrors, - setIsLoggedOut, - setIsAccountDeleted, + resetUserState, + resetDeleteUserAccountError, + setSuccessStatus, + resetProfileEditErrors, + setIsLoggedOut, + setIsAccountDeleted, } = userSlice.actions; -export default userSlice.reducer; \ No newline at end of file +export default userSlice.reducer; diff --git a/src/store/walletSlice.ts b/src/store/walletSlice.ts index e95dd78..9014694 100644 --- a/src/store/walletSlice.ts +++ b/src/store/walletSlice.ts @@ -124,9 +124,7 @@ const walletSlice = createSlice({ name: "wallet", initialState, reducers: { - resetWalletState: (state) => { - return initialState; - }, + resetWalletState: (state) => initialState, resetError: (state) => { state.error = null; }, diff --git a/types/bankdata.ts b/types/bankdata.ts index e1ddb10..63fcb98 100644 --- a/types/bankdata.ts +++ b/types/bankdata.ts @@ -3,4 +3,4 @@ export interface IBankData { owner: number; wallettitle: string; file: any; -} \ No newline at end of file +} diff --git a/types/category.ts b/types/category.ts index 4703d4b..dd90f44 100644 --- a/types/category.ts +++ b/types/category.ts @@ -1,10 +1,10 @@ import { FilterByTypeOfOutlayOptions, TypeOfOutlay } from "./common"; export interface ICategory { - id?: number, - title: string, - type_of_outlay: TypeOfOutlay, - owner: number + id?: number; + title: string; + type_of_outlay: TypeOfOutlay; + owner: number; } export interface ICategoryWithTotalAmount extends ICategory { @@ -29,4 +29,4 @@ export type CategoryState = { isEditCategorySuccess: boolean; isDeleteCategorySuccess: boolean; isEditCategoryOpen: boolean; -} \ No newline at end of file +}; diff --git a/types/common.ts b/types/common.ts index 1ae80b3..c9b2e94 100644 --- a/types/common.ts +++ b/types/common.ts @@ -12,15 +12,15 @@ export interface IFilterButton { buttonName: string; isActive: boolean; typeOfOutlay?: TypeOfOutlay | ""; -}; +} export interface ISwitchButton { buttonName: string; onTabClick: () => void; isActive: boolean; -}; +} export type SelectOptions = { value: number; label: string; -} \ No newline at end of file +}; diff --git a/types/statistics.ts b/types/statistics.ts index cda6b26..2f1c094 100644 --- a/types/statistics.ts +++ b/types/statistics.ts @@ -6,8 +6,8 @@ type DoughnutChartData = { allTransactions: Transactions; categoryTransactions: Transactions[]; categories: ICategory[]; - data: string[], - totalAmount: string, + data: string[]; + totalAmount: string; }; export type StatisticsState = { @@ -21,4 +21,4 @@ export type StatisticsState = { }; isLoading: boolean; error: string | null; -}; \ No newline at end of file +}; diff --git a/types/transactions.ts b/types/transactions.ts index 824f94d..8014c86 100644 --- a/types/transactions.ts +++ b/types/transactions.ts @@ -14,7 +14,7 @@ export interface ITransaction { export type Transactions = { [date: string]: ITransaction[]; -} +}; export type TransactionState = { filterByTypeOfOutlay: FilterByTypeOfOutlayOptions; @@ -32,4 +32,4 @@ export type TransactionState = { isEditTransactionSuccess: boolean; isDeleteTransactionSuccess: boolean; isEditTransactionOpen: boolean; -} \ No newline at end of file +}; diff --git a/types/user.ts b/types/user.ts index 88807c1..5454d8f 100644 --- a/types/user.ts +++ b/types/user.ts @@ -1,9 +1,9 @@ export interface IUser { - id?: number, - first_name: string, - last_name: string, - email?: string, - is_confirm_email?: boolean, + id?: number; + first_name: string; + last_name: string; + email?: string; + is_confirm_email?: boolean; token?: string; } @@ -24,20 +24,20 @@ export type UserState = { confirmEmailError: string | null; profileChangeError: string | null; passwordChangeError: string | null; -} +}; export type RegisterFormData = { - first_name: string, - last_name: string, - email: string, - password: string, - password2: string, -} + first_name: string; + last_name: string; + email: string; + password: string; + password2: string; +}; export type LoginFormData = { - email: string, - password: string, -} + email: string; + password: string; +}; export interface DataEntryFormData { availableCash: string; @@ -50,4 +50,4 @@ export interface PasswordChangeFormData { old_password: string; new_password: string; new_password_2: string; -} \ No newline at end of file +} diff --git a/types/wallet.ts b/types/wallet.ts index 55f2b36..6949999 100644 --- a/types/wallet.ts +++ b/types/wallet.ts @@ -1,14 +1,14 @@ type TypeOfAccount = "cash" | "bank"; export interface IWallet { - id?: number, - title: string, - amount: string, - type_of_account: TypeOfAccount, - owner: number, + id?: number; + title: string; + amount: string; + type_of_account: TypeOfAccount; + owner: number; } export interface WalletFormData { - title: string, - amount: string, -} \ No newline at end of file + title: string; + amount: string; +} diff --git a/webpack.config.ts b/webpack.config.ts index ac3dfd8..6420032 100644 --- a/webpack.config.ts +++ b/webpack.config.ts @@ -1,23 +1,23 @@ -import path from 'path'; -import { buildWebpacConfig } from './config/build/buildWebpackConfig'; +import path from "path"; +import { buildWebpacConfig } from "./config/build/buildWebpackConfig"; -import { BuildEnv, BuildPaths } from './config/types/types'; +import { BuildEnv, BuildPaths } from "./config/types/types"; export default (env: BuildEnv) => { - const mode = env.mode || 'development' - const isDev = mode === 'development' + const mode = env.mode || "development"; + const isDev = mode === "development"; const port = env.port || 3000; const paths: BuildPaths = { - entry: path.resolve(__dirname, 'src', 'index.tsx'), - output: path.resolve(__dirname, 'build'), - html: path.resolve(__dirname, 'public', 'index.html'), - } + entry: path.resolve(__dirname, "src", "index.tsx"), + output: path.resolve(__dirname, "build"), + html: path.resolve(__dirname, "public", "index.html"), + }; return buildWebpacConfig({ mode, paths, isDev, port, - }) -} \ No newline at end of file + }); +}; From f1c11621e107da99fef121008a302b77d9063808 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Thu, 13 Jul 2023 21:11:40 +0300 Subject: [PATCH 15/16] refactor: remaining linter problems --- .eslintrc.json | 8 +- config/build/buildDevServer.ts | 6 +- config/build/buildLoaders.ts | 6 +- config/build/buildPlugins.ts | 4 +- config/build/buildResolve.ts | 4 +- config/build/buildWebpackConfig.ts | 14 +- package.json | 10 +- src/components/atoms/box/Box.styled.ts | 7 +- src/components/atoms/button/Button.styled.ts | 7 +- src/components/atoms/button/ButtonLink.ts | 6 +- src/components/atoms/button/ButtonPopup.ts | 4 +- .../atoms/button/ButtonTransparent.styled.ts | 7 +- .../atoms/container/Container.styled.ts | 4 +- src/components/atoms/form/Form.styled.ts | 6 +- src/components/atoms/img/Img.styled.ts | 4 +- src/components/atoms/input/Input.styled.ts | 6 +- .../atoms/input/InputDate.styled.ts | 6 +- src/components/atoms/label/Label.styled.ts | 6 +- src/components/atoms/link/Link.styled.ts | 4 +- src/components/atoms/link/LinkMenu.styled.ts | 6 +- src/components/atoms/list/List.styled.ts | 6 +- src/components/atoms/list/ListItem.styled.ts | 6 +- .../atoms/typography/Typography.styled.ts | 7 +- .../molecules/base-field/BaseField.tsx | 11 +- .../molecules/category/Category.tsx | 6 +- .../molecules/category/CategoryWrapper.ts | 6 +- .../molecules/charts/DoughnutChart.tsx | 4 +- src/components/molecules/charts/LineChart.tsx | 4 +- .../molecules/charts/doughnutChartConfig.ts | 6 +- .../molecules/charts/lineChartConfig.ts | 7 +- .../molecules/header/Header.styled.ts | 10 +- src/components/molecules/header/Header.tsx | 14 +- .../molecules/popup/Popup.styled.ts | 8 +- .../molecules/popup/PopupDeleteAccount.tsx | 10 +- .../molecules/popup/PopupEditWallet.tsx | 16 +- .../popup/add-wallet/AddBankdataTab.tsx | 12 +- .../popup/add-wallet/AddWalletTab.tsx | 12 +- .../popup/add-wallet/BankdataInfoMessage.tsx | 4 +- .../popup/add-wallet/PopupAddWallet.tsx | 12 +- .../popup/edit-profile/ChangePasswordTab.tsx | 8 +- .../popup/edit-profile/EditProfileTab.tsx | 8 +- .../popup/edit-profile/PopupEditProfile.tsx | 12 +- .../molecules/tabs/filter/TabFilter.styled.ts | 14 +- .../molecules/tabs/filter/TabFilter.tsx | 36 ++- .../molecules/tabs/switch/TabSwitch.styled.ts | 14 +- .../molecules/tabs/switch/TabSwitch.tsx | 14 +- .../molecules/tabs/tabWrapperStyles.ts | 4 +- .../molecules/transaction/Transaction.tsx | 8 +- .../transaction/TransactionWrapper.ts | 6 +- .../molecules/wallet/Wallet.styled.ts | 10 +- src/components/molecules/wallet/Wallet.tsx | 6 +- .../pages/2FA/TwoFactorAuthenticationPage.tsx | 24 +- .../pages/categories/AddCategory.tsx | 10 +- .../pages/categories/Categories.tsx | 14 +- .../pages/categories/CategoriesPage.styled.ts | 6 +- .../pages/categories/CategoriesPage.tsx | 4 +- .../pages/categories/EditCategory.tsx | 12 +- src/components/pages/data/DataEntryPage.tsx | 16 +- src/components/pages/home/HomePage.styled.ts | 3 +- src/components/pages/home/HomePage.tsx | 4 +- src/components/pages/home/Statistics.tsx | 8 +- src/components/pages/home/Transitions.tsx | 23 +- src/components/pages/home/Wallets.tsx | 10 +- src/components/pages/login/LoginPage.tsx | 16 +- .../pages/not-found/NotFoundPage.tsx | 2 +- .../pages/password-recovery/EmailStep.tsx | 14 +- .../password-recovery/NewPasswordStep.tsx | 12 +- .../pages/password-recovery/ResetLinkStep.tsx | 10 +- .../pages/register/RegisterPage.tsx | 16 +- .../pages/statistics/DoughnutChartSection.tsx | 8 +- .../pages/statistics/LineChartSection.tsx | 6 +- .../pages/statistics/StatisticsHeader.tsx | 4 +- .../pages/statistics/StatisticsPage.styled.ts | 6 +- .../pages/statistics/StatisticsPage.tsx | 4 +- .../pages/transactions/AddTransaction.tsx | 42 +-- .../pages/transactions/DatePicker.tsx | 18 +- .../pages/transactions/EditTransaction.tsx | 24 +- .../pages/transactions/Transactions.tsx | 25 +- .../transactions/TransactionsPage.styled.ts | 4 +- .../pages/transactions/TransactionsPage.tsx | 4 +- src/components/pages/welcome/WelcomePage.tsx | 22 +- src/contexts/PopupContext.tsx | 39 ++- src/global.d.ts | 3 - src/index.tsx | 2 +- src/shared/styles/commonStyles.ts | 4 +- src/shared/styles/fontStyles.ts | 4 +- src/shared/styles/globalStyles.ts | 6 +- src/shared/styles/iconStyles.ts | 4 +- src/shared/utils/field-rules/amount.ts | 4 +- src/shared/utils/field-rules/details.ts | 44 +-- src/shared/utils/field-rules/email.ts | 4 +- src/shared/utils/field-rules/name.ts | 4 +- src/shared/utils/field-rules/title.ts | 4 +- .../calculateCategoriesWithTotalAmount.ts | 4 +- .../utils/statistics/calculateTotalAmount.ts | 4 +- .../statistics/generateNewLineChartData.ts | 4 +- src/shared/utils/store/updateCategories.ts | 4 +- .../utils/store/updateChartCategories.ts | 4 +- .../store/updateChartCategoryTransactions.ts | 4 +- .../utils/store/updateChartTransactions.ts | 4 +- src/shared/utils/store/updateTransactions.ts | 4 +- .../utils/transactions/filterTransactions.ts | 4 +- .../transactions/formatTransactionTime.ts | 4 +- .../utils/transactions/setSelectOptions.ts | 4 +- src/store/bankDataSlice.ts | 2 +- src/store/categorySlice.ts | 4 +- src/store/statisticsSlice.ts | 6 +- src/store/transactionSlice.ts | 2 +- src/store/walletSlice.ts | 2 +- webpack.config.ts | 3 +- yarn.lock | 253 ++++++++++++++++-- 111 files changed, 782 insertions(+), 453 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index 2ff0132..dd54106 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -37,6 +37,12 @@ } ], "no-undef": "off", - "no-param-reassign": "off" + "no-param-reassign": "off", + "no-unused-vars": "off", + "no-nested-ternary": "off", + "radix": "off", + "consistent-return": "off", + "react/prop-types": "off", + "react/jsx-props-no-spreading": "off" } } diff --git a/config/build/buildDevServer.ts b/config/build/buildDevServer.ts index b9d564b..d786ede 100644 --- a/config/build/buildDevServer.ts +++ b/config/build/buildDevServer.ts @@ -2,9 +2,7 @@ import type { Configuration as DevServerConfiguration } from "webpack-dev-server import { BuildOptions } from "../types/types"; -export const buildDevServer = ( - options: BuildOptions -): DevServerConfiguration => { +const buildDevServer = (options: BuildOptions): DevServerConfiguration => { const { paths } = options; return { @@ -17,3 +15,5 @@ export const buildDevServer = ( }, }; }; + +export default buildDevServer; diff --git a/config/build/buildLoaders.ts b/config/build/buildLoaders.ts index f775551..b71fbdc 100644 --- a/config/build/buildLoaders.ts +++ b/config/build/buildLoaders.ts @@ -3,9 +3,7 @@ import MiniCssExtractPlugin from "mini-css-extract-plugin"; import { BuildOptions } from "../types/types"; -export const buildLoaders = ({ - isDev, -}: BuildOptions): webpack.RuleSetRule[] => { +const buildLoaders = ({ isDev }: BuildOptions): webpack.RuleSetRule[] => { const typescriptLoader = { test: /\.tsx?$/, use: "ts-loader", @@ -65,3 +63,5 @@ export const buildLoaders = ({ babelLoader, ]; }; + +export default buildLoaders; diff --git a/config/build/buildPlugins.ts b/config/build/buildPlugins.ts index 19e78eb..87f282c 100644 --- a/config/build/buildPlugins.ts +++ b/config/build/buildPlugins.ts @@ -5,7 +5,7 @@ import ReactRefreshWebpackPlugin from "@pmmmwh/react-refresh-webpack-plugin"; import { BuildOptions } from "../types/types"; -export const buildPlugins = ( +const buildPlugins = ( options: BuildOptions ): webpack.WebpackPluginInstance[] => { const { paths } = options; @@ -29,3 +29,5 @@ export const buildPlugins = ( return plugins; }; + +export default buildPlugins; diff --git a/config/build/buildResolve.ts b/config/build/buildResolve.ts index cb0244c..b197587 100644 --- a/config/build/buildResolve.ts +++ b/config/build/buildResolve.ts @@ -1,5 +1,7 @@ import webpack from "webpack"; -export const buildResolve = (): webpack.ResolveOptions => ({ +const buildResolve = (): webpack.ResolveOptions => ({ extensions: [".tsx", ".ts", ".js"], }); + +export default buildResolve; diff --git a/config/build/buildWebpackConfig.ts b/config/build/buildWebpackConfig.ts index b5ebf43..6caaed7 100644 --- a/config/build/buildWebpackConfig.ts +++ b/config/build/buildWebpackConfig.ts @@ -1,15 +1,13 @@ import webpack from "webpack"; -import { buildLoaders } from "./buildLoaders"; -import { buildResolve } from "./buildResolve"; -import { buildPlugins } from "./buildPlugins"; -import { buildDevServer } from "./buildDevServer"; +import buildLoaders from "./buildLoaders"; +import buildResolve from "./buildResolve"; +import buildPlugins from "./buildPlugins"; +import buildDevServer from "./buildDevServer"; import { BuildOptions } from "../types/types"; -export const buildWebpacConfig = ( - options: BuildOptions -): webpack.Configuration => { +const buildWebpacConfig = (options: BuildOptions): webpack.Configuration => { const { paths, mode, isDev } = options; return { @@ -29,3 +27,5 @@ export const buildWebpacConfig = ( plugins: buildPlugins(options), }; }; + +export default buildWebpacConfig; diff --git a/package.json b/package.json index 3930fdb..4b186f9 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,6 @@ "@babel/preset-env": "^7.20.2", "@commitlint/cli": "^17.4.4", "@commitlint/config-conventional": "^17.4.4", - "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10", "@svgr/webpack": "^6.5.1", "@types/node": "^18.15.3", "@types/react": "^18.0.28", @@ -40,28 +39,28 @@ "eslint-plugin-prettier": "^4.2.1", "eslint-plugin-react": "^7.32.2", "file-loader": "^6.2.0", - "html-webpack-plugin": "^5.5.0", "husky": "^8.0.3", "json-server": "^0.17.3", - "mini-css-extract-plugin": "^2.7.3", "prettier": "^2.8.8", "react-refresh": "^0.14.0", "style-loader": "^3.3.2", "ts-loader": "^9.4.2", "ts-node": "^10.9.1", "typescript": "*", - "webpack": "^5.76.2", "webpack-cli": "^5.0.1", "webpack-dev-server": "^4.12.0" }, "dependencies": { "@hookform/resolvers": "^3.0.1", + "@pmmmwh/react-refresh-webpack-plugin": "0.5.10", "@react-hook/hotkey": "^3.1.0", "@reduxjs/toolkit": "^1.9.3", "axios": "^1.3.4", "chart.js": "^4.2.1", "chartjs-plugin-datalabels": "^2.2.0", "date-fns": "^2.29.3", + "html-webpack-plugin": "5.5.0", + "mini-css-extract-plugin": "2.7.3", "react": "^18.2.0", "react-currency-input-field": "^3.6.10", "react-datepicker": "^4.11.0", @@ -70,6 +69,7 @@ "react-redux": "^8.0.5", "react-router-dom": "^6.9.0", "react-select": "^5.7.2", - "styled-components": "^5.3.9" + "styled-components": "^5.3.9", + "webpack": "5.76.2" } } diff --git a/src/components/atoms/box/Box.styled.ts b/src/components/atoms/box/Box.styled.ts index 853bd4d..74d9e80 100644 --- a/src/components/atoms/box/Box.styled.ts +++ b/src/components/atoms/box/Box.styled.ts @@ -1,7 +1,6 @@ import styled from "styled-components"; -import { - commonStyles, +import commonStyles, { commonStylesProps, } from "../../../shared/styles/commonStyles"; @@ -26,7 +25,7 @@ type BoxProps = commonStylesProps & { overflow?: string; }; -export const Box = styled.div` +const Box = styled.div` ${commonStyles}; border: ${({ border }) => border || undefined}; border-top: ${({ borderTop }) => borderTop || undefined}; @@ -45,3 +44,5 @@ export const Box = styled.div` flex: ${({ flex }) => flex || undefined}; flex-basis: ${({ flexBasis }) => flexBasis || undefined}; `; + +export default Box; diff --git a/src/components/atoms/button/Button.styled.ts b/src/components/atoms/button/Button.styled.ts index 4e65785..a4d8281 100644 --- a/src/components/atoms/button/Button.styled.ts +++ b/src/components/atoms/button/Button.styled.ts @@ -1,7 +1,6 @@ import styled, { css } from "styled-components"; -import { - commonStyles, +import commonStyles, { commonStylesProps, } from "../../../shared/styles/commonStyles"; @@ -62,7 +61,9 @@ export const buttonStyles = css` `} `; -export const Button = styled.button` +const Button = styled.button` ${commonStyles} ${buttonStyles} `; + +export default Button; diff --git a/src/components/atoms/button/ButtonLink.ts b/src/components/atoms/button/ButtonLink.ts index c994490..dab90c9 100644 --- a/src/components/atoms/button/ButtonLink.ts +++ b/src/components/atoms/button/ButtonLink.ts @@ -1,10 +1,10 @@ import styled from "styled-components"; -import { ButtonTransparent } from "./ButtonTransparent.styled"; +import ButtonTransparent from "./ButtonTransparent.styled"; import COLORS from "../../../shared/styles/variables"; -export const ButtonLink = styled(ButtonTransparent)` +const ButtonLink = styled(ButtonTransparent)` color: ${(props) => props.color || COLORS.PRIMARY}; font-weight: 600; @@ -12,3 +12,5 @@ export const ButtonLink = styled(ButtonTransparent)` text-decoration: underline; } `; + +export default ButtonLink; diff --git a/src/components/atoms/button/ButtonPopup.ts b/src/components/atoms/button/ButtonPopup.ts index 7309911..13a915a 100644 --- a/src/components/atoms/button/ButtonPopup.ts +++ b/src/components/atoms/button/ButtonPopup.ts @@ -2,7 +2,7 @@ import styled from "styled-components"; import COLORS from "../../../shared/styles/variables"; -export const ButtonPopup = styled.button<{ isActive: boolean }>` +const ButtonPopup = styled.button<{ isActive: boolean }>` color: ${(props) => props.color || COLORS.ALMOST_BLACK_FOR_TEXT}; font-weight: ${(props) => (props.isActive ? "700" : "400")}; font-size: 12px; @@ -15,3 +15,5 @@ export const ButtonPopup = styled.button<{ isActive: boolean }>` ${(props) => (props.isActive ? COLORS.PRIMARY_HOVER : COLORS.DIVIDER)}; cursor: pointer; `; + +export default ButtonPopup; diff --git a/src/components/atoms/button/ButtonTransparent.styled.ts b/src/components/atoms/button/ButtonTransparent.styled.ts index a7f66bd..b9cff7e 100644 --- a/src/components/atoms/button/ButtonTransparent.styled.ts +++ b/src/components/atoms/button/ButtonTransparent.styled.ts @@ -1,7 +1,8 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; -export const ButtonTransparent = styled.button` +import commonStyles from "../../../shared/styles/commonStyles"; + +const ButtonTransparent = styled.button` ${commonStyles} margin: 0; padding: 0; @@ -10,3 +11,5 @@ export const ButtonTransparent = styled.button` background: transparent; display: flex; `; + +export default ButtonTransparent; diff --git a/src/components/atoms/container/Container.styled.ts b/src/components/atoms/container/Container.styled.ts index f8a7ed0..8074c5d 100644 --- a/src/components/atoms/container/Container.styled.ts +++ b/src/components/atoms/container/Container.styled.ts @@ -5,7 +5,9 @@ type ContainerProps = { overflowX?: string; }; -export const Container = styled.div` +const Container = styled.div` display: ${({ display }) => display || undefined}; overflow-x: ${({ overflowX }) => overflowX || undefined}; `; + +export default Container; diff --git a/src/components/atoms/form/Form.styled.ts b/src/components/atoms/form/Form.styled.ts index 1814523..5d0dedf 100644 --- a/src/components/atoms/form/Form.styled.ts +++ b/src/components/atoms/form/Form.styled.ts @@ -1,6 +1,6 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; +import commonStyles from "../../../shared/styles/commonStyles"; import COLORS from "../../../shared/styles/variables"; @@ -11,7 +11,7 @@ type FormProps = { alignItems?: string; }; -export const Form = styled.form` +const Form = styled.form` ${commonStyles}; max-width: ${({ maxWidth }) => maxWidth || undefined}; @@ -19,3 +19,5 @@ export const Form = styled.form` color: ${({ color }) => color || COLORS.WHITE}; align-items: ${({ alignItems }) => alignItems || undefined}; `; + +export default Form; diff --git a/src/components/atoms/img/Img.styled.ts b/src/components/atoms/img/Img.styled.ts index 2d1a108..4ddd6c6 100644 --- a/src/components/atoms/img/Img.styled.ts +++ b/src/components/atoms/img/Img.styled.ts @@ -12,7 +12,7 @@ type ImgProps = { display?: string; }; -export const Img = styled.img` +const Img = styled.img` max-width: ${({ maxWidth }) => maxWidth || undefined}; max-height: ${({ maxHeight }) => maxHeight || undefined}; position: ${({ position }) => position || undefined}; @@ -23,3 +23,5 @@ export const Img = styled.img` padding: ${({ p }) => p || "0px 0px 0px 0px"}; display: ${({ display }) => display || undefined}; `; + +export default Img; diff --git a/src/components/atoms/input/Input.styled.ts b/src/components/atoms/input/Input.styled.ts index c1257e0..3437916 100644 --- a/src/components/atoms/input/Input.styled.ts +++ b/src/components/atoms/input/Input.styled.ts @@ -1,10 +1,10 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; +import commonStyles from "../../../shared/styles/commonStyles"; import COLORS from "../../../shared/styles/variables"; -export const Input = styled.input` +const Input = styled.input` width: 100%; padding: 12px 16px; ${commonStyles} @@ -28,3 +28,5 @@ export const Input = styled.input` cursor: not-allowed; } `; + +export default Input; diff --git a/src/components/atoms/input/InputDate.styled.ts b/src/components/atoms/input/InputDate.styled.ts index 052af4f..33fd99f 100644 --- a/src/components/atoms/input/InputDate.styled.ts +++ b/src/components/atoms/input/InputDate.styled.ts @@ -1,10 +1,10 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; +import commonStyles from "../../../shared/styles/commonStyles"; import COLORS from "../../../shared/styles/variables"; -export const DateInput = styled.button` +const DateInput = styled.button` ${commonStyles} padding: 10px 14px; background: ${COLORS.WHITE}; @@ -18,3 +18,5 @@ export const DateInput = styled.button` outline: none; } `; + +export default DateInput; diff --git a/src/components/atoms/label/Label.styled.ts b/src/components/atoms/label/Label.styled.ts index 2a807ac..c126bc9 100644 --- a/src/components/atoms/label/Label.styled.ts +++ b/src/components/atoms/label/Label.styled.ts @@ -1,11 +1,13 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; +import commonStyles from "../../../shared/styles/commonStyles"; -export const Label = styled.label` +const Label = styled.label` font-size: 16px; font-weight: 500; display: block; margin-bottom: 8px; ${commonStyles} `; + +export default Label; diff --git a/src/components/atoms/link/Link.styled.ts b/src/components/atoms/link/Link.styled.ts index fcc78c6..2dd666c 100644 --- a/src/components/atoms/link/Link.styled.ts +++ b/src/components/atoms/link/Link.styled.ts @@ -20,7 +20,7 @@ type LinkProps = { outline?: string; }; -export const Link = styled(RouterLink)` +const Link = styled(RouterLink)` font-weight: ${({ fw }) => fw || "700px"}; font-size: ${({ fz }) => fz || "18px"}; border-radius: ${({ borderRadius }) => borderRadius || "16px"}; @@ -40,3 +40,5 @@ export const Link = styled(RouterLink)` text-decoration: underline; } `; + +export default Link; diff --git a/src/components/atoms/link/LinkMenu.styled.ts b/src/components/atoms/link/LinkMenu.styled.ts index 7bde050..3ff327b 100644 --- a/src/components/atoms/link/LinkMenu.styled.ts +++ b/src/components/atoms/link/LinkMenu.styled.ts @@ -2,11 +2,11 @@ import { Link as RouterLink } from "react-router-dom"; import styled from "styled-components"; -import { blackSVGtoWhite } from "../../../shared/styles/iconStyles"; +import blackSVGtoWhite from "../../../shared/styles/iconStyles"; import COLORS from "../../../shared/styles/variables"; -export const LinkMenu = styled(RouterLink)` +const LinkMenu = styled(RouterLink)` padding: 10px 28px; border-radius: 40px; display: inline-flex; @@ -48,3 +48,5 @@ export const LinkMenu = styled(RouterLink)` font-weight: 600; } `; + +export default LinkMenu; diff --git a/src/components/atoms/list/List.styled.ts b/src/components/atoms/list/List.styled.ts index a42c2f4..df9c8d1 100644 --- a/src/components/atoms/list/List.styled.ts +++ b/src/components/atoms/list/List.styled.ts @@ -1,11 +1,13 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; +import commonStyles from "../../../shared/styles/commonStyles"; -export const List = styled.ul` +const List = styled.ul` margin: 0; padding: 0; ${commonStyles} list-style: none; `; + +export default List; diff --git a/src/components/atoms/list/ListItem.styled.ts b/src/components/atoms/list/ListItem.styled.ts index 98edcb2..babf51c 100644 --- a/src/components/atoms/list/ListItem.styled.ts +++ b/src/components/atoms/list/ListItem.styled.ts @@ -1,7 +1,9 @@ import styled from "styled-components"; -import { commonStyles } from "../../../shared/styles/commonStyles"; +import commonStyles from "../../../shared/styles/commonStyles"; -export const ListItem = styled.li` +const ListItem = styled.li` ${commonStyles} `; + +export default ListItem; diff --git a/src/components/atoms/typography/Typography.styled.ts b/src/components/atoms/typography/Typography.styled.ts index 6c6e401..b6dd2ba 100644 --- a/src/components/atoms/typography/Typography.styled.ts +++ b/src/components/atoms/typography/Typography.styled.ts @@ -1,7 +1,6 @@ import styled, { css } from "styled-components"; -import { - commonStyles, +import commonStyles, { commonStylesProps, } from "../../../shared/styles/commonStyles"; @@ -11,7 +10,7 @@ type TypographyProps = commonStylesProps & { lh?: string; }; -export const Typography = styled.p((props) => { +const Typography = styled.p((props) => { const { textAlign, letterSpacing, lh } = props; return css` @@ -21,3 +20,5 @@ export const Typography = styled.p((props) => { line-height: ${lh || undefined}; `; }); + +export default Typography; diff --git a/src/components/molecules/base-field/BaseField.tsx b/src/components/molecules/base-field/BaseField.tsx index fb293c1..8788d6d 100644 --- a/src/components/molecules/base-field/BaseField.tsx +++ b/src/components/molecules/base-field/BaseField.tsx @@ -1,8 +1,9 @@ import { FieldErrors, UseFormRegisterReturn } from "react-hook-form"; -import { Box } from "../../atoms/box/Box.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import { Input } from "../../atoms/input/Input.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; + +import Box from "../../atoms/box/Box.styled"; +import Label from "../../atoms/label/Label.styled"; +import Input from "../../atoms/input/Input.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import VisibilityOff from "../../../shared/assets/icons/visibility-off.svg"; import VisibilityOn from "../../../shared/assets/icons/visibility-on.svg"; @@ -82,7 +83,7 @@ const BaseField: React.FC = ({ height="14px" width="300px" mb="20px"> - {errors?.[name] && <>{errors?.[name]?.message || "Error!"}} + {errors?.[name]?.message && "Error!"} ); diff --git a/src/components/molecules/category/Category.tsx b/src/components/molecules/category/Category.tsx index a110eba..83d9b4c 100644 --- a/src/components/molecules/category/Category.tsx +++ b/src/components/molecules/category/Category.tsx @@ -1,8 +1,8 @@ import { useAppSelector } from "../../../store/hooks"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { CategoryWrapper } from "./CategoryWrapper"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import CategoryWrapper from "./CategoryWrapper"; import IncomeIcon from "../../../shared/assets/icons/income.svg"; import ExpenseIcon from "../../../shared/assets/icons/expense.svg"; diff --git a/src/components/molecules/category/CategoryWrapper.ts b/src/components/molecules/category/CategoryWrapper.ts index 583e7a4..30141cd 100644 --- a/src/components/molecules/category/CategoryWrapper.ts +++ b/src/components/molecules/category/CategoryWrapper.ts @@ -1,10 +1,10 @@ import styled from "styled-components"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import COLORS from "../../../shared/styles/variables"; -export const CategoryWrapper = styled(Box)` +const CategoryWrapper = styled(Box)` display: flex; align-items: center; gap: 16px; @@ -20,3 +20,5 @@ export const CategoryWrapper = styled(Box)` } } `; + +export default CategoryWrapper; diff --git a/src/components/molecules/charts/DoughnutChart.tsx b/src/components/molecules/charts/DoughnutChart.tsx index 758e62e..67e6ea2 100644 --- a/src/components/molecules/charts/DoughnutChart.tsx +++ b/src/components/molecules/charts/DoughnutChart.tsx @@ -5,9 +5,9 @@ import ChartDataLabels from "chartjs-plugin-datalabels"; import { useAppSelector } from "../../../store/hooks"; -import { getDoughnutChartConfig } from "./doughnutChartConfig"; +import getDoughnutChartConfig from "./doughnutChartConfig"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import COLORS from "../../../shared/styles/variables"; diff --git a/src/components/molecules/charts/LineChart.tsx b/src/components/molecules/charts/LineChart.tsx index 9ee927b..a60ff7c 100644 --- a/src/components/molecules/charts/LineChart.tsx +++ b/src/components/molecules/charts/LineChart.tsx @@ -31,12 +31,12 @@ const LineChart: React.FC<{ data: number[] }> = ({ data }) => { ); useEffect(() => { - const labels = generateLabels( + const generatedLabels = generateLabels( allOutlaysChart.categoryTransactions, filterByDays ); - setLabels(labels); + setLabels(generatedLabels); setPointValues( filterByDays, diff --git a/src/components/molecules/charts/doughnutChartConfig.ts b/src/components/molecules/charts/doughnutChartConfig.ts index b22fa2c..6f5e67f 100644 --- a/src/components/molecules/charts/doughnutChartConfig.ts +++ b/src/components/molecules/charts/doughnutChartConfig.ts @@ -7,7 +7,7 @@ const calculatePercentage = (value: number, ctx: any): string => { const dataArr = ctx.chart.data.datasets[0].data; let percentage: number = 0; - dataArr.map((data: number) => { + dataArr.forEach((data: number) => { if (typeof data === "number") { sum += data; } @@ -20,7 +20,7 @@ const calculatePercentage = (value: number, ctx: any): string => { return `${percentage}%`; }; -export const getDoughnutChartConfig = ( +const getDoughnutChartConfig = ( data: string[], labels: string[] ): { chartData: ChartData; chartOptions: ChartOptions } => { @@ -98,3 +98,5 @@ export const getDoughnutChartConfig = ( return { chartData, chartOptions }; }; + +export default getDoughnutChartConfig; diff --git a/src/components/molecules/charts/lineChartConfig.ts b/src/components/molecules/charts/lineChartConfig.ts index 2fed5be..51fc092 100644 --- a/src/components/molecules/charts/lineChartConfig.ts +++ b/src/components/molecules/charts/lineChartConfig.ts @@ -12,7 +12,10 @@ export const generateLabels = ( const labels: string[] = []; if (Object.keys(categoryTransactions)?.length > 0) { - for (let i = 0; i < parseInt(filterByDays); i++) { + const daysCount = parseInt(filterByDays); + const daysArray = Array.from({ length: daysCount }).fill(null); + + daysArray.forEach((_, i) => { const date = new Date(); date.setDate(date.getDate() - i); @@ -22,7 +25,7 @@ export const generateLabels = ( }); labels.push(label); - } + }); } return labels; diff --git a/src/components/molecules/header/Header.styled.ts b/src/components/molecules/header/Header.styled.ts index 357911c..86c5612 100644 --- a/src/components/molecules/header/Header.styled.ts +++ b/src/components/molecules/header/Header.styled.ts @@ -1,12 +1,12 @@ import styled from "styled-components"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { List } from "../../atoms/list/List.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import List from "../../atoms/list/List.styled"; import COLORS from "../../../shared/styles/variables"; -export const HeaderWrapper = styled.nav` +const HeaderWrapper = styled.nav` display: flex; align-items: center; padding: 12px 50px; @@ -34,3 +34,5 @@ export const HeaderWrapper = styled.nav` align-items: center; } `; + +export default HeaderWrapper; diff --git a/src/components/molecules/header/Header.tsx b/src/components/molecules/header/Header.tsx index ca288ed..d7e0b42 100644 --- a/src/components/molecules/header/Header.tsx +++ b/src/components/molecules/header/Header.tsx @@ -14,13 +14,13 @@ import { resetCategoryState } from "../../../store/categorySlice"; import { resetTransactionState } from "../../../store/transactionSlice"; import { resetStatisticsState } from "../../../store/statisticsSlice"; -import { HeaderWrapper } from "./Header.styled"; -import { LinkMenu } from "../../atoms/link/LinkMenu.styled"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { List } from "../../atoms/list/List.styled"; -import { ListItem } from "../../atoms/list/ListItem.styled"; -import { ButtonTransparent } from "../../atoms/button/ButtonTransparent.styled"; +import HeaderWrapper from "./Header.styled"; +import LinkMenu from "../../atoms/link/LinkMenu.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import List from "../../atoms/list/List.styled"; +import ListItem from "../../atoms/list/ListItem.styled"; +import ButtonTransparent from "../../atoms/button/ButtonTransparent.styled"; import PopupEditProfile from "../popup/edit-profile/PopupEditProfile"; import PopupDeleteAccount from "../popup/PopupDeleteAccount"; diff --git a/src/components/molecules/popup/Popup.styled.ts b/src/components/molecules/popup/Popup.styled.ts index 0bd173b..6d4c614 100644 --- a/src/components/molecules/popup/Popup.styled.ts +++ b/src/components/molecules/popup/Popup.styled.ts @@ -1,12 +1,12 @@ import styled from "styled-components"; -import { blackSVGtoWhite } from "../../../shared/styles/iconStyles"; +import blackSVGtoWhite from "../../../shared/styles/iconStyles"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import COLORS from "../../../shared/styles/variables"; -export const PopupWrapper = styled(Box)` +const PopupWrapper = styled(Box)` position: absolute; top: 0; left: 0; @@ -42,3 +42,5 @@ export const PopupWrapper = styled(Box)` } } `; + +export default PopupWrapper; diff --git a/src/components/molecules/popup/PopupDeleteAccount.tsx b/src/components/molecules/popup/PopupDeleteAccount.tsx index 602fab6..98c4f3d 100644 --- a/src/components/molecules/popup/PopupDeleteAccount.tsx +++ b/src/components/molecules/popup/PopupDeleteAccount.tsx @@ -17,11 +17,11 @@ import { resetCategoryState } from "../../../store/categorySlice"; import { resetTransactionState } from "../../../store/transactionSlice"; import { resetStatisticsState } from "../../../store/statisticsSlice"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Form } from "../../atoms/form/Form.styled"; -import { PopupWrapper } from "./Popup.styled"; +import Box from "../../atoms/box/Box.styled"; +import Button from "../../atoms/button/Button.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Form from "../../atoms/form/Form.styled"; +import PopupWrapper from "./Popup.styled"; import CrossIcon from "../../../shared/assets/icons/cross.svg"; diff --git a/src/components/molecules/popup/PopupEditWallet.tsx b/src/components/molecules/popup/PopupEditWallet.tsx index 6ba8229..2bcb2f3 100644 --- a/src/components/molecules/popup/PopupEditWallet.tsx +++ b/src/components/molecules/popup/PopupEditWallet.tsx @@ -12,17 +12,17 @@ import { walletAction, } from "../../../store/walletSlice"; -import { titleFieldRules } from "../../../shared/utils/field-rules/title"; -import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; +import titleFieldRules from "../../../shared/utils/field-rules/title"; +import amountFieldRules from "../../../shared/utils/field-rules/amount"; import { userId } from "../../../api/api"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; -import { Form } from "../../atoms/form/Form.styled"; -import { PopupWrapper } from "./Popup.styled"; +import Box from "../../atoms/box/Box.styled"; +import Button from "../../atoms/button/Button.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import ButtonLink from "../../atoms/button/ButtonLink"; +import Form from "../../atoms/form/Form.styled"; +import PopupWrapper from "./Popup.styled"; import BaseField from "../base-field/BaseField"; import CrossIcon from "../../../shared/assets/icons/cross.svg"; diff --git a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx index afc37f8..1b0428b 100644 --- a/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddBankdataTab.tsx @@ -12,15 +12,15 @@ import { import { setSuccessStatus } from "../../../../store/userSlice"; import { setActiveWallet, resetError } from "../../../../store/walletSlice"; -import { titleFieldRules } from "../../../../shared/utils/field-rules/title"; +import titleFieldRules from "../../../../shared/utils/field-rules/title"; import { userId } from "../../../../api/api"; -import { Box } from "../../../atoms/box/Box.styled"; -import { Button } from "../../../atoms/button/Button.styled"; -import { Input } from "../../../atoms/input/Input.styled"; -import { Typography } from "../../../atoms/typography/Typography.styled"; -import { Form } from "../../../atoms/form/Form.styled"; +import Box from "../../../atoms/box/Box.styled"; +import Button from "../../../atoms/button/Button.styled"; +import Input from "../../../atoms/input/Input.styled"; +import Typography from "../../../atoms/typography/Typography.styled"; +import Form from "../../../atoms/form/Form.styled"; import BaseField from "../../base-field/BaseField"; import BankdataInfoMessage from "./BankdataInfoMessage"; diff --git a/src/components/molecules/popup/add-wallet/AddWalletTab.tsx b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx index 50e6ee1..cf61c18 100644 --- a/src/components/molecules/popup/add-wallet/AddWalletTab.tsx +++ b/src/components/molecules/popup/add-wallet/AddWalletTab.tsx @@ -13,15 +13,15 @@ import { walletAction, } from "../../../../store/walletSlice"; -import { titleFieldRules } from "../../../../shared/utils/field-rules/title"; -import { amountFieldRules } from "../../../../shared/utils/field-rules/amount"; +import titleFieldRules from "../../../../shared/utils/field-rules/title"; +import amountFieldRules from "../../../../shared/utils/field-rules/amount"; import { userId } from "../../../../api/api"; -import { Form } from "../../../atoms/form/Form.styled"; -import { Box } from "../../../atoms/box/Box.styled"; -import { Button } from "../../../atoms/button/Button.styled"; -import { Typography } from "../../../atoms/typography/Typography.styled"; +import Form from "../../../atoms/form/Form.styled"; +import Box from "../../../atoms/box/Box.styled"; +import Button from "../../../atoms/button/Button.styled"; +import Typography from "../../../atoms/typography/Typography.styled"; import BaseField from "../../base-field/BaseField"; import COLORS from "../../../../shared/styles/variables"; diff --git a/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx index a804d53..e0ade27 100644 --- a/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx +++ b/src/components/molecules/popup/add-wallet/BankdataInfoMessage.tsx @@ -1,5 +1,5 @@ -import { Box } from "../../../atoms/box/Box.styled"; -import { Typography } from "../../../atoms/typography/Typography.styled"; +import Box from "../../../atoms/box/Box.styled"; +import Typography from "../../../atoms/typography/Typography.styled"; import PackageSuccessIcon from "../../../../shared/assets/icons/package-success.svg"; import PackageErrorIcon from "../../../../shared/assets/icons/package-error.svg"; diff --git a/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx index f9c5559..87aa1e0 100644 --- a/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx +++ b/src/components/molecules/popup/add-wallet/PopupAddWallet.tsx @@ -10,18 +10,16 @@ import { setSuccessStatus, } from "../../../../store/walletSlice"; -import { Box } from "../../../atoms/box/Box.styled"; -import { Button } from "../../../atoms/button/Button.styled"; -import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; -import { Typography } from "../../../atoms/typography/Typography.styled"; -import { PopupWrapper } from "../Popup.styled"; +import Box from "../../../atoms/box/Box.styled"; +import Button from "../../../atoms/button/Button.styled"; +import ButtonPopup from "../../../atoms/button/ButtonPopup"; +import Typography from "../../../atoms/typography/Typography.styled"; +import PopupWrapper from "../Popup.styled"; import AddWalletTab from "./AddWalletTab"; import AddBankDataTab from "./AddBankdataTab"; import CrossIcon from "../../../../shared/assets/icons/cross.svg"; -import COLORS from "../../../../shared/styles/variables"; - const PopupAddWallet: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx index 7b72803..edc2b12 100644 --- a/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx +++ b/src/components/molecules/popup/edit-profile/ChangePasswordTab.tsx @@ -16,10 +16,10 @@ import { passwordInputRules, } from "../../../../shared/utils/field-rules/password"; -import { Form } from "../../../atoms/form/Form.styled"; -import { Box } from "../../../atoms/box/Box.styled"; -import { Typography } from "../../../atoms/typography/Typography.styled"; -import { Button } from "../../../atoms/button/Button.styled"; +import Form from "../../../atoms/form/Form.styled"; +import Box from "../../../atoms/box/Box.styled"; +import Typography from "../../../atoms/typography/Typography.styled"; +import Button from "../../../atoms/button/Button.styled"; import BaseField from "../../base-field/BaseField"; import COLORS from "../../../../shared/styles/variables"; diff --git a/src/components/molecules/popup/edit-profile/EditProfileTab.tsx b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx index 56b8058..fcbad0e 100644 --- a/src/components/molecules/popup/edit-profile/EditProfileTab.tsx +++ b/src/components/molecules/popup/edit-profile/EditProfileTab.tsx @@ -11,13 +11,13 @@ import { setSuccessStatus, } from "../../../../store/userSlice"; -import { nameFieldRules } from "../../../../shared/utils/field-rules/name"; +import nameFieldRules from "../../../../shared/utils/field-rules/name"; import { userDataParsed } from "../../../../api/api"; -import { Form } from "../../../atoms/form/Form.styled"; -import { Box } from "../../../atoms/box/Box.styled"; -import { Button } from "../../../atoms/button/Button.styled"; +import Form from "../../../atoms/form/Form.styled"; +import Box from "../../../atoms/box/Box.styled"; +import Button from "../../../atoms/button/Button.styled"; import BaseField from "../../base-field/BaseField"; import COLORS from "../../../../shared/styles/variables"; diff --git a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx index b611de9..9d42e35 100644 --- a/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx +++ b/src/components/molecules/popup/edit-profile/PopupEditProfile.tsx @@ -4,12 +4,12 @@ import { PopupContext } from "../../../../contexts/PopupContext"; import { useAppSelector } from "../../../../store/hooks"; -import { Box } from "../../../atoms/box/Box.styled"; -import { Button } from "../../../atoms/button/Button.styled"; -import { PopupWrapper } from "../Popup.styled"; -import { ButtonPopup } from "../../../atoms/button/ButtonPopup"; -import { Typography } from "../../../atoms/typography/Typography.styled"; -import { ButtonLink } from "../../../atoms/button/ButtonLink"; +import Box from "../../../atoms/box/Box.styled"; +import Button from "../../../atoms/button/Button.styled"; +import PopupWrapper from "../Popup.styled"; +import ButtonPopup from "../../../atoms/button/ButtonPopup"; +import Typography from "../../../atoms/typography/Typography.styled"; +import ButtonLink from "../../../atoms/button/ButtonLink"; import EditProfileTab from "./EditProfileTab"; import ChangePasswordTab from "./ChangePasswordTab"; diff --git a/src/components/molecules/tabs/filter/TabFilter.styled.ts b/src/components/molecules/tabs/filter/TabFilter.styled.ts index 658e5ff..17b5377 100644 --- a/src/components/molecules/tabs/filter/TabFilter.styled.ts +++ b/src/components/molecules/tabs/filter/TabFilter.styled.ts @@ -1,15 +1,15 @@ import styled from "styled-components"; -import { Box } from "../../../atoms/box/Box.styled"; -import { List } from "../../../atoms/list/List.styled"; -import { ListItem } from "../../../atoms/list/ListItem.styled"; -import { Link } from "../../../atoms/link/Link.styled"; +import Box from "../../../atoms/box/Box.styled"; +import List from "../../../atoms/list/List.styled"; +import ListItem from "../../../atoms/list/ListItem.styled"; +import Link from "../../../atoms/link/Link.styled"; -import { tabWrapperStyles } from "../tabWrapperStyles"; +import tabWrapperStyles from "../tabWrapperStyles"; import COLORS from "../../../../shared/styles/variables"; -export const TabFilterWrapper = styled(Box)` +const TabFilterWrapper = styled(Box)` ${tabWrapperStyles} ${List} { @@ -36,3 +36,5 @@ export const TabFilterWrapper = styled(Box)` } } `; + +export default TabFilterWrapper; diff --git a/src/components/molecules/tabs/filter/TabFilter.tsx b/src/components/molecules/tabs/filter/TabFilter.tsx index ddfe3ea..7d9a5bc 100644 --- a/src/components/molecules/tabs/filter/TabFilter.tsx +++ b/src/components/molecules/tabs/filter/TabFilter.tsx @@ -1,7 +1,7 @@ -import { Link } from "../../../atoms/link/Link.styled"; -import { List } from "../../../atoms/list/List.styled"; -import { ListItem } from "../../../atoms/list/ListItem.styled"; -import { TabFilterWrapper } from "./TabFilter.styled"; +import Link from "../../../atoms/link/Link.styled"; +import List from "../../../atoms/list/List.styled"; +import ListItem from "../../../atoms/list/ListItem.styled"; +import TabFilterWrapper from "./TabFilter.styled"; import COLORS from "../../../../shared/styles/variables"; @@ -14,21 +14,19 @@ type TabFilterProps = { const TabFilter: React.FC = ({ filterButtons }) => ( - {filterButtons.map( - ({ filterBy, onTabClick, buttonName, isActive }, index) => ( - - - {buttonName} - - - ) - )} + {filterButtons.map(({ filterBy, onTabClick, buttonName, isActive }) => ( + + + {buttonName} + + + ))} ); diff --git a/src/components/molecules/tabs/switch/TabSwitch.styled.ts b/src/components/molecules/tabs/switch/TabSwitch.styled.ts index d969c85..4614193 100644 --- a/src/components/molecules/tabs/switch/TabSwitch.styled.ts +++ b/src/components/molecules/tabs/switch/TabSwitch.styled.ts @@ -1,14 +1,14 @@ import styled from "styled-components"; -import { Box } from "../../../atoms/box/Box.styled"; -import { List } from "../../../atoms/list/List.styled"; -import { ListItem } from "../../../atoms/list/ListItem.styled"; -import { ButtonTransparent } from "../../../atoms/button/ButtonTransparent.styled"; -import { tabWrapperStyles } from "../tabWrapperStyles"; +import Box from "../../../atoms/box/Box.styled"; +import List from "../../../atoms/list/List.styled"; +import ListItem from "../../../atoms/list/ListItem.styled"; +import ButtonTransparent from "../../../atoms/button/ButtonTransparent.styled"; +import tabWrapperStyles from "../tabWrapperStyles"; import COLORS from "../../../../shared/styles/variables"; -export const TabSwitchWrapper = styled(Box)` +const TabSwitchWrapper = styled(Box)` ${tabWrapperStyles} width: 215px; @@ -38,3 +38,5 @@ export const TabSwitchWrapper = styled(Box)` } } `; + +export default TabSwitchWrapper; diff --git a/src/components/molecules/tabs/switch/TabSwitch.tsx b/src/components/molecules/tabs/switch/TabSwitch.tsx index be7f565..e293025 100644 --- a/src/components/molecules/tabs/switch/TabSwitch.tsx +++ b/src/components/molecules/tabs/switch/TabSwitch.tsx @@ -1,7 +1,7 @@ -import { ButtonTransparent } from "../../../atoms/button/ButtonTransparent.styled"; -import { List } from "../../../atoms/list/List.styled"; -import { ListItem } from "../../../atoms/list/ListItem.styled"; -import { TabSwitchWrapper } from "./TabSwitch.styled"; +import ButtonTransparent from "../../../atoms/button/ButtonTransparent.styled"; +import List from "../../../atoms/list/List.styled"; +import ListItem from "../../../atoms/list/ListItem.styled"; +import TabSwitchWrapper from "./TabSwitch.styled"; import COLORS from "../../../../shared/styles/variables"; @@ -14,8 +14,10 @@ type TabSwitchProps = { const TabSwitch: React.FC = ({ switchButtons }) => ( - {switchButtons.map(({ buttonName, onTabClick, isActive }, index) => ( - + {switchButtons.map(({ buttonName, onTabClick, isActive }) => ( + {buttonName} diff --git a/src/components/molecules/tabs/tabWrapperStyles.ts b/src/components/molecules/tabs/tabWrapperStyles.ts index ab31971..ce3f8b3 100644 --- a/src/components/molecules/tabs/tabWrapperStyles.ts +++ b/src/components/molecules/tabs/tabWrapperStyles.ts @@ -1,8 +1,10 @@ import { css } from "styled-components"; -export const tabWrapperStyles = css` +const tabWrapperStyles = css` border-radius: 16px; background-color: rgba(115, 127, 239, 0.3); display: flex; align-items: center; `; + +export default tabWrapperStyles; diff --git a/src/components/molecules/transaction/Transaction.tsx b/src/components/molecules/transaction/Transaction.tsx index 4d92592..41475e0 100644 --- a/src/components/molecules/transaction/Transaction.tsx +++ b/src/components/molecules/transaction/Transaction.tsx @@ -1,10 +1,10 @@ import { useAppSelector } from "../../../store/hooks"; -import { formatTransactionTime } from "../../../shared/utils/transactions/formatTransactionTime"; +import formatTransactionTime from "../../../shared/utils/transactions/formatTransactionTime"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { TransactionWrapper } from "./TransactionWrapper"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import TransactionWrapper from "./TransactionWrapper"; import IncomeIcon from "../../../shared/assets/icons/income.svg"; import ExpenseIcon from "../../../shared/assets/icons/expense.svg"; diff --git a/src/components/molecules/transaction/TransactionWrapper.ts b/src/components/molecules/transaction/TransactionWrapper.ts index c21c70f..900bedd 100644 --- a/src/components/molecules/transaction/TransactionWrapper.ts +++ b/src/components/molecules/transaction/TransactionWrapper.ts @@ -1,6 +1,6 @@ import styled from "styled-components"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import COLORS from "../../../shared/styles/variables"; @@ -8,7 +8,7 @@ type TransactionWrapperProps = { isTransactionsPage: boolean; }; -export const TransactionWrapper = styled(Box)` +const TransactionWrapper = styled(Box)` display: flex; flex-direction: column; border-radius: 8px; @@ -26,3 +26,5 @@ export const TransactionWrapper = styled(Box)` } `} `; + +export default TransactionWrapper; diff --git a/src/components/molecules/wallet/Wallet.styled.ts b/src/components/molecules/wallet/Wallet.styled.ts index fac65ea..222be33 100644 --- a/src/components/molecules/wallet/Wallet.styled.ts +++ b/src/components/molecules/wallet/Wallet.styled.ts @@ -1,9 +1,9 @@ import styled from "styled-components"; -import { blackSVGtoWhite } from "../../../shared/styles/iconStyles"; -import { commonStyles } from "../../../shared/styles/commonStyles"; +import blackSVGtoWhite from "../../../shared/styles/iconStyles"; +import commonStyles from "../../../shared/styles/commonStyles"; -import { ButtonTransparent } from "../../atoms/button/ButtonTransparent.styled"; +import ButtonTransparent from "../../atoms/button/ButtonTransparent.styled"; import COLORS from "../../../shared/styles/variables"; @@ -13,7 +13,7 @@ type WalletButtonProps = { const transactionsPath = window.location.pathname === "/transactions"; -export const WalletButton = styled(ButtonTransparent)` +const WalletButton = styled(ButtonTransparent)` ${commonStyles} background: ${({ isActive }) => (isActive ? COLORS.PRIMARY : COLORS.WHITE)}; width: 100%; @@ -47,3 +47,5 @@ export const WalletButton = styled(ButtonTransparent)` } } `; + +export default WalletButton; diff --git a/src/components/molecules/wallet/Wallet.tsx b/src/components/molecules/wallet/Wallet.tsx index 5a59cd3..84ca595 100644 --- a/src/components/molecules/wallet/Wallet.tsx +++ b/src/components/molecules/wallet/Wallet.tsx @@ -1,6 +1,6 @@ -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { WalletButton } from "./Wallet.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import WalletButton from "./Wallet.styled"; import SettingsWalletIcon from "../../../shared/assets/icons/settings-wallet.svg"; diff --git a/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx b/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx index 8d26e99..85bbda1 100644 --- a/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx +++ b/src/components/pages/2FA/TwoFactorAuthenticationPage.tsx @@ -5,13 +5,13 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { getUserDetails } from "../../../store/userSlice"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Container } from "../../atoms/container/Container.styled"; -import { Form } from "../../atoms/form/Form.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Img from "../../atoms/img/Img.styled"; +import Container from "../../atoms/container/Container.styled"; +import Form from "../../atoms/form/Form.styled"; +import Button from "../../atoms/button/Button.styled"; +import ButtonLink from "../../atoms/button/ButtonLink"; import BaseField from "../../molecules/base-field/BaseField"; import logo from "../../../shared/assets/images/logo.png"; @@ -28,10 +28,6 @@ const TwoFactorAuthenticationPage: React.FC = () => { const intervalRef = useRef(null); - const handleSub = (data: {}) => { - reset(); - }; - const { register, formState: { errors, isValid }, @@ -39,11 +35,15 @@ const TwoFactorAuthenticationPage: React.FC = () => { reset, } = useForm({ mode: "all" }); + const handleSub = () => { + reset(); + }; + useEffect(() => { dispatch(getUserDetails()); intervalRef.current = setInterval(() => { - setCount((count) => count - 1); + setCount((prevCount) => prevCount - 1); }, 1000); return () => clearInterval(intervalRef.current); diff --git a/src/components/pages/categories/AddCategory.tsx b/src/components/pages/categories/AddCategory.tsx index 1af7b57..790c4ea 100644 --- a/src/components/pages/categories/AddCategory.tsx +++ b/src/components/pages/categories/AddCategory.tsx @@ -11,14 +11,14 @@ import { import useSwitchButtonOptions from "../../../shared/hooks/useSwitchButtonOptions"; -import { titleFieldRules } from "../../../shared/utils/field-rules/title"; +import titleFieldRules from "../../../shared/utils/field-rules/title"; import { userId } from "../../../api/api"; -import { Form } from "../../atoms/form/Form.styled"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Form from "../../atoms/form/Form.styled"; +import Box from "../../atoms/box/Box.styled"; +import Button from "../../atoms/button/Button.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; import BaseField from "../../molecules/base-field/BaseField"; diff --git a/src/components/pages/categories/Categories.tsx b/src/components/pages/categories/Categories.tsx index fd7bece..6d3787c 100644 --- a/src/components/pages/categories/Categories.tsx +++ b/src/components/pages/categories/Categories.tsx @@ -7,11 +7,11 @@ import { import useFilterButtonOptions from "../../../shared/hooks/useFilterButtonOptions"; -import { Box } from "../../atoms/box/Box.styled"; -import { ButtonTransparent } from "../../atoms/button/ButtonTransparent.styled"; -import { List } from "../../atoms/list/List.styled"; -import { ListItem } from "../../atoms/list/ListItem.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Box from "../../atoms/box/Box.styled"; +import ButtonTransparent from "../../atoms/button/ButtonTransparent.styled"; +import List from "../../atoms/list/List.styled"; +import ListItem from "../../atoms/list/ListItem.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import Category from "../../molecules/category/Category"; import TabFilter from "../../molecules/tabs/filter/TabFilter"; @@ -74,8 +74,8 @@ const Categories: React.FC = () => { height="100px" p="15px"> - {categoriesData()?.map((category, index) => ( - + {categoriesData()?.map((category) => ( + onCategoryClick(category)} diff --git a/src/components/pages/categories/CategoriesPage.styled.ts b/src/components/pages/categories/CategoriesPage.styled.ts index 4356e47..9996217 100644 --- a/src/components/pages/categories/CategoriesPage.styled.ts +++ b/src/components/pages/categories/CategoriesPage.styled.ts @@ -1,10 +1,12 @@ import styled from "styled-components"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; -export const CategoriesPageWrapper = styled(Box)` +const CategoriesPageWrapper = styled(Box)` min-height: 100vh; box-sizing: border-box; display: flex; flex-direction: column; `; + +export default CategoriesPageWrapper; diff --git a/src/components/pages/categories/CategoriesPage.tsx b/src/components/pages/categories/CategoriesPage.tsx index e8b11e4..3240a92 100644 --- a/src/components/pages/categories/CategoriesPage.tsx +++ b/src/components/pages/categories/CategoriesPage.tsx @@ -6,12 +6,12 @@ import { getCategories } from "../../../store/categorySlice"; import { token } from "../../../api/api"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import Header from "../../molecules/header/Header"; import Categories from "./Categories"; import EditCategory from "./EditCategory"; import AddCategory from "./AddCategory"; -import { CategoriesPageWrapper } from "./CategoriesPage.styled"; +import CategoriesPageWrapper from "./CategoriesPage.styled"; const CategoriesPage: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/categories/EditCategory.tsx b/src/components/pages/categories/EditCategory.tsx index a11f37a..dbb9283 100644 --- a/src/components/pages/categories/EditCategory.tsx +++ b/src/components/pages/categories/EditCategory.tsx @@ -12,13 +12,13 @@ import { setIsEditCategoryOpen, } from "../../../store/categorySlice"; -import { titleFieldRules } from "../../../shared/utils/field-rules/title"; +import titleFieldRules from "../../../shared/utils/field-rules/title"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Form } from "../../atoms/form/Form.styled"; +import Box from "../../atoms/box/Box.styled"; +import Button from "../../atoms/button/Button.styled"; +import ButtonLink from "../../atoms/button/ButtonLink"; +import Typography from "../../atoms/typography/Typography.styled"; +import Form from "../../atoms/form/Form.styled"; import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; import BaseField from "../../molecules/base-field/BaseField"; diff --git a/src/components/pages/data/DataEntryPage.tsx b/src/components/pages/data/DataEntryPage.tsx index 1529355..2d4cc9d 100644 --- a/src/components/pages/data/DataEntryPage.tsx +++ b/src/components/pages/data/DataEntryPage.tsx @@ -7,8 +7,8 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { postEntryData } from "../../../store/walletSlice"; import { getUserDetails } from "../../../store/userSlice"; -import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; -import { titleFieldRules } from "../../../shared/utils/field-rules/title"; +import amountFieldRules from "../../../shared/utils/field-rules/amount"; +import titleFieldRules from "../../../shared/utils/field-rules/title"; import { localStorageIsDataEntrySuccess, @@ -16,12 +16,12 @@ import { userId, } from "../../../api/api"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Container } from "../../atoms/container/Container.styled"; -import { Form } from "../../atoms/form/Form.styled"; -import { Button } from "../../atoms/button/Button.styled"; +import Button from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Img from "../../atoms/img/Img.styled"; +import Container from "../../atoms/container/Container.styled"; +import Form from "../../atoms/form/Form.styled"; import BaseField from "../../molecules/base-field/BaseField"; import logo from "../../../shared/assets/images/logo.png"; diff --git a/src/components/pages/home/HomePage.styled.ts b/src/components/pages/home/HomePage.styled.ts index 3a45153..5db7df1 100644 --- a/src/components/pages/home/HomePage.styled.ts +++ b/src/components/pages/home/HomePage.styled.ts @@ -1,6 +1,6 @@ import styled from "styled-components"; -export const HomePageWrapper = styled.div` +const HomePageWrapper = styled.div` min-height: 100vh; box-sizing: border-box; display: flex; @@ -10,3 +10,4 @@ export const HomePageWrapper = styled.div` flex-grow: 1; } `; +export default HomePageWrapper; diff --git a/src/components/pages/home/HomePage.tsx b/src/components/pages/home/HomePage.tsx index 0008a42..55f02a9 100644 --- a/src/components/pages/home/HomePage.tsx +++ b/src/components/pages/home/HomePage.tsx @@ -17,14 +17,14 @@ import { import { token } from "../../../api/api"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import Header from "../../molecules/header/Header"; import PopupAddWallet from "../../molecules/popup/add-wallet/PopupAddWallet"; import PopupEditWallet from "../../molecules/popup/PopupEditWallet"; import Wallets from "./Wallets"; import Transactions from "./Transitions"; import Statistics from "./Statistics"; -import { HomePageWrapper } from "./HomePage.styled"; +import HomePageWrapper from "./HomePage.styled"; const HomePage: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/home/Statistics.tsx b/src/components/pages/home/Statistics.tsx index 67569b0..fe3621e 100644 --- a/src/components/pages/home/Statistics.tsx +++ b/src/components/pages/home/Statistics.tsx @@ -6,11 +6,11 @@ import { setTotalExpenses, } from "../../../store/categorySlice"; -import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; -import { calculateCategoriesWithTotalAmount } from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; +import calculateTotalAmount from "../../../shared/utils/statistics/calculateTotalAmount"; +import calculateCategoriesWithTotalAmount from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import DoughnutChart from "../../molecules/charts/DoughnutChart"; import COLORS from "../../../shared/styles/variables"; diff --git a/src/components/pages/home/Transitions.tsx b/src/components/pages/home/Transitions.tsx index 0514c51..5657de9 100644 --- a/src/components/pages/home/Transitions.tsx +++ b/src/components/pages/home/Transitions.tsx @@ -1,17 +1,20 @@ import { useAppSelector } from "../../../store/hooks"; -import { filterTransactions } from "../../../shared/utils/transactions/filterTransactions"; +import filterTransactions from "../../../shared/utils/transactions/filterTransactions"; import { formatTransactionDateToFullDate } from "../../../shared/utils/transactions/formatTransactionDate"; -import { Box } from "../../atoms/box/Box.styled"; -import { List } from "../../atoms/list/List.styled"; -import { ListItem } from "../../atoms/list/ListItem.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Box from "../../atoms/box/Box.styled"; +import List from "../../atoms/list/List.styled"; +import ListItem from "../../atoms/list/ListItem.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import Transaction from "../../molecules/transaction/Transaction"; import COLORS from "../../../shared/styles/variables"; -import { ITransaction, Transactions } from "../../../../types/transactions"; +import { + ITransaction, + Transactions as TransactionsType, +} from "../../../../types/transactions"; const renderTransactionItems = ( transactions: ITransaction[] @@ -29,8 +32,8 @@ const renderTransactionItems = ( const Transactions: React.FC = () => { const { transactions } = useAppSelector((state) => state.transaction); - const transactionsData = (): Transactions => { - const filteredTransactions: Transactions = transactions.all; + const transactionsData = (): TransactionsType => { + const filteredTransactions: TransactionsType = transactions.all; return filterTransactions(filteredTransactions); }; @@ -50,13 +53,13 @@ const Transactions: React.FC = () => { bgColor={COLORS.BASE_2} p="15px" borderRadius="16px"> - {Object.entries(transactionsData).map(([date, transactions]) => ( + {Object.entries(transactionsData).map(([date, transactionsArr]) => ( {formatTransactionDateToFullDate(date)} - {renderTransactionItems(transactions)} + {renderTransactionItems(transactionsArr)} ))} diff --git a/src/components/pages/home/Wallets.tsx b/src/components/pages/home/Wallets.tsx index c8e1e9d..683694d 100644 --- a/src/components/pages/home/Wallets.tsx +++ b/src/components/pages/home/Wallets.tsx @@ -5,11 +5,11 @@ import { PopupContext } from "../../../contexts/PopupContext"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setActiveWallet } from "../../../store/walletSlice"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { List } from "../../atoms/list/List.styled"; -import { ListItem } from "../../atoms/list/ListItem.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Button from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import List from "../../atoms/list/List.styled"; +import ListItem from "../../atoms/list/ListItem.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import Wallet from "../../molecules/wallet/Wallet"; import COLORS from "../../../shared/styles/variables"; diff --git a/src/components/pages/login/LoginPage.tsx b/src/components/pages/login/LoginPage.tsx index e191120..bb0ba7c 100644 --- a/src/components/pages/login/LoginPage.tsx +++ b/src/components/pages/login/LoginPage.tsx @@ -6,16 +6,16 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { loginUser } from "../../../store/userSlice"; -import { emailFieldRules } from "../../../shared/utils/field-rules/email"; +import emailFieldRules from "../../../shared/utils/field-rules/email"; import { passwordInputRules } from "../../../shared/utils/field-rules/password"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Container } from "../../atoms/container/Container.styled"; -import { Form } from "../../atoms/form/Form.styled"; -import { Link } from "../../atoms/link/Link.styled"; -import { Button } from "../../atoms/button/Button.styled"; +import Button from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Img from "../../atoms/img/Img.styled"; +import Container from "../../atoms/container/Container.styled"; +import Form from "../../atoms/form/Form.styled"; +import Link from "../../atoms/link/Link.styled"; import BaseField from "../../molecules/base-field/BaseField"; import logo from "../../../shared/assets/images/logo.png"; diff --git a/src/components/pages/not-found/NotFoundPage.tsx b/src/components/pages/not-found/NotFoundPage.tsx index a774b33..ae1df4d 100644 --- a/src/components/pages/not-found/NotFoundPage.tsx +++ b/src/components/pages/not-found/NotFoundPage.tsx @@ -1,4 +1,4 @@ -import { Typography } from "../../atoms/typography/Typography.styled"; +import Typography from "../../atoms/typography/Typography.styled"; const NotFoundPage = () => ( diff --git a/src/components/pages/password-recovery/EmailStep.tsx b/src/components/pages/password-recovery/EmailStep.tsx index 5c9b29b..75153bc 100644 --- a/src/components/pages/password-recovery/EmailStep.tsx +++ b/src/components/pages/password-recovery/EmailStep.tsx @@ -3,14 +3,14 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { requestPasswordReset } from "../../../store/passwordRecoverySlice"; -import { emailFieldRules } from "../../../shared/utils/field-rules/email"; +import emailFieldRules from "../../../shared/utils/field-rules/email"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { Container } from "../../atoms/container/Container.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Form } from "../../atoms/form/Form.styled"; +import Button from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import Container from "../../atoms/container/Container.styled"; +import Img from "../../atoms/img/Img.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Form from "../../atoms/form/Form.styled"; import BaseField from "../../molecules/base-field/BaseField"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; diff --git a/src/components/pages/password-recovery/NewPasswordStep.tsx b/src/components/pages/password-recovery/NewPasswordStep.tsx index f504624..bbd3d64 100644 --- a/src/components/pages/password-recovery/NewPasswordStep.tsx +++ b/src/components/pages/password-recovery/NewPasswordStep.tsx @@ -11,12 +11,12 @@ import { passwordInputRules, } from "../../../shared/utils/field-rules/password"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { Container } from "../../atoms/container/Container.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Form } from "../../atoms/form/Form.styled"; +import Button from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import Container from "../../atoms/container/Container.styled"; +import Img from "../../atoms/img/Img.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Form from "../../atoms/form/Form.styled"; import BaseField from "../../molecules/base-field/BaseField"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; diff --git a/src/components/pages/password-recovery/ResetLinkStep.tsx b/src/components/pages/password-recovery/ResetLinkStep.tsx index 12f7b2f..79ed270 100644 --- a/src/components/pages/password-recovery/ResetLinkStep.tsx +++ b/src/components/pages/password-recovery/ResetLinkStep.tsx @@ -1,11 +1,11 @@ import { useAppDispatch } from "../../../store/hooks"; import { setIsResetLinkStepOpen } from "../../../store/passwordRecoverySlice"; -import { Box } from "../../atoms/box/Box.styled"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; -import { Container } from "../../atoms/container/Container.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Box from "../../atoms/box/Box.styled"; +import ButtonLink from "../../atoms/button/ButtonLink"; +import Container from "../../atoms/container/Container.styled"; +import Img from "../../atoms/img/Img.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; import logo from "../../../shared/assets/images/logo.png"; diff --git a/src/components/pages/register/RegisterPage.tsx b/src/components/pages/register/RegisterPage.tsx index 8e33183..9e51951 100644 --- a/src/components/pages/register/RegisterPage.tsx +++ b/src/components/pages/register/RegisterPage.tsx @@ -6,19 +6,19 @@ import { useForm } from "react-hook-form"; import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { registerUser } from "../../../store/userSlice"; -import { nameFieldRules } from "../../../shared/utils/field-rules/name"; -import { emailFieldRules } from "../../../shared/utils/field-rules/email"; +import nameFieldRules from "../../../shared/utils/field-rules/name"; +import emailFieldRules from "../../../shared/utils/field-rules/email"; import { confirmPasswordInputRules, passwordInputRules, } from "../../../shared/utils/field-rules/password"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Container } from "../../atoms/container/Container.styled"; -import { Form } from "../../atoms/form/Form.styled"; -import { Button } from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Img from "../../atoms/img/Img.styled"; +import Container from "../../atoms/container/Container.styled"; +import Form from "../../atoms/form/Form.styled"; +import Button from "../../atoms/button/Button.styled"; import BaseField from "../../molecules/base-field/BaseField"; import logo from "../../../shared/assets/images/logo.png"; diff --git a/src/components/pages/statistics/DoughnutChartSection.tsx b/src/components/pages/statistics/DoughnutChartSection.tsx index 028b79f..a4f3f9c 100644 --- a/src/components/pages/statistics/DoughnutChartSection.tsx +++ b/src/components/pages/statistics/DoughnutChartSection.tsx @@ -6,12 +6,12 @@ import { setTotalExpenses, } from "../../../store/categorySlice"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import DoughnutChart from "../../molecules/charts/DoughnutChart"; -import { calculateCategoriesWithTotalAmount } from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; -import { calculateTotalAmount } from "../../../shared/utils/statistics/calculateTotalAmount"; +import calculateCategoriesWithTotalAmount from "../../../shared/utils/statistics/calculateCategoriesWithTotalAmount"; +import calculateTotalAmount from "../../../shared/utils/statistics/calculateTotalAmount"; import COLORS from "../../../shared/styles/variables"; diff --git a/src/components/pages/statistics/LineChartSection.tsx b/src/components/pages/statistics/LineChartSection.tsx index 63de6a1..dc6b269 100644 --- a/src/components/pages/statistics/LineChartSection.tsx +++ b/src/components/pages/statistics/LineChartSection.tsx @@ -4,10 +4,10 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setActiveCategoryId } from "../../../store/statisticsSlice"; import { getFilteredTransactions } from "../../../store/transactionSlice"; -import { generateNewLineChartData } from "../../../shared/utils/statistics/generateNewLineChartData"; +import generateNewLineChartData from "../../../shared/utils/statistics/generateNewLineChartData"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import LineChart from "../../molecules/charts/LineChart"; import Select from "../../molecules/select/Select"; diff --git a/src/components/pages/statistics/StatisticsHeader.tsx b/src/components/pages/statistics/StatisticsHeader.tsx index 1364407..4b958af 100644 --- a/src/components/pages/statistics/StatisticsHeader.tsx +++ b/src/components/pages/statistics/StatisticsHeader.tsx @@ -2,8 +2,8 @@ import { useAppDispatch, useAppSelector } from "../../../store/hooks"; import { setFilterByDays } from "../../../store/statisticsSlice"; import { getFilteredTransactions } from "../../../store/transactionSlice"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import TabFilter from "../../molecules/tabs/filter/TabFilter"; import COLORS from "../../../shared/styles/variables"; diff --git a/src/components/pages/statistics/StatisticsPage.styled.ts b/src/components/pages/statistics/StatisticsPage.styled.ts index 8a9b996..b6f8038 100644 --- a/src/components/pages/statistics/StatisticsPage.styled.ts +++ b/src/components/pages/statistics/StatisticsPage.styled.ts @@ -1,10 +1,12 @@ import styled from "styled-components"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; -export const StatisticsPageWrapper = styled(Box)` +const StatisticsPageWrapper = styled(Box)` min-height: 100vh; box-sizing: border-box; display: flex; flex-direction: column; `; + +export default StatisticsPageWrapper; diff --git a/src/components/pages/statistics/StatisticsPage.tsx b/src/components/pages/statistics/StatisticsPage.tsx index 1a9314a..d751091 100644 --- a/src/components/pages/statistics/StatisticsPage.tsx +++ b/src/components/pages/statistics/StatisticsPage.tsx @@ -13,12 +13,12 @@ import { import { token } from "../../../api/api"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import Header from "../../molecules/header/Header"; import StatisticsHeader from "./StatisticsHeader"; import DoughnutChartsSection from "./DoughnutChartSection"; import LineChartSection from "./LineChartSection"; -import { StatisticsPageWrapper } from "./StatisticsPage.styled"; +import StatisticsPageWrapper from "./StatisticsPage.styled"; import COLORS from "../../../shared/styles/variables"; diff --git a/src/components/pages/transactions/AddTransaction.tsx b/src/components/pages/transactions/AddTransaction.tsx index eb73c2d..c8faae0 100644 --- a/src/components/pages/transactions/AddTransaction.tsx +++ b/src/components/pages/transactions/AddTransaction.tsx @@ -11,18 +11,18 @@ import { } from "../../../store/transactionSlice"; import { formatTransactionDateToUTC } from "../../../shared/utils/transactions/formatTransactionDate"; -import { setSelectOptions } from "../../../shared/utils/transactions/setSelectOptions"; -import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; -import { setDetailsFieldRules } from "../../../shared/utils/field-rules/details"; +import setSelectOptions from "../../../shared/utils/transactions/setSelectOptions"; +import amountFieldRules from "../../../shared/utils/field-rules/amount"; +import setDetailsFieldRules from "../../../shared/utils/field-rules/details"; import { userId } from "../../../api/api"; -import { Form } from "../../atoms/form/Form.styled"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import { ListItem } from "../../atoms/list/ListItem.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; +import Button from "../../atoms/button/Button.styled"; +import Form from "../../atoms/form/Form.styled"; +import Box from "../../atoms/box/Box.styled"; +import Label from "../../atoms/label/Label.styled"; +import ListItem from "../../atoms/list/ListItem.styled"; +import Typography from "../../atoms/typography/Typography.styled"; import Select from "../../molecules/select/Select"; import Wallet from "../../molecules/wallet/Wallet"; import TabSwitch from "../../molecules/tabs/switch/TabSwitch"; @@ -105,6 +105,15 @@ const AddTransaction: React.FC = () => { }); }; + const { + register, + formState: { errors }, + handleSubmit, + setValue, + getValues, + clearErrors, + } = useForm({ mode: "all" }); + const handleSub = (data: { amount: string; category: number; @@ -132,15 +141,6 @@ const AddTransaction: React.FC = () => { ); }; - const { - register, - formState: { errors }, - handleSubmit, - setValue, - getValues, - clearErrors, - } = useForm({ mode: "all" }); - useEffect(() => { clearErrors("category"); setValue("category", addTransactionData?.category); @@ -203,8 +203,8 @@ const AddTransaction: React.FC = () => { Рахунок - {wallets?.map((wallet, index) => ( - + {wallets?.map((wallet) => ( + onWalletClick(wallet)} @@ -235,7 +235,7 @@ const AddTransaction: React.FC = () => { fz="13px" height="14px" m="0 0 20px 0"> - {(errors?.category && errors?.category?.message) || "Error!"} + {errors?.category?.message && "Error!"} diff --git a/src/components/pages/transactions/DatePicker.tsx b/src/components/pages/transactions/DatePicker.tsx index 010c992..bd68a0c 100644 --- a/src/components/pages/transactions/DatePicker.tsx +++ b/src/components/pages/transactions/DatePicker.tsx @@ -15,10 +15,18 @@ import { formatTransactionDateToUTC, } from "../../../shared/utils/transactions/formatTransactionDate"; -import { DateInput } from "../../atoms/input/InputDate.styled"; +import DateInput from "../../atoms/input/InputDate.styled"; registerLocale("uk", uk); +const CustomDateInput = forwardRef( + ({ value, onClick }, ref) => ( + + {value} + + ) +); + const DatePicker: React.FC<{ isEditTrapsactionOpen?: boolean }> = ({ isEditTrapsactionOpen, }) => { @@ -63,12 +71,4 @@ const DatePicker: React.FC<{ isEditTrapsactionOpen?: boolean }> = ({ ); }; -const CustomDateInput = forwardRef( - ({ value, onClick }, ref) => ( - - {value} - - ) -); - export default DatePicker; diff --git a/src/components/pages/transactions/EditTransaction.tsx b/src/components/pages/transactions/EditTransaction.tsx index cb0d69f..6842bf4 100644 --- a/src/components/pages/transactions/EditTransaction.tsx +++ b/src/components/pages/transactions/EditTransaction.tsx @@ -11,17 +11,17 @@ import { transactionAction, } from "../../../store/transactionSlice"; -import { setSelectOptions } from "../../../shared/utils/transactions/setSelectOptions"; -import { setDetailsFieldRules } from "../../../shared/utils/field-rules/details"; -import { amountFieldRules } from "../../../shared/utils/field-rules/amount"; +import setSelectOptions from "../../../shared/utils/transactions/setSelectOptions"; +import setDetailsFieldRules from "../../../shared/utils/field-rules/details"; +import amountFieldRules from "../../../shared/utils/field-rules/amount"; -import { Box } from "../../atoms/box/Box.styled"; -import { Button } from "../../atoms/button/Button.styled"; -import { ButtonLink } from "../../atoms/button/ButtonLink"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Label } from "../../atoms/label/Label.styled"; -import { Form } from "../../atoms/form/Form.styled"; -import { ListItem } from "../../atoms/list/ListItem.styled"; +import Button from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import ButtonLink from "../../atoms/button/ButtonLink"; +import Typography from "../../atoms/typography/Typography.styled"; +import Label from "../../atoms/label/Label.styled"; +import Form from "../../atoms/form/Form.styled"; +import ListItem from "../../atoms/list/ListItem.styled"; import Select from "../../molecules/select/Select"; import Wallet from "../../molecules/wallet/Wallet"; import BaseField from "../../molecules/base-field/BaseField"; @@ -204,8 +204,8 @@ const EditTransaction: React.FC = () => { Рахунок - {wallets?.map((wallet, index) => ( - + {wallets?.map((wallet) => ( + onWalletClick(wallet)} diff --git a/src/components/pages/transactions/Transactions.tsx b/src/components/pages/transactions/Transactions.tsx index e107233..41a9225 100644 --- a/src/components/pages/transactions/Transactions.tsx +++ b/src/components/pages/transactions/Transactions.tsx @@ -7,20 +7,23 @@ import { import useFilterButtonOptions from "../../../shared/hooks/useFilterButtonOptions"; -import { filterTransactions } from "../../../shared/utils/transactions/filterTransactions"; +import filterTransactions from "../../../shared/utils/transactions/filterTransactions"; import { formatTransactionDateToFullDate } from "../../../shared/utils/transactions/formatTransactionDate"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { ButtonTransparent } from "../../atoms/button/ButtonTransparent.styled"; -import { ListItem } from "../../atoms/list/ListItem.styled"; -import { List } from "../../atoms/list/List.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import ButtonTransparent from "../../atoms/button/ButtonTransparent.styled"; +import ListItem from "../../atoms/list/ListItem.styled"; +import List from "../../atoms/list/List.styled"; import Transaction from "../../molecules/transaction/Transaction"; import TabFilter from "../../molecules/tabs/filter/TabFilter"; import COLORS from "../../../shared/styles/variables"; -import { ITransaction, Transactions } from "../../../../types/transactions"; +import { + ITransaction, + Transactions as TransactionsType, +} from "../../../../types/transactions"; const renderTransactionItems = ( transactions: ITransaction[], @@ -56,8 +59,8 @@ const Transactions: React.FC = () => { dispatch(setIsEditTransactionOpen(true)); }; - const transactionsData = (): Transactions => { - let filteredTransactions: Transactions = {}; + const transactionsData = (): TransactionsType => { + let filteredTransactions: TransactionsType = {}; switch (filterByTypeOfOutlay) { case "all": @@ -105,13 +108,13 @@ const Transactions: React.FC = () => { grow="1" overflow="auto" height="100px"> - {Object.entries(transactionsData()).map(([date, transactions]) => ( + {Object.entries(transactionsData()).map(([date, transactionsArr]) => ( {formatTransactionDateToFullDate(date)} - {renderTransactionItems(transactions, onTransactionClick)} + {renderTransactionItems(transactionsArr, onTransactionClick)} ))} diff --git a/src/components/pages/transactions/TransactionsPage.styled.ts b/src/components/pages/transactions/TransactionsPage.styled.ts index e2002c0..91b2333 100644 --- a/src/components/pages/transactions/TransactionsPage.styled.ts +++ b/src/components/pages/transactions/TransactionsPage.styled.ts @@ -1,8 +1,10 @@ import styled from "styled-components"; -export const TransactionsPageWrapper = styled.div` +const TransactionsPageWrapper = styled.div` min-height: 100vh; box-sizing: border-box; display: flex; flex-direction: column; `; + +export default TransactionsPageWrapper; diff --git a/src/components/pages/transactions/TransactionsPage.tsx b/src/components/pages/transactions/TransactionsPage.tsx index bc33bf1..ba0d2b5 100644 --- a/src/components/pages/transactions/TransactionsPage.tsx +++ b/src/components/pages/transactions/TransactionsPage.tsx @@ -8,12 +8,12 @@ import { getCategories } from "../../../store/categorySlice"; import { token } from "../../../api/api"; -import { Box } from "../../atoms/box/Box.styled"; +import Box from "../../atoms/box/Box.styled"; import Header from "../../molecules/header/Header"; import EditTransaction from "./EditTransaction"; import Transactions from "./Transactions"; import AddTransaction from "./AddTransaction"; -import { TransactionsPageWrapper } from "./TransactionsPage.styled"; +import TransactionsPageWrapper from "./TransactionsPage.styled"; const TransactionsPage: React.FC = () => { const dispatch = useAppDispatch(); diff --git a/src/components/pages/welcome/WelcomePage.tsx b/src/components/pages/welcome/WelcomePage.tsx index 6838bf4..25a74e7 100644 --- a/src/components/pages/welcome/WelcomePage.tsx +++ b/src/components/pages/welcome/WelcomePage.tsx @@ -1,10 +1,8 @@ -import { useNavigate } from "react-router-dom"; - -import { Button } from "../../atoms/button/Button.styled"; -import { Box } from "../../atoms/box/Box.styled"; -import { Typography } from "../../atoms/typography/Typography.styled"; -import { Img } from "../../atoms/img/Img.styled"; -import { Container } from "../../atoms/container/Container.styled"; +import Button from "../../atoms/button/Button.styled"; +import Box from "../../atoms/box/Box.styled"; +import Typography from "../../atoms/typography/Typography.styled"; +import Img from "../../atoms/img/Img.styled"; +import Container from "../../atoms/container/Container.styled"; import logo from "../../../shared/assets/images/logo.png"; import InterfaceImage from "../../../shared/assets/images/interface-image-full.png"; @@ -12,16 +10,6 @@ import InterfaceImage from "../../../shared/assets/images/interface-image-full.p import COLORS from "../../../shared/styles/variables"; const WelcomePage = () => { - const navigate = useNavigate(); - - const handleEnterClick = () => { - navigate("/login"); - }; - - const handleRegisterClick = () => { - navigate("/register"); - }; - const handleShowDemoClick = () => { window.location.replace("https://spendwise-test.vercel.app/home"); }; diff --git a/src/contexts/PopupContext.tsx b/src/contexts/PopupContext.tsx index b4d5003..ad199f7 100644 --- a/src/contexts/PopupContext.tsx +++ b/src/contexts/PopupContext.tsx @@ -1,4 +1,4 @@ -import { createContext, useState } from "react"; +import { createContext, useMemo, useState } from "react"; type PopupContextType = { isAddWalletPopupOpen: boolean; @@ -33,19 +33,30 @@ export const PopupProvider: React.FC = ({ children }) => { const [isDeleteAccountPopupOpen, setIsDeleteAccountPopupOpen] = useState(false); + const value = useMemo( + () => ({ + isAddWalletPopupOpen, + setIsAddWalletPopupOpen, + isEditWalletPopupOpen, + setIsEditWalletPopupOpen, + isEditProfilePopupOpen, + setIsEditProfilePopupOpen, + isDeleteAccountPopupOpen, + setIsDeleteAccountPopupOpen, + }), + [ + isAddWalletPopupOpen, + setIsAddWalletPopupOpen, + isEditWalletPopupOpen, + setIsEditWalletPopupOpen, + isEditProfilePopupOpen, + setIsEditProfilePopupOpen, + isDeleteAccountPopupOpen, + setIsDeleteAccountPopupOpen, + ] + ); + return ( - - {children} - + {children} ); }; diff --git a/src/global.d.ts b/src/global.d.ts index 0736c56..1c32328 100644 --- a/src/global.d.ts +++ b/src/global.d.ts @@ -9,9 +9,6 @@ declare module "*.svg" { export default content; } -declare const __DEV__: boolean; -declare const __API_URL__: string; - declare module "*.ttf"; declare module "*.woff"; declare module "*.woff2"; diff --git a/src/index.tsx b/src/index.tsx index 1c9f17b..7b7009a 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,7 +1,7 @@ import ReactDOM from "react-dom/client"; import { BrowserRouter } from "react-router-dom"; import { Provider } from "react-redux"; -import { GlobalStyles } from "./shared/styles/globalStyles"; +import GlobalStyles from "./shared/styles/globalStyles"; import App from "./App"; import store from "./store/store"; import { injectStore } from "./api/api"; diff --git a/src/shared/styles/commonStyles.ts b/src/shared/styles/commonStyles.ts index 2b300b7..237f7fc 100644 --- a/src/shared/styles/commonStyles.ts +++ b/src/shared/styles/commonStyles.ts @@ -43,7 +43,7 @@ export type commonStylesProps = { cursor?: string; }; -export const commonStyles = css` +const commonStyles = css` margin: ${({ m }) => m || undefined}; margin-top: ${({ mt }) => mt || undefined}; margin-right: ${({ mr }) => mr || undefined}; @@ -84,3 +84,5 @@ export const commonStyles = css` right: ${({ right }) => right || undefined}; cursor: ${({ cursor }) => cursor || undefined}; `; + +export default commonStyles; diff --git a/src/shared/styles/fontStyles.ts b/src/shared/styles/fontStyles.ts index 9bcbeb6..1bd679a 100644 --- a/src/shared/styles/fontStyles.ts +++ b/src/shared/styles/fontStyles.ts @@ -10,7 +10,7 @@ import InterBold from "../fonts/Inter/static/Inter-Bold.ttf"; import InterExtraBold from "../fonts/Inter/static/Inter-ExtraBold.ttf"; import InterBlack from "../fonts/Inter/static/Inter-Black.ttf"; -export const fontStyles = css` +const fontStyles = css` @font-face { font-family: "Inter"; src: url(${InterThin}) format("truetype"); @@ -74,3 +74,5 @@ export const fontStyles = css` font-style: normal; } `; + +export default fontStyles; diff --git a/src/shared/styles/globalStyles.ts b/src/shared/styles/globalStyles.ts index ac3a2c4..1c5145c 100644 --- a/src/shared/styles/globalStyles.ts +++ b/src/shared/styles/globalStyles.ts @@ -1,10 +1,10 @@ import { createGlobalStyle } from "styled-components"; -import { fontStyles } from "./fontStyles"; +import fontStyles from "./fontStyles"; import COLORS from "./variables"; -export const GlobalStyles = createGlobalStyle` +const GlobalStyles = createGlobalStyle` ${fontStyles} * { @@ -34,3 +34,5 @@ export const GlobalStyles = createGlobalStyle` scrollbar-color: #ccc #f5f5f5; `; + +export default GlobalStyles; diff --git a/src/shared/styles/iconStyles.ts b/src/shared/styles/iconStyles.ts index eaef96f..236774d 100644 --- a/src/shared/styles/iconStyles.ts +++ b/src/shared/styles/iconStyles.ts @@ -1,6 +1,8 @@ import { css } from "styled-components"; -export const blackSVGtoWhite = css` +const blackSVGtoWhite = css` filter: invert(100%) sepia(0%) saturate(3410%) hue-rotate(161deg) brightness(113%) contrast(100%); `; + +export default blackSVGtoWhite; diff --git a/src/shared/utils/field-rules/amount.ts b/src/shared/utils/field-rules/amount.ts index 0f8b057..bb1115c 100644 --- a/src/shared/utils/field-rules/amount.ts +++ b/src/shared/utils/field-rules/amount.ts @@ -1,6 +1,6 @@ import { moneyAmountRegex } from "../regexes"; -export const amountFieldRules = { +const amountFieldRules = { required: "Обов'язкове поле для заповнення", pattern: { value: moneyAmountRegex, @@ -13,3 +13,5 @@ export const amountFieldRules = { "Сума може бути додатньою від 1 до 8 цифр перед крапкою та до 2 цифр після крапки", }, }; + +export default amountFieldRules; diff --git a/src/shared/utils/field-rules/details.ts b/src/shared/utils/field-rules/details.ts index e89d57e..3bd07c5 100644 --- a/src/shared/utils/field-rules/details.ts +++ b/src/shared/utils/field-rules/details.ts @@ -1,22 +1,26 @@ +import { UseFormClearErrors, FieldValues } from "react-hook-form"; + import { titleRegex, twoSymbolsRegex } from "../regexes"; -export const setDetailsFieldRules = (clearErrors: (name?: string | string[]) => void) => { - return { - validate: { - hasTwoSymbols: (value: string) => { - if (!value) { - clearErrors('title'); - return; - }; - return twoSymbolsRegex.test(value) || 'Повинно бути не менше 2 символів'; - }, - hasTwoLetters: (value: string) => { - if (!value) { - clearErrors('title'); - return; - }; - return titleRegex.test(value) || 'Повинно бути не менше 2 літер'; - }, - } - } -} +const setDetailsFieldRules = ( + clearErrors: UseFormClearErrors +) => ({ + validate: { + hasTwoSymbols: (value: string) => { + if (!value) { + clearErrors("title"); + return undefined; + } + return twoSymbolsRegex.test(value) || "Повинно бути не менше 2 символів"; + }, + hasTwoLetters: (value: string) => { + if (!value) { + clearErrors("title"); + return undefined; + } + return titleRegex.test(value) || "Повинно бути не менше 2 літер"; + }, + }, +}); + +export default setDetailsFieldRules; diff --git a/src/shared/utils/field-rules/email.ts b/src/shared/utils/field-rules/email.ts index 78e71a0..d2fa81b 100644 --- a/src/shared/utils/field-rules/email.ts +++ b/src/shared/utils/field-rules/email.ts @@ -1,9 +1,11 @@ import { emailRegex } from "../regexes"; -export const emailFieldRules = { +const emailFieldRules = { required: "Обов'язкове поле для заповнення", pattern: { value: emailRegex, message: "Назва повинна бути не менше 2 літер", }, }; + +export default emailFieldRules; diff --git a/src/shared/utils/field-rules/name.ts b/src/shared/utils/field-rules/name.ts index ecdce45..84fe89d 100644 --- a/src/shared/utils/field-rules/name.ts +++ b/src/shared/utils/field-rules/name.ts @@ -1,9 +1,11 @@ import { nameRegex } from "../regexes"; -export const nameFieldRules = { +const nameFieldRules = { required: "Обов'язкове поле для заповнення", pattern: { value: nameRegex, message: "Назва повинна бути не менше 2 літер", }, }; + +export default nameFieldRules; diff --git a/src/shared/utils/field-rules/title.ts b/src/shared/utils/field-rules/title.ts index 91974df..8acb643 100644 --- a/src/shared/utils/field-rules/title.ts +++ b/src/shared/utils/field-rules/title.ts @@ -1,6 +1,6 @@ import { titleRegex, twoSymbolsRegex } from "../regexes"; -export const titleFieldRules = { +const titleFieldRules = { required: "Обов'язкове поле для заповнення", validate: { hasTwoSymbols: (value: string) => @@ -9,3 +9,5 @@ export const titleFieldRules = { titleRegex.test(value) || "Повинно бути не менше 2 літер", }, }; + +export default titleFieldRules; diff --git a/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts index 859ae89..fda705e 100644 --- a/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts +++ b/src/shared/utils/statistics/calculateCategoriesWithTotalAmount.ts @@ -4,7 +4,7 @@ import { } from "../../../../types/category"; import { Transactions } from "../../../../types/transactions"; -export const calculateCategoriesWithTotalAmount = ( +const calculateCategoriesWithTotalAmount = ( categories: ICategory[], allTransactions: Transactions ): ICategoryWithTotalAmount[] => @@ -33,3 +33,5 @@ export const calculateCategoriesWithTotalAmount = ( }; }) .filter((category) => category.totalAmount > 0); + +export default calculateCategoriesWithTotalAmount; diff --git a/src/shared/utils/statistics/calculateTotalAmount.ts b/src/shared/utils/statistics/calculateTotalAmount.ts index f0ba0e3..d4d0925 100644 --- a/src/shared/utils/statistics/calculateTotalAmount.ts +++ b/src/shared/utils/statistics/calculateTotalAmount.ts @@ -1,6 +1,6 @@ import { Transactions } from "../../../../types/transactions"; -export const calculateTotalAmount = (allTransactions: Transactions): string => { +const calculateTotalAmount = (allTransactions: Transactions): string => { const transactionAmounts = Object.values(allTransactions).flatMap( (transactionsArr) => transactionsArr.map((transaction) => @@ -15,3 +15,5 @@ export const calculateTotalAmount = (allTransactions: Transactions): string => { return totalAmount.toFixed(2); }; + +export default calculateTotalAmount; diff --git a/src/shared/utils/statistics/generateNewLineChartData.ts b/src/shared/utils/statistics/generateNewLineChartData.ts index 9a07539..ac08354 100644 --- a/src/shared/utils/statistics/generateNewLineChartData.ts +++ b/src/shared/utils/statistics/generateNewLineChartData.ts @@ -1,6 +1,6 @@ import { Transactions } from "../../../../types/transactions"; -export const generateNewLineChartData = ( +const generateNewLineChartData = ( categoryTransactions: Transactions ): { diffInDays: number; @@ -27,3 +27,5 @@ export const generateNewLineChartData = ( return { diffInDays, totalAmount }; }; + +export default generateNewLineChartData; diff --git a/src/shared/utils/store/updateCategories.ts b/src/shared/utils/store/updateCategories.ts index fbb95d4..ceed8e4 100644 --- a/src/shared/utils/store/updateCategories.ts +++ b/src/shared/utils/store/updateCategories.ts @@ -2,7 +2,7 @@ import { PayloadAction } from "@reduxjs/toolkit"; import { CategoryState, ICategory } from "../../../../types/category"; -export const updateCategories = ( +const updateCategories = ( state: CategoryState, action: PayloadAction<{ data: ICategory[]; params: string }> ) => { @@ -22,3 +22,5 @@ export const updateCategories = ( break; } }; + +export default updateCategories; diff --git a/src/shared/utils/store/updateChartCategories.ts b/src/shared/utils/store/updateChartCategories.ts index 33b87a4..6a6a2f2 100644 --- a/src/shared/utils/store/updateChartCategories.ts +++ b/src/shared/utils/store/updateChartCategories.ts @@ -3,7 +3,7 @@ import { PayloadAction } from "@reduxjs/toolkit"; import { StatisticsState } from "../../../../types/statistics"; import { ICategory } from "../../../../types/category"; -export const updateChartCategories = ( +const updateChartCategories = ( state: StatisticsState, action: PayloadAction<{ data: ICategory[]; params: string }> ) => { @@ -20,3 +20,5 @@ export const updateChartCategories = ( break; } }; + +export default updateChartCategories; diff --git a/src/shared/utils/store/updateChartCategoryTransactions.ts b/src/shared/utils/store/updateChartCategoryTransactions.ts index 5b13e46..b4d91dd 100644 --- a/src/shared/utils/store/updateChartCategoryTransactions.ts +++ b/src/shared/utils/store/updateChartCategoryTransactions.ts @@ -4,7 +4,7 @@ import { TypeOfOutlay } from "../../../../types/common"; import { Transactions } from "../../../../types/transactions"; import { StatisticsState } from "../../../../types/statistics"; -export const updateChartCategoryTransactions = ( +const updateChartCategoryTransactions = ( state: StatisticsState, action: PayloadAction<{ data: Transactions[]; chartType: TypeOfOutlay }> ) => { @@ -21,3 +21,5 @@ export const updateChartCategoryTransactions = ( break; } }; + +export default updateChartCategoryTransactions; diff --git a/src/shared/utils/store/updateChartTransactions.ts b/src/shared/utils/store/updateChartTransactions.ts index 7430f2d..62c8248 100644 --- a/src/shared/utils/store/updateChartTransactions.ts +++ b/src/shared/utils/store/updateChartTransactions.ts @@ -3,7 +3,7 @@ import { PayloadAction } from "@reduxjs/toolkit"; import { StatisticsState } from "../../../../types/statistics"; import { Transactions } from "../../../../types/transactions"; -export const updateChartTransactions = ( +const updateChartTransactions = ( state: StatisticsState, action: PayloadAction<{ data: Transactions; params: string }> ) => { @@ -17,3 +17,5 @@ export const updateChartTransactions = ( state.expensesChart.allTransactions = data; } }; + +export default updateChartTransactions; diff --git a/src/shared/utils/store/updateTransactions.ts b/src/shared/utils/store/updateTransactions.ts index f0d1098..2a5767d 100644 --- a/src/shared/utils/store/updateTransactions.ts +++ b/src/shared/utils/store/updateTransactions.ts @@ -2,7 +2,7 @@ import { PayloadAction } from "@reduxjs/toolkit"; import { TransactionState, Transactions } from "../../../../types/transactions"; -export const updateTransactions = ( +const updateTransactions = ( state: TransactionState, action: PayloadAction<{ data: Transactions; params: string }> ) => { @@ -22,3 +22,5 @@ export const updateTransactions = ( break; } }; + +export default updateTransactions; diff --git a/src/shared/utils/transactions/filterTransactions.ts b/src/shared/utils/transactions/filterTransactions.ts index fbafe0c..451f054 100644 --- a/src/shared/utils/transactions/filterTransactions.ts +++ b/src/shared/utils/transactions/filterTransactions.ts @@ -1,6 +1,6 @@ import { Transactions } from "../../../../types/transactions"; -export const filterTransactions = ( +const filterTransactions = ( filteredTransactions: Transactions ): Transactions => { const sortedTransactions: Transactions = {}; @@ -21,3 +21,5 @@ export const filterTransactions = ( return sortedTransactions; }; + +export default filterTransactions; diff --git a/src/shared/utils/transactions/formatTransactionTime.ts b/src/shared/utils/transactions/formatTransactionTime.ts index dbe6ef0..2e0cfb0 100644 --- a/src/shared/utils/transactions/formatTransactionTime.ts +++ b/src/shared/utils/transactions/formatTransactionTime.ts @@ -1,4 +1,4 @@ -export const formatTransactionTime = (timestamp: string): string => { +const formatTransactionTime = (timestamp: string): string => { const date = new Date(timestamp); date.setHours(date.getHours() + 3); @@ -15,3 +15,5 @@ export const formatTransactionTime = (timestamp: string): string => { return time; }; + +export default formatTransactionTime; diff --git a/src/shared/utils/transactions/setSelectOptions.ts b/src/shared/utils/transactions/setSelectOptions.ts index 2fe392f..728c9b8 100644 --- a/src/shared/utils/transactions/setSelectOptions.ts +++ b/src/shared/utils/transactions/setSelectOptions.ts @@ -1,7 +1,7 @@ import { ICategory } from "../../../../types/category"; import { SelectOptions, TypeOfOutlay } from "../../../../types/common"; -export const setSelectOptions = ( +const setSelectOptions = ( typeOfOutlay: TypeOfOutlay, categories: { all: ICategory[]; @@ -19,3 +19,5 @@ export const setSelectOptions = ( return categoriesArr?.map(({ id, title }) => ({ value: id, label: title })); }; + +export default setSelectOptions; diff --git a/src/store/bankDataSlice.ts b/src/store/bankDataSlice.ts index 601cb0c..6779f16 100644 --- a/src/store/bankDataSlice.ts +++ b/src/store/bankDataSlice.ts @@ -59,7 +59,7 @@ const passwordRecoverySlice = createSlice({ }, extraReducers: (builder) => { builder - .addCase(getBankData.pending, (state, action) => { + .addCase(getBankData.pending, (state) => { state.isLoading = true; state.error = null; }) diff --git a/src/store/categorySlice.ts b/src/store/categorySlice.ts index ba2d337..9e2ac5f 100644 --- a/src/store/categorySlice.ts +++ b/src/store/categorySlice.ts @@ -2,7 +2,7 @@ import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; import { getUserDetails } from "./userSlice"; -import { updateCategories } from "../shared/utils/store/updateCategories"; +import updateCategories from "../shared/utils/store/updateCategories"; import { $api, CATEGORY_PATH } from "../api/api"; @@ -97,7 +97,7 @@ const categorySlice = createSlice({ name: "category", initialState, reducers: { - resetCategoryState: (state) => initialState, + resetCategoryState: () => initialState, resetError: (state) => { state.error = null; }, diff --git a/src/store/statisticsSlice.ts b/src/store/statisticsSlice.ts index ba6bb05..3a39d86 100644 --- a/src/store/statisticsSlice.ts +++ b/src/store/statisticsSlice.ts @@ -3,9 +3,9 @@ import { createAsyncThunk, createSlice } from "@reduxjs/toolkit"; import { getFilteredTransactions } from "./transactionSlice"; import { getFilteredCategories } from "./categorySlice"; -import { updateChartCategories } from "../shared/utils/store/updateChartCategories"; -import { updateChartTransactions } from "../shared/utils/store/updateChartTransactions"; -import { updateChartCategoryTransactions } from "../shared/utils/store/updateChartCategoryTransactions"; +import updateChartCategories from "../shared/utils/store/updateChartCategories"; +import updateChartTransactions from "../shared/utils/store/updateChartTransactions"; +import updateChartCategoryTransactions from "../shared/utils/store/updateChartCategoryTransactions"; import { $api, TRANSACTION_PATH } from "../api/api"; diff --git a/src/store/transactionSlice.ts b/src/store/transactionSlice.ts index 467b037..dccc2af 100644 --- a/src/store/transactionSlice.ts +++ b/src/store/transactionSlice.ts @@ -2,7 +2,7 @@ import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; import { getUserDetails } from "./userSlice"; -import { updateTransactions } from "../shared/utils/store/updateTransactions"; +import updateTransactions from "../shared/utils/store/updateTransactions"; import { $api, TRANSACTION_PATH } from "../api/api"; diff --git a/src/store/walletSlice.ts b/src/store/walletSlice.ts index 9014694..bad46a9 100644 --- a/src/store/walletSlice.ts +++ b/src/store/walletSlice.ts @@ -124,7 +124,7 @@ const walletSlice = createSlice({ name: "wallet", initialState, reducers: { - resetWalletState: (state) => initialState, + resetWalletState: () => initialState, resetError: (state) => { state.error = null; }, diff --git a/webpack.config.ts b/webpack.config.ts index 6420032..350b537 100644 --- a/webpack.config.ts +++ b/webpack.config.ts @@ -1,5 +1,6 @@ import path from "path"; -import { buildWebpacConfig } from "./config/build/buildWebpackConfig"; + +import buildWebpacConfig from "./config/build/buildWebpackConfig"; import { BuildEnv, BuildPaths } from "./config/types/types"; diff --git a/yarn.lock b/yarn.lock index ba1b7c7..f502a19 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1387,6 +1387,14 @@ "@jridgewell/gen-mapping" "^0.3.0" "@jridgewell/trace-mapping" "^0.3.9" +"@jridgewell/source-map@^0.3.3": + version "0.3.5" + resolved "https://registry.yarnpkg.com/@jridgewell/source-map/-/source-map-0.3.5.tgz#a3bb4d5c6825aab0d281268f47f6ad5853431e91" + integrity sha512-UTYAUj/wviwdsMfzoSJspJxbkH5o1snzwX0//0ENX1u/55kkZZkcTZP6u9bwKGkv+dkk9at4m1Cpt0uY80kcpQ== + dependencies: + "@jridgewell/gen-mapping" "^0.3.0" + "@jridgewell/trace-mapping" "^0.3.9" + "@jridgewell/sourcemap-codec@1.4.14": version "1.4.14" resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24" @@ -1444,7 +1452,7 @@ "@nodelib/fs.scandir" "2.1.5" fastq "^1.6.0" -"@pmmmwh/react-refresh-webpack-plugin@^0.5.10": +"@pmmmwh/react-refresh-webpack-plugin@0.5.10": version "0.5.10" resolved "https://registry.yarnpkg.com/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.10.tgz#2eba163b8e7dbabb4ce3609ab5e32ab63dda3ef8" integrity sha512-j0Ya0hCFZPd4x40qLzbhGsh9TMtdb+CJQiso+WxLOPNasohq9cc5SNUcwsZaRH6++Xh91Xkm/xHCkuIiIu0LUA== @@ -1673,6 +1681,11 @@ resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.1.tgz#aa22750962f3bf0e79d753d3cc067f010c95f194" integrity sha512-LG4opVs2ANWZ1TJoKc937iMmNstM/d0ae1vNbnBvBhqCSezgVUOzcLCqbI5elV8Vy6WKwKjaqR+zO9VKirBBCA== +"@types/estree@^0.0.51": + version "0.0.51" + resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.51.tgz#cfd70924a25a3fd32b218e5e420e6897e1ac4f40" + integrity sha512-CuPgU6f3eT/XgKKPqKd/gLZV1Xmvf1a2R5POBOGQa6uv82xpls89HU5zKeVoyR8XzHd1RGNOlQlvUe3CFkjWNQ== + "@types/express-serve-static-core@*", "@types/express-serve-static-core@^4.17.33": version "4.17.33" resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.17.33.tgz#de35d30a9d637dc1450ad18dd583d75d5733d543" @@ -1968,6 +1981,14 @@ "@typescript-eslint/types" "5.61.0" eslint-visitor-keys "^3.3.0" +"@webassemblyjs/ast@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.11.1.tgz#2bfd767eae1a6996f432ff7e8d7fc75679c0b6a7" + integrity sha512-ukBh14qFLjxTQNTXocdyksN5QdM28S1CxHt2rdskFyL+xFV7VremuBLVbmCePj+URalXBENx/9Lm7lnhihtCSw== + dependencies: + "@webassemblyjs/helper-numbers" "1.11.1" + "@webassemblyjs/helper-wasm-bytecode" "1.11.1" + "@webassemblyjs/ast@1.11.5", "@webassemblyjs/ast@^1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.11.5.tgz#6e818036b94548c1fb53b754b5cae3c9b208281c" @@ -1976,21 +1997,45 @@ "@webassemblyjs/helper-numbers" "1.11.5" "@webassemblyjs/helper-wasm-bytecode" "1.11.5" +"@webassemblyjs/floating-point-hex-parser@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.11.1.tgz#f6c61a705f0fd7a6aecaa4e8198f23d9dc179e4f" + integrity sha512-iGRfyc5Bq+NnNuX8b5hwBrRjzf0ocrJPI6GWFodBFzmFnyvrQ83SHKhmilCU/8Jv67i4GJZBMhEzltxzcNagtQ== + "@webassemblyjs/floating-point-hex-parser@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.11.5.tgz#e85dfdb01cad16b812ff166b96806c050555f1b4" integrity sha512-1j1zTIC5EZOtCplMBG/IEwLtUojtwFVwdyVMbL/hwWqbzlQoJsWCOavrdnLkemwNoC/EOwtUFch3fuo+cbcXYQ== +"@webassemblyjs/helper-api-error@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.11.1.tgz#1a63192d8788e5c012800ba6a7a46c705288fd16" + integrity sha512-RlhS8CBCXfRUR/cwo2ho9bkheSXG0+NwooXcc3PAILALf2QLdFyj7KGsKRbVc95hZnhnERon4kW/D3SZpp6Tcg== + "@webassemblyjs/helper-api-error@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.11.5.tgz#1e82fa7958c681ddcf4eabef756ce09d49d442d1" integrity sha512-L65bDPmfpY0+yFrsgz8b6LhXmbbs38OnwDCf6NpnMUYqa+ENfE5Dq9E42ny0qz/PdR0LJyq/T5YijPnU8AXEpA== +"@webassemblyjs/helper-buffer@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.11.1.tgz#832a900eb444884cde9a7cad467f81500f5e5ab5" + integrity sha512-gwikF65aDNeeXa8JxXa2BAk+REjSyhrNC9ZwdT0f8jc4dQQeDQ7G4m0f2QCLPJiMTTO6wfDmRmj/pW0PsUvIcA== + "@webassemblyjs/helper-buffer@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.11.5.tgz#91381652ea95bb38bbfd270702351c0c89d69fba" integrity sha512-fDKo1gstwFFSfacIeH5KfwzjykIE6ldh1iH9Y/8YkAZrhmu4TctqYjSh7t0K2VyDSXOZJ1MLhht/k9IvYGcIxg== +"@webassemblyjs/helper-numbers@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-numbers/-/helper-numbers-1.11.1.tgz#64d81da219fbbba1e3bd1bfc74f6e8c4e10a62ae" + integrity sha512-vDkbxiB8zfnPdNK9Rajcey5C0w+QJugEglN0of+kmO8l7lDb77AnlKYQF7aarZuCrv+l0UvqL+68gSDr3k9LPQ== + dependencies: + "@webassemblyjs/floating-point-hex-parser" "1.11.1" + "@webassemblyjs/helper-api-error" "1.11.1" + "@xtuc/long" "4.2.2" + "@webassemblyjs/helper-numbers@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-numbers/-/helper-numbers-1.11.5.tgz#23380c910d56764957292839006fecbe05e135a9" @@ -2000,11 +2045,26 @@ "@webassemblyjs/helper-api-error" "1.11.5" "@xtuc/long" "4.2.2" +"@webassemblyjs/helper-wasm-bytecode@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.11.1.tgz#f328241e41e7b199d0b20c18e88429c4433295e1" + integrity sha512-PvpoOGiJwXeTrSf/qfudJhwlvDQxFgelbMqtq52WWiXC6Xgg1IREdngmPN3bs4RoO83PnL/nFrxucXj1+BX62Q== + "@webassemblyjs/helper-wasm-bytecode@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.11.5.tgz#e258a25251bc69a52ef817da3001863cc1c24b9f" integrity sha512-oC4Qa0bNcqnjAowFn7MPCETQgDYytpsfvz4ujZz63Zu/a/v71HeCAAmZsgZ3YVKec3zSPYytG3/PrRCqbtcAvA== +"@webassemblyjs/helper-wasm-section@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.11.1.tgz#21ee065a7b635f319e738f0dd73bfbda281c097a" + integrity sha512-10P9No29rYX1j7F3EVPX3JvGPQPae+AomuSTPiF9eBQeChHI6iqjMIwR9JmOJXwpnn/oVGDk7I5IlskuMwU/pg== + dependencies: + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/helper-buffer" "1.11.1" + "@webassemblyjs/helper-wasm-bytecode" "1.11.1" + "@webassemblyjs/wasm-gen" "1.11.1" + "@webassemblyjs/helper-wasm-section@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.11.5.tgz#966e855a6fae04d5570ad4ec87fbcf29b42ba78e" @@ -2015,6 +2075,13 @@ "@webassemblyjs/helper-wasm-bytecode" "1.11.5" "@webassemblyjs/wasm-gen" "1.11.5" +"@webassemblyjs/ieee754@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.11.1.tgz#963929e9bbd05709e7e12243a099180812992614" + integrity sha512-hJ87QIPtAMKbFq6CGTkZYJivEwZDbQUgYd3qKSadTNOhVY7p+gfP6Sr0lLRVTaG1JjFj+r3YchoqRYxNH3M0GQ== + dependencies: + "@xtuc/ieee754" "^1.2.0" + "@webassemblyjs/ieee754@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.11.5.tgz#b2db1b33ce9c91e34236194c2b5cba9b25ca9d60" @@ -2022,6 +2089,13 @@ dependencies: "@xtuc/ieee754" "^1.2.0" +"@webassemblyjs/leb128@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.11.1.tgz#ce814b45574e93d76bae1fb2644ab9cdd9527aa5" + integrity sha512-BJ2P0hNZ0u+Th1YZXJpzW6miwqQUGcIHT1G/sf72gLVD9DZ5AdYTqPNbHZh6K1M5VmKvFXwGSWZADz+qBWxeRw== + dependencies: + "@xtuc/long" "4.2.2" + "@webassemblyjs/leb128@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.11.5.tgz#482e44d26b6b949edf042a8525a66c649e38935a" @@ -2029,11 +2103,30 @@ dependencies: "@xtuc/long" "4.2.2" +"@webassemblyjs/utf8@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.11.1.tgz#d1f8b764369e7c6e6bae350e854dec9a59f0a3ff" + integrity sha512-9kqcxAEdMhiwQkHpkNiorZzqpGrodQQ2IGrHHxCy+Ozng0ofyMA0lTqiLkVs1uzTRejX+/O0EOT7KxqVPuXosQ== + "@webassemblyjs/utf8@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.11.5.tgz#83bef94856e399f3740e8df9f63bc47a987eae1a" integrity sha512-WiOhulHKTZU5UPlRl53gHR8OxdGsSOxqfpqWeA2FmcwBMaoEdz6b2x2si3IwC9/fSPLfe8pBMRTHVMk5nlwnFQ== +"@webassemblyjs/wasm-edit@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.11.1.tgz#ad206ebf4bf95a058ce9880a8c092c5dec8193d6" + integrity sha512-g+RsupUC1aTHfR8CDgnsVRVZFJqdkFHpsHMfJuWQzWU3tvnLC07UqHICfP+4XyL2tnr1amvl1Sdp06TnYCmVkA== + dependencies: + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/helper-buffer" "1.11.1" + "@webassemblyjs/helper-wasm-bytecode" "1.11.1" + "@webassemblyjs/helper-wasm-section" "1.11.1" + "@webassemblyjs/wasm-gen" "1.11.1" + "@webassemblyjs/wasm-opt" "1.11.1" + "@webassemblyjs/wasm-parser" "1.11.1" + "@webassemblyjs/wast-printer" "1.11.1" + "@webassemblyjs/wasm-edit@^1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.11.5.tgz#93ee10a08037657e21c70de31c47fdad6b522b2d" @@ -2048,6 +2141,17 @@ "@webassemblyjs/wasm-parser" "1.11.5" "@webassemblyjs/wast-printer" "1.11.5" +"@webassemblyjs/wasm-gen@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.11.1.tgz#86c5ea304849759b7d88c47a32f4f039ae3c8f76" + integrity sha512-F7QqKXwwNlMmsulj6+O7r4mmtAlCWfO/0HdgOxSklZfQcDu0TpLiD1mRt/zF25Bk59FIjEuGAIyn5ei4yMfLhA== + dependencies: + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/helper-wasm-bytecode" "1.11.1" + "@webassemblyjs/ieee754" "1.11.1" + "@webassemblyjs/leb128" "1.11.1" + "@webassemblyjs/utf8" "1.11.1" + "@webassemblyjs/wasm-gen@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.11.5.tgz#ceb1c82b40bf0cf67a492c53381916756ef7f0b1" @@ -2059,6 +2163,16 @@ "@webassemblyjs/leb128" "1.11.5" "@webassemblyjs/utf8" "1.11.5" +"@webassemblyjs/wasm-opt@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.11.1.tgz#657b4c2202f4cf3b345f8a4c6461c8c2418985f2" + integrity sha512-VqnkNqnZlU5EB64pp1l7hdm3hmQw7Vgqa0KF/KCNO9sIpI6Fk6brDEiX+iCOYrvMuBWDws0NkTOxYEb85XQHHw== + dependencies: + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/helper-buffer" "1.11.1" + "@webassemblyjs/wasm-gen" "1.11.1" + "@webassemblyjs/wasm-parser" "1.11.1" + "@webassemblyjs/wasm-opt@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.11.5.tgz#b52bac29681fa62487e16d3bb7f0633d5e62ca0a" @@ -2069,6 +2183,18 @@ "@webassemblyjs/wasm-gen" "1.11.5" "@webassemblyjs/wasm-parser" "1.11.5" +"@webassemblyjs/wasm-parser@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.11.1.tgz#86ca734534f417e9bd3c67c7a1c75d8be41fb199" + integrity sha512-rrBujw+dJu32gYB7/Lup6UhdkPx9S9SnobZzRVL7VcBH9Bt9bCBLEuX/YXOOtBsOZ4NQrRykKhffRWHvigQvOA== + dependencies: + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/helper-api-error" "1.11.1" + "@webassemblyjs/helper-wasm-bytecode" "1.11.1" + "@webassemblyjs/ieee754" "1.11.1" + "@webassemblyjs/leb128" "1.11.1" + "@webassemblyjs/utf8" "1.11.1" + "@webassemblyjs/wasm-parser@1.11.5", "@webassemblyjs/wasm-parser@^1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.11.5.tgz#7ba0697ca74c860ea13e3ba226b29617046982e2" @@ -2081,6 +2207,14 @@ "@webassemblyjs/leb128" "1.11.5" "@webassemblyjs/utf8" "1.11.5" +"@webassemblyjs/wast-printer@1.11.1": + version "1.11.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.11.1.tgz#d0c73beda8eec5426f10ae8ef55cee5e7084c2f0" + integrity sha512-IQboUWM4eKzWW+N/jij2sRatKMh99QEelo3Eb2q0qXkvPRISAj8Qxtmw5itwqK+TTkBuUIE45AxYPToqPtL5gg== + dependencies: + "@webassemblyjs/ast" "1.11.1" + "@xtuc/long" "4.2.2" + "@webassemblyjs/wast-printer@1.11.5": version "1.11.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.11.5.tgz#7a5e9689043f3eca82d544d7be7a8e6373a6fa98" @@ -2150,6 +2284,11 @@ acorn@^8.4.1, acorn@^8.5.0, acorn@^8.7.1: resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.2.tgz#1b2f25db02af965399b9776b0c2c391276d37c4a" integrity sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw== +acorn@^8.8.2: + version "8.10.0" + resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.10.0.tgz#8be5b3907a67221a81ab23c7889c4c5526b62ec5" + integrity sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw== + acorn@^8.9.0: version "8.9.0" resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.9.0.tgz#78a16e3b2bcc198c10822786fa6679e245db5b59" @@ -2843,9 +2982,9 @@ core-js-compat@^3.25.1: browserslist "^4.21.5" core-js-pure@^3.23.3: - version "3.30.1" - resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.30.1.tgz#7d93dc89e7d47b8ef05d7e79f507b0e99ea77eec" - integrity sha512-nXBEVpmUnNRhz83cHd9JRQC52cTMcuXAmR56+9dSMpRdpeA4I1PX6yjmhd71Eyc/wXNsdBdUDIj1QTIeZpU5Tg== + version "3.31.1" + resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.31.1.tgz#73d154958881873bc19381df80bddb20c8d0cdb5" + integrity sha512-w+C62kvWti0EPs4KPMCMVv9DriHSXfQOCQ94bGGBiEW5rrbtt/Rz8n5Krhfw9cpFyzXBjf3DB3QnPdEzGDY4Fw== core-util-is@~1.0.0: version "1.0.3" @@ -3221,6 +3360,14 @@ enhanced-resolve@^5.0.0, enhanced-resolve@^5.13.0: graceful-fs "^4.2.4" tapable "^2.2.0" +enhanced-resolve@^5.10.0: + version "5.15.0" + resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz#1af946c7d93603eb88e9896cee4904dc012e9c35" + integrity sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg== + dependencies: + graceful-fs "^4.2.4" + tapable "^2.2.0" + entities@^2.0.0: version "2.2.0" resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55" @@ -3298,6 +3445,11 @@ es-abstract@^1.19.0, es-abstract@^1.20.4: unbox-primitive "^1.0.2" which-typed-array "^1.1.9" +es-module-lexer@^0.9.0: + version "0.9.3" + resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-0.9.3.tgz#6f13db00cc38417137daf74366f535c8eb438f19" + integrity sha512-1HQ2M2sPtxwnvOvT1ZClHyQDiggdNjURWpY2we6aMKCQiUVxTmVs2UYPLIrD84sS+kMdUwfBSylbJPwNnBrnHQ== + es-module-lexer@^1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-1.2.1.tgz#ba303831f63e6a394983fde2f97ad77b22324527" @@ -4143,7 +4295,12 @@ hpack.js@^2.1.6: readable-stream "^2.0.1" wbuf "^1.1.0" -html-entities@^2.1.0, html-entities@^2.3.2: +html-entities@^2.1.0: + version "2.4.0" + resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-2.4.0.tgz#edd0cee70402584c8c76cc2c0556db09d1f45061" + integrity sha512-igBTJcNNNhvZFRtm8uA6xMY6xYleeDwn3PeBCkDz7tHttv4F2hsDI2aPgNERWzvRcNYHNT3ymRaQzllmXj4YsQ== + +html-entities@^2.3.2: version "2.3.3" resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-2.3.3.tgz#117d7626bece327fc8baace8868fa6f5ef856e46" integrity sha512-DV5Ln36z34NNTDgnz0EWGBLZENelNAtkiFA4kyNOG2tDI6Mz1uSWiq1wAKdyjnJwyDiDO7Fa2SO1CTxPXL8VxA== @@ -4161,10 +4318,10 @@ html-minifier-terser@^6.0.2: relateurl "^0.2.7" terser "^5.10.0" -html-webpack-plugin@^5.5.0: - version "5.5.1" - resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-5.5.1.tgz#826838e31b427f5f7f30971f8d8fa2422dfa6763" - integrity sha512-cTUzZ1+NqjGEKjmVgZKLMdiFg3m9MdRXkZW2OEe69WYVi5ONLMmlnSZdXzGGMOq0C8jGDrL6EWyEDDUioHO/pA== +html-webpack-plugin@5.5.0: + version "5.5.0" + resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-5.5.0.tgz#c3911936f57681c1f9f4d8b68c158cd9dfe52f50" + integrity sha512-sy88PC2cRTVxvETRgUHFrL4No3UxvcH8G1NepGhqaTT+GXN2kTamqasot0inS5hXeg1cMbFDt27zzo9p35lZVw== dependencies: "@types/html-minifier-terser" "^6.0.0" html-minifier-terser "^6.0.2" @@ -5002,10 +5159,10 @@ min-indent@^1.0.0: resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869" integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg== -mini-css-extract-plugin@^2.7.3: - version "2.7.5" - resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.5.tgz#afbb344977659ec0f1f6e050c7aea456b121cfc5" - integrity sha512-9HaR++0mlgom81s95vvNjxkg52n2b5s//3ZTI1EtzFb98awsLSivs2LMsVqnQ3ay0PVhqWcGNyDaTE961FOcjQ== +mini-css-extract-plugin@2.7.3: + version "2.7.3" + resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.3.tgz#794aa4d598bf178a66b2a35fe287c3df3eac394e" + integrity sha512-CD9cXeKeXLcnMw8FZdtfrRrLaM7gwCl4nKuKn2YkY2Bw5wdlB8zU2cCzw+w2zS9RFvbrufTBkMCJACNPwqQA0w== dependencies: schema-utils "^4.0.0" @@ -6010,6 +6167,15 @@ schema-utils@^3.0.0, schema-utils@^3.1.1, schema-utils@^3.1.2: ajv "^6.12.5" ajv-keywords "^3.5.2" +schema-utils@^3.1.0: + version "3.3.0" + resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-3.3.0.tgz#f50a88877c3c01652a15b622ae9e9795df7a60fe" + integrity sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg== + dependencies: + "@types/json-schema" "^7.0.8" + ajv "^6.12.5" + ajv-keywords "^3.5.2" + schema-utils@^4.0.0: version "4.0.1" resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-4.0.1.tgz#eb2d042df8b01f4b5c276a2dfd41ba0faab72e8d" @@ -6493,6 +6659,17 @@ tapable@^2.0.0, tapable@^2.1.1, tapable@^2.2.0: resolved "https://registry.yarnpkg.com/tapable/-/tapable-2.2.1.tgz#1967a73ef4060a82f12ab96af86d52fdb76eeca0" integrity sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ== +terser-webpack-plugin@^5.1.3: + version "5.3.9" + resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-5.3.9.tgz#832536999c51b46d468067f9e37662a3b96adfe1" + integrity sha512-ZuXsqE07EcggTWQjXUj+Aot/OMcD0bMKGgF63f7UxYcu5/AJF53aIpK1YoP5xR9l6s/Hy2b+t1AM0bLNPRuhwA== + dependencies: + "@jridgewell/trace-mapping" "^0.3.17" + jest-worker "^27.4.5" + schema-utils "^3.1.1" + serialize-javascript "^6.0.1" + terser "^5.16.8" + terser-webpack-plugin@^5.3.7: version "5.3.7" resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-5.3.7.tgz#ef760632d24991760f339fe9290deb936ad1ffc7" @@ -6504,7 +6681,17 @@ terser-webpack-plugin@^5.3.7: serialize-javascript "^6.0.1" terser "^5.16.5" -terser@^5.10.0, terser@^5.16.5: +terser@^5.10.0, terser@^5.16.8: + version "5.19.0" + resolved "https://registry.yarnpkg.com/terser/-/terser-5.19.0.tgz#7b3137b01226bdd179978207b9c8148754a6da9c" + integrity sha512-JpcpGOQLOXm2jsomozdMDpd5f8ZHh1rR48OFgWUH3QsyZcfPgv2qDCYbcDEAYNd4OZRj2bWYKpwdll/udZCk/Q== + dependencies: + "@jridgewell/source-map" "^0.3.3" + acorn "^8.8.2" + commander "^2.20.0" + source-map-support "~0.5.20" + +terser@^5.16.5: version "5.17.1" resolved "https://registry.yarnpkg.com/terser/-/terser-5.17.1.tgz#948f10830454761e2eeedc6debe45c532c83fd69" integrity sha512-hVl35zClmpisy6oaoKALOpS0rDYLxRFLHhRuDlEGTKey9qHjS1w9GMORjuwIMt70Wan4lwsLYyWDVnWgF+KUEw== @@ -6608,9 +6795,9 @@ tslib@^1.8.1: integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg== tslib@^2.0.3: - version "2.5.0" - resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.5.0.tgz#42bfed86f5787aeb41d031866c8f402429e0fddf" - integrity sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg== + version "2.6.0" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.0.tgz#b295854684dbda164e181d259a22cd779dcd7bc3" + integrity sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA== tsutils@^3.21.0: version "3.21.0" @@ -6885,7 +7072,37 @@ webpack-sources@^3.2.3: resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-3.2.3.tgz#2d4daab8451fd4b240cc27055ff6a0c2ccea0cde" integrity sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w== -webpack@^5, webpack@^5.76.2: +webpack@5.76.2: + version "5.76.2" + resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.76.2.tgz#6f80d1c1d1e3bf704db571b2504a0461fac80230" + integrity sha512-Th05ggRm23rVzEOlX8y67NkYCHa9nTNcwHPBhdg+lKG+mtiW7XgggjAeeLnADAe7mLjJ6LUNfgHAuRRh+Z6J7w== + dependencies: + "@types/eslint-scope" "^3.7.3" + "@types/estree" "^0.0.51" + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/wasm-edit" "1.11.1" + "@webassemblyjs/wasm-parser" "1.11.1" + acorn "^8.7.1" + acorn-import-assertions "^1.7.6" + browserslist "^4.14.5" + chrome-trace-event "^1.0.2" + enhanced-resolve "^5.10.0" + es-module-lexer "^0.9.0" + eslint-scope "5.1.1" + events "^3.2.0" + glob-to-regexp "^0.4.1" + graceful-fs "^4.2.9" + json-parse-even-better-errors "^2.3.1" + loader-runner "^4.2.0" + mime-types "^2.1.27" + neo-async "^2.6.2" + schema-utils "^3.1.0" + tapable "^2.1.1" + terser-webpack-plugin "^5.1.3" + watchpack "^2.4.0" + webpack-sources "^3.2.3" + +webpack@^5: version "5.80.0" resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.80.0.tgz#3e660b4ab572be38c5e954bdaae7e2bf76010fdc" integrity sha512-OIMiq37XK1rWO8mH9ssfFKZsXg4n6klTEDL7S8/HqbAOBBaiy8ABvXvz0dDCXeEF9gqwxSvVk611zFPjS8hJxA== From 64dc42d03061c5217ea19d3894afaff3a89601f9 Mon Sep 17 00:00:00 2001 From: DavidGit999 Date: Fri, 14 Jul 2023 10:59:33 +0300 Subject: [PATCH 16/16] feat: deploy mock backend --- json-server/db.json | 145 -------------- package.json | 2 - src/api/api.ts | 7 +- yarn.lock | 453 +++----------------------------------------- 4 files changed, 29 insertions(+), 578 deletions(-) delete mode 100644 json-server/db.json diff --git a/json-server/db.json b/json-server/db.json deleted file mode 100644 index 8657085..0000000 --- a/json-server/db.json +++ /dev/null @@ -1,145 +0,0 @@ -{ - "users": [ - { - "id": 0, - "first_name": "john", - "last_name": "doe", - "email": "user@gmail.com" - } - ], - "category": [ - { - "id": 0, - "title": "Подарунки та благодійність (подарунки родичам та друзям, пожертвування)", - "type_of_outlay": "income", - "owner": 0 - }, - { - "id": 1, - "title": "Розваги (кінотеатри, концерти, музеї, ігри)", - "type_of_outlay": "expense", - "owner": 0 - }, - { - "id": 2, - "title": "Техніка та електроніка (комп'ютери, смартфони, планшети)", - "type_of_outlay": "expense", - "owner": 0 - } - ], - "transactions": { - "2023-04-07": [ - { - "id": 0, - "owner": 0, - "wallet": 0, - "title": "title", - "category": 1, - "description": "New transaction", - "type_of_outlay": "expense", - "amount_of_funds": "7193", - "created": "2023-04-07T21:01:49.424000Z" - }, - { - "id": 1, - "owner": 0, - "wallet": 0, - "title": "title", - "category": 1, - "description": "New transaction", - "type_of_outlay": "expense", - "amount_of_funds": "7193", - "created": "2023-04-07T21:01:49.424000Z" - } - ], - "2023-06-10": [ - { - "id": 2, - "owner": 0, - "wallet": 1, - "title": "New transaction", - "category": 0, - "description": "New transaction", - "type_of_outlay": "income", - "amount_of_funds": "3114.79", - "created": "2023-06-10T23:01:49.424000Z" - } - ], - "2023-07-04": [ - { - "id": 3, - "owner": 0, - "wallet": 2, - "title": "New transaction", - "category": 2, - "description": "New transaction", - "type_of_outlay": "expense", - "amount_of_funds": "3114.79", - "created": "2023-06-04T23:01:49.424000Z" - } - ] - }, - "wallet": [ - { - "id": 0, - "title": "Готівка", - "amount": "13248.26", - "type_of_account": "cash", - "owner": 1 - }, - { - "id": 1, - "title": "Приват", - "amount": "3042.65", - "type_of_account": "bank", - "owner": 1 - }, - { - "id": 2, - "title": "Моно", - "amount": "5346.70", - "type_of_account": "bank", - "owner": 1 - }, - { - "id": 3, - "title": "Ощадss", - "amount": "346", - "type_of_account": "bank", - "owner": 10 - }, - { - "id": 4, - "title": "Альфа", - "amount": "2314.35", - "type_of_account": "bank", - "owner": 1 - } - ], - "charts": { - "doughnut": { - "data": ["30", "25", "20", "15", "10"], - "labels": [ - "Подарунки та благодійність", - "Охорона здоров'я та краса", - "Їжа та напої", - "Електроніка та техніка", - "Комунальні послуги" - ] - } - }, - "options": [ - { - "value": "Подарунки та благодійність (подарунки родичам та друзям, пожертвування)", - "label": "Подарунки та благодійність (подарунки родичам та друзям, пожертвування)" - }, - { - "value": "Розваги (кінотеатри, концерти, музеї, ігри)", - "label": "Розваги (кінотеатри, концерти, музеї, ігри)" - }, - { - "value": "Техніка та електроніка (комп'ютери, смартфони, планшети)", - "label": "Техніка та електроніка (комп'ютери, смартфони, планшети)" - } - ] -} diff --git a/package.json b/package.json index 4b186f9..d783f11 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,6 @@ "main": "index.tsx", "scripts": { "dev": "webpack serve --env mode=development --https", - "dev:server": "yarn json-server --watch ./json-server/db.json -p 4000", "build:dev": "webpack --env mode=development", "build:prod": "webpack --env mode=production", "prepare": "husky install", @@ -40,7 +39,6 @@ "eslint-plugin-react": "^7.32.2", "file-loader": "^6.2.0", "husky": "^8.0.3", - "json-server": "^0.17.3", "prettier": "^2.8.8", "react-refresh": "^0.14.0", "style-loader": "^3.3.2", diff --git a/src/api/api.ts b/src/api/api.ts index 8c7bf5f..104457c 100644 --- a/src/api/api.ts +++ b/src/api/api.ts @@ -1,10 +1,9 @@ import axios, { InternalAxiosRequestConfig } from "axios"; -import { Store } from "@reduxjs/toolkit"; +import { Store } from "@reduxjs/toolkit"; import { IUser } from "../../types/user"; -// export const BASE_URL = "https://prod.wallet.cloudns.ph:8800"; -export const BASE_URL = "http:localhost:4000"; +export const BASE_URL = "https://spendwise-mock-backend.onrender.com"; export const REGISTER_PATH = "/accounts/register/"; export const LOGIN_PATH = "/accounts/login/"; export const LOGOUT_PATH = "/accounts/logout/"; @@ -15,9 +14,7 @@ export const CHANGE_USER_PASSWORD_PATH = export const PASSWORD_RESET_REQUEST_PATH = "/accounts/password-reset-request/"; export const PASSWORD_RESET_CONFIRM_PATH = "/accounts/password-reset-confirm/"; export const WALLET_PATH = "/wallet/"; -// export const CATEGORY_PATH = "/wallet/category/"; export const CATEGORY_PATH = "/category/"; -// export const TRANSACTION_PATH = "/wallet/transactions/"; export const TRANSACTION_PATH = "/transactions/"; export const BANK_DATA_PATH = "/bankdata/"; diff --git a/yarn.lock b/yarn.lock index f502a19..5537dc5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2256,7 +2256,7 @@ JSONStream@^1.0.4: jsonparse "^1.2.0" through ">=2.2.7 <3" -accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7, accepts@~1.3.8: +accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.8: version "1.3.8" resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.8.tgz#0bf0be125b67014adcb0b0921e62db7bffe16b2e" integrity sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw== @@ -2555,13 +2555,6 @@ balanced-match@^1.0.0: resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw== -basic-auth@~2.0.1: - version "2.0.1" - resolved "https://registry.yarnpkg.com/basic-auth/-/basic-auth-2.0.1.tgz#b998279bf47ce38344b4f3cf916d4679bbf51e3a" - integrity sha512-NF+epuEdnUYVlGuhaxbbq+dvJttwLnGY+YixlXlME5KpQ5W3CnXA5cVTneY3SPbPDRkcjMbifrwmFYcClgOZeg== - dependencies: - safe-buffer "5.1.2" - batch@0.6.1: version "0.6.1" resolved "https://registry.yarnpkg.com/batch/-/batch-0.6.1.tgz#dc34314f4e679318093fc760272525f94bf25c16" @@ -2595,24 +2588,6 @@ body-parser@1.20.1: type-is "~1.6.18" unpipe "1.0.0" -body-parser@^1.19.0: - version "1.20.2" - resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.2.tgz#6feb0e21c4724d06de7ff38da36dad4f57a747fd" - integrity sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA== - dependencies: - bytes "3.1.2" - content-type "~1.0.5" - debug "2.6.9" - depd "2.0.0" - destroy "1.2.0" - http-errors "2.0.0" - iconv-lite "0.4.24" - on-finished "2.4.1" - qs "6.11.0" - raw-body "2.5.2" - type-is "~1.6.18" - unpipe "1.0.0" - bonjour-service@^1.0.11: version "1.1.1" resolved "https://registry.yarnpkg.com/bonjour-service/-/bonjour-service-1.1.1.tgz#960948fa0e0153f5d26743ab15baf8e33752c135" @@ -2658,13 +2633,6 @@ buffer-from@^1.0.0: resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.2.tgz#2b146a6fd72e80b4f55d255f35ed59a3a9a41bd5" integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ== -builtins@^5.0.1: - version "5.0.1" - resolved "https://registry.yarnpkg.com/builtins/-/builtins-5.0.1.tgz#87f6db9ab0458be728564fa81d876d8d74552fa9" - integrity sha512-qwVpFEHNfhYJIzNRBvd2C1kyo6jz3ZSMPyyuR47OPdiKWlbYnZNyDWuyR175qDnAJLiCo5fBBqPb3RiXgWlkOQ== - dependencies: - semver "^7.0.0" - bytes@3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048" @@ -2734,7 +2702,7 @@ chalk@^2.0.0: escape-string-regexp "^1.0.5" supports-color "^5.3.0" -chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.2: +chalk@^4.0.0, chalk@^4.1.0: version "4.1.2" resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01" integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA== @@ -2913,11 +2881,6 @@ connect-history-api-fallback@^2.0.0: resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz#647264845251a0daf25b97ce87834cace0f5f1c8" integrity sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA== -connect-pause@^0.1.1: - version "0.1.1" - resolved "https://registry.yarnpkg.com/connect-pause/-/connect-pause-0.1.1.tgz#b269b2bb82ddb1ac3db5099c0fb582aba99fb37a" - integrity sha512-a1gSWQBQD73krFXdUEYJom2RTFrWUL3YvXDCRkyv//GVXc79cdW9MngtRuN9ih4FDKBtfJAJId+BbDuX+1rh2w== - content-disposition@0.5.4: version "0.5.4" resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.4.tgz#8b82b4efac82512a02bb0b1dcec9d2c5e8eb5bfe" @@ -2925,7 +2888,7 @@ content-disposition@0.5.4: dependencies: safe-buffer "5.2.1" -content-type@~1.0.4, content-type@~1.0.5: +content-type@~1.0.4: version "1.0.5" resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.5.tgz#8b773162656d1d1086784c8f23a54ce6d73d7918" integrity sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA== @@ -2991,14 +2954,6 @@ core-util-is@~1.0.0: resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.3.tgz#a6042d3634c2b27e9328f837b965fac83808db85" integrity sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ== -cors@^2.8.5: - version "2.8.5" - resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29" - integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g== - dependencies: - object-assign "^4" - vary "^1" - cosmiconfig-typescript-loader@^4.0.0: version "4.3.0" resolved "https://registry.yarnpkg.com/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-4.3.0.tgz#c4259ce474c9df0f32274ed162c0447c951ef073" @@ -3123,13 +3078,6 @@ date-fns@^2.0.1, date-fns@^2.24.0, date-fns@^2.29.3: resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.29.3.tgz#27402d2fc67eb442b511b70bbdf98e6411cd68a8" integrity sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA== -debug@*, debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4: - version "4.3.4" - resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865" - integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ== - dependencies: - ms "2.1.2" - debug@2.6.9: version "2.6.9" resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f" @@ -3137,13 +3085,6 @@ debug@2.6.9: dependencies: ms "2.0.0" -debug@3.1.0: - version "3.1.0" - resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261" - integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g== - dependencies: - ms "2.0.0" - debug@^3.2.7: version "3.2.7" resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a" @@ -3151,6 +3092,13 @@ debug@^3.2.7: dependencies: ms "^2.1.1" +debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4: + version "4.3.4" + resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865" + integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ== + dependencies: + ms "2.1.2" + decamelize-keys@^1.1.0: version "1.1.1" resolved "https://registry.yarnpkg.com/decamelize-keys/-/decamelize-keys-1.1.1.tgz#04a2d523b2f18d80d0158a43b895d56dff8d19d8" @@ -3199,7 +3147,7 @@ delayed-stream@~1.0.0: resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" integrity sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ== -depd@2.0.0, depd@~2.0.0: +depd@2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/depd/-/depd-2.0.0.tgz#b696163cc757560d09cf22cc8fad1571b79e76df" integrity sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw== @@ -3397,14 +3345,6 @@ error-stack-parser@^2.0.6: dependencies: stackframe "^1.3.4" -errorhandler@^1.5.1: - version "1.5.1" - resolved "https://registry.yarnpkg.com/errorhandler/-/errorhandler-1.5.1.tgz#b9ba5d17cf90744cd1e851357a6e75bf806a9a91" - integrity sha512-rcOwbfvP1WTViVoUjcfZicVzjhjTuhSMntHh6mW3IrEiyE6mJyXvsToJUJGlGlw/2xU9P5whlWNGlIDVeCiT4A== - dependencies: - accepts "~1.3.7" - escape-html "~1.0.3" - es-abstract@^1.19.0, es-abstract@^1.20.4: version "1.21.2" resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.21.2.tgz#a56b9695322c8a185dc25975aa3b8ec31d0e7eff" @@ -3524,16 +3464,6 @@ eslint-config-prettier@^8.8.0: resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.8.0.tgz#bfda738d412adc917fd7b038857110efe98c9348" integrity sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA== -eslint-config-standard-jsx@^11.0.0: - version "11.0.0" - resolved "https://registry.yarnpkg.com/eslint-config-standard-jsx/-/eslint-config-standard-jsx-11.0.0.tgz#70852d395731a96704a592be5b0bfaccfeded239" - integrity sha512-+1EV/R0JxEK1L0NGolAr8Iktm3Rgotx3BKwgaX+eAuSX8D952LULKtjgZD3F+e6SvibONnhLwoTi9DPxN5LvvQ== - -eslint-config-standard@17.1.0: - version "17.1.0" - resolved "https://registry.yarnpkg.com/eslint-config-standard/-/eslint-config-standard-17.1.0.tgz#40ffb8595d47a6b242e07cbfd49dc211ed128975" - integrity sha512-IwHwmaBNtDK4zDHQukFDW5u/aTb8+meQWZvNFWkiGmbWjD6bqyuSSBxxXKkCftCUzc1zwCH2m/baCNDLGmuO5Q== - eslint-import-resolver-node@^0.3.7: version "0.3.7" resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.7.tgz#83b375187d412324a1963d84fa664377a23eb4d7" @@ -3550,14 +3480,6 @@ eslint-module-utils@^2.7.4: dependencies: debug "^3.2.7" -eslint-plugin-es@^4.1.0: - version "4.1.0" - resolved "https://registry.yarnpkg.com/eslint-plugin-es/-/eslint-plugin-es-4.1.0.tgz#f0822f0c18a535a97c3e714e89f88586a7641ec9" - integrity sha512-GILhQTnjYE2WorX5Jyi5i4dz5ALWxBIdQECVQavL6s7cI76IZTDWleTHkxz/QT3kvcs2QlGHvKLYsSlPOlPXnQ== - dependencies: - eslint-utils "^2.0.0" - regexpp "^3.0.0" - eslint-plugin-import@^2.27.5: version "2.27.5" resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.27.5.tgz#876a6d03f52608a3e5bb439c2550588e51dd6c65" @@ -3601,20 +3523,6 @@ eslint-plugin-jsx-a11y@^6.7.1: object.fromentries "^2.0.6" semver "^6.3.0" -eslint-plugin-n@^15.7.0: - version "15.7.0" - resolved "https://registry.yarnpkg.com/eslint-plugin-n/-/eslint-plugin-n-15.7.0.tgz#e29221d8f5174f84d18f2eb94765f2eeea033b90" - integrity sha512-jDex9s7D/Qial8AGVIHq4W7NswpUD5DPDL2RH8Lzd9EloWUuvUkHfv4FRLMipH5q2UtyurorBkPeNi1wVWNh3Q== - dependencies: - builtins "^5.0.1" - eslint-plugin-es "^4.1.0" - eslint-utils "^3.0.0" - ignore "^5.1.1" - is-core-module "^2.11.0" - minimatch "^3.1.2" - resolve "^1.22.1" - semver "^7.3.8" - eslint-plugin-prettier@^4.2.1: version "4.2.1" resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz#651cbb88b1dab98bfd42f017a12fa6b2d993f94b" @@ -3622,11 +3530,6 @@ eslint-plugin-prettier@^4.2.1: dependencies: prettier-linter-helpers "^1.0.0" -eslint-plugin-promise@^6.1.1: - version "6.1.1" - resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz#269a3e2772f62875661220631bd4dafcb4083816" - integrity sha512-tjqWDwVZQo7UIPMeDReOpUgHCmCiH+ePnVT+5zVapL0uuHnegBUs2smM13CzOs2Xb5+MHMRFTs9v24yjba4Oig== - eslint-plugin-react@^7.32.2: version "7.32.2" resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.32.2.tgz#e71f21c7c265ebce01bcbc9d0955170c55571f10" @@ -3664,36 +3567,12 @@ eslint-scope@^7.2.0: esrecurse "^4.3.0" estraverse "^5.2.0" -eslint-utils@^2.0.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.1.0.tgz#d2de5e03424e707dc10c74068ddedae708741b27" - integrity sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg== - dependencies: - eslint-visitor-keys "^1.1.0" - -eslint-utils@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-3.0.0.tgz#8aebaface7345bb33559db0a1f13a1d2d48c3672" - integrity sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA== - dependencies: - eslint-visitor-keys "^2.0.0" - -eslint-visitor-keys@^1.1.0: - version "1.3.0" - resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e" - integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ== - -eslint-visitor-keys@^2.0.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303" - integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw== - eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1: version "3.4.1" resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz#c22c48f48942d08ca824cc526211ae400478a994" integrity sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA== -eslint@^8.41.0, eslint@^8.44.0: +eslint@^8.44.0: version "8.44.0" resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.44.0.tgz#51246e3889b259bbcd1d7d736a0c10add4f0e500" integrity sha512-0wpHoUbDUHgNCyvFB5aXLiQVfK9B0at6gUvzy83k4kAsQ/u769TQDX6iKC+aO4upIHO9WSaA3QoXYQDHbNwf1A== @@ -3806,15 +3685,7 @@ execa@^5.0.0: signal-exit "^3.0.3" strip-final-newline "^2.0.0" -express-urlrewrite@^1.4.0: - version "1.4.0" - resolved "https://registry.yarnpkg.com/express-urlrewrite/-/express-urlrewrite-1.4.0.tgz#985ee022773bac7ed32126f1cf9ec8ee48e1290a" - integrity sha512-PI5h8JuzoweS26vFizwQl6UTF25CAHSggNv0J25Dn/IKZscJHWZzPrI5z2Y2jgOzIaw2qh8l6+/jUcig23Z2SA== - dependencies: - debug "*" - path-to-regexp "^1.0.3" - -express@^4.17.1, express@^4.17.3: +express@^4.17.3: version "4.18.2" resolved "https://registry.yarnpkg.com/express/-/express-4.18.2.tgz#3fabe08296e930c796c19e3c516979386ba9fd59" integrity sha512-5/PsL6iGPdfQ/lKM1UuielYgv3BUoJfz1aUwU9vHZ+J7gyvwdQXFEBIEIaxeGf0GIcreATNyBExtalisDbuMqQ== @@ -3950,13 +3821,6 @@ find-root@^1.1.0: resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4" integrity sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng== -find-up@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/find-up/-/find-up-3.0.0.tgz#49169f1d7993430646da61ecc5ae355c21c97b73" - integrity sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg== - dependencies: - locate-path "^3.0.0" - find-up@^4.0.0, find-up@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/find-up/-/find-up-4.1.0.tgz#97afe7d6cdc0bc5928584b7c8d7b16e8a9aa5d19" @@ -4090,11 +3954,6 @@ get-intrinsic@^1.1.1, get-intrinsic@^1.1.3, get-intrinsic@^1.2.0: has-proto "^1.0.1" has-symbols "^1.0.3" -get-stdin@^8.0.0: - version "8.0.0" - resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-8.0.0.tgz#cbad6a73feb75f6eeb22ba9e01f89aa28aa97a53" - integrity sha512-sY22aA6xchAzprjyqmSEQv4UbAAzRN0L2dQB0NlN5acTTK9Don6nhoc3eAbUnpZiCANAMfd/+40kVdKfFygohg== - get-stream@^6.0.0: version "6.0.1" resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-6.0.1.tgz#a262d8eef67aced57c2852ad6167526a43cbf7b7" @@ -4195,7 +4054,7 @@ gopd@^1.0.1: dependencies: get-intrinsic "^1.1.3" -graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.3, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9: +graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9: version "4.2.11" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.11.tgz#4183e4e8bf08bb6e05bbb2f7d2e0c8f712ca40e3" integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ== @@ -4412,7 +4271,7 @@ icss-utils@^5.0.0, icss-utils@^5.1.0: resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-5.1.0.tgz#c6be6858abd013d768e98366ae47e25d5887b1ae" integrity sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA== -ignore@^5.1.1, ignore@^5.2.0: +ignore@^5.2.0: version "5.2.4" resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324" integrity sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ== @@ -4623,11 +4482,6 @@ is-plain-object@^2.0.4: dependencies: isobject "^3.0.1" -is-promise@^2.1.0: - version "2.2.2" - resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.2.2.tgz#39ab959ccbf9a774cf079f7b40c7a26f763135f1" - integrity sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ== - is-regex@^1.1.4: version "1.1.4" resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958" @@ -4694,11 +4548,6 @@ is-wsl@^2.2.0: dependencies: is-docker "^2.0.0" -isarray@0.0.1: - version "0.0.1" - resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf" - integrity sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ== - isarray@~1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11" @@ -4723,11 +4572,6 @@ jest-worker@^27.4.5: merge-stream "^2.0.0" supports-color "^8.0.0" -jju@^1.1.0: - version "1.4.0" - resolved "https://registry.yarnpkg.com/jju/-/jju-1.4.0.tgz#a3abe2718af241a2b2904f84a625970f389ae32a" - integrity sha512-8wb9Yw966OSxApiCt0K3yNJL8pnNeIv+OEq2YMidz4FKP6nonSRoOXc80iXY4JaN2FC11B9qsNmDsm+ZOfMROA== - "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" @@ -4750,23 +4594,11 @@ jsesc@~0.5.0: resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d" integrity sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA== -json-parse-better-errors@^1.0.1: - version "1.0.2" - resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" - integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw== - json-parse-even-better-errors@^2.3.0, json-parse-even-better-errors@^2.3.1: version "2.3.1" resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d" integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w== -json-parse-helpfulerror@^1.0.3: - version "1.0.3" - resolved "https://registry.yarnpkg.com/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz#13f14ce02eed4e981297b64eb9e3b932e2dd13dc" - integrity sha512-XgP0FGR77+QhUxjXkwOMkC94k3WtqEBfcnjWqhRd82qTat4SWKRE+9kUnynz/shm3I4ea2+qISvTIeGTNU7kJg== - dependencies: - jju "^1.1.0" - json-schema-traverse@^0.4.1: version "0.4.1" resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660" @@ -4777,32 +4609,6 @@ json-schema-traverse@^1.0.0: resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz#ae7bcb3656ab77a73ba5c49bf654f38e6b6860e2" integrity sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug== -json-server@^0.17.3: - version "0.17.3" - resolved "https://registry.yarnpkg.com/json-server/-/json-server-0.17.3.tgz#c641884189aad59f101f7ad9f519fa3c4c3cff14" - integrity sha512-LDNOvleTv3rPAcefzXZpXMDZshV0FtSzWo8ZjnTOhKm4OCiUvsYGrGrfz4iHXIFd+UbRgFHm6gcOHI/BSZ/3fw== - dependencies: - body-parser "^1.19.0" - chalk "^4.1.2" - compression "^1.7.4" - connect-pause "^0.1.1" - cors "^2.8.5" - errorhandler "^1.5.1" - express "^4.17.1" - express-urlrewrite "^1.4.0" - json-parse-helpfulerror "^1.0.3" - lodash "^4.17.21" - lodash-id "^0.14.1" - lowdb "^1.0.0" - method-override "^3.0.0" - morgan "^1.10.0" - nanoid "^3.1.23" - please-upgrade-node "^3.2.0" - pluralize "^8.0.0" - server-destroy "^1.0.1" - standard "^17.0.0" - yargs "^17.0.1" - json-stable-stringify-without-jsonify@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651" @@ -4882,17 +4688,6 @@ lines-and-columns@^1.1.6: resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632" integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg== -load-json-file@^5.2.0: - version "5.3.0" - resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-5.3.0.tgz#4d3c1e01fa1c03ea78a60ac7af932c9ce53403f3" - integrity sha512-cJGP40Jc/VXUsp8/OrnyKyTZ1y6v/dphm3bioS+RrKXjK2BB6wHUd6JptZEFDGgGahMT+InnZO5i1Ei9mpC8Bw== - dependencies: - graceful-fs "^4.1.15" - parse-json "^4.0.0" - pify "^4.0.1" - strip-bom "^3.0.0" - type-fest "^0.3.0" - loader-runner@^4.2.0: version "4.3.0" resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.3.0.tgz#c1b4a163b99f614830353b16755e7149ac2314e1" @@ -4907,14 +4702,6 @@ loader-utils@^2.0.0, loader-utils@^2.0.4: emojis-list "^3.0.0" json5 "^2.1.2" -locate-path@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-3.0.0.tgz#dbec3b3ab759758071b58fe59fc41871af21400e" - integrity sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A== - dependencies: - p-locate "^3.0.0" - path-exists "^3.0.0" - locate-path@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-5.0.0.tgz#1afba396afd676a6d42504d0a67a3a7eb9f62aa0" @@ -4929,11 +4716,6 @@ locate-path@^6.0.0: dependencies: p-locate "^5.0.0" -lodash-id@^0.14.1: - version "0.14.1" - resolved "https://registry.yarnpkg.com/lodash-id/-/lodash-id-0.14.1.tgz#dffa1f1f8b90d1803bb0d70b7d7547e10751e80b" - integrity sha512-ikQPBTiq/d5m6dfKQlFdIXFzvThPi2Be9/AHxktOnDSfSxE1j9ICbBT5Elk1ke7HSTgM38LHTpmJovo9/klnLg== - lodash.camelcase@^4.3.0: version "4.3.0" resolved "https://registry.yarnpkg.com/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz#b28aa6288a2b9fc651035c7711f65ab6190331a6" @@ -4989,7 +4771,7 @@ lodash.upperfirst@^4.3.1: resolved "https://registry.yarnpkg.com/lodash.upperfirst/-/lodash.upperfirst-4.3.1.tgz#1365edf431480481ef0d1c68957a5ed99d49f7ce" integrity sha512-sReKOYJIJf74dhJONhU4e0/shzi1trVbSWDOhKYE5XV2O+H7Sb2Dihwuc7xWxVl+DgFPyTqIN3zMfT9cq5iWDg== -lodash@4, lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21: +lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21: version "4.17.21" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== @@ -5001,17 +4783,6 @@ loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0: dependencies: js-tokens "^3.0.0 || ^4.0.0" -lowdb@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/lowdb/-/lowdb-1.0.0.tgz#5243be6b22786ccce30e50c9a33eac36b20c8064" - integrity sha512-2+x8esE/Wb9SQ1F9IHaYWfsC9FIecLOPrK4g17FGEayjUWH172H6nwicRovGvSE2CPZouc2MCIqCI7h9d+GftQ== - dependencies: - graceful-fs "^4.1.3" - is-promise "^2.1.0" - lodash "4" - pify "^3.0.0" - steno "^0.4.1" - lower-case@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-2.0.2.tgz#6fa237c63dbdc4a82ca0fd882e4722dc5e634e28" @@ -5109,16 +4880,6 @@ merge2@^1.3.0, merge2@^1.4.1: resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae" integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg== -method-override@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/method-override/-/method-override-3.0.0.tgz#6ab0d5d574e3208f15b0c9cf45ab52000468d7a2" - integrity sha512-IJ2NNN/mSl9w3kzWB92rcdHpz+HjkxhDJWNDBqSlas+zQdP8wBiJzITPg08M/k2uVvMow7Sk41atndNtt/PHSA== - dependencies: - debug "3.1.0" - methods "~1.1.2" - parseurl "~1.3.2" - vary "~1.1.2" - methods@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee" @@ -5192,17 +4953,6 @@ minimist@^1.2.0, minimist@^1.2.6: resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c" integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA== -morgan@^1.10.0: - version "1.10.0" - resolved "https://registry.yarnpkg.com/morgan/-/morgan-1.10.0.tgz#091778abc1fc47cd3509824653dae1faab6b17d7" - integrity sha512-AbegBVI4sh6El+1gNwvD5YIck7nSA36weD7xvIxG4in80j/UoK8AEGaWnnz8v1GxonMCltmlNs5ZKbGvl9b1XQ== - dependencies: - basic-auth "~2.0.1" - debug "2.6.9" - depd "~2.0.0" - on-finished "~2.3.0" - on-headers "~1.0.2" - ms@2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8" @@ -5226,7 +4976,7 @@ multicast-dns@^7.2.5: dns-packet "^5.2.2" thunky "^1.0.2" -nanoid@^3.1.23, nanoid@^3.3.6: +nanoid@^3.3.6: version "3.3.6" resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c" integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA== @@ -5308,7 +5058,7 @@ nth-check@^2.0.1: dependencies: boolbase "^1.0.0" -object-assign@^4, object-assign@^4.1.1: +object-assign@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863" integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg== @@ -5380,13 +5130,6 @@ on-finished@2.4.1: dependencies: ee-first "1.1.1" -on-finished@~2.3.0: - version "2.3.0" - resolved "https://registry.yarnpkg.com/on-finished/-/on-finished-2.3.0.tgz#20f1336481b083cd75337992a16971aa2d906947" - integrity sha512-ikqdkGAAyf/X/gPhXGvfgAytDZtDbr+bkNUJ0N9h5MI/dmdgCs3l6hoHrcUv41sRKew3jIwrp4qQDXiK99Utww== - dependencies: - ee-first "1.1.1" - on-headers@~1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.2.tgz#772b0ae6aaa525c399e489adfad90c403eb3c28f" @@ -5427,7 +5170,7 @@ optionator@^0.9.3: prelude-ls "^1.2.1" type-check "^0.4.0" -p-limit@^2.0.0, p-limit@^2.2.0: +p-limit@^2.2.0: version "2.3.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1" integrity sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w== @@ -5441,13 +5184,6 @@ p-limit@^3.0.2: dependencies: yocto-queue "^0.1.0" -p-locate@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-3.0.0.tgz#322d69a05c0264b25997d9f40cd8a891ab0064a4" - integrity sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ== - dependencies: - p-limit "^2.0.0" - p-locate@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-4.1.0.tgz#a3428bb7088b3a60292f66919278b7c297ad4f07" @@ -5490,14 +5226,6 @@ parent-module@^1.0.0: dependencies: callsites "^3.0.0" -parse-json@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-4.0.0.tgz#be35f5425be1f7f6c747184f98a788cb99477ee0" - integrity sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw== - dependencies: - error-ex "^1.3.1" - json-parse-better-errors "^1.0.1" - parse-json@^5.0.0: version "5.2.0" resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.2.0.tgz#c76fc66dee54231c962b22bcc8a72cf2f99753cd" @@ -5521,11 +5249,6 @@ pascal-case@^3.1.2: no-case "^3.0.4" tslib "^2.0.3" -path-exists@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515" - integrity sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ== - path-exists@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-4.0.0.tgz#513bdbe2d3b95d7762e8c1137efa195c6c61b5b3" @@ -5551,13 +5274,6 @@ path-to-regexp@0.1.7: resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" integrity sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ== -path-to-regexp@^1.0.3: - version "1.8.0" - resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.8.0.tgz#887b3ba9d84393e87a0a0b9f4cb756198b53548a" - integrity sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA== - dependencies: - isarray "0.0.1" - path-type@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b" @@ -5573,24 +5289,6 @@ picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.0, picomatch@^2.3.1: resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42" integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA== -pify@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176" - integrity sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg== - -pify@^4.0.1: - version "4.0.1" - resolved "https://registry.yarnpkg.com/pify/-/pify-4.0.1.tgz#4b2cd25c50d598735c50292224fd8c6df41e3231" - integrity sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g== - -pkg-conf@^3.1.0: - version "3.1.0" - resolved "https://registry.yarnpkg.com/pkg-conf/-/pkg-conf-3.1.0.tgz#d9f9c75ea1bae0e77938cde045b276dac7cc69ae" - integrity sha512-m0OTbR/5VPNPqO1ph6Fqbj7Hv6QU7gR/tQW40ZqrL1rjgCU85W6C1bJn0BItuJqnR98PWzw7Z8hHeChD1WrgdQ== - dependencies: - find-up "^3.0.0" - load-json-file "^5.2.0" - pkg-dir@^4.1.0, pkg-dir@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-4.2.0.tgz#f099133df7ede422e81d1d8448270eeb3e4261f3" @@ -5598,18 +5296,6 @@ pkg-dir@^4.1.0, pkg-dir@^4.2.0: dependencies: find-up "^4.0.0" -please-upgrade-node@^3.2.0: - version "3.2.0" - resolved "https://registry.yarnpkg.com/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz#aeddd3f994c933e4ad98b99d9a556efa0e2fe942" - integrity sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg== - dependencies: - semver-compare "^1.0.0" - -pluralize@^8.0.0: - version "8.0.0" - resolved "https://registry.yarnpkg.com/pluralize/-/pluralize-8.0.0.tgz#1a6fa16a38d12a1901e0320fa017051c539ce3b1" - integrity sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA== - postcss-modules-extract-imports@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d" @@ -5761,16 +5447,6 @@ raw-body@2.5.1: iconv-lite "0.4.24" unpipe "1.0.0" -raw-body@2.5.2: - version "2.5.2" - resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.5.2.tgz#99febd83b90e08975087e8f1f9419a149366b68a" - integrity sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA== - dependencies: - bytes "3.1.2" - http-errors "2.0.0" - iconv-lite "0.4.24" - unpipe "1.0.0" - react-currency-input-field@^3.6.10: version "3.6.10" resolved "https://registry.yarnpkg.com/react-currency-input-field/-/react-currency-input-field-3.6.10.tgz#f04663a2074b894735edb6d9fae95499727596b1" @@ -6001,11 +5677,6 @@ regexp.prototype.flags@^1.4.3: define-properties "^1.2.0" functions-have-names "^1.2.3" -regexpp@^3.0.0: - version "3.2.0" - resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.2.0.tgz#0425a2768d8f23bad70ca4b90461fa2f1213e1b2" - integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg== - regexpu-core@^5.3.1: version "5.3.2" resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.3.2.tgz#11a2b06884f3527aec3e93dbbf4a3b958a95546b" @@ -6198,11 +5869,6 @@ selfsigned@^2.1.1: dependencies: node-forge "^1" -semver-compare@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/semver-compare/-/semver-compare-1.0.0.tgz#0dee216a1c941ab37e9efb1788f6afc5ff5537fc" - integrity sha512-YM3/ITh2MJ5MtzaM429anh+x2jiLVjqILF4m4oyQB18W7Ggea7BfqdH/wGMK7dDiMghv/6WG7znWMwUDzJiXow== - "semver@2 || 3 || 4 || 5": version "5.7.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7" @@ -6220,13 +5886,6 @@ semver@^6.0.0, semver@^6.1.1, semver@^6.1.2, semver@^6.3.0: resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d" integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw== -semver@^7.0.0, semver@^7.3.7: - version "7.5.3" - resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.3.tgz#161ce8c2c6b4b3bdca6caadc9fa3317a4c4fe88e" - integrity sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ== - dependencies: - lru-cache "^6.0.0" - semver@^7.3.4, semver@^7.3.8: version "7.5.0" resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.0.tgz#ed8c5dc8efb6c629c88b23d41dc9bf40c1d96cd0" @@ -6234,6 +5893,13 @@ semver@^7.3.4, semver@^7.3.8: dependencies: lru-cache "^6.0.0" +semver@^7.3.7: + version "7.5.3" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.3.tgz#161ce8c2c6b4b3bdca6caadc9fa3317a4c4fe88e" + integrity sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ== + dependencies: + lru-cache "^6.0.0" + send@0.18.0: version "0.18.0" resolved "https://registry.yarnpkg.com/send/-/send-0.18.0.tgz#670167cc654b05f5aa4a767f9113bb371bc706be" @@ -6283,11 +5949,6 @@ serve-static@1.15.0: parseurl "~1.3.3" send "0.18.0" -server-destroy@^1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/server-destroy/-/server-destroy-1.0.1.tgz#f13bf928e42b9c3e79383e61cc3998b5d14e6cdd" - integrity sha512-rb+9B5YBIEzYcD6x2VKidaa+cqYBJQKnU4oe4E3ANwRRN56yk/ua1YCJT1n21NTS8w6CcOclAKNP3PhdCXKYtQ== - setprototypeof@1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/setprototypeof/-/setprototypeof-1.1.0.tgz#d0bd85536887b6fe7c0d818cb962d9d91c54e656" @@ -6449,31 +6110,6 @@ stackframe@^1.3.4: resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.3.4.tgz#b881a004c8c149a5e8efef37d51b16e412943310" integrity sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw== -standard-engine@^15.0.0: - version "15.1.0" - resolved "https://registry.yarnpkg.com/standard-engine/-/standard-engine-15.1.0.tgz#717409a002edd13cd57f6554fdd3464d9a22a774" - integrity sha512-VHysfoyxFu/ukT+9v49d4BRXIokFRZuH3z1VRxzFArZdjSCFpro6rEIU3ji7e4AoAtuSfKBkiOmsrDqKW5ZSRw== - dependencies: - get-stdin "^8.0.0" - minimist "^1.2.6" - pkg-conf "^3.1.0" - xdg-basedir "^4.0.0" - -standard@^17.0.0: - version "17.1.0" - resolved "https://registry.yarnpkg.com/standard/-/standard-17.1.0.tgz#829eeeb3139ad50714294d3531592d60ad1286af" - integrity sha512-jaDqlNSzLtWYW4lvQmU0EnxWMUGQiwHasZl5ZEIwx3S/ijZDjZOzs1y1QqKwKs5vqnFpGtizo4NOYX2s0Voq/g== - dependencies: - eslint "^8.41.0" - eslint-config-standard "17.1.0" - eslint-config-standard-jsx "^11.0.0" - eslint-plugin-import "^2.27.5" - eslint-plugin-n "^15.7.0" - eslint-plugin-promise "^6.1.1" - eslint-plugin-react "^7.32.2" - standard-engine "^15.0.0" - version-guard "^1.1.1" - statuses@2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/statuses/-/statuses-2.0.1.tgz#55cb000ccf1d48728bd23c685a063998cf1a1b63" @@ -6484,13 +6120,6 @@ statuses@2.0.1: resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c" integrity sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA== -steno@^0.4.1: - version "0.4.4" - resolved "https://registry.yarnpkg.com/steno/-/steno-0.4.4.tgz#071105bdfc286e6615c0403c27e9d7b5dcb855cb" - integrity sha512-EEHMVYHNXFHfGtgjNITnka0aHhiAlo93F7z2/Pwd+g0teG9CnM3JIINM7hVVB5/rhw9voufD7Wukwgtw2uqh6w== - dependencies: - graceful-fs "^4.1.3" - string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" @@ -6823,11 +6452,6 @@ type-fest@^0.20.2: resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4" integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ== -type-fest@^0.3.0: - version "0.3.1" - resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.3.1.tgz#63d00d204e059474fe5e1b7c011112bbd1dc29e1" - integrity sha512-cUGJnCdr4STbePCgqNFbpVNCepa+kAVohJs1sLhxzdH+gnEoOd8VhbYa7pD3zZYGiURWM2xzEII3fQcRizDkYQ== - type-fest@^0.6.0: version "0.6.0" resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.6.0.tgz#8d2a2370d3df886eb5c90ada1c5bf6188acf838b" @@ -6961,16 +6585,11 @@ validate-npm-package-license@^3.0.1: spdx-correct "^3.0.0" spdx-expression-parse "^3.0.0" -vary@^1, vary@~1.1.2: +vary@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc" integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg== -version-guard@^1.1.1: - version "1.1.1" - resolved "https://registry.yarnpkg.com/version-guard/-/version-guard-1.1.1.tgz#7a6e87a1babff1b43d6a7b0fd239731e278262fa" - integrity sha512-MGQLX89UxmYHgDvcXyjBI0cbmoW+t/dANDppNPrno64rYr8nH4SHSuElQuSYdXGEs0mUzdQe1BY+FhVPNsAmJQ== - warning@^4.0.2: version "4.0.3" resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3" @@ -7200,11 +6819,6 @@ ws@^8.13.0: resolved "https://registry.yarnpkg.com/ws/-/ws-8.13.0.tgz#9a9fb92f93cf41512a0735c8f4dd09b8a1211cd0" integrity sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA== -xdg-basedir@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-4.0.0.tgz#4bc8d9984403696225ef83a1573cbbcb4e79db13" - integrity sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q== - y18n@^5.0.5: version "5.0.8" resolved "https://registry.yarnpkg.com/y18n/-/y18n-5.0.8.tgz#7f4934d0f7ca8c56f95314939ddcd2dd91ce1d55" @@ -7248,19 +6862,6 @@ yargs@^17.0.0: y18n "^5.0.5" yargs-parser "^21.1.1" -yargs@^17.0.1: - version "17.7.2" - resolved "https://registry.yarnpkg.com/yargs/-/yargs-17.7.2.tgz#991df39aca675a192b816e1e0363f9d75d2aa269" - integrity sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w== - dependencies: - cliui "^8.0.1" - escalade "^3.1.1" - get-caller-file "^2.0.5" - require-directory "^2.1.1" - string-width "^4.2.3" - y18n "^5.0.5" - yargs-parser "^21.1.1" - yn@3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/yn/-/yn-3.1.1.tgz#1e87401a09d767c1d5eab26a6e4c185182d2eb50"