pull main

app/[locale]/(protected)/contributor/agenda-setting/calender-view.tsx

@@ -105,6 +105,7 @@ interface ListItemProps {
   createdBy: string;
   isPublish: boolean | null;
   bgColor: string;
+  colorList: string[] | null;
 }
 
 interface APIResponse {
@@ -360,17 +361,24 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
     const { createdByName, isPublish } = eventInfo.event.extendedProps;
 
     return (
-      <>
-        <div className="flex flex-row">
-          {" "}
-          {isPublish === true ? <CheckCheck size={15} /> : <Timer size={15} />}
-          <p className="ml-1">{title}</p>
+      <div className="w-full p-2 mb-2 rounded-md text-white text-sm bg-yellow-500 flex justify-between items-stretch">
+        <div className="flex-1">
+          <div className="flex flex-row items-center">
+            {isPublish === true ? <CheckCheck size={15} /> : <Timer size={15} />}
+            <p className="ml-1">{title}</p>
+          </div>
+
+          <p className="ml-1 text-xs text-start mt-2">
+            Created By : {createdByName}
+          </p>
         </div>
 
-        <p className="ml-1 text-xs text-start mt-2">
-          Created By : {createdByName}
-        </p>
-      </>
+        <div className="w-3 flex flex-col h-full ml-2 rounded-r-md">
+          <div className="flex-1 bg-red-500"></div>
+          <div className="flex-1 bg-yellow-400"></div>
+          <div className="flex-1 bg-green-500"></div>
+        </div>
+      </div>
     );
   };
 
@@ -420,14 +428,39 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
   ];
 
   const getEventColor = (type: Event["type"]): string => {
+    const typeSplit = type.split(",");
+    const firstType = typeSplit && typeSplit[0];
     const colors: Record<Event["type"], string> = {
-      1: "bg-yellow-500",
-      2: "bg-blue-400",
-      3: "bg-slate-400",
-      4: "bg-orange-500",
-      5: "bg-green-400",
+      "0": "bg-black",
+      "1": "bg-yellow-500",
+      "2": "bg-blue-400",
+      "3": "bg-slate-400",
+      "4": "bg-orange-500",
+      "5": "bg-green-400",
     };
-    return colors[type];
+    console.log("Type : ", colors[firstType]);
+    return colors[firstType];
+  };
+
+  const getEventColorList = (type: Event["type"]): string[] | null => {
+    const typeSplit = type.split(",");
+    const typeList = typeSplit?.slice(1);
+
+    if (typeList.length === 0) return null;
+
+    const colors: Record<Event["type"], string> = {
+      "0": "bg-black",
+      "1": "bg-yellow-500",
+      "2": "bg-blue-400",
+      "3": "bg-slate-400",
+      "4": "bg-orange-500",
+      "5": "bg-green-400",
+    };
+
+    const typeListColor = typeList.map((item) => colors[item] || "bg-gray-200");
+
+    console.log("Type List Color : ", typeListColor);
+    return typeListColor;
   };
 
   const handleClickListItem = (item: any) => {
@@ -463,16 +496,24 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
     createdBy,
     isPublish,
     bgColor,
+    colorList,
   }) => (
-    <div
-      className={`w-full p-1 mb-2 rounded-md text-white text-sm ${bgColor}`}
+    <div className={`w-full p-2 mb-2 rounded-md text-white text-sm flex justify-between items-stretch ${bgColor}`}
       onClick={() => handleClickListItem(item)}
     >
-      <div className="flex flex-row items-center">
-        {isPublish ? <CheckCheck size={15} /> : <Timer size={15} />}
-        <p className="ml-1">{text}</p>
-      </div>
-      <p className="ml-1 text-xs text-start mt-2">Created By: {createdBy}</p>
+        <div className="flex-1">
+          <div className="flex flex-row items-center">
+            {isPublish ? <CheckCheck size={15} /> : <Timer size={15} />}
+            <p className="ml-1">{text}</p>
+          </div>
+          <p className="ml-1 text-xs text-start mt-2">Created By: {createdBy}</p>
+        </div>
+
+        <div className="w-3 flex flex-col h-full ml-2 overflow-hidden item-stretch gap-1">
+          {colorList?.map((color: string) => (
+            <div className={`h-[10px] rounded-sm ${color}`}></div>
+          ))}
+        </div>
     </div>
   );
 
