From fa8e4893e0518018449356be3f7dc49e842e4628 Mon Sep 17 00:00:00 2001 From: Joaovitor045 Date: Wed, 15 Jan 2025 20:38:31 -0300 Subject: [PATCH 1/3] feat: create a begin of a front --- src/images/logo.jpeg | Bin 0 -> 3095 bytes src/pages/BorrowBook/index.tsx | 27 ++++++++++++++++++++++++++ src/pages/SignUp/SignUpForm/index.tsx | 12 +++++++----- 3 files changed, 34 insertions(+), 5 deletions(-) create mode 100644 src/images/logo.jpeg create mode 100644 src/pages/BorrowBook/index.tsx diff --git a/src/images/logo.jpeg b/src/images/logo.jpeg new file mode 100644 index 0000000000000000000000000000000000000000..44211b0a99c961e8a5a245968cd752b1f4b609f6 GIT binary patch literal 3095 zcmb_edpK0<9{$E4w_@Ddk&=|qutRFoWrqk`YFx%8Cb{GqhG`;~Q>l$<6spN&$hgcH z4GBeVyHdv`#LO6m3<-sCi`-pBY*9L%` zjit3EfWZKOK?AJ4gLPY*n`2I(>@BT-JNnJh2q1|53_!@aNG!_AOx?xRO?}!0YJ+APaib>O>gRuYcteWC^XK3VBibXfi*Y>yn!CX48YG|4=`Tq z1?B)QB7|^;Ll6}g6+%K>TufY2LP|+Fs~=@8~&tx<5Tj&5*RLDiyuYuz|6A&i$?-C%oqL%uuPv zm5!$_p~`n2U%Xux=w~x*xtrL<{zN?J1~q1rMC+Ic(Pm$D`E+FX0)UNpZa8VNH0*=e z$={yJv>OjB%G*yVPyfnesAPGDN?F#EqWekFde=6S_IX+RYPIm(FN8|%&mo}Wy3*y` z?!G4+>mEPN$D~v>A)Wj}LU~vPuh^=*YzW?}X_=qBGbdw8pqe-R9y3>MyS&xHKYE|6(|x-Ca{BnSfqu-D1fOs< zjAPfwE?kAF5=-0uCr=$a#U1B;lbf{O&YG_G*v>5|@{gvm0?#~p@sECv+KqlxGH#4` zIW{EL8;@BuPNR~^#XBw+XKCl+&mU`uK=&MrUAS_}xDnCfL_o0`1*^U)NYm7qxmJym zR>jx#1GZxs;S?P{Sx^3J2X=Y8O8a%>w(?vQX*iAim1#BBEK;q~jFcz|+FtFTfs3?m z(a|cps9&nYEbA@qo4Svw<`}Mo)&7Exqt_C6)tC0I=nX%M2u$#f&R1)#+a2`bhQ$}{ z*#NO-B(A*eSS2CJJ}Bequ}QXdyS)B0CqaLD$N67zSsN?Mub>_C#TM&!MLDKK#k*Ow z*m6IdYBG&xguWOgWp4SU{np6erPRIB;C81ietTta39z1VGqairy|@By~79KRp}A>QwzCo@tJPigNNOG&$|GIvF_ z!f}{1*_J{4l8EkTS#-&&XQ;;NS}k-_j<3EhSolDFl3AnNQcG^Na#)B;Fs%;1I?~J2 zeYvz<`K@2$ExBU@*^l4gOHI$8jR%%qnE1= zw2yro=^i_F^$y04bv~b^De@;@sBf%s@;%4HJ^5(uyVT~g1~RGHw3aaGh+cc2$4rY_ z@-24qsLrwu4O2LY>YpXtp#%-Knd@#WdtWfks~dk)AM%-CS73CF6P%ZOW@lBvU~s@( z;5K4Zb7@Uf^2+dRGQqmewIJwJ{muo9&kpvYNk#sli`9*+OD9SBCIz0C*> zS^I#dwNUV$e+#utUbq{!lGMXQ8aZ}bu=}MsE97G3se)?Vn{@2vXhHJZ(NexPD(i7J zsez~&H2<27#RW3-kJ=}dE%3`}vLP`Yy>TnJRMXviu!eEPaikB)K{wnbj_GlaL4}qbY={IA2GP*JZ2Z)SzTqi);mpxPBKL0%)tqRX!3DY*m^^N1 zd(${2e|Y%(oAT27ioMVEjv3q&b&{YcN29T(BTNtKihmAFv$L|^z2hNMPm@~DsqK2OO(1@85+6Hk2WOo(feB7dq#3w_Il_B1r(P* z`gP<}UXm`Z?EJGIa{OIl_F6|PKY6U!5B$Z3?rD{^pH zsY=qEPKx?h>O?o^)SU-`cTAbT1<+dC=`K@x6m)mKL5kt%657ZKO=3Az(=OR9g>Z|X zmSCGRU7yz|Q);h!xE1+zsrFX2PLLALdq};ww)lH;si%Mu+5hoi^+mR`V6g?y<~<-J zE*{^_MGmRwr&z85$&?vQK1ml}6078F{khYv#5sQEk8v&{>7oOUdOu|hdLis$7|(hf&OIXlEBJ(=J6 znH + + + + Logo + + + + + + + + + + + + + ); +} + +export default BorrowBook; diff --git a/src/pages/SignUp/SignUpForm/index.tsx b/src/pages/SignUp/SignUpForm/index.tsx index bb473f1..1e39c71 100644 --- a/src/pages/SignUp/SignUpForm/index.tsx +++ b/src/pages/SignUp/SignUpForm/index.tsx @@ -93,12 +93,14 @@ function SignUpForm() { return onlyNumbers.length === 11 || "Telefone inválido."; } })} + onChange={(e) => { - const formatted = formatPhoneNumber(e.target.value); - e.target.value = formatted; - register('phone').onChange(e); - trigger('phone'); - }} + const formatted = formatPhoneNumber(e.target.value); + register('phone').onChange({ + target: { name: 'phone', value: formatted } + }); + trigger('phone'); + }} /> Date: Tue, 21 Jan 2025 14:36:38 -0300 Subject: [PATCH 2/3] feat:front of borrow book --- src/components/ui/rating.tsx | 27 +++++++++++ .../BorrowBook/BorrowBookHeader/index.tsx | 13 ++++++ .../BorrowBook/BorrowBookLivro/index.tsx | 46 +++++++++++++++++++ src/pages/BorrowBook/Buton/index.tsx | 11 +++++ src/pages/BorrowBook/index.tsx | 39 ++++++++++------ 5 files changed, 121 insertions(+), 15 deletions(-) create mode 100644 src/components/ui/rating.tsx create mode 100644 src/pages/BorrowBook/BorrowBookHeader/index.tsx create mode 100644 src/pages/BorrowBook/BorrowBookLivro/index.tsx create mode 100644 src/pages/BorrowBook/Buton/index.tsx diff --git a/src/components/ui/rating.tsx b/src/components/ui/rating.tsx new file mode 100644 index 0000000..5609f26 --- /dev/null +++ b/src/components/ui/rating.tsx @@ -0,0 +1,27 @@ +import { RatingGroup } from "@chakra-ui/react" +import * as React from "react" + +export interface RatingProps extends RatingGroup.RootProps { + icon?: React.ReactElement + count?: number + label?: React.ReactNode +} + +export const Rating = React.forwardRef( + function Rating(props, ref) { + const { icon, count = 5, label, ...rest } = props + return ( + + {label && {label}} + + + {Array.from({ length: count }).map((_, index) => ( + + + + ))} + + + ) + }, +) diff --git a/src/pages/BorrowBook/BorrowBookHeader/index.tsx b/src/pages/BorrowBook/BorrowBookHeader/index.tsx new file mode 100644 index 0000000..1ea07eb --- /dev/null +++ b/src/pages/BorrowBook/BorrowBookHeader/index.tsx @@ -0,0 +1,13 @@ +import { Box, Flex, Image } from '@chakra-ui/react'; + +const BorrowBookHeader = () => ( + + + + Logo + + + +); + +export default BorrowBookHeader; diff --git a/src/pages/BorrowBook/BorrowBookLivro/index.tsx b/src/pages/BorrowBook/BorrowBookLivro/index.tsx new file mode 100644 index 0000000..1e1f83d --- /dev/null +++ b/src/pages/BorrowBook/BorrowBookLivro/index.tsx @@ -0,0 +1,46 @@ +import { Box, Flex, Image, Text } from '@chakra-ui/react'; +import { Rating } from "../../../components/ui/rating"; + +interface Book { + title: string; + author: string; + rating: number; + description: string; + coverImage: string; +} + +const BorrowBookLivro = ({ book }: { book: Book }) => ( + + + {`Capa + + {`Título: ${book.title}`} + Autor: {book.author} + + + + Avaliação: + + + + + + + + + Descrição: {book.description} + + + + +); + +export default BorrowBookLivro; diff --git a/src/pages/BorrowBook/Buton/index.tsx b/src/pages/BorrowBook/Buton/index.tsx new file mode 100644 index 0000000..91e2c69 --- /dev/null +++ b/src/pages/BorrowBook/Buton/index.tsx @@ -0,0 +1,11 @@ +import { Box, Button } from '@chakra-ui/react'; + +const BorrowButton = () => ( + + + +); + +export default BorrowButton; diff --git a/src/pages/BorrowBook/index.tsx b/src/pages/BorrowBook/index.tsx index b8ae1ec..bf3a70a 100644 --- a/src/pages/BorrowBook/index.tsx +++ b/src/pages/BorrowBook/index.tsx @@ -1,23 +1,32 @@ -import { Box, Button, Heading, Flex, Image } from '@chakra-ui/react'; +import { Box, Grid } from '@chakra-ui/react'; import { NavBar } from '../../components/NavBar'; - +import BorrowBookHeader from './BorrowBookHeader'; +import BorrowBookLivro from './BorrowBookLivro'; +import BorrowButton from './Buton'; + +const book = { + title: "Curupira, O guardião da floresta", + author: "Saci-Pererê", + rating: 5, + description: "Lorem Ipsum Lorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem Ipsum.", + coverImage: "/logo.png" +}; function BorrowBook() { return ( - - - - Logo - - - - - - - - - + + + + + + From df4070af80fe6754b01bfb5c3ae7053d0db6c610 Mon Sep 17 00:00:00 2001 From: Joaovitor045 Date: Thu, 23 Jan 2025 08:56:41 -0300 Subject: [PATCH 3/3] feature:us 05 front concluded --- .../BorrowBook/BorrowBookLivro/index.tsx | 7 +- src/pages/BorrowBook/BorrowButton/index.tsx | 78 +++++++++++++++++++ src/pages/BorrowBook/Buton/index.tsx | 11 --- src/pages/BorrowBook/index.tsx | 15 ++-- 4 files changed, 89 insertions(+), 22 deletions(-) create mode 100644 src/pages/BorrowBook/BorrowButton/index.tsx delete mode 100644 src/pages/BorrowBook/Buton/index.tsx diff --git a/src/pages/BorrowBook/BorrowBookLivro/index.tsx b/src/pages/BorrowBook/BorrowBookLivro/index.tsx index 1e1f83d..7b683bd 100644 --- a/src/pages/BorrowBook/BorrowBookLivro/index.tsx +++ b/src/pages/BorrowBook/BorrowBookLivro/index.tsx @@ -1,6 +1,7 @@ import { Box, Flex, Image, Text } from '@chakra-ui/react'; import { Rating } from "../../../components/ui/rating"; + interface Book { title: string; author: string; @@ -20,12 +21,12 @@ const BorrowBookLivro = ({ book }: { book: Book }) => ( mr={8} /> - {`Título: ${book.title}`} - Autor: {book.author} + {` ${book.title}`} + Autor: {book.author} - Avaliação: + diff --git a/src/pages/BorrowBook/BorrowButton/index.tsx b/src/pages/BorrowBook/BorrowButton/index.tsx new file mode 100644 index 0000000..60a9aed --- /dev/null +++ b/src/pages/BorrowBook/BorrowButton/index.tsx @@ -0,0 +1,78 @@ +import { HStack } from "@chakra-ui/react"; +import { toaster } from "../../../components/ui/toaster"; +import { + DialogContent, + DialogRoot, + DialogTitle, + DialogTrigger, + DialogHeader, + DialogFooter, + DialogBody, + DialogActionTrigger, + DialogCloseTrigger, +} from "../../../components/ui/dialog"; +import { Button } from "../../../components/ui/button"; +import { useNavigate } from "react-router"; + +interface Book { + title: string; + author: string; + rating: number; + description: string; + coverImage: string; + status: string; +} + +const BorrowBook = ({ book }: { book: Book }) => { + const navigate = useNavigate(); + + const handleBorrow = async () => { + toaster.create({ + title: `Empréstimo Realizado`, + type: "success", + }); + + navigate("/perfil"); + }; + + return ( + + + + + + + + + + +

Deseja realizar esse empréstimo?

+
+ + + + + + + +
+
+
+ ); +}; + +export default BorrowBook; diff --git a/src/pages/BorrowBook/Buton/index.tsx b/src/pages/BorrowBook/Buton/index.tsx deleted file mode 100644 index 91e2c69..0000000 --- a/src/pages/BorrowBook/Buton/index.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import { Box, Button } from '@chakra-ui/react'; - -const BorrowButton = () => ( - - - -); - -export default BorrowButton; diff --git a/src/pages/BorrowBook/index.tsx b/src/pages/BorrowBook/index.tsx index bf3a70a..1611633 100644 --- a/src/pages/BorrowBook/index.tsx +++ b/src/pages/BorrowBook/index.tsx @@ -2,21 +2,21 @@ import { Box, Grid } from '@chakra-ui/react'; import { NavBar } from '../../components/NavBar'; import BorrowBookHeader from './BorrowBookHeader'; import BorrowBookLivro from './BorrowBookLivro'; -import BorrowButton from './Buton'; +import BorrowButton from './BorrowButton'; const book = { title: "Curupira, O guardião da floresta", author: "Saci-Pererê", - rating: 5, + rating: 4.5, description: "Lorem Ipsum Lorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem Ipsum.", - coverImage: "/logo.png" + coverImage: "/logo.png", + status: "Available" }; function BorrowBook() { return ( - - - + + - - + ); }