From e666148507f231e09a5f336ee73ba313bc54fde9 Mon Sep 17 00:00:00 2001 From: alifhaider Date: Mon, 28 Oct 2024 06:29:13 +0600 Subject: [PATCH] fix few things --- app/root.tsx | 2 +- app/routes/search.tsx | 38 +++++++++++++++++++++++++----------- app/routes/signup.tsx | 35 +++++++++++++++++++++------------ app/services/auth.server.ts | 3 ++- app/tailwind.css | 22 +++++++++++++++++++++ app/utils/schedule.test.ts | 4 +++- app/utils/schedule.ts | 12 ++++-------- app/utils/user-validation.ts | 5 +++++ 8 files changed, 86 insertions(+), 35 deletions(-) diff --git a/app/root.tsx b/app/root.tsx index 1e6ba5b..c58c500 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -76,7 +76,7 @@ export function App() { } }, [toast, notify]) return ( - + diff --git a/app/routes/search.tsx b/app/routes/search.tsx index fab9454..9d21bfe 100644 --- a/app/routes/search.tsx +++ b/app/routes/search.tsx @@ -6,7 +6,7 @@ import { prisma } from '~/db.server' import { Card, CardContent } from '~/components/ui/card' import { Avatar, AvatarFallback, AvatarImage } from '~/components/ui/avatar' import { Badge } from '~/components/ui/badge' -import { MapPin, Star } from 'lucide-react' +import { MapPin, MoveUpRight, Star } from 'lucide-react' import { Tooltip, TooltipContent, @@ -19,6 +19,7 @@ import { getUpcomingDateSchedules, } from '~/utils/schedule' import { formatDistance } from 'date-fns' +import React, { useEffect } from 'react' export const meta: MetaFunction = () => { return [ @@ -104,6 +105,7 @@ export async function loader({ request }: LoaderFunctionArgs) { export default function Search() { const [searchParams] = useSearchParams() const { doctors } = useLoaderData() + return (
@@ -143,10 +145,15 @@ export default function Search() { const closestDateSchedules = getUpcomingDateSchedules( doctor.schedules, ) + + if (closestDateSchedules.length === 0) return null + + const nextSchedule = closestDateSchedules[0] + const formattedDateDifference = getFormattedTimeDifference( - closestDateSchedules[0]?.date, - closestDateSchedules[0]?.startTime, - closestDateSchedules[closestDateSchedules.length - 1]?.endTime, + nextSchedule.date, + nextSchedule.startTime, + closestDateSchedules[closestDateSchedules.length - 1].endTime, ) return ( @@ -173,9 +180,14 @@ export default function Search() {
-

- {user.fullName ?? user.username} -

+ +

+ {user.fullName ?? user.username}{' '} +

+
{doctor.specialties.map((specialty, index) => ( @@ -189,10 +201,14 @@ export default function Search() { -
- {formatTime(schedule?.startTime)} -{' '} - {formatTime(schedule?.endTime)} -
+ +
+ {formatTime(schedule?.startTime)} -{' '} + {formatTime(schedule?.endTime)} +
+

diff --git a/app/routes/signup.tsx b/app/routes/signup.tsx index b2e7d5e..25b0760 100644 --- a/app/routes/signup.tsx +++ b/app/routes/signup.tsx @@ -11,6 +11,7 @@ import { z } from 'zod' import bcrypt from 'bcryptjs' import { prisma } from '~/db.server' import { + ConfirmPasswordSchema, EmailSchema, PasswordSchema, UsernameSchema, @@ -25,25 +26,27 @@ const SignupFormSchema = z username: UsernameSchema, email: EmailSchema, password: PasswordSchema, - confirmPassword: PasswordSchema, - agreeToTermsOfServiceAndPrivacyPolicy: z.boolean({ - required_error: - 'You must agree to the terms of service and privacy policy', - }), - remember: z.boolean().optional(), + confirmPassword: ConfirmPasswordSchema, + agreeToTermsOfServiceAndPrivacyPolicy: z + .string({ required_error: 'You must agree to the terms of service' }) + .refine(value => value === 'true', { + message: 'You must agree to the terms of service and privacy policy', + }), + remember: z.string().optional(), }) .superRefine(({ confirmPassword, password }, ctx) => { if (confirmPassword !== password) { ctx.addIssue({ path: ['confirmPassword'], code: 'custom', - message: 'The passwords must match', + message: 'Passwords do not match', }) } }) export async function action({ request }: ActionFunctionArgs) { const formData = await request.formData() + console.log('formData in action', Object.fromEntries(formData)) // await validateCSRF(formData, request.headers) // checkHoneypot(formData) const submission = await parseWithZod(formData, { @@ -95,7 +98,7 @@ export async function action({ request }: ActionFunctionArgs) { return redirect('/', { headers: { 'set-cookie': await sessionStorage.commitSession(cookieSession, { - expires: remember ? getSessionExpirationDate() : undefined, + expires: remember === 'true' ? getSessionExpirationDate() : undefined, }), }, }) @@ -113,6 +116,7 @@ export default function SignupRoute() { id: 'signup-form', lastResult: actionData, onValidate({ formData }) { + console.log('formData', Object.fromEntries(formData)) return parseWithZod(formData, { schema: SignupFormSchema }) }, shouldRevalidate: 'onBlur', @@ -184,10 +188,12 @@ export default function SignupRoute() { 'Do you agree to our Terms of Service and Privacy Policy?', }} // @ts-expect-error @ts-ignore - buttonProps={getInputProps( - fields.agreeToTermsOfServiceAndPrivacyPolicy, - { type: 'checkbox' }, - )} + buttonProps={{ + ...getInputProps(fields.agreeToTermsOfServiceAndPrivacyPolicy, { + type: 'checkbox', + }), + value: 'true', + }} errors={fields.agreeToTermsOfServiceAndPrivacyPolicy.errors} /> diff --git a/app/services/auth.server.ts b/app/services/auth.server.ts index 27458f8..ec124c4 100644 --- a/app/services/auth.server.ts +++ b/app/services/auth.server.ts @@ -6,7 +6,8 @@ import { prisma } from '~/db.server' import { combineResponseInits } from '~/utils/misc' import { authSessionStorage } from './session.server' -const SESSION_EXPIRATION_TIME = 1000 * 60 * 60 * 24 * 30 +const SESSION_EXPIRATION_TIME = 1000 * 60 * 60 * 24 * 30 // 30 days + export const getSessionExpirationDate = () => new Date(Date.now() + SESSION_EXPIRATION_TIME) diff --git a/app/tailwind.css b/app/tailwind.css index e64738c..3024666 100644 --- a/app/tailwind.css +++ b/app/tailwind.css @@ -95,4 +95,26 @@ filter: invert(0); } } + + @keyframes shake { + 0% { + transform: translateX(0); + } + 25% { + transform: translateX(-5px); + } + 50% { + transform: translateX(5px); + } + 75% { + transform: translateX(-5px); + } + 100% { + transform: translateX(0); + } + } + + .shake { + animation: shake 0.3s ease-in-out; + } } diff --git a/app/utils/schedule.test.ts b/app/utils/schedule.test.ts index 0cdbc19..f477844 100644 --- a/app/utils/schedule.test.ts +++ b/app/utils/schedule.test.ts @@ -247,13 +247,14 @@ describe('getFormattedTimeDifference', () => { expect(result).toBe('Today') }) - it('should return today if the date is today and time is in 4 hours', () => { + it.only('should return today if the date is today and time is in 4 hours', () => { const today = new Date() const result = getFormattedTimeDifference( today.toISOString(), today.getHours() + ':00', today.getHours() + 4 + ':00', ) + console.log(result) expect(result).toBe('Today') }) @@ -265,6 +266,7 @@ describe('getFormattedTimeDifference', () => { tomorrow.getHours() + ':00', tomorrow.getHours() + 4 + ':00', ) + console.log(result) expect(result).toBe('in 1 day') }) }) diff --git a/app/utils/schedule.ts b/app/utils/schedule.ts index ca230a6..2eb496f 100644 --- a/app/utils/schedule.ts +++ b/app/utils/schedule.ts @@ -101,11 +101,10 @@ export function getFormattedTimeDifference( if (!isValidDate(date) || !isValidTime(startTime) || !isValidTime(endTime)) { return '' } + const scheduleDate = new Date(date) const currentTime = new Date() - const today = isToday(scheduleDate) - // Extract hours and minutes from startTime and endTime const [startHour, startMinute] = startTime.split(':').map(Number) const [endHour, endMinute] = endTime.split(':').map(Number) @@ -117,14 +116,11 @@ export function getFormattedTimeDifference( const end = new Date(scheduleDate) end.setHours(endHour, endMinute) - // Check if the current time is within the schedule's time range - const isWithinTimeRange = currentTime >= start && currentTime <= end - - // If today and within the time range, return "Today" - if (today && isWithinTimeRange) { + // Check if the schedule date is today (ignoring time range) + if (isToday(scheduleDate)) { return 'Today' } - // Otherwise, return the time difference using formatDistance + // If not today, return the time difference (e.g., "in 14 hours", "3 days ago") return formatDistance(scheduleDate, currentTime, { addSuffix: true }) } diff --git a/app/utils/user-validation.ts b/app/utils/user-validation.ts index daedc78..e16c4b0 100644 --- a/app/utils/user-validation.ts +++ b/app/utils/user-validation.ts @@ -14,6 +14,11 @@ export const PasswordSchema = z .string({ required_error: 'Password is required' }) .min(2, { message: 'Password is too short' }) .max(100, { message: 'Password is too long' }) + +export const ConfirmPasswordSchema = z.string({ + required_error: 'Confirm Password is required', +}) + export const NameSchema = z .string({ required_error: 'Name is required' }) .min(3, { message: 'Name is too short' })