@@ -502,6 +543,7 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
                   createdBy={event.createdByName}
                   isPublish={event.isPublish}
                   bgColor={getEventColor(event.agendaType)}
+                  colorList={getEventColorList(event.agendaType)}
                 />
               ))}
 
@@ -532,6 +574,7 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
                               createdBy={event.createdByName}
                               isPublish={event.isPublish}
                               bgColor={getEventColor(event.agendaType)}
+                              colorList={getEventColorList(event.agendaType)}
                             />
                           ))}
                         </div>

components/landing-page/area-coverage-and-work-units.tsx

@@ -35,7 +35,11 @@ const AreaCoverageWorkUnits = () => {
               <p className="text-base font-bold">Polda Jajaran</p>
             </button>
           </DialogTrigger>
+<<<<<<< HEAD
           <DialogContent size="md" className="max-h-[90vh] overflow-y-auto flex flex-col  ">
+=======
+          <DialogContent size="md" className="max-h-[90vh] overflow-hidden flex flex-col" data-lenis-prevent>
+>>>>>>> d7747da00bb99fa3931b64558555cf22f624ccd5
             <DialogHeader className="flex flex-col justify-center">
               <DialogTitle>
                 <p className="text-center">Polda Jajaran</p>
@@ -63,7 +67,7 @@ const AreaCoverageWorkUnits = () => {
               <p className="text-base font-bold">Satuan Kerja Polri</p>
             </button>
           </DialogTrigger>
-          <DialogContent size="md">
+          <DialogContent size="md" data-lenis-prevent>
             <DialogHeader className="flex flex-col justify-center">
               <DialogTitle>
                 <p className="text-center">Satuan Kerja Polri</p>

components/landing-page/footer.tsx

@@ -68,6 +68,7 @@ const Footer = () => {
             <DialogContent
               className="flex flex-col overflow-y-scroll h-[80%]"
               size="md"
+              data-lenis-prevent
             >
               <div className="flex flex-row items-center justify-center gap-4">
                 <img src="/assets/icon-privacy.png" alt="Privacy" />

components/landing-page/survey-box.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { Dialog, DialogClose, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from "../ui/dialog";
 import FormSurvey from "./survey";
 import { Controller, useForm } from "react-hook-form";
@@ -83,6 +83,7 @@ const UserSurveyBox = () => {
       const response = await createSurveyData(data);
       console.log("API Response:", response);
       setShowSurvey(false);
+      setOpenPolda(false);
     } catch (error) {
       console.error("Error submitting survey:", error);
     } finally {
@@ -114,7 +115,7 @@ const UserSurveyBox = () => {
                 SURVEY SEKARANG
               </Button>
             </DialogTrigger>
-            <DialogContent size="md" className="max-h-[90vh] overflow-auto flex flex-col">
+            <DialogContent size="md" className="max-h-[90vh] overflow-auto flex flex-col" data-lenis-prevent>
               <DialogHeader>
                 <DialogTitle className="text-lg font-bold">SURVEI KEPUASAN PENGGUNA MEDIAHUB POLRI</DialogTitle>
                 <DialogDescription className="text-sm">Kami menghargai pendapat Anda! Survei ini bertujuan untuk meningkatkan kualitas layanan MediaHub Polri.</DialogDescription>
@@ -148,7 +149,7 @@ const UserSurveyBox = () => {
                 </div>
 
                 <div className="flex justify-end gap-2">
-                  <Button variant="outline" onClick={() => setShowSurvey(false)}>
+                  <Button variant="outline" onClick={() => setOpenPolda(false)}>
                     Batal
                   </Button>
                   <Button type="submit" disabled={isLoading}>