Merge pull request #213 from chingu-x/fix/fix-multiple-issues

Fix/fix multiple issues
chingu-x · Aug 26, 2024 · 2bc71ae · 2bc71ae
2 parents 1a8bafd + 557ba20
commit 2bc71ae
Show file tree

Hide file tree

Showing 11 changed files with 88 additions and 47 deletions.
diff --git a/src/app/(main)/dashboard/components/voyage-dashboard/CheckInWidget.tsx b/src/app/(main)/dashboard/components/voyage-dashboard/CheckInWidget.tsx
@@ -4,13 +4,14 @@ import { ArrowRightIcon, DocumentCheckIcon } from "@heroicons/react/24/outline";
 import { CheckCircleIcon } from "@heroicons/react/24/solid";
 import React from "react";
 import Link from "next/link";
-import { getDay } from "date-fns";
+import { isSameDay, sub } from "date-fns";
 import Button from "@/components/Button";
 import Badge from "@/components/badge/Badge";
 import routePaths from "@/utils/routePaths";
 import { getSprintCheckinIsStatus } from "@/utils/getFormStatus";
 import type { User } from "@/store/features/user/userSlice";
-import { useUser } from "@/store/hooks";
+import { useSprint, useUser } from "@/store/hooks";
+import convertStringToDate from "@/utils/convertStringToDate";
 
 interface CheckInWidgetProps {
   user: User | null;
@@ -22,7 +23,8 @@ function CheckInWidget({
   currentSprintNumber,
   teamId,
 }: CheckInWidgetProps) {
-  const { currentDate } = useUser();
+  const { timezone, currentDate } = useUser();
+  const sprintsData = useSprint();
   const userDate = currentDate ?? new Date();
 
   const sprintCheckinIsSubmitted = getSprintCheckinIsStatus(
@@ -55,14 +57,26 @@ function CheckInWidget({
   }
 
   const getBadgeValue = (userDate: Date): string => {
-    const dayOfWeek = getDay(userDate);
+    const currentSprintEndDate = sprintsData.voyage.sprints.find(
+      (sprint) => sprint.number === currentSprintNumber,
+    )?.endDate;
 
-    if (dayOfWeek >= 2 && dayOfWeek <= 6) {
-      return "";
-    } else if (dayOfWeek === 0) {
-      return "Pending Submission";
-    } else if (dayOfWeek === 1) {
-      return "Due today";
+    if (currentSprintEndDate) {
+      const currentSprintEndDateInUserTimezone = convertStringToDate(
+        currentSprintEndDate,
+        timezone,
+      );
+
+      if (isSameDay(userDate, currentSprintEndDateInUserTimezone)) {
+        return "Due today";
+      } else if (
+        isSameDay(
+          userDate,
+          sub(currentSprintEndDateInUserTimezone, { days: 1 }),
+        )
+      ) {
+        return "Pending Submission";
+      }
     }
 
     return "";

diff --git a/src/app/(main)/my-voyage/[teamId]/ideation/components/IdeationForm.tsx b/src/app/(main)/my-voyage/[teamId]/ideation/components/IdeationForm.tsx
@@ -28,7 +28,7 @@ const validationSchema = z.object({
   title: validateTextInput({
     inputName: "Title",
     required: true,
-    minLen: 10,
+    minLen: 3,
     maxLen: 50,
   }),
   description: validateTextInput({
@@ -315,7 +315,7 @@ export default function IdeationForm() {
           <Textarea
             id="visionStatement"
             label="vision statement"
-            placeholder="Share your insoiring vision. How will you provide value and benefits to users? What long term impact do you hope to achieve?"
+            placeholder="Share your inspiring vision. How will you provide value and benefits to users? What long term impact do you hope to achieve?"
             {...register("vision")}
             errorMessage={errors.vision?.message}
             defaultValue={ideationData?.vision ?? ""}

diff --git a/src/app/(main)/my-voyage/[teamId]/sprints/components/meetingOverview/MeetingOverview.tsx b/src/app/(main)/my-voyage/[teamId]/sprints/components/meetingOverview/MeetingOverview.tsx
@@ -28,9 +28,9 @@ export default function MeetingOverview({
         </p>
       </div>
       <a
-        href={`//${meetingLink}`}
+        href={meetingLink}
         target={"_blank"}
-        rel={"noreferrer"}
+        rel={"noopener noreferrer"}
         className="w-full"
       >
         <Button

diff --git a/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Notes.tsx b/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Notes.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { z } from "zod";
 import { type SubmitHandler, useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -13,7 +13,7 @@ import Spinner from "@/components/Spinner";
 import { validateTextInput } from "@/utils/form/validateInput";
 import useServerAction from "@/hooks/useServerAction";
 import { editMeeting } from "@/myVoyage/sprints/sprintsService";
-import { useAppDispatch } from "@/store/hooks";
+import { useAppDispatch, useSprint } from "@/store/hooks";
 import { onOpenModal } from "@/store/features/modal/modalSlice";
 
 const validationSchema = z.object({
@@ -25,11 +25,8 @@ const validationSchema = z.object({
 
 export type ValidationSchema = z.infer<typeof validationSchema>;
 
-interface NotesProps {
-  data?: string;
-}
-
-export default function Notes({ data }: NotesProps) {
+export default function Notes() {
+  const [data, setData] = useState<string>();
   const dispatch = useAppDispatch();
   const params = useParams<{
     sprintNumber: string;
@@ -41,6 +38,14 @@ export default function Notes({ data }: NotesProps) {
     Number(params.meetingId),
   ];
 
+  const {
+    voyage: { sprints },
+  } = useSprint();
+
+  useEffect(() => {
+    setData(sprints[sprintNumber - 1].teamMeetings[0].notes);
+  }, [sprints, sprintNumber]);
+
   const {
     register,
     handleSubmit,

diff --git a/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Planning.tsx b/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Planning.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { z } from "zod";
 import { type SubmitHandler, useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -18,7 +18,7 @@ import {
   editSection,
   type EditSectionBody,
 } from "@/myVoyage/sprints/sprintsService";
-import { useAppDispatch } from "@/store/hooks";
+import { useAppDispatch, useSprint } from "@/store/hooks";
 import { onOpenModal } from "@/store/features/modal/modalSlice";
 
 const validationSchema = z.object({
@@ -34,11 +34,8 @@ const validationSchema = z.object({
 
 export type ValidationSchema = z.infer<typeof validationSchema>;
 
-interface PlanningProps {
-  data?: Section;
-}
-
-export default function Planning({ data }: PlanningProps) {
+export default function Planning() {
+  const [data, setData] = useState<Section>();
   const dispatch = useAppDispatch();
   const params = useParams<{
     sprintNumber: string;
@@ -50,6 +47,18 @@ export default function Planning({ data }: PlanningProps) {
     Number(params.meetingId),
   ];
 
+  const {
+    voyage: { sprints },
+  } = useSprint();
+
+  useEffect(() => {
+    setData(
+      sprints[sprintNumber - 1].teamMeetings[0].formResponseMeeting?.find(
+        (form) => form.form.id === Number(Forms.planning),
+      ),
+    );
+  }, [sprints, sprintNumber]);
+
   const goal = data?.responseGroup.responses.find(
     (response) => response.question.id === Number(PlanningQuestions.goal),
   )?.text;

diff --git a/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Review.tsx b/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Review.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { z } from "zod";
 import { type SubmitHandler, useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -19,7 +19,7 @@ import {
   editSection,
 } from "@/myVoyage/sprints/sprintsService";
 import { onOpenModal } from "@/store/features/modal/modalSlice";
-import { useAppDispatch } from "@/store/hooks";
+import { useAppDispatch, useSprint } from "@/store/hooks";
 
 const validationSchema = z.object({
   what_right: validateTextInput({
@@ -38,11 +38,8 @@ const validationSchema = z.object({
 
 export type ValidationSchema = z.infer<typeof validationSchema>;
 
-interface ReviewProps {
-  data?: Section;
-}
-
-export default function Review({ data }: ReviewProps) {
+export default function Review() {
+  const [data, setData] = useState<Section>();
   const dispatch = useAppDispatch();
   const params = useParams<{
     sprintNumber: string;
@@ -54,6 +51,18 @@ export default function Review({ data }: ReviewProps) {
     Number(params.meetingId),
   ];
 
+  const {
+    voyage: { sprints },
+  } = useSprint();
+
+  useEffect(() => {
+    setData(
+      sprints[sprintNumber - 1].teamMeetings[0].formResponseMeeting?.find(
+        (form) => form.form.id === Number(Forms.review),
+      ),
+    );
+  }, [sprints, sprintNumber]);
+
   const what_right = data?.responseGroup.responses.find(
     (response) => response.question.id === Number(ReviewQuestions.what_right),
   )?.text;

diff --git a/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/SectionBase.tsx b/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/SectionBase.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { AnimatePresence, type Variants, motion } from "framer-motion";
 import {
   ChevronDownIcon,
@@ -58,6 +58,10 @@ export default function SectionBase({
     setIsLoading: setEditMeetingLoading,
   } = useServerAction(editMeeting);
 
+  useEffect(() => {
+    if (isAdded) setIsOpen(true);
+  }, [isAdded]);
+
   const handleAddSection = async () => {
     if (id !== Number(Forms.notes)) {
       const [res, error] = await addSectionAction({
@@ -174,10 +178,10 @@ export default function SectionBase({
               aria-expanded={isOpen}
               aria-controls={`accordion-panel-${title}`}
               type="button"
-              onClick={handleToggle}
+              onClick={() => handleToggle()}
               aria-label={`close ${title} panel`}
             >
-              <ChevronUpIcon className="h-10 w-10 text-base-300" />
+              <ChevronDownIcon className="h-10 w-10 text-base-300" />
             </motion.button>
           )}
           {isAdded && !isOpen && (
@@ -191,10 +195,10 @@ export default function SectionBase({
               aria-expanded={isOpen}
               aria-controls={`accordion-panel-${title}`}
               type="button"
-              onClick={handleToggle}
+              onClick={() => handleToggle()}
               aria-label={`open ${title} panel`}
             >
-              <ChevronDownIcon className="h-10 w-10 text-base-300" />
+              <ChevronUpIcon className="h-10 w-10 text-base-300" />
             </motion.button>
           )}
         </AnimatePresence>

diff --git a/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Sections.tsx b/src/app/(main)/my-voyage/[teamId]/sprints/components/sections/Sections.tsx
@@ -37,21 +37,21 @@ export default function Sections({
       title: "notes",
       icon: <DocumentTextIcon aria-hidden="true" />,
       isAdded: notes !== null,
-      children: <Notes data={notes} />,
+      children: <Notes />,
     },
     {
       id: Forms.planning,
       title: "sprint planning",
       icon: <LightBulbIcon aria-hidden="true" />,
       isAdded: planning !== undefined,
-      children: <Planning data={planning} />,
+      children: <Planning />,
     },
     {
       id: Forms.review,
       title: "retrospective & review",
       icon: <ArrowPathRoundedSquareIcon aria-hidden="true" />,
       isAdded: review !== undefined,
-      children: <Review data={review} />,
+      children: <Review />,
     },
   ];
 

diff --git a/src/components/inputs/TextInput.tsx b/src/components/inputs/TextInput.tsx
@@ -57,7 +57,7 @@ const TextInput = React.forwardRef<HTMLInputElement, TextInputProps>(
 
     function handleOnChange(e: ChangeEvent<HTMLInputElement>) {
       // Max length suggestion message
-      if (maxLength) {
+      if (maxLength && e.target.type !== "password") {
         const currentLength = e.target.value.length;
         if (currentLength > 0) {
           setCurrentSuggestion(

diff --git a/src/stories/components/Modal.stories.tsx b/src/stories/components/Modal.stories.tsx
@@ -128,7 +128,7 @@ export const WithFormInsideWithVerticalScroll: Story = {
             <Textarea
               id="visionStatement"
               label="vision statement"
-              placeholder="Share your insoiring vision. How will you provide value and benefits to users? What long term impact do you hope to achieve?"
+              placeholder="Share your inspiring vision. How will you provide value and benefits to users? What long term impact do you hope to achieve?"
               maxLength={50}
             />
             <TextInput

diff --git a/src/utils/form/validateInput.ts b/src/utils/form/validateInput.ts
@@ -89,11 +89,11 @@ export function validateDateTimeInput({
       () => ({
         message: `The meeting should be between ${format(
           minDate,
-          "MMM d k:mm (zzz)",
+          "MMM d H:mm (zzz)",
           {
             timeZone: timezone,
           },
-        )} and ${format(maxDate, "MMM d k:mm (zzz)", {
+        )} and ${format(maxDate, "MMM d H:mm (zzz)", {
           timeZone: timezone,
         })}`,
       }),