From 20f7d961afb97ff6c86dba4fae6f3782c2a597af Mon Sep 17 00:00:00 2001 From: franco sanchez Date: Wed, 21 Feb 2024 12:29:11 -0300 Subject: [PATCH] chore: a new view has been created and some things improved --- .github/workflows/type-check.yml | 6 ++-- src/components/forms/FormEdit.tsx | 6 ++-- src/components/nav/menu/MenuProfile.tsx | 7 ++++ src/hooks/useMyToast.tsx | 10 +++--- src/pages/Book.tsx | 14 ++++---- src/pages/profile/Profile.tsx | 17 ++-------- src/pages/profile/account/MyAccount.tsx | 45 +++++++++++++++++++++++++ src/routes.tsx | 10 ++++++ 8 files changed, 84 insertions(+), 31 deletions(-) create mode 100644 src/pages/profile/account/MyAccount.tsx diff --git a/.github/workflows/type-check.yml b/.github/workflows/type-check.yml index 046cff0..b68b90d 100644 --- a/.github/workflows/type-check.yml +++ b/.github/workflows/type-check.yml @@ -13,7 +13,7 @@ jobs: runs-on: ubuntu-latest strategy: matrix: - node-version: [18.x] + node-version: [20.x] steps: - uses: actions/checkout@v2 - name: Use Node.js ${{ matrix.node-version }} @@ -24,5 +24,5 @@ jobs: run: npm ci - name: Run TypeScript type check run: npm run ts-lint - - name: Typecheck - uses: andoshin11/typescript-error-reporter-action@v1.0.2 + # - name: Typecheck + # uses: andoshin11/typescript-error-reporter-action@v1.0.2 diff --git a/src/components/forms/FormEdit.tsx b/src/components/forms/FormEdit.tsx index 23f1551..9a582f3 100644 --- a/src/components/forms/FormEdit.tsx +++ b/src/components/forms/FormEdit.tsx @@ -267,7 +267,8 @@ export function FormEdit({ title: 'Guardado', description: 'Modificaciones guardadas exitosamente.', icon: FaCheckCircle, - bgColor: 'green.50', + iconColor: 'green.700', + bgColor: 'black', }); navigate('/explore', { replace: true }); @@ -276,7 +277,8 @@ export function FormEdit({ title: 'Ha ocurrido un error', description: 'No se ha podido guardar las modificaciones.', icon: IoWarningSharp, - bgColor: 'red.400', + iconColor: 'red.400', + bgColor: 'black', }); } diff --git a/src/components/nav/menu/MenuProfile.tsx b/src/components/nav/menu/MenuProfile.tsx index 8841b13..b9145f2 100644 --- a/src/components/nav/menu/MenuProfile.tsx +++ b/src/components/nav/menu/MenuProfile.tsx @@ -64,6 +64,13 @@ export function MenuProfile({ displayName, photoURL, username }: MenuType) { > Crear Publicación + + Cuenta + diff --git a/src/hooks/useMyToast.tsx b/src/hooks/useMyToast.tsx index 9cc5159..2ddb78f 100644 --- a/src/hooks/useMyToast.tsx +++ b/src/hooks/useMyToast.tsx @@ -11,22 +11,22 @@ import { export function useMyToast() { const toast = useToast(); - function myToast({ bgColor, title, description, icon }) { + function myToast({ bgColor, iconColor, title, description, icon }) { toast({ - position: 'bottom-right', + position: 'bottom-left', containerStyle: { fontFamily: 'sans-serif', }, render: ({ onClose }) => ( - - + + {title} {description} - + ), }); diff --git a/src/pages/Book.tsx b/src/pages/Book.tsx index 7f752b8..312876d 100644 --- a/src/pages/Book.tsx +++ b/src/pages/Book.tsx @@ -21,6 +21,7 @@ import { FiMoreHorizontal, } from 'react-icons/fi'; import { BsTag } from 'react-icons/bs'; +import { FaCheckCircle } from 'react-icons/fa'; import LazyLoad from 'react-lazy-load'; import { useBook, useDeleteBook } from '@hooks/querys'; @@ -35,6 +36,7 @@ import { ModalOptions } from '@components/modals/ModalOptions'; import { ModalConfirmation } from '@components/modals/ModalConfirmation'; import { ModalForm } from '@components/modals/ModalForm'; import { useAuth } from '@contexts/AuthContext'; +import { useMyToast } from '@hooks/useMyToast'; const Categories = lazy(() => import('@components/Categories')); const MoreBooksAuthors = lazy( @@ -53,7 +55,7 @@ export default function Book() { const infoTextColor = useColorModeValue('gray.600', 'gray.400'); const bgButton = useColorModeValue('white', 'black'); const navigate = useNavigate(); - const toast = useToast(); + const myToast = useMyToast(); const { isOpen: isOpenOptions, onOpen: onOpenOptions, @@ -99,14 +101,12 @@ export default function Book() { } if (isSuccess) { - toast({ + myToast({ title: 'Libro eliminado', description: 'Se ha eliminado exitosamente.', - position: 'bottom-right', - isClosable: true, - containerStyle: { - fontFamily: 'sans-serif', - }, + icon: FaCheckCircle, + iconColor: 'green.700', + bgColor: 'black', }); navigate('/explore', { replace: true }); diff --git a/src/pages/profile/Profile.tsx b/src/pages/profile/Profile.tsx index 065213a..3f81141 100644 --- a/src/pages/profile/Profile.tsx +++ b/src/pages/profile/Profile.tsx @@ -1,6 +1,6 @@ -import React, { useEffect } from 'react'; -import { useParams, useLocation, useNavigate } from 'react-router-dom'; -import { Box, Button, Flex, Image, useColorModeValue } from '@chakra-ui/react'; +import React from 'react'; +import { useParams } from 'react-router-dom'; +import { Box, Flex, Image, useColorModeValue } from '@chakra-ui/react'; import { MySimpleGrid } from '@components/MySimpleGrid'; import { Card } from '@components/cards/Card'; @@ -11,16 +11,13 @@ import { parseDate } from '@utils/utils'; import { CardType } from '@components/types'; import ResultLength from '@components/ResultLength'; import { useAuth } from '@contexts/AuthContext'; -import { useAccountActions } from '@hooks/useAccountActions'; // import { logOut } from '../../services/firebase/auth'; export default function Profile() { const getToken = window.localStorage.getItem('app_tk'); - const { deleteAccount } = useAccountActions(); const { currentUser } = useAuth(); const uid = currentUser?.uid; const { username } = useParams(); - const navigate = useNavigate(); const { data } = useProfile(username, uid, getToken); const bgCover = useColorModeValue('gray.100', 'gray.700'); @@ -67,14 +64,6 @@ export default function Profile() { PUBLICACIONES - + + + + + + + ); +} diff --git a/src/routes.tsx b/src/routes.tsx index 39ddcb9..b6649b0 100644 --- a/src/routes.tsx +++ b/src/routes.tsx @@ -11,6 +11,8 @@ import { SkeletonAllBooks } from '@components/skeletons/SkeletonABooks'; import { SkeletonDetailsBook } from '@components/skeletons/SkeletonDBook'; import { PrivateRoute } from '@components/PrivateRoute'; +import { MyAccount } from '@pages/profile/account/MyAccount'; + const PrivacyPolicies = lazy(() => import('@pages/PrivacyPolicies')); const Explore = lazy(() => import('@pages/Explore')); const Book = lazy(() => import('@pages/Book')); @@ -96,6 +98,14 @@ const routes = createBrowserRouter([ ), }, + { + path: '/my-account', + element: ( + + + + ), + }, { path: '*', element: ,