diff --git a/src/components/Organization/AssignOrg.jsx b/src/components/Organization/AssignOrg.jsx index d0886a62..b35402ed 100644 --- a/src/components/Organization/AssignOrg.jsx +++ b/src/components/Organization/AssignOrg.jsx @@ -96,11 +96,11 @@ const AssignOrg = ({ setStep }) => {
logo

{orgData.name}

+ src="/public/assets/img/orgLogo.png" + alt="logo" + width={40} + height={40} + />

{orgData.name}

-
Organization Info
+
Organization Info
{/* Contact Info */} -
+
{orgData.contactPerson}
-
+
{orgData.contactNumber}
-
+
-
{orgData.email}
+
{orgData.email}
-
+
{orgData.sprid}
-
+
{orgData.address}
diff --git a/src/components/Organization/ManagOrg.jsx b/src/components/Organization/ManagOrg.jsx index e73c34e1..d994b8b5 100644 --- a/src/components/Organization/ManagOrg.jsx +++ b/src/components/Organization/ManagOrg.jsx @@ -189,7 +189,7 @@ const ManagOrg = () => { )}
-
+
+ ))} +
+ ); +}; + +export default GalleryFilterChips; diff --git a/src/components/gallary/GalleryFilterPanel.jsx b/src/components/gallary/GalleryFilterPanel.jsx index 6518eb74..e7a89172 100644 --- a/src/components/gallary/GalleryFilterPanel.jsx +++ b/src/components/gallary/GalleryFilterPanel.jsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useState } from "react"; import { useImageGalleryFilter } from "../../hooks/useImageGallery"; import { useSelectedProject } from "../../slices/apiDataManager"; import { FormProvider, useForm } from "react-hook-form"; @@ -10,19 +10,52 @@ import SelectMultiple from "../common/SelectMultiple"; import { localToUtc } from "../../utils/appUtils"; import { useLocation } from "react-router-dom"; -const GalleryFilterPanel = ({ onApply }) => { +const GalleryFilterPanel = forwardRef(({ onApply, setFilterdata, clearFilter }, ref) => { const selectedProject = useSelectedProject(); const [resetKey, setResetKey] = useState(0); const { data, isLoading, isError, error } = useImageGalleryFilter(selectedProject); + + const dynamicDefaultFilter = useMemo(() => { + return { + ...defaultGalleryFilterValue, + buildingIds: defaultGalleryFilterValue.buildingIds || [], + floorIds: defaultGalleryFilterValue.floorIds || [], + workAreaIds: defaultGalleryFilterValue.workAreaIds || [], + activityIds: defaultGalleryFilterValue.activityIds || [], + workCategoryIds: defaultGalleryFilterValue.workCategoryIds || [], + startDate: defaultGalleryFilterValue.startDate, + endDate: defaultGalleryFilterValue.endDate, + uploadedByIds: defaultGalleryFilterValue.uploadedByIds || [], + serviceIds: defaultGalleryFilterValue.serviceIds || [], + }; + }, [selectedProject]); + + useImperativeHandle(ref, () => ({ + resetFieldValue: (name, value) => { + // Reset specific field + if (value !== undefined) { + setValue(name, value); + } else { + reset({ ...methods.getValues(), [name]: defaultFilter[name] }); + } + }, + getValues: methods.getValues, // optional, to read current filter state + })); + + useEffect(() => { + if (data && setFilterdata) { + setFilterdata(data); + } + }, [data, setFilterdata]); const closePanel = () => { document.querySelector(".offcanvas.show .btn-close")?.click(); }; const methods = useForm({ resolver: zodResolver(gallerySchema), - defaultValues: defaultGalleryFilterValue, + defaultValues: dynamicDefaultFilter, }); const { @@ -144,6 +177,6 @@ const GalleryFilterPanel = ({ onApply }) => {
); -}; +}); export default GalleryFilterPanel; diff --git a/src/components/gallary/ImageGalleryListView.jsx b/src/components/gallary/ImageGalleryListView.jsx index af5cfbc2..08dce746 100644 --- a/src/components/gallary/ImageGalleryListView.jsx +++ b/src/components/gallary/ImageGalleryListView.jsx @@ -8,7 +8,8 @@ import { ITEMS_PER_PAGE } from "../../utils/constants"; import Pagination from "../common/Pagination"; import { formatUTCToLocalTime } from "../../utils/dateUtils"; import { SpinnerLoader } from "../common/Loader"; -const ImageGalleryListView = ({filter}) => { +import GalleryFilterChips from "./GalleryFilterChips"; +const ImageGalleryListView = ({ filter, filterData, removeFilterChip, clearFilter }) => { const [hoveredImage, setHoveredImage] = useState(null); const selectedProject = useSelectedProject(); const [currentPage, setCurrentPage] = useState(1); @@ -27,40 +28,50 @@ const ImageGalleryListView = ({filter}) => { } }; - if (!data?.data?.length && !isLoading) { - return ( -
- - {selectedProject - ? "No images match the selected filters." - : "Please Select Project!"} - -
- ); -} + if (!data?.data?.length && !isLoading) { + return ( +
+ + {selectedProject + ? "No images match the selected filters." + : "Please Select Project!"} + +
+ ); + } - if (isLoading) { + if (isLoading) { return (
); - } + } + + + return (
+
+ +
{data?.data?.map((batch) => { - if (!batch.documents?.length) return null; + if (!batch.documents?.length) return null; const doc = batch.documents[0]; - const userName = `${doc.uploadedBy?.firstName || ""} ${ - doc.uploadedBy?.lastName || "" - }`.trim(); + const userName = `${doc.uploadedBy?.firstName || ""} ${doc.uploadedBy?.lastName || "" + }`.trim(); const date = formatUTCToLocalTime(doc.uploadedAt); // const hasArrows = batch.documents.length > scrollThreshold; @@ -112,7 +123,7 @@ const ImageGalleryListView = ({filter}) => { )} */}
(imageGroupRefs.current[batch.batchId] = el)} + // ref={(el) => (imageGroupRefs.current[batch.batchId] = el)} > {batch.documents.map((d, i) => { const hoverDate = moment().format("DD MMMM, YYYY"); diff --git a/src/hooks/useImageGallery.js b/src/hooks/useImageGallery.js index ac3cb852..b1892e26 100644 --- a/src/hooks/useImageGallery.js +++ b/src/hooks/useImageGallery.js @@ -47,6 +47,7 @@ export const useImageGalleryFilter = (project)=>{ const response = await ImageGalleryRepository.getImageGalleryFilter(project); return response.data; }, + enabled:!!project }) } diff --git a/src/pages/Gallary/ImageGallaryPage.jsx b/src/pages/Gallary/ImageGallaryPage.jsx index 501bd84c..39909771 100644 --- a/src/pages/Gallary/ImageGallaryPage.jsx +++ b/src/pages/Gallary/ImageGallaryPage.jsx @@ -23,6 +23,7 @@ import GlobalModel from "../../components/common/GlobalModel"; import ViewGallery from "../../components/gallary/ViewGallery"; import { useFab } from "../../Context/FabContext"; import GalleryFilterPanel from "../../components/gallary/GalleryFilterPanel"; +import { defaultGalleryFilterValue } from "../../components/gallary/GallerySchema"; const GalleryContext = createContext(); @@ -36,12 +37,12 @@ export const useGalleryContext = () => { }; const ImageGalleryPage = () => { - const [filter, setFilter] = useState(); + const [filter, setFilter] = useState(defaultGalleryFilterValue); const selectedProjectId = useSelectedProject(); const { projectNames } = useProjectName(); - + const [filterData, setFilterdata] = useState(null); + const updatedRef = useRef(); const [openGallery, setOpenGallery] = useState({ isOpen: false, data: null }); - const { data: assignedServices = [], isLoading } = useProjectAssignedServices(selectedProjectId); @@ -55,13 +56,18 @@ const ImageGalleryPage = () => { setOpenGallery, }; + const clearFilter = () => setFilter(defaultGalleryFilterValue); const { setOffcanvasContent, setShowTrigger } = useFab(); useEffect(() => { setShowTrigger(true); setOffcanvasContent( "Gallery Filter", - + ); return () => { @@ -70,6 +76,22 @@ const ImageGalleryPage = () => { }; }, []); + const handleRemoveChip = (key, id) => { + setFilter((prev) => { + const updated = { ...prev }; + + if (Array.isArray(updated[key])) { + updated[key] = updated[key].filter((v) => v !== id); + setTimeout(() => updatedRef.current?.resetFieldValue(key, updated[key]), 0); + } else { + updated[key] = null; + setTimeout(() => updatedRef.current?.resetFieldValue(key, null), 0); + } + + return updated; + }); + }; + return (
@@ -78,34 +100,11 @@ const ImageGalleryPage = () => { />
- {/* {selectedProjectId && ( -
- {!isLoading && assignedServices?.length === 0 ? ( - - Not service assiged yet - - ) : ( - - )} -
- )} */} - - +
{openGallery?.isOpen && ( diff --git a/src/pages/collections/CollectionPage.jsx b/src/pages/collections/CollectionPage.jsx index 32324133..bd97cf0b 100644 --- a/src/pages/collections/CollectionPage.jsx +++ b/src/pages/collections/CollectionPage.jsx @@ -140,13 +140,13 @@ const CollectionPage = () => {
-
+
setSearchText(e.target.value)} placeholder="Search Collection" - className="form-control form-control-sm mt-2 mt-sm-0" + className="form-control form-control-sm w-25 mt-2 mt-sm-0" />