oa-componentbook 1.0.1-stage.443 → 1.0.1-stage.444

package/build/components/oa-component-table-with-search-and-filter/TableWithSearchAndFilter.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.array.sort.js");
 require("core-js/modules/es.json.stringify.js");
 var _react = _interopRequireWildcard(require("react"));
 var _Search = _interopRequireDefault(require("@material-ui/icons/Search"));
@@ -116,6 +117,7 @@ function TableWithSearchAndFilter(_ref) {
   // Filter drawer state
   const [isFilterDrawerVisible, setIsFilterDrawerVisible] = (0, _react.useState)(false);
   const [filterValues, setFilterValues] = (0, _react.useState)({});
+  const [areAllRequiredFieldsFilled, setAreAllRequiredFieldsFilled] = (0, _react.useState)(true);
 
   // Search handlers
   const handleSearchChange = e => {
@@ -186,29 +188,33 @@ function TableWithSearchAndFilter(_ref) {
     return keys;
   }, [filterConfig]);
 
-  // Create a stable string representation of filterValues for required keys
-  // This ensures reliable dependency tracking in production builds
-  const requiredFieldsSignature = (0, _react.useMemo)(() => requiredKeys.map(key => {
-    const value = filterValues[key];
-    // Create a stable string representation that changes when value changes
-    if (value === undefined || value === null) return "".concat(key, ":null");
-    if (value instanceof Date) return "".concat(key, ":").concat(value.getTime());
-    return "".concat(key, ":").concat(JSON.stringify(value));
-  }).join('|'), [requiredKeys, filterValues]);
+  // Create a stable string signature of required field values for reliable dependency tracking
+  const requiredFieldsSignature = (0, _react.useMemo)(() => {
+    if (requiredKeys.length === 0) return '';
+    return requiredKeys.map(key => {
+      const value = filterValues[key];
+      if (value === undefined || value === null) return "".concat(key, ":null");
+      if (value instanceof Date) return "".concat(key, ":").concat(value.getTime());
+      if (Array.isArray(value)) return "".concat(key, ":array[").concat(value.length, "]");
+      if (typeof value === 'object') return "".concat(key, ":obj[").concat(Object.keys(value).length, "]");
+      return "".concat(key, ":").concat(JSON.stringify(value));
+    }).sort().join('|');
+  }, [requiredKeys, filterValues]);
 
-  // Memoized check if all required fields are filled
-  const areAllRequiredFieldsFilled = (0, _react.useMemo)(() => {
+  // Use useEffect to update validation state whenever filterValues or requiredKeys change
+  // Using signature ensures reliable updates in production builds where object reference comparison might fail
+  (0, _react.useEffect)(() => {
     // If no required fields, button should be enabled
     if (requiredKeys.length === 0) {
-      return true;
+      setAreAllRequiredFieldsFilled(true);
+      return;
     }
 
     // Check each required field has a valid value
-    return requiredKeys.every(requiredKey => {
+    const allFilled = requiredKeys.every(requiredKey => {
       const value = filterValues[requiredKey];
 
       // Check if value exists and is not empty/null/undefined
-      // Also handle edge cases: empty arrays, empty objects, etc.
       if (value === undefined || value === null || value === '') {
         return false;
       }
@@ -224,6 +230,7 @@ function TableWithSearchAndFilter(_ref) {
       }
       return true;
     });
+    setAreAllRequiredFieldsFilled(allFilled);
   }, [requiredKeys, requiredFieldsSignature, filterValues]);
 
   // Helper function to determine notFoundContent message

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oa-componentbook",
-  "version": "1.0.1-stage.443",
+  "version": "1.0.1-stage.444",
   "private": false,
   "description": "Reusable components",
   "main": "build/index.js",