rez-table-listing-mui 1.0.45 → 1.0.47

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rez-table-listing-mui",
-  "version": "1.0.45",
+  "version": "1.0.47",
   "type": "module",
   "description": "A rez table listing component built on TanStack Table",
   "main": "dist/index.js",

package/src/components/table-settings/components/quick-tab.tsx

@@ -35,8 +35,14 @@ const QuickTab = ({
   tabsApiData,
   tabsApiDataLoading,
 }: SettingsQuickTabProps) => {
-  const { quickTabStates, setQuickTabStates, settingsData, setColumnTabState } =
-    filterSettingStates;
+  const {
+    quickTabStates,
+    setQuickTabStates,
+    settingsData,
+    setColumnTabState,
+    saveButtonError,
+    setSaveButtonError,
+  } = filterSettingStates;
 
   const [searchTerm, setSearchTerm] = useState<string>("");
 
@@ -101,6 +107,43 @@ const QuickTab = ({
         }));
       }
     }
+
+    // check for error
+    const hasInvalidValidShowList =
+      quickTabStates.show_list &&
+      (quickTabStates.show_list?.length === 0 ||
+        quickTabStates.show_list.length >= 5);
+
+    if (hasInvalidValidShowList) {
+      // Check if error is already in the state to avoid duplication
+      const errorMessage = {
+        type: "quick_tab_error",
+        message:
+          "Quick Tab : View as Tabs should have at least 1 and at most 5 tabs.",
+      };
+      const hasQuickTabError = saveButtonError?.messages?.some(
+        (message) => message.type === "quick_tab_error"
+      );
+
+      if (!hasQuickTabError) {
+        setSaveButtonError((prev) => ({
+          ...prev,
+          hasError: true,
+          messages: [...(prev?.messages || []), errorMessage], // Only add if it doesn't exist
+        }));
+      }
+    } else {
+      const otherMessages =
+        saveButtonError?.messages?.filter(
+          (message) => message.type !== "quick_tab_error"
+        ) || [];
+
+      setSaveButtonError((prev) => ({
+        ...prev,
+        hasError: otherMessages.length > 0,
+        messages: otherMessages,
+      }));
+    }
   }, [quickTabStates.show_list, quickTabStates.hide_list]);
 
   // useEffect(() => {

package/src/components/table-settings/index.tsx

@@ -37,6 +37,7 @@ export function QuickFilterSettings({
     quickTabStates,
     columnTabState,
     sortingTabState,
+    saveButtonError,
   } = filterSettingStates;
 
   const hasAPIData = Boolean(Object.entries(columnsData).length);
@@ -148,7 +149,10 @@ export function QuickFilterSettings({
 
       {!columnsDataLoading && hasAPIData && (
         <DialogActions>
-          <CustomButton onClick={handleSaveSetSettingsData}>
+          <CustomButton
+            disabled={saveButtonError?.hasError}
+            onClick={handleSaveSetSettingsData}
+          >
             Save Quick Filter
           </CustomButton>
         </DialogActions>

package/src/components/topbar/index.tsx

@@ -45,7 +45,6 @@ function Topbar<T>({
   tableStates,
   onFilterButtonClick,
 }: TopbarProps<T>) {
-  const [isFullscreenState, setIsFullscreenState] = useState(isFullscreen);
   const [sortAnchorEl, setSortAnchorEl] = useState<HTMLElement | null>(null);
   const [groupBy, setGroupBy] = useState<string>("None");
 
@@ -211,11 +210,8 @@ function Topbar<T>({
               onCompactToggle={(value: string) =>
                 setIsCompactTable(value === "Compact")
               }
-              isFullscreen={isFullscreenState}
-              onFullscreenToggle={() => {
-                fullscreenToggle();
-                setIsFullscreenState((prev) => !prev);
-              }}
+              isFullscreen={isFullscreen}
+              onFullscreenToggle={fullscreenToggle}
               groupBy={groupBy}
               onGroupByChange={(value: string) => setGroupBy(value)}
               tableStates={tableStates}