Bug fix, tooltip, date time optional edge case fix, centered names in…

… legend
sandboxnu · Aug 2, 2024 · c3a278a · c3a278a
1 parent 4274bba
commit c3a278a
Show file tree

Hide file tree

Showing 6 changed files with 49 additions and 39 deletions.
diff --git a/prisma/migrations/20240801200019_request_message_length/migration.sql b/prisma/migrations/20240801200019_request_message_length/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE `request` MODIFY `message` VARCHAR(255) NOT NULL;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
@@ -67,7 +67,7 @@ model Session {
 // Represents an Invitation to a user
 model Request {
   id         String @id @default(cuid()) // primary key
-  message    String
+  message    String @db.VarChar(255)
   fromUserId String // foreign key
   toUserId   String // foreign key
   fromUser   User   @relation("sentRequests", fields: [fromUserId], references: [id])

diff --git a/src/components/MapLegend.tsx b/src/components/MapLegend.tsx
@@ -11,19 +11,19 @@ export const MapLegend = (props: MapLegendProps) => {
   const role = props.role;
   return (
     <>
-      <div className="text-md absolute bottom-8 left-2 z-10 flex flex-col rounded-xl border bg-white p-2  md:text-lg">
-        <div className="my-1 flex flex-row">
+      <div className="text-md absolute bottom-8 left-2 z-10  flex flex-col rounded-xl border bg-white p-2  md:text-lg">
+        <div className="my-1 flex flex-row items-center">
           <Image className="" src={BlueSquare} width={32} height={32} />
           <p className="mx-2">My Destination</p>
         </div>
         {(role === "VIEWER" || role === "RIDER") && (
-          <div className="my-1 flex flex-row">
+          <div className="my-1 flex flex-row items-center">
             <Image className="" src={RedSquare} width={32} height={32} />
             <p className="mx-2">{"Driver Destination"}</p>
           </div>
         )}
         {(role === "VIEWER" || role === "DRIVER") && (
-          <div className="my-1 flex flex-row">
+          <div className="my-1 flex flex-row items-center">
             <Image className="" src={OrangeSquare} width={32} height={32} />
             <p className="mx-2">{"Rider Destination"}</p>
           </div>

diff --git a/src/components/Modals/ConnectModal.tsx b/src/components/Modals/ConnectModal.tsx
@@ -89,7 +89,7 @@ const ConnectModal = (props: ConnectModalProps): JSX.Element => {
             </div>
             <textarea
               className={`form-input h-24 min-h-[120px] w-full resize-none rounded-md px-3 py-2 shadow-sm`}
-              maxLength={280}
+              maxLength={255}
               defaultValue={customMessage}
               onChange={(e) => setCustomMessage(e.target.value)}
             ></textarea>

diff --git a/src/components/Profile/ControlledTimePicker.tsx b/src/components/Profile/ControlledTimePicker.tsx
@@ -26,7 +26,7 @@ const ControlledTimePickerRHF = (props: ControlledTimePickerRHFProps) => {
   const convertInputDateToUTC = (inputDate: Date): Date => {
     const inputHours = inputDate.getHours();
     const result = dayjs.utc(
-      `2022-2-2 ${inputHours}:${inputDate.getMinutes()}`
+      `2022-02-02 ${inputHours}:${inputDate.getMinutes()}`
     );
     return result.toDate();
   };
@@ -42,33 +42,40 @@ const ControlledTimePickerRHF = (props: ControlledTimePickerRHFProps) => {
     <Controller
       name={props.name}
       control={props.control}
-      render={({ field: { ref, ...fieldProps }, fieldState }) => (
-        <div className={"flex flex-col"}>
-          <TimePicker
-            className="form-input w-full rounded-lg"
-            format="h:mm A"
-            suffixIcon={customSuffixIcon()}
-            ref={ref}
-            status={fieldState.error ? "error" : undefined}
-            placeholder={props.placeholder}
-            showNow={false}
-            disabled={props.isDisabled}
-            minuteStep={15}
-            use12Hours={true}
-            value={displayedTime}
-            onSelect={(date) => {
-              if (!date.isUTC()) {
-                const utcDate = convertInputDateToUTC(date.toDate());
-                setDisplayedTime(date);
-                fieldProps.onChange(utcDate);
-              } else {
-                setDisplayedTime(dayjs.utc(date));
-                fieldProps.onChange(date.toDate());
-              }
-            }}
-          />
-        </div>
-      )}
+      render={({ field: { ref, ...fieldProps }, fieldState }) => {
+        // Log the error state to the console
+        if (fieldState.error) {
+          console.log("Error in TimePicker:", fieldState.error);
+        }
+
+        return (
+          <div className={"flex flex-col"}>
+            <TimePicker
+              className="form-input w-full rounded-lg"
+              format="h:mm A"
+              suffixIcon={customSuffixIcon()}
+              ref={ref}
+              status={fieldState.error ? "error" : undefined}
+              placeholder={props.placeholder}
+              showNow={false}
+              disabled={props.isDisabled}
+              minuteStep={15}
+              use12Hours={true}
+              value={displayedTime}
+              onSelect={(date) => {
+                if (!date.isUTC()) {
+                  const utcDate = convertInputDateToUTC(date.toDate());
+                  setDisplayedTime(date);
+                  fieldProps.onChange(utcDate);
+                } else {
+                  setDisplayedTime(dayjs.utc(date));
+                  fieldProps.onChange(date.toDate());
+                }
+              }}
+            />
+          </div>
+        );
+      }}
     />
   );
 };

diff --git a/src/pages/profile.tsx b/src/pages/profile.tsx
@@ -69,8 +69,8 @@ const onboardSchema = z
     pronouns: z.string().optional(),
     daysWorking: z.array(z.boolean()).optional(),
     bio: z.string().optional(),
-    startTime: z.date().optional(),
-    endTime: z.date().optional(),
+    startTime: z.date().nullable().optional(),
+    endTime: z.date().nullable().optional(),
     timeDiffers: z.boolean().optional(),
   })
   .superRefine((data, ctx) => {
@@ -528,9 +528,10 @@ const Profile: NextPage = () => {
                     </div>
                   </div>
                   <Note className="py-4 md:w-96">
-                    If you don&apos;t have set times, communicate that on your
-                    own with potential riders/drivers. For start/end time, enter
-                    whatever best matches your work schedule.
+                    Please input the start and end times of your work, rather
+                    than your departure times. If your work hours are flexible,
+                    coordinate directly with potential riders or drivers to
+                    inform them.
                   </Note>
                   <div className="flex flex-col space-y-2"></div>
                 </CommutingScheduleSection>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		-- AlterTable
		ALTER TABLE `request` MODIFY `message` VARCHAR(255) NOT NULL;