- Attendance logs for{" "} - {logs[0]?.employee?.firstName + " " + logs[0]?.employee?.lastName}{" "} - on {formatUTCToLocalTime(logs[0]?.activityTime)} +
+ Showing logs for{" "} + + {logs[0]?.employee?.firstName + " " + logs[0]?.employee?.lastName} + {" "} + on {formatUTCToLocalTime(logs[0]?.activityTime)}
)}| Activity | Date | Time | -Activity | Location | Recored By | Description | @@ -156,11 +159,16 @@ const AttendLogs = ({ Id }) => { .sort((a, b) => b.id - a.id) .map((log, index) => (|||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| {formatUTCToLocalTime(log.activityTime)} | -{convertShortTime(log.activityTime)} | {whichActivityPerform(log.activity, log.activityTime)} | +
+
+ {formatUTCToLocalTime(log.activityTime)}
+
+ |
+ {convertShortTime(log.activityTime)} | +{log?.latitude != 0 ? ( { )} | - {`${log?.updatedByEmployee?.firstName ?? ""} ${ - log?.updatedByEmployee?.lastName ?? "" - }`} + {`${log?.updatedByEmployee?.firstName ?? ""} ${log?.updatedByEmployee?.lastName ?? "" + }`} |
{log?.comment?.length > 50
diff --git a/src/components/Activities/Attendance.jsx b/src/components/Activities/Attendance.jsx
index 9a082976..681434df 100644
--- a/src/components/Activities/Attendance.jsx
+++ b/src/components/Activities/Attendance.jsx
@@ -11,6 +11,7 @@ import { useSelector } from "react-redux";
import { useQueryClient } from "@tanstack/react-query";
import eventBus from "../../services/eventBus";
import { useSelectedProject } from "../../slices/apiDataManager";
+import { SpinnerLoader } from "../common/Loader";
const Attendance = ({ getRole, handleModalData, searchTerm, projectId, organizationId, }) => {
const queryClient = useQueryClient();
@@ -110,28 +111,41 @@ const Attendance = ({ getRole, handleModalData, searchTerm, projectId, organizat
return (
<>
+
+ {/* Left side - Date */}
+
+ Date: {formatUTCToLocalTime(todayDate)}
+
+
+ {/* Right side - Pending Attendance toggle */}
+
+ setShowPending(e.target.checked)}
+ />
+
+
+
-
);
diff --git a/src/components/Directory/ManageContact.jsx b/src/components/Directory/ManageContact.jsx
index 56d45e32..f55ed858 100644
--- a/src/components/Directory/ManageContact.jsx
+++ b/src/components/Directory/ManageContact.jsx
@@ -23,7 +23,7 @@ import Label from "../common/Label";
const ManageContact = ({ contactId, closeModal }) => {
// fetch master data
const { buckets, loading: bucketsLoaging } = useBuckets();
- const { data:projects, loading: projectLoading } = useProjects();
+ const { data: projects, loading: projectLoading } = useProjects();
const { contactCategory, loading: contactCategoryLoading } =
useContactCategory();
const { organizationList } = useOrganization();
@@ -205,12 +205,12 @@ const ManageContact = ({ contactId, closeModal }) => {
-
- Date : {formatUTCToLocalTime(todayDate)}
-
{attLoading ? (
-
- setShowPending(e.target.checked)}
- />
-
-
- Loading...
+
+
) : currentItems?.length > 0 ? (
+
<>
)}
+ {!loading && finalFilteredData.length > ITEMS_PER_PAGE && (
+
+ )}
);
};
diff --git a/src/components/Activities/AttendcesLogs.jsx b/src/components/Activities/AttendcesLogs.jsx
index 267bec1d..f1d8e008 100644
--- a/src/components/Activities/AttendcesLogs.jsx
+++ b/src/components/Activities/AttendcesLogs.jsx
@@ -1,7 +1,7 @@
import React, { useEffect, useState, useMemo, useCallback } from "react";
import moment from "moment";
import Avatar from "../common/Avatar";
-import { convertShortTime } from "../../utils/dateUtils";
+import { convertShortTime, formatUTCToLocalTime } from "../../utils/dateUtils";
import RenderAttendanceStatus from "./RenderAttendanceStatus";
import { useSelector, useDispatch } from "react-redux";
import DateRangePicker from "../common/DateRangePicker";
@@ -15,6 +15,8 @@ import AttendanceRepository from "../../repositories/AttendanceRepository";
import { useAttendancesLogs } from "../../hooks/useAttendance";
import { queryClient } from "../../layouts/AuthLayout";
import { ITEMS_PER_PAGE } from "../../utils/constants";
+import { useNavigate } from "react-router-dom";
+import { SpinnerLoader } from "../common/Loader";
const usePagination = (data, itemsPerPage) => {
const [currentPage, setCurrentPage] = useState(1);
@@ -38,17 +40,13 @@ const usePagination = (data, itemsPerPage) => {
};
const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
- // const selectedProject = useSelector(
- // (store) => store.localVariables.projectId
- // );
const selectedProject = useSelectedProject();
const [dateRange, setDateRange] = useState({ startDate: "", endDate: "" });
const dispatch = useDispatch();
const [loading, setLoading] = useState(false);
const [showPending, setShowPending] = useState(false);
-
const [isRefreshing, setIsRefreshing] = useState(false);
- const [processedData, setProcessedData] = useState([]);
+ const navigate = useNavigate();
const today = new Date();
today.setHours(0, 0, 0, 0);
@@ -71,57 +69,32 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
};
const sortByName = (a, b) => {
- const nameA = a.firstName.toLowerCase() + a.lastName.toLowerCase();
- const nameB = b.firstName.toLowerCase() + b.lastName.toLowerCase();
- return nameA?.localeCompare(nameB);
+ const nameA = (a.firstName + a.lastName).toLowerCase();
+ const nameB = (b.firstName + b.lastName).toLowerCase();
+ return nameA.localeCompare(nameB);
};
- const {
- data = [],
- isLoading,
- error,
- refetch,
- isFetching,
- } = useAttendancesLogs(
+ const { data = [], isLoading, error, refetch, isFetching } = useAttendancesLogs(
selectedProject,
dateRange.startDate,
dateRange.endDate,
organizationId
);
- const filtering = (data) => {
+
+ const processedData = useMemo(() => {
const filteredData = showPending
? data.filter((item) => item.checkOutTime === null)
: data;
- const group1 = filteredData
- .filter((d) => d.activity === 1 && isSameDay(d.checkInTime))
- .sort(sortByName);
- const group2 = filteredData
- .filter((d) => d.activity === 4 && isSameDay(d.checkOutTime))
- .sort(sortByName);
- const group3 = filteredData
- .filter((d) => d.activity === 1 && isBeforeToday(d.checkInTime))
- .sort(sortByName);
- const group4 = filteredData.filter(
- (d) => d.activity === 4 && isBeforeToday(d.checkOutTime)
- );
- const group5 = filteredData
- .filter((d) => d.activity === 2 && isBeforeToday(d.checkOutTime))
- .sort(sortByName);
- const group6 = filteredData
- .filter((d) => d.activity === 5)
- .sort(sortByName);
+ const group1 = filteredData.filter((d) => d.activity === 1 && isSameDay(d.checkInTime)).sort(sortByName);
+ const group2 = filteredData.filter((d) => d.activity === 4 && isSameDay(d.checkOutTime)).sort(sortByName);
+ const group3 = filteredData.filter((d) => d.activity === 1 && isBeforeToday(d.checkInTime)).sort(sortByName);
+ const group4 = filteredData.filter((d) => d.activity === 4 && isBeforeToday(d.checkOutTime));
+ const group5 = filteredData.filter((d) => d.activity === 2 && isBeforeToday(d.checkOutTime)).sort(sortByName);
+ const group6 = filteredData.filter((d) => d.activity === 5).sort(sortByName);
- const sortedList = [
- ...group1,
- ...group2,
- ...group3,
- ...group4,
- ...group5,
- ...group6,
- ];
+ const sortedList = [...group1, ...group2, ...group3, ...group4, ...group5, ...group6];
- // Group by date
const groupedByDate = sortedList.reduce((acc, item) => {
const date = (item.checkInTime || item.checkOutTime)?.split("T")[0];
if (date) {
@@ -131,28 +104,17 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
return acc;
}, {});
- const sortedDates = Object.keys(groupedByDate).sort(
- (a, b) => new Date(b) - new Date(a)
- );
-
- const finalData = sortedDates.flatMap((date) => groupedByDate[date]);
- setProcessedData(finalData);
- };
-
- useEffect(() => {
- filtering(data);
+ const sortedDates = Object.keys(groupedByDate).sort((a, b) => new Date(b) - new Date(a));
+ return sortedDates.flatMap((date) => groupedByDate[date]);
}, [data, showPending]);
- // New useEffect to handle search filtering
const filteredSearchData = useMemo(() => {
- if (!searchTerm) {
- return processedData;
- }
- const lowercasedSearchTerm = searchTerm.toLowerCase();
- return processedData.filter((item) => {
- const fullName = `${item.firstName} ${item.lastName}`.toLowerCase();
- return fullName.includes(lowercasedSearchTerm);
- });
+ if (!searchTerm) return processedData;
+
+ const lowercased = searchTerm.toLowerCase();
+ return processedData.filter((item) =>
+ `${item.firstName} ${item.lastName}`.toLowerCase().includes(lowercased)
+ );
}, [processedData, searchTerm]);
const {
@@ -165,34 +127,27 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
useEffect(() => {
resetPage();
- }, [filteredSearchData, resetPage]);
+ }, [filteredSearchData]);
const handler = useCallback(
(msg) => {
const { startDate, endDate } = dateRange;
const checkIn = msg.response.checkInTime.substring(0, 10);
- if (
- selectedProject === msg.projectId &&
- startDate <= checkIn &&
- checkIn <= endDate
- ) {
+
+ if (selectedProject === msg.projectId && startDate <= checkIn && checkIn <= endDate) {
queryClient.setQueriesData(["attendanceLogs"], (oldData) => {
if (!oldData) {
queryClient.invalidateQueries({ queryKey: ["attendanceLogs"] });
return;
}
- const updatedAttendance = oldData.map((record) =>
- record.id === msg.response.id
- ? { ...record, ...msg.response }
- : record
+ return oldData.map((record) =>
+ record.id === msg.response.id ? { ...record, ...msg.response } : record
);
- filtering(updatedAttendance);
- return updatedAttendance;
});
resetPage();
}
},
- [selectedProject, dateRange, filtering, resetPage]
+ [selectedProject, dateRange, resetPage]
);
useEffect(() => {
@@ -204,18 +159,10 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
(msg) => {
const { startDate, endDate } = dateRange;
if (data.some((item) => item.employeeId == msg.employeeId)) {
- // dispatch(
- // fetchAttendanceData({
- // ,
- // fromDate: startDate,
- // toDate: endDate,
- // })
- // );
-
refetch();
}
},
- [selectedProject, dateRange, data, refetch]
+ [data, refetch]
);
useEffect(() => {
@@ -223,43 +170,56 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
return () => eventBus.off("employee", employeeHandler);
}, [employeeHandler]);
+
+
return (
<>
-
+ {Pagination && (
+
+ {/* Left Side - Date Picker */}
+
+
+
- setShowPending(e.target.checked)}
- />
-
-
+
+ setShowPending(e.target.checked)}
+ />
+
{isLoading ? (
-
) : filteredSearchData?.length > 0 ? (
+
Loading... +
- {Pagination}
-
- )}
+ {Pagination}
+
+ )}
contactProfile(noteItem.contactId)}
>
@@ -98,7 +98,7 @@ const NoteCardDirectoryEditable = ({
-
+
by{" "}
@@ -184,7 +184,7 @@ const NoteCardDirectoryEditable = ({
) : (
)}
diff --git a/src/components/Directory/NoteFilterChips.jsx b/src/components/Directory/NoteFilterChips.jsx
new file mode 100644
index 00000000..5569a460
--- /dev/null
+++ b/src/components/Directory/NoteFilterChips.jsx
@@ -0,0 +1,79 @@
+import React, { useMemo } from "react";
+import moment from "moment";
+
+const NoteFilterChips = ({ filters, filterData, removeFilterChip }) => {
+ // Normalize data (in case it’s wrapped in .data)
+ const data = filterData?.data || filterData || {};
+
+ const filterChips = useMemo(() => {
+ const chips = [];
+
+ const buildGroup = (ids, list, label, key) => {
+ if (!ids?.length) return;
+ const items = ids.map((id) => ({
+ id,
+ name: list?.find((item) => item.id === id)?.name || id,
+ }));
+ chips.push({ key, label, items });
+ };
+
+ // Build chips dynamically
+ buildGroup(filters.createdByIds, data.createdBy, "Created By", "createdByIds");
+ buildGroup(filters.organizations, data.organizations, "Organization", "organizations");
+
+ // Example: Add date range if you ever add in future
+ if (filters.startDate || filters.endDate) {
+ const start = filters.startDate ? moment(filters.startDate).format("DD-MM-YYYY") : "";
+ const end = filters.endDate ? moment(filters.endDate).format("DD-MM-YYYY") : "";
+ chips.push({
+ key: "dateRange",
+ label: "Date Range",
+ items: [{ id: "dateRange", name: `${start} - ${end}` }],
+ });
+ }
+
+ return chips;
+ }, [filters, filterData]);
+
+ if (!filterChips.length) return null;
+
+ return (
+
+
+ );
+};
+
+export default NoteFilterChips;
\ No newline at end of file
diff --git a/src/components/Documents/DocumentFilterChips.jsx b/src/components/Documents/DocumentFilterChips.jsx
new file mode 100644
index 00000000..e6b56d7c
--- /dev/null
+++ b/src/components/Documents/DocumentFilterChips.jsx
@@ -0,0 +1,94 @@
+import React, { useMemo } from "react";
+import moment from "moment";
+
+const DocumentFilterChips = ({ filters, filterData, removeFilterChip }) => {
+ // Normalize structure: handle both "filterData.data" and plain "filterData"
+ const data = filterData?.data || filterData || {};
+
+ const filterChips = useMemo(() => {
+ const chips = [];
+
+ const buildGroup = (ids, list, label, key) => {
+ if (!ids?.length) return;
+ const items = ids.map((id) => ({
+ id,
+ name: list?.find((item) => item.id === id)?.name || id,
+ }));
+ chips.push({ key, label, items });
+ };
+
+ // Build chips using normalized data
+ buildGroup(filters.uploadedByIds, data.uploadedBy || [], "Uploaded By", "uploadedByIds");
+ buildGroup(filters.documentCategoryIds, data.documentCategory || [], "Category", "documentCategoryIds");
+ buildGroup(filters.documentTypeIds, data.documentType || [], "Type", "documentTypeIds");
+ buildGroup(filters.documentTagIds, data.documentTag || [], "Tags", "documentTagIds");
+
+ if (filters.statusIds?.length) {
+ const items = filters.statusIds.map((status) => ({
+ id: status,
+ name:
+ status === true
+ ? "Verified"
+ : status === false
+ ? "Rejected"
+ : "Pending",
+ }));
+ chips.push({ key: "statusIds", label: "Status", items });
+ }
+
+ if (filters.startDate || filters.endDate) {
+ const start = filters.startDate ? moment(filters.startDate).format("DD-MM-YYYY") : "";
+ const end = filters.endDate ? moment(filters.endDate).format("DD-MM-YYYY") : "";
+ chips.push({
+ key: "dateRange",
+ label: "Date Range",
+ items: [{ id: "dateRange", name: `${start} - ${end}` }],
+ });
+ }
+
+ return chips;
+ }, [filters, filterData]);
+
+ if (!filterChips.length) return null;
+
+
+ return (
+
+
+
+ {filterChips.map((chip) => (
+
+
+ {chip.label}:
+
+ ))}
+
+ {chip.items.map((item) => (
+
+ {item.name}
+
+ ))}
+
+
+
+ );
+};
+
+export default DocumentFilterChips;
diff --git a/src/components/Documents/DocumentFilterPanel.jsx b/src/components/Documents/DocumentFilterPanel.jsx
index 15a2cbf1..04f54956 100644
--- a/src/components/Documents/DocumentFilterPanel.jsx
+++ b/src/components/Documents/DocumentFilterPanel.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState, useMemo, useImperativeHandle, forwardRef } from "react";
import { useDocumentFilterEntities } from "../../hooks/useDocument";
import { FormProvider, useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
@@ -9,198 +9,240 @@ import {
import { DateRangePicker1 } from "../common/DateRangePicker";
import SelectMultiple from "../common/SelectMultiple";
import moment from "moment";
+import { useParams } from "react-router-dom";
-const DocumentFilterPanel = ({ entityTypeId, onApply }) => {
- const [resetKey, setResetKey] = useState(0);
+const DocumentFilterPanel = forwardRef(
+ ({ entityTypeId, onApply, setFilterdata }, ref) => {
+ const [resetKey, setResetKey] = useState(0);
+ const { status } = useParams();
- const { data, isError, isLoading, error } =
- useDocumentFilterEntities(entityTypeId);
+ const { data, isError, isLoading, error } =
+ useDocumentFilterEntities(entityTypeId);
- const methods = useForm({
- resolver: zodResolver(DocumentFilterSchema),
- defaultValues: DocumentFilterDefaultValues,
- });
+ useEffect(() => {
+ return () => {
+ closePanel();
+ };
+ }, []);
- const { handleSubmit, reset, setValue, watch } = methods;
+ //changes
- // Watch values from form
- const isUploadedAt = watch("isUploadedAt");
- const isVerified = watch("isVerified");
+ const dynamicDocumentFilterDefaultValues = useMemo(() => {
+ return {
+ ...DocumentFilterDefaultValues,
+ uploadedByIds: DocumentFilterDefaultValues.uploadedByIds || [],
+ documentCategoryIds: DocumentFilterDefaultValues.documentCategoryIds || [],
+ documentTypeIds: DocumentFilterDefaultValues.documentTypeIds || [],
+ documentTagIds: DocumentFilterDefaultValues.documentTagIds || [],
+ startDate: DocumentFilterDefaultValues.startDate,
+ endDate: DocumentFilterDefaultValues.endDate,
+ };
- // Close the offcanvas (bootstrap specific)
- const closePanel = () => {
- document.querySelector(".offcanvas.show .btn-close")?.click();
- };
+ }, [status]);
- const onSubmit = (values) => {
- onApply({
- ...values,
- startDate: values.startDate
- ? moment.utc(values.startDate, "DD-MM-YYYY").toISOString()
- : null,
- endDate: values.endDate
- ? moment.utc(values.endDate, "DD-MM-YYYY").toISOString()
- : null,
+ const methods = useForm({
+ resolver: zodResolver(DocumentFilterSchema),
+ defaultValues: dynamicDocumentFilterDefaultValues,
});
- closePanel();
- };
- const onClear = () => {
- reset(DocumentFilterDefaultValues);
- setResetKey((prev) => prev + 1);
- onApply(DocumentFilterDefaultValues);
- closePanel();
- };
+ const { handleSubmit, reset, setValue, watch } = methods;
- if (isLoading) return
+
+
+ {filterChips.map((chip) => (
+
+
+ {chip.label}:
+
+ ))}
+
+ {chip.items.map((item) => (
+
+ {item.name}
+
+ ))}
+
+ Loading... ;
- if (isError)
- return Error: {error?.message || "Something went wrong!"} ;
+ // Watch values from form
+ const isUploadedAt = watch("isUploadedAt");
+ const isVerified = watch("isVerified");
- const {
- uploadedBy = [],
- documentCategory = [],
- documentType = [],
- documentTag = [],
- } = data?.data || {};
+ // Close the offcanvas (bootstrap specific)
+ const closePanel = () => {
+ document.querySelector(".offcanvas.show .btn-close")?.click();
+ };
- return (
- |