Handle Date range in Expense Widget on dashboard

Link Project to detail page in Attendance Report Widget

src/components/Dashboard/ExpenseAnalysis.jsx

@@ -53,17 +53,17 @@ const ExpenseAnalysis = () => {
     dataLabels: { enabled: true, formatter: (val) => `${val.toFixed(0)}%` },
     colors: flatColors,
     tooltip: {
-    y: {
-      formatter: function (value) {
-        return formatCurrency(value); 
+      y: {
+        formatter: function (value) {
+          return formatCurrency(value);
+        },
+      },
+      x: {
+        formatter: function (label) {
+          return label;
+        },
       },
     },
-    x: {
-      formatter: function (label) {
-        return label;
-      },
-    },
-  },
     plotOptions: {
       pie: {
         donut: {
@@ -100,7 +100,7 @@ const ExpenseAnalysis = () => {
 
         <div className="text-end text-sm-end">
           <FormProvider {...methods}>
-            <DateRangePicker1 />
+            <DateRangePicker1 pastDays="30" />
           </FormProvider>
         </div>
       </div>
@@ -152,7 +152,9 @@ const ExpenseAnalysis = () => {
                       className="col-6"
                       key={idx}
                       style={{
-                        borderLeft: `3px solid ${flatColors[idx % flatColors.length]}`,
+                        borderLeft: `3px solid ${
+                          flatColors[idx % flatColors.length]
+                        }`,
                       }}
                     >
                       <div className="d-flex flex-column text-start">
@@ -177,7 +179,6 @@ const ExpenseAnalysis = () => {
                         </span>
                       </div>
                     </div>
-
                   ))}
                 </div>
               </div>

src/components/common/DateRangePicker.jsx

@@ -93,6 +93,7 @@ export const DateRangePicker1 = ({
   resetSignal,
   defaultRange = true,
   maxDate = null,
+  pastDays = 6,
   ...rest
 }) => {
   const inputRef = useRef(null);
@@ -105,7 +106,7 @@ export const DateRangePicker1 = ({
   const applyDefaultDates = () => {
     const today = new Date();
     const past = new Date();
-    past.setDate(today.getDate() - 6);
+    past.setDate(today.getDate() - pastDays);
 
     const format = (d) => flatpickr.formatDate(d, "d-m-Y");
     const formattedStart = format(past);