rez-table-listing-mui 0.0.27 → 1.0.28

package/src/App.tsx

@@ -49,11 +49,6 @@ function App() {
   //API FOR UPDATE FILTER
   const { updateMutation } = useUpdateFilterAPI();
 
-  // const { dropdownData } = useCommonDropdownAPI(
-  //   metaQuery.data,
-  //   tableStates.filterMaster?.attributes?.selected
-  // );
-
   const { dropdownData } = useCommonDropdownAPI(metaQuery.data);
 
   useEffect(() => {
@@ -79,7 +74,7 @@ function App() {
 
   const enableServerSideSorting = false;
 
-  const { tableData } = useEntityTableAPI({
+  const { tableData, isTableDataPending } = useEntityTableAPI({
     page: 0,
     size: 50,
     entity_type: "UPR",
@@ -224,8 +219,8 @@ function App() {
           enableServerSideSorting: enableServerSideSorting,
         }}
         loadingOptions={{
-          isLoading: mockLoading,
-          loaderText: "Loading, Please wait...",
+          isLoading: isTableDataPending || detailsQuery.isPending,
+          // loaderText: "Loading, Please wait...",
         }}
         topbarOptions={{
           tableStates,
@@ -244,9 +239,9 @@ function App() {
           showFilterToggle: true,
           filterOptions: {
             tableStates: tableStates,
+            tableData: tableData,
             columnsData: metaQuery.data || [],
             defaultFilters: detailsQuery.data || [],
-            tableData: tableData,
             dropdownData: dropdownData || [],
             onDeleteFilter: handleRemoveFilter,
             onSaveFilter: handleSaveFilter,

package/src/components/filter/components/forms/components/Attributes-select.tsx

@@ -27,6 +27,23 @@ const SelectAttribute = ({
 
   const selectedAttribute = filterMaster?.attributes?.selected;
 
+  // Get the current filter value to set radio button state
+  const currentFilterValue = useMemo(() => {
+    if (!selectedAttribute) return "";
+
+    const matchingColumn = columnsData.column_list.find(
+      (column) => column.datasource_list === selectedAttribute
+    );
+
+    if (!matchingColumn) return "";
+
+    const existingFilter = filters.find(
+      (filter) => filter.filter_attribute === matchingColumn.attribute_key
+    );
+
+    return existingFilter?.filter_value || "";
+  }, [selectedAttribute, filters, columnsData]);
+
   const handleSelectChange = (event: SelectChangeEvent) => {
     const attributeKey = event.target.value as string;
 
@@ -37,6 +54,7 @@ const SelectAttribute = ({
           attributes: {
             ...prev?.attributes,
             selected: attributeKey,
+            radio: "", // Reset radio selection when changing attribute
           },
         } as FilterMasterStateProps)
     );
@@ -44,8 +62,9 @@ const SelectAttribute = ({
 
   const handleRadioChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     event.preventDefault();
-    console.log("tabValu", tabValue);
+
     const selectedValue = event.target.value;
+
     setFilterMaster(
       (prev) =>
         ({
@@ -73,19 +92,7 @@ const SelectAttribute = ({
           filter_value: selectedValue,
         };
 
-        const existingFilterIndex = filters.findIndex(
-          (filter) => filter.filter_attribute === matchingColumn.attribute_key
-        );
-
-        let updatedFilters;
-        if (existingFilterIndex !== -1) {
-          updatedFilters = [...filters];
-          updatedFilters[existingFilterIndex] = newFilter;
-        } else {
-          updatedFilters = [...filters, newFilter];
-        }
-
-        setFilters(updatedFilters);
+        setFilters([newFilter]);
       }
     }
   };
@@ -104,7 +111,7 @@ const SelectAttribute = ({
         <Select
           value={selectedAttribute || ""}
           onChange={handleSelectChange}
-          displayEmpty // Ensures the placeholder is shown when no value is selected
+          displayEmpty
           renderValue={(selected) => {
             if (!selected) {
               return <span>Select Attribute</span>;
@@ -154,7 +161,10 @@ const SelectAttribute = ({
       {dropdownData && (
         <Box sx={{ mt: 2 }}>
           <FormControl>
-            <RadioGroup onChange={handleRadioChange}>
+            <RadioGroup
+              onChange={handleRadioChange}
+              value={currentFilterValue} // Set the value from current filter
+            >
               {selectedAttributeOptions
                 ?.filter((option) => {
                   if (!searchTerm) return true;

package/src/components/index-table.tsx

@@ -243,6 +243,30 @@ function TableWrapper<T>({
 
   return (
     <div className="ts__table__container" ref={tableRef}>
+      {enableTopbar && (
+        <Topbar
+          table={table}
+          topbarOptions={craftTopbarOptions}
+          isCompactTable={isCompactTable}
+          setIsCompactTable={setIsCompactTable}
+          isFullscreen={isFullscreen}
+          fullscreenToggle={handleFullscreenToggle}
+          paginationComponent={
+            craftPaginationOptions?.showPagination === true &&
+            craftPaginationOptions?.paginationPosition === "top" ? (
+              <DefaultPagination
+                table={table}
+                rowsPerPageArray={rowsPerPageArray}
+                paginationOptions={craftPaginationOptions}
+              />
+            ) : null
+          }
+          // searchValue={searchValue} // 👈 new
+          // onSearchChange={onSearchChange}
+          tableStates={tableStates}
+        />
+      )}
+
       {isLoading ? (
         loadingComponent ?? (
           <div className="ts__loader">
@@ -251,70 +275,44 @@ function TableWrapper<T>({
           </div>
         )
       ) : (
-        <>
-          {enableTopbar && (
-            <Topbar
+        <div
+          // {...tableWrapperProps}
+          className={`ts__table__wrapper ${
+            isFullscreen ? "is-fullscreen" : ""
+          }`}
+        >
+          {enableColumnReordering ? (
+            <TableDND
               table={table}
-              topbarOptions={craftTopbarOptions}
+              columnOrder={columnOrder}
+              featureOptions={craftFeatureOptions}
+              NestedComponent={nestedComponent}
+              setColumnOrder={setColumnOrder}
               isCompactTable={isCompactTable}
-              setIsCompactTable={setIsCompactTable}
-              isFullscreen={isFullscreen}
-              fullscreenToggle={handleFullscreenToggle}
-              paginationComponent={
-                craftPaginationOptions?.showPagination === true &&
-                craftPaginationOptions?.paginationPosition === "top" ? (
-                  <DefaultPagination
-                    table={table}
-                    rowsPerPageArray={rowsPerPageArray}
-                    paginationOptions={craftPaginationOptions}
-                  />
-                ) : null
-              }
-              // searchValue={searchValue} // 👈 new
-              // onSearchChange={onSearchChange}
               tableStates={tableStates}
             />
-          )}
-
-          <div
-            // {...tableWrapperProps}
-            className={`ts__table__wrapper ${
-              isFullscreen ? "is-fullscreen" : ""
-            }`}
-          >
-            {enableColumnReordering ? (
-              <TableDND
-                table={table}
-                columnOrder={columnOrder}
-                featureOptions={craftFeatureOptions}
-                NestedComponent={nestedComponent}
-                setColumnOrder={setColumnOrder}
-                isCompactTable={isCompactTable}
-                tableStates={tableStates}
-              />
-            ) : (
-              <Table
-                table={table}
-                featureOptions={craftFeatureOptions}
-                NestedComponent={nestedComponent}
-                columnOrder={columnOrder}
-                setColumnOrder={setColumnOrder}
-                isCompactTable={isCompactTable}
-                tableStates={tableStates}
-              />
-            )}
-          </div>
-
-          {craftPaginationOptions?.showPagination === true &&
-          craftPaginationOptions?.paginationPosition === "bottom" ? (
-            <DefaultPagination
+          ) : (
+            <Table
               table={table}
-              rowsPerPageArray={rowsPerPageArray}
-              paginationOptions={craftPaginationOptions}
+              featureOptions={craftFeatureOptions}
+              NestedComponent={nestedComponent}
+              columnOrder={columnOrder}
+              setColumnOrder={setColumnOrder}
+              isCompactTable={isCompactTable}
+              tableStates={tableStates}
             />
-          ) : null}
-        </>
+          )}
+        </div>
       )}
+
+      {craftPaginationOptions?.showPagination === true &&
+      craftPaginationOptions?.paginationPosition === "bottom" ? (
+        <DefaultPagination
+          table={table}
+          rowsPerPageArray={rowsPerPageArray}
+          paginationOptions={craftPaginationOptions}
+        />
+      ) : null}
     </div>
   );
 }

package/src/libs/hooks/useEntityTableAPI.tsx

@@ -166,11 +166,13 @@ export const useCommonDropdownAPI = (
 
   // Step 2: Use useQueries to fetch them all in parallel
   const dropdownResults = useQueries({
-    queries: dropdownConfigs.map((cfg) => ({
-      queryKey: ["commonDropdown", cfg.dataSourceType],
-      queryFn: () => commonGetDropdownDataAPI(cfg.dataSourceType, null),
-      enabled: !!cfg.dataSourceType,
-    })),
+    queries: dropdownConfigs.map((cfg) => {
+      return {
+        queryKey: ["commonDropdown", cfg.dataSourceType],
+        queryFn: () => commonGetDropdownDataAPI(cfg.dataSourceType, null),
+        enabled: !!cfg.dataSourceType,
+      };
+    }),
   });
 
   // Step 3: Map results to keys

package/src/libs/utils/apiColumn.ts

@@ -1,6 +1,6 @@
 import { api } from "./common";
 import {
-  createSavedFilterPaload,
+  createSavedFilterPayload,
   deleteSavedFilterPayload,
   updateSavedFilterPayload,
 } from "../../types/filter";
@@ -52,13 +52,13 @@ export const fetchDetailsByFilterId = async (filterId: string) => {
 
 export const commonGetDropdownDataAPI = async (
   entity_type: string,
-  organization_id?: string | null,
+  // organization_id?: string | null,
   data?: any
 ) => {
   try {
     const requestBody = {
       status: "ACTIVE",
-      organization_id: organization_id,
+      organization_id: 1,
       ...data,
     };
 
@@ -76,7 +76,7 @@ export const commonGetDropdownDataAPI = async (
 
 export const createSavedFilter = async (
   entity_type: string,
-  payload: createSavedFilterPaload
+  payload: createSavedFilterPayload
 ) => {
   try {
     const response = await api.post(

package/src/types/filter.ts

@@ -124,7 +124,7 @@ interface FilterDetail {
   filter_value: string | string[];
 }
 
-export interface createSavedFilterPaload {
+export interface createSavedFilterPayload {
   name: string;
   organization_id?: number;
   enterprise_id?: number;
@@ -155,14 +155,6 @@ export interface updateSavedFilterPayload {
   filterDetails: FilterDetail[];
 }
 
-export interface deleteSavedFilterPayload {
-  name: string;
-  is_default: boolean;
-  id: string | number;
-  status?: string;
-  entity_type: string;
-  mapped_entity_type: string;
-}
 interface FilterDetail {
   filter_attribute: string;
   filter_operator: string;