Add reviews in data models and add number validate in validate.js. Ad…

…d login link in ptsitterDetails and add getRole to index.js to app b00tc4mp#99
TatiGV · Aug 26, 2024 · cce15ff · cce15ff
1 parent 07acb67
commit cce15ff
Show file tree

Hide file tree

Showing 6 changed files with 88 additions and 17 deletions.
diff --git a/staff/tatiana-garcia/project/app/logic/index.js b/staff/tatiana-garcia/project/app/logic/index.js
@@ -2,6 +2,7 @@ import registerUser from './registerUser'
 import registerPetsitterUser from './registerPetsitterUser'
 import getUser from './getUser'
 import getUserId from './getUserId'
+import getUserRole from './getUserRole'
 import loginUser from './loginUser'
 import isUserLoggedIn from './isUserLoggedIn'
 import logoutUser from './logoutUser'
@@ -15,6 +16,7 @@ const logic = {
     registerPetsitterUser,
     getUser,
     getUserId,
+    getUserRole,
     loginUser,
     isUserLoggedIn,
     logoutUser,

diff --git a/staff/tatiana-garcia/project/app/view/App.jsx b/staff/tatiana-garcia/project/app/view/App.jsx
@@ -42,6 +42,8 @@ export default function App() {
     navigate('/login')
   }
 
+  const onLoginClicked = () => navigate('/login')
+
   const handleAlertAccept = () => setAlertMessage(null)
 
   return <Context.Provider value={{ alert: setAlertMessage }}>
@@ -53,7 +55,7 @@ export default function App() {
       <Route path='/registerPetsitter' element={logic.isUserLoggedIn() ? <Navigate to='/' /> : <RegisterPetsitterUser onRegisterPetsitterUser={handleRegisterPetsitterUser} onLoginClick={handleLoginClick} />} />
       <Route path='/petsitters' element={<Petsitters />} />
       <Route path='/settings' element={<Settings onLogoutClick={handleLogout} />} />
-      <Route path='/petsitters/:petsitterId' element={<PetsitterDetails />} />
+      <Route path='/petsitters/:petsitterId' element={<PetsitterDetails handleLoginClick={onLoginClicked} />} />
     </Routes>
 
     {alertMessage && <Alert message={alertMessage} onAccept={handleAlertAccept} />}

diff --git a/staff/tatiana-garcia/project/app/view/petsitters/index.jsx b/staff/tatiana-garcia/project/app/view/petsitters/index.jsx
@@ -60,7 +60,7 @@ export default function SearchPetsitters() {
     return <>
         <Header />
         <main className='bg-teal-100 h-screen mt-16 mb-12 flex flex-col items-center justify-start gap-4 text-[1.5rem]'>
-            <Container className='p-4 bg-teal-100 w-full max-w-sm'>
+            <Container className='p-2 bg-teal-100 w-full max-w-sm'>
                 <Heading className='text-center mb-4 font-bold'>Guarderías</Heading>
 
                 <Container className='text-lg p-0 rounded-[50px] text-center flex-col'>
@@ -134,13 +134,13 @@ export default function SearchPetsitters() {
                                 <div className='flex flex-col'>
                                     <Heading className='text-base font-bold'>{petsitter.name}</Heading>
                                     <Paragraph className='text-sm mt-1 ml-0 font-semibold text-gray-500'>{petsitter.city}</Paragraph>
-                                    <Paragraph className='text-sm mt-0 ml-0 text-gray-700'>{petsitter.description.substring(0, 30)}</Paragraph>
+                                    <Paragraph className='text-sm mt-0 ml-0 text-gray-700 overflow-hidden text-ellipsis' >{petsitter.description.substring(0, 40)}</Paragraph>
                                 </div>
                             </div>
                         ))
                     ) : (
                         <div className='text-center justify-center items-center flex flex-col'>
-                            <Paragraph className=' text-gray-500'>No hay guarderías disponible para la selección actual.</Paragraph>
+                            <Paragraph className=' text-gray-500'>No hay guarderías disponibles para la selección actual.</Paragraph>
                         </div>
                     )}
                 </Container>

diff --git a/staff/tatiana-garcia/project/app/view/petsitters/petsitterDetails.jsx b/staff/tatiana-garcia/project/app/view/petsitters/petsitterDetails.jsx
@@ -7,14 +7,21 @@ import logic from '../../logic/index.js'
 import Container from '../library/Container'
 import Header from '../home/Header'
 import Footer from '../home/Footer'
+import Link from '../library/Link.jsx'
 import Heading from '../library/Heading'
 import Paragraph from '../library/Paragraph'
+import Button from '../library/Button.jsx'
 
-export default function PetsitterDetails() {
+export default function PetsitterDetails({ handleLoginClick }) {
     const { alert } = useContext()
     const [petsitter, setPetsitter] = useState(null)
+    const [addReviewVisibility, setAddReviewVisibility] = useState(false)
     const { petsitterId } = useParams()
 
+    const [userRole, setUserRole] = useState(null)
+
+    const onLoginClick = () => handleLoginClick()
+
     useEffect(() => {
         try {
             logic.getPetsitterDetails(petsitterId)
@@ -25,43 +32,62 @@ export default function PetsitterDetails() {
                     alert(error.message)
                 })
 
+            if (logic.isUserLoggedIn()) {
+                const role = logic.getUserRole()
+                setUserRole(role)
+            }
+
         } catch (error) {
             console.error(error)
 
             alert(error.message)
         }
     }, [petsitterId, alert])
 
+
+
     return (<>
         <Header />
-        <main className='bg-teal-100 h-screen mt-16 mb-12 flex flex-col items-center justify-start gap-4 text-[1.5rem]'>
+        <main className='bg-teal-100 h-screen mt-16 mb-12 flex flex-col items-center justify-start gap-4 text-[1.5rem] overflow-y-auto'>
             <Container className='text-center mb-4'>
                 <Heading className='text-2xl font-bold'>Guardería</Heading>
             </Container>
             {petsitter != null ? (
-                <Container className='text-lg bg-white p-3 mt-0 rounded-[50px] shadow-lg'>
+                <Container className='text-lg bg-white p-3 mt-0 rounded-[50px] shadow-lg overflow-y-auto max-h-[80vh]'>
                     <Container className='flex items-center mb-4'>
                         <img src={petsitter.image} alt='Vetpoint' className='h-24 w-24 rounded-[15px] mr-4 p-2 ml-3' />
 
                         <Container className='flex flex-col'>
                             <Heading className='text-base font-bold'>{petsitter.name}</Heading>
                             <Paragraph className='text-sm mt-1 ml-0 font-semibold text-gray-500'>{petsitter.city}</Paragraph>
-                            <Paragraph className='text-sm mt-1 ml-0 font-semibold text-gray-500'>*****</Paragraph>
+                            <Paragraph className='text-sm mt-1 ml-0 font-semibold text-gray-500'>⭐⭐⭐⭐⭐</Paragraph>
                         </Container>
                     </Container>
 
                     <Container>
                         <Paragraph className=' flex flex-col text-sm text-gray-700 mb-4'>{petsitter.description}</Paragraph>
                     </Container>
 
+                    {
+                        userRole === 'regular' ? (
+                            <Container className='font-bold text-lg p-1 flex flex-row space-x-2'>
+                                <Button className='w-36 bg-green-100 text-black rounded-full hover:bg-green-200 transition duration-200'>Contáctame</Button>
+                                <Button className='w-36 bg-green-100 text-black rounded-full hover:bg-green-200 transition duration-200'>Valórame</Button>
+                            </Container>
+
+                        ) : (
+                            <Link className='text-xs font-bold ' onClick={onLoginClick}>Loguéate para contactar o valorar a tu guardería</Link>
+                        )
+                    }
+
                     <Container>
-                        <Heading className='items-start justify-start flex flex-row text-xl font-bold '>* Reseñas</Heading>
-                        <Container className='flex items-start'>
+                        <Heading className='items-start justify-start flex flex-row text-xl font-bold '>⭐ Reseñas</Heading>
+                        <Container className='flex flex-col max-h-48 overflow-y-auto space-y-4'>
                             <img src='https://res.cloudinary.com/worldpackers/image/upload/c_fill,f_auto,q_auto,w_1024/v1/guides/article_cover/kswgynyhsz3xfmptodmt' alt='foto koalas' className='h-24 w-24 rounded-[15px] p-2 ml-3 mr-2' />
                             <Container>
                                 <Container className='flex flex-row'>
                                     <Heading className='text-sm font-bold'>Manuel Barzi</Heading>
-                                    <Paragraph className='items-center my-0'>*****</Paragraph>
+                                    <Paragraph className='text-sm items-center my-0'>⭐⭐⭐⭐⭐</Paragraph>
                                 </Container>
                                 <Container>
                                     <Paragraph className=' text-sm mt-0 ml-0 text-gray-700'>Elena de Vetpoint, es muy simpática y ha cuidado fenomenal de mi iguana.</Paragraph>
@@ -72,18 +98,23 @@ export default function PetsitterDetails() {
                     </Container>
                 </Container>
 
-
             ) : (
 
                 <Container >
-
                     <Paragraph>Cargando...</Paragraph>
                 </Container>
 
             )}
             <Container>
                 <Footer defaultTab={'petsitters'} />
             </Container>
+
+            {addReviewVisibility && <>
+                <Container className='absolute bg-black opacity-70 w-screen h-screen z-20'></Container>
+                <Container>
+
+                </Container>
+            </>}
         </main>
     </>
     )

diff --git a/staff/tatiana-garcia/project/com/validate.js b/staff/tatiana-garcia/project/com/validate.js
@@ -3,7 +3,7 @@ import errors from './errors.js'
 const { ValidationError } = errors
 
 const EMAIL_REGEX = /^[a-z0-9._]+@[a-z0-9.-]{3,63}\.[a-z]{2,10}$/
-const NAME_REGEX = /^(?!.*\s{2})[a-zA-Z ]{3,16}$/
+const NAME_REGEX = /^(?!.*\s{2})[a-zA-Z0-9 ]+$/
 const PHONE_REGEX = /^\+?\d{9,15}$/
 
 function validateString(value, explain = 'value') {
@@ -60,6 +60,10 @@ function validatePhoneNumber(phoneNumber, explain = 'phoneNumber') {
     if (!PHONE_REGEX.test(phoneNumber)) throw new ValidationError(`invalid ${explain}`)
 }
 
+function validateNumber(number, explain = 'number') {
+    if (typeof number !== 'number') throw new ValidationError(`${explain} is not a number`)
+}
+
 const validate = {
     string: validateString,
     name: validateName,
@@ -71,7 +75,8 @@ const validate = {
     image: validateImage,
     pets: validatePets,
     array: validateArray,
-    phoneNumber: validatePhoneNumber
+    phoneNumber: validatePhoneNumber,
+    number: validateNumber
 }
 
 export default validate
diff --git a/staff/tatiana-garcia/project/cor/data/models.js b/staff/tatiana-garcia/project/cor/data/models.js
@@ -1,4 +1,6 @@
-import { Schema, model } from 'mongoose'
+import { Schema, Types, model } from 'mongoose'
+
+const { ObjectId } = Types
 
 const user = new Schema({
     name: {
@@ -41,8 +43,37 @@ const user = new Schema({
 
 })
 
+const review = new Schema({
+    author: {
+        type: ObjectId,
+        ref: 'User',
+        required: true
+    },
+    petsitter: {
+        type: ObjectId,
+        ref: 'User',
+        required: true
+    },
+    rate: {
+        type: Number,
+        required: true,
+        enum: [0, 1, 2, 3, 4, 5]
+    },
+    comment: {
+        type: String,
+        required: true
+    },
+    date: {
+        type: Date,
+        required: true,
+        default: Date.now
+    }
+})
+
 const User = model('User', user)
+const Review = model('Review', review)
 
 export {
-    User
+    User,
+    Review
 }