Dynamic date range for DateRange Picker in task allocation log

src/components/common/DateRangePicker.jsx

@@ -1,13 +1,12 @@
 import React, { useEffect, useRef } from "react";
 
-
+const DateRangePicker = ({ onRangeChange, DateDifference = 15 }) => {
-const DateRangePicker = ({ onRangeChange }) => {
   const inputRef = useRef(null);
 
   useEffect(() => {
     const today = new Date();
     const fifteenDaysAgo = new Date();
-    fifteenDaysAgo.setDate(today.getDate() - 15);
+    fifteenDaysAgo.setDate(today.getDate() - DateDifference);
 
     const fp = flatpickr(inputRef.current, {
       mode: "range",
@@ -20,12 +19,12 @@ const DateRangePicker = ({ onRangeChange }) => {
         onRangeChange?.({ startDate, endDate });
       },
     });
-    
+
     onRangeChange?.({
       // startDate: fifteenDaysAgo.toISOString().split("T")[0],
       // endDate: today.toISOString().split("T")[0],
-      startDate: fifteenDaysAgo.toLocaleDateString('en-CA'),
+      startDate: fifteenDaysAgo.toLocaleDateString("en-CA"),
-      endDate: today.toLocaleDateString('en-CA'),
+      endDate: today.toLocaleDateString("en-CA"),
     });
 
     return () => {

src/pages/Activities/DailyTask.jsx

@@ -27,27 +27,21 @@ const DailyTask = () => {
     error: projects_Error,
   } = useProjects();
 
-
-  
   const [initialized, setInitialized] = useState(false);
 
   // Sync projectId (either from URL or pick first accessible one)
   useEffect(() => {
     if (!project_lodaing && projects.length > 0 && !initialized) {
- 
-  
       if (projectId) {
         dispatch(setProjectId(projectId));
       } else if (!selectedProject) {
-        dispatch(setProjectId(projects[0].id)); 
+        dispatch(setProjectId(projects[0].id));
       }
-  
+
       setInitialized(true);
     }
   }, [project_lodaing, projects, projectId, selectedProject, initialized]);
-  
 
-  
   const dispatch = useDispatch(selectedProject);
   const [dateRange, setDateRange] = useState({ startDate: "", endDate: "" });
 
@@ -56,15 +50,17 @@ const DailyTask = () => {
     loading: task_loading,
     error: task_error,
     refetch,
-  } = useTaskList( initialized ? selectedProject : null,
+  } = useTaskList(
+    initialized ? selectedProject : null,
     initialized ? dateRange.startDate : null,
-    initialized ? dateRange.endDate : null);
+    initialized ? dateRange.endDate : null
+  );
 
   const [TaskLists, setTaskLists] = useState([]);
 
   useEffect(() => {
     setTaskLists(TaskList);
-  }, [TaskList,selectedProject]);
+  }, [TaskList, selectedProject]);
 
   const [selectedTask, selectTask] = useState(null);
   const [comments, setComment] = useState(null);
@@ -81,7 +77,7 @@ const DailyTask = () => {
     selectTask(task);
     openModal();
   };
-  
+
   return (
     <>
       <div
@@ -122,7 +118,10 @@ const DailyTask = () => {
           <div className="card-body p-1 p-sm-2">
             <div className="row d-flex justify-content-between">
               <div className="col-6 text-start">
-                <DateRangePicker onRangeChange={setDateRange} />
+                <DateRangePicker
+                  onRangeChange={setDateRange}
+                  DateDifference="1"
+                />
               </div>
               <div className="col-sm-3 col-6 text-end mb-1">
                 <select
@@ -133,21 +132,18 @@ const DailyTask = () => {
                   onChange={(e) => dispatch(setProjectId(e.target.value))}
                   aria-label=""
                 >
-                   {(project_lodaing )  && (
+                  {project_lodaing && (
                     <option value="Loading..." disabled>
                       Loading...
                     </option>
                   )}
-                   {(!project_lodaing && projects) &&
+                  {!project_lodaing &&
-                    projects
+                    projects &&
-                      ?.filter((project) =>
+                    projects?.map((project) => (
-                        LoggedUser?.projects?.map(String).includes(project.id)
+                      <option value={project.id} key={project.id}>
-                      )
+                        {project.name}
-                      .map((project) => (
+                      </option>
-                        <option value={project.id} key={project.id}>
+                    ))}
-                          {project.name}
-                        </option>
-                      ))}
                 </select>
               </div>
             </div>
@@ -155,7 +151,6 @@ const DailyTask = () => {
               <table className="table">
                 <thead>
                   <tr>
-
                     <th>Activity</th>
                     <th>Planned </th>
                     <th>Compeleted</th>
@@ -168,7 +163,7 @@ const DailyTask = () => {
                   {TaskLists?.length === 0 && !task_loading && (
                     <tr>
                       <td colSpan={7} className="text-center">
-                      No Task Found
+                        No Task Found
                       </td>
                     </tr>
                   )}
@@ -180,13 +175,11 @@ const DailyTask = () => {
                       </td>
                     </tr>
                   )}
-             
 
                   {TaskLists.map((task, index) => {
                     return (
                       <React.Fragment key={index}>
                         <tr>
-                          
                           <td className="flex-wrap">
                             {task.workItem.activityMaster.activityName ||
                               "No Activity Name"}