From c686b388f4e66baf92fb9181fe40e015075ea574 Mon Sep 17 00:00:00 2001 From: Kartik Sharma Date: Thu, 9 Oct 2025 17:50:56 +0530 Subject: [PATCH] Adding Chips in Document. --- src/components/Activities/AttendLogs.jsx | 11 +- .../Documents/DocumentFilterChips.jsx | 143 ++++++++++-------- .../Documents/DocumentFilterPanel.jsx | 39 +++-- src/components/Documents/Documents.jsx | 30 +++- src/components/Documents/DocumentsList.jsx | 2 +- 5 files changed, 133 insertions(+), 92 deletions(-) diff --git a/src/components/Activities/AttendLogs.jsx b/src/components/Activities/AttendLogs.jsx index d94bacdd..a1fb9a28 100644 --- a/src/components/Activities/AttendLogs.jsx +++ b/src/components/Activities/AttendLogs.jsx @@ -124,7 +124,7 @@ const AttendLogs = ({ Id }) => { return (
-
Attendance Logs
+
Attendance Logs
{logs && !loading && (

Showing logs for{" "} @@ -146,9 +146,9 @@ const AttendLogs = ({ Id }) => { + - @@ -160,15 +160,16 @@ const AttendLogs = ({ Id }) => { .sort((a, b) => b.id - a.id) .map((log, index) => ( + - +
Activity Date TimeActivity Location Recored By Description
+ {whichActivityPerform(log.activity, log.activityTime)} +
{formatUTCToLocalTime(log.activityTime)}
{convertShortTime(log.activityTime)} - {whichActivityPerform(log.activity, log.activityTime)} - {log?.latitude != 0 ? ( { - const filterChips = useMemo(() => { - const chips = []; + // Normalize structure: handle both "filterData.data" and plain "filterData" + const data = filterData?.data || filterData || {}; - 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 }); - }; + const filterChips = useMemo(() => { + const chips = []; - // Build chips from document filters - buildGroup(filters.uploadedByIds, filterData.data.uploadedBy || [], "Uploaded By", "uploadedByIds"); - buildGroup(filters.documentCategoryIds, filterData.data.documentCategory || [], "Category", "documentCategoryIds"); - buildGroup(filters.documentTypeIds, filterData.data.documentType || [], "Type", "documentTypeIds"); - buildGroup(filters.documentTagIds, filterData.data.documentTag || [], "Tags", "documentTagIds"); + 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 }); + }; - 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 }); - } + // 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.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}` }], - }); - } + 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 }); + } - return chips; - }, [filters, filterData]); + 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}` }], + }); + } - if (!filterChips.length) return null; + return chips; + }, [filters, filterData]); - console.log("Kartik", filterData.uploadedBy) + if (!filterChips.length) return null; - return ( -
-
-
- {filterChips.map((chip) => ( -
- {chip.label}: -
- {chip.items.map((item) => ( - - {item.name} -
-
- ))} -
+ + return ( +
+
+
+ {filterChips.map((chip) => ( +
+ {chip.label}: +
+ {chip.items.map((item) => ( + + {item.name} +
+ ))}
- ); +
+
+ ); }; -export default DocumentFilterChips; \ No newline at end of file +export default DocumentFilterChips; diff --git a/src/components/Documents/DocumentFilterPanel.jsx b/src/components/Documents/DocumentFilterPanel.jsx index 8bb5e347..c71c5979 100644 --- a/src/components/Documents/DocumentFilterPanel.jsx +++ b/src/components/Documents/DocumentFilterPanel.jsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState,useMemo } 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"; @@ -11,16 +11,16 @@ import SelectMultiple from "../common/SelectMultiple"; import moment from "moment"; import { useParams } from "react-router-dom"; -const DocumentFilterPanel = ({ entityTypeId, onApply,setFilterdata }) => { +const DocumentFilterPanel = forwardRef(({ entityTypeId, onApply, setFilterdata }, ref) => { const [resetKey, setResetKey] = useState(0); const { status } = useParams(); const { data, isError, isLoading, error } = useDocumentFilterEntities(entityTypeId); - //changes + //changes - const dynamicDocumentFilterDefaultValues = useMemo(() => { + const dynamicDocumentFilterDefaultValues = useMemo(() => { return { ...DocumentFilterDefaultValues, uploadedByIds: DocumentFilterDefaultValues.uploadedByIds || [], @@ -49,13 +49,24 @@ const DocumentFilterPanel = ({ entityTypeId, onApply,setFilterdata }) => { document.querySelector(".offcanvas.show .btn-close")?.click(); }; - //changes - useEffect(() => { + useImperativeHandle(ref, () => ({ + resetFieldValue: (name, value) => { + // Reset specific field + if (value !== undefined) { + setValue(name, value); + } else { + reset({ ...methods.getValues(), [name]: DocumentFilterDefaultValues[name] }); + } + }, + getValues: methods.getValues, // optional, to read current filter state + })); + + //changes + useEffect(() => { if (data && setFilterdata) { setFilterdata(data); } }, [data, setFilterdata]); - console.log("Veer",data) const onSubmit = (values) => { onApply({ @@ -88,7 +99,7 @@ const DocumentFilterPanel = ({ entityTypeId, onApply,setFilterdata }) => { documentTag = [], } = data?.data || {}; - + return ( @@ -100,18 +111,16 @@ const DocumentFilterPanel = ({ entityTypeId, onApply,setFilterdata }) => {