@controleonline/ui-default 1.0.279 → 1.0.281

package/src/store/default/actions.js

@@ -1,5 +1,5 @@
-import {api} from '@controleonline/ui-common/src/api';
-import localDB from '@controleonline/ui-common/src/api/localDB';
+import {api} from '@controleonline/ui-common/src/api';
+import localDB from '@controleonline/ui-common/src/api/localDB';
 import {queue} from '@controleonline/ui-common/src/api/queue';
 import * as types from '@controleonline/ui-default/src/store/default/mutation_types';
 
@@ -150,23 +150,23 @@ const commitStoreError = (commit, error, storeMeta) => {
     buildStoreErrorCommitOptions(storeMeta),
   )
 }
-
-export const executeQueue = ({commit, getters}, func, callback) => {
-  queue.executeQueue(func, callback);
-};
-
-export const addToQueue = ({commit, getters}, func) => {
-  queue.addToQueue(func);
-};
-export const initQueue = ({commit, getters}, func) => {
-  queue.initQueue(func);
-  return queue;
-};
-
+
+export const executeQueue = ({commit, getters}, func, callback) => {
+  queue.executeQueue(func, callback);
+};
+
+export const addToQueue = ({commit, getters}, func) => {
+  queue.addToQueue(func);
+};
+export const initQueue = ({commit, getters}, func) => {
+  queue.initQueue(func);
+  return queue;
+};
+
 export const saveOffline = ({commit, getters}, data) => {
   return;
 };
-
+
 export const getOfflineItems = ({commit, getters}, params = {}) => {
   const {storeMeta} = splitStoreActionPayload(params)
   commit(types.SET_ISLOADING, true);
@@ -175,26 +175,26 @@ export const getOfflineItems = ({commit, getters}, params = {}) => {
   commit(types.SET_DEBUG, {});
 
   db = new localDB(getters);
-
-  return db
-    .getItemsByFilters()
-    .then(async data => {
-      if (!data || (Array.isArray(data) && data.length === 0))
-        return getOnlineItems({commit, getters}, params).then(data => {
-          commit(types.SET_ITEM, data);
-          if (getters.offline) saveOffline({commit, getters}, data);
-          return data;
-        });
-    })
+
+  return db
+    .getItemsByFilters()
+    .then(async data => {
+      if (!data || (Array.isArray(data) && data.length === 0))
+        return getOnlineItems({commit, getters}, params).then(data => {
+          commit(types.SET_ITEM, data);
+          if (getters.offline) saveOffline({commit, getters}, data);
+          return data;
+        });
+    })
     .catch(e => {
       commitStoreError(commit, e, storeMeta)
       throw e;
     })
-    .finally(() => {
-      commit(types.SET_ISLOADING, false);
-    });
-};
-
+    .finally(() => {
+      commit(types.SET_ISLOADING, false);
+    });
+};
+
 export const getOnlineItems = ({commit, getters}, params = {}) => {
   const {payload: requestParams, storeMeta} = splitStoreActionPayload(params)
   const {append: shouldAppend = false, ...queryParams} = isPlainObject(requestParams)
@@ -206,11 +206,12 @@ export const getOnlineItems = ({commit, getters}, params = {}) => {
     params: queryParams,
   })
 
+  const preserveQuery = storeMeta.preserveItems === true && getters.lastCompletedRequest?.requestKey === requestKey
   commit(types.SET_ACTIVE_REQUEST_KEY, requestKey)
-  commit(types.SET_ISLOADING, true);
-  commit(types.SET_ISLOADINGLIST, true)
+  commit(types.SET_ISLOADING, !preserveQuery);
+  commit(types.SET_ISLOADINGLIST, !preserveQuery)
   commit(types.SET_ERROR, null);
-  if (!shouldAppend) {
+  if (!shouldAppend && !preserveQuery) {
     if (getters.items != null) commit(types.SET_ITEMS, []);
     commit(types.SET_TOTALITEMS, 0);
     commit(types.SET_SUMMARY, {});
@@ -262,12 +263,12 @@ export const getOnlineItems = ({commit, getters}, params = {}) => {
       }
     });
 };
-
-export const getItems = ({commit, getters}, params = {}) => {
-  //if (getters.offline) return getOfflineItems({commit, getters}, params); else
-  return getOnlineItems({commit, getters}, params);
-};
-
+
+export const getItems = ({commit, getters}, params = {}) => {
+  //if (getters.offline) return getOfflineItems({commit, getters}, params); else
+  return getOnlineItems({commit, getters}, params);
+};
+
 export const get = ({commit, getters}, id) => {
   const {payload: requestId, storeMeta} = splitStoreActionPayload(id)
   const normalizedId = String(requestId?.id ?? requestId ?? '').replace(/\D/g, '')
@@ -359,15 +360,15 @@ export const remove = ({commit, getters}, id) => {
     .then(() => {
       commit(types.SET_ERROR, null);
       let items = getters.items ? [...getters.items] : [];
-      const index = items.findIndex(i => {
-        if (i && i['@id']) return i['@id'].toString().replace(/\D/g, '') === id;
-      });
-
-      if (index >= 0) items.splice(index, 1);
-      else items = [];
-      commit(types.SET_ITEMS, items);
-      return;
-    })
+      const index = items.findIndex(i => {
+        if (i && i['@id']) return i['@id'].toString().replace(/\D/g, '') === id;
+      });
+
+      if (index >= 0) items.splice(index, 1);
+      else items = [];
+      commit(types.SET_ITEMS, items);
+      return;
+    })
     .catch(e => {
       commitStoreError(commit, e, storeMeta)
       throw e;
@@ -375,39 +376,39 @@ export const remove = ({commit, getters}, id) => {
     .finally(() => {
       commit(types.SET_ISSAVING, false);
     });
-};
-
-export const setFilters = ({commit, getters}, params) => {
-  commit(types.SET_FILTERS, params);
-};
-
-export const setItem = ({commit, getters}, params) => {
-  commit(types.SET_ITEM, params);
-};
-
-export const setItems = ({commit, getters}, params) => {
-  commit(types.SET_ITEMS, params);
-};
-
-export const setPrint = ({commit, getters}, params) => {
-  commit(types.SET_PRINT, params);
-};
-
-export const setReload = ({commit, getters}, reload) => {
-  commit(types.SET_RELOAD, reload);
-};
-
-export const setError = ({commit, getters}, error) => {
-  commit(types.SET_ERROR, error);
-};
-
-export const setIsSaving = ({commit, getters}, IsSaving) => {
-  commit(types.SET_ISSAVING, IsSaving);
-};
-export const setIsLoading = ({commit, getters}, IsLoading) => {
-  commit(types.SET_ISLOADING, IsLoading);
-};
-
+};
+
+export const setFilters = ({commit, getters}, params) => {
+  commit(types.SET_FILTERS, params);
+};
+
+export const setItem = ({commit, getters}, params) => {
+  commit(types.SET_ITEM, params);
+};
+
+export const setItems = ({commit, getters}, params) => {
+  commit(types.SET_ITEMS, params);
+};
+
+export const setPrint = ({commit, getters}, params) => {
+  commit(types.SET_PRINT, params);
+};
+
+export const setReload = ({commit, getters}, reload) => {
+  commit(types.SET_RELOAD, reload);
+};
+
+export const setError = ({commit, getters}, error) => {
+  commit(types.SET_ERROR, error);
+};
+
+export const setIsSaving = ({commit, getters}, IsSaving) => {
+  commit(types.SET_ISSAVING, IsSaving);
+};
+export const setIsLoading = ({commit, getters}, IsLoading) => {
+  commit(types.SET_ISLOADING, IsLoading);
+};
+
 export const setTotalItems = ({commit, getters}, totalItems) => {
   commit(types.SET_TOTALITEMS, totalItems);
 };
@@ -425,20 +426,20 @@ export const setConfigs = ({commit, getters}, configs) => {
 };
 
 export const setResourceEndpoint = (
-  {commit, getters},
-  resourceEndpoint = null,
-) => {
-  commit(types.SET_RESOURCE_ENDPOINT, resourceEndpoint);
-};
-
-export const setSelected = ({commit, getters}, selected) => {
-  commit(types.SET_SELECTED, selected);
-};
-
-export const setMessage = ({commit, getters}, message) => {
-  commit(types.SET_MESSAGE, message);
-};
-
+  {commit, getters},
+  resourceEndpoint = null,
+) => {
+  commit(types.SET_RESOURCE_ENDPOINT, resourceEndpoint);
+};
+
+export const setSelected = ({commit, getters}, selected) => {
+  commit(types.SET_SELECTED, selected);
+};
+
+export const setMessage = ({commit, getters}, message) => {
+  commit(types.SET_MESSAGE, message);
+};
+
 export const setMessages = ({commit, getters}, messages) => {
   commit(types.SET_MESSAGES, messages);
 };
@@ -461,22 +462,22 @@ export const setLastCompletedRequest = (
 ) => {
   commit(types.SET_LAST_COMPLETED_REQUEST, lastCompletedRequest);
 };
-
-export const setVisibleColumns = ({commit, getters}, visibleColumns) => {
-  commit(types.SET_VISIBLECOLUMNS, visibleColumns);
-};
-
-export const setIsLoadingList = ({commit, getters}, isLoadingList) => {
-  commit(types.SET_ISLOADINGLIST, isLoadingList);
-};
-
-export const setStore = ({commit, getters}, store) => {
-  commit(types.SET_STORE, store);
-};
-
-export const setOffline = ({commit, getters}, offline) => {
-  commit(types.SET_OFFLINE, offline);
-};
-export const setPayable = ({commit, getters}, payable) => {
-  commit(types.SET_PAYABLE, payable);
-};
+
+export const setVisibleColumns = ({commit, getters}, visibleColumns) => {
+  commit(types.SET_VISIBLECOLUMNS, visibleColumns);
+};
+
+export const setIsLoadingList = ({commit, getters}, isLoadingList) => {
+  commit(types.SET_ISLOADINGLIST, isLoadingList);
+};
+
+export const setStore = ({commit, getters}, store) => {
+  commit(types.SET_STORE, store);
+};
+
+export const setOffline = ({commit, getters}, offline) => {
+  commit(types.SET_OFFLINE, offline);
+};
+export const setPayable = ({commit, getters}, payable) => {
+  commit(types.SET_PAYABLE, payable);
+};

package/src/tests/react/components/table/DefaultTable.defaultAppearance.test.js

@@ -0,0 +1,14 @@
+// app-community #1092: the compact layout is the DefaultTable default.
+// Pages (Order History, Financial Hub) must inherit it instead of opting in.
+const fs = require('node:fs');
+const path = require('node:path');
+
+const read = relative => fs.readFileSync(path.join(__dirname, relative), 'utf8');
+
+it('uses the compact layout as the DefaultTable default appearance', () => {
+  expect(read('../../../../react/components/table/DefaultTable.js')).toMatch(/^\s+appearance = 'compact',$/m);
+});
+
+it('keeps legacy appearance reachable through an explicit prop', () => {
+  expect(read('../../../../react/components/table/DefaultTableToolbar.js')).toMatch(/configs\.appearance === 'compact'/);
+});

package/src/tests/react/components/table/DefaultTable.group1.test.js

@@ -19,6 +19,7 @@ it('can show only search in the toolbar while hiding configured actions and cont
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome', searchable: true}],
           data: [],
           showToolbarActions: false,
@@ -42,6 +43,7 @@ it('keeps the list/card toggle visible on compact layouts even when cards are fo
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [],
           showColumnFiltersButton: false,
@@ -68,6 +70,7 @@ it('respects the compact grid/list toggle in the table body', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           data: [{id: 1, name: 'Pedido'}],
           showColumnFiltersButton: false,
           storeName: 'orders',
@@ -87,6 +90,7 @@ it('respects the compact grid/list toggle in the table body', () => {
       toggleViewButton.props.onPress();
       tree.update(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           data: [{id: 1, name: 'Pedido'}],
           showColumnFiltersButton: false,
           storeName: 'orders',
@@ -118,6 +122,7 @@ it('pins identity and action columns on table view', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           rowActionsComponent,
           storeName: 'orders',
         }),
@@ -178,6 +183,7 @@ it('renders a custom row actions component with the configured actions width', (
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           onEditRow: jest.fn(),
           rowActionsComponent,
           rowActionsWidth: 180,
@@ -231,6 +237,7 @@ it('keeps only the identity column pinned when row actions are not pinned', () =
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           pinRowActions: false,
           rowActionsComponent,
           storeName: 'orders',
@@ -293,6 +300,7 @@ it('keeps the complete search aligned in the toolbar when there is enough room',
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [],
           storeName: 'orders',
@@ -316,6 +324,7 @@ it('hides the toolbar when the screen disables it', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome', searchable: true}],
           data: [],
           showToolbar: false,
@@ -344,6 +353,7 @@ it('keeps add available as a floating button when the toolbar is hidden', () =>
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome', searchable: true}],
           data: [],
           onAdd,
@@ -380,6 +390,7 @@ it('opens the default create form when add has no custom handler', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           requestParams: {receiver: 21},
           showToolbar: false,
           storeName: 'invoice',
@@ -418,6 +429,7 @@ it('collapses search into an icon on narrow toolbars and opens the search modal'
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [],
           storeName: 'orders',

package/src/tests/react/components/table/DefaultTable.group2.test.js

@@ -13,6 +13,7 @@ it('gives collapsed search a stable accessible name without a placeholder', () =
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [],
           storeName: 'orders',
@@ -41,6 +42,7 @@ it('keeps the financial compact toolbar aligned when the total is already in the
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [],
           showTotalItemsInCompactToolbar: true,
@@ -80,6 +82,7 @@ it('opens the filters modal with filterable columns only', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           data: [],
           storeName: 'orders',
         }),
@@ -117,6 +120,7 @@ it('persists filters and sort under default-table[store][route]', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           storeName: 'orders',
         }),
       );
@@ -195,6 +199,7 @@ it('hydrates the saved sort using a stable preference key on auto tables', async
     await renderer.act(async () => {
       renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           storeName: 'orders',
           visibleColumnsPreferenceKey: 'order-history-page',
         }),
@@ -244,6 +249,7 @@ it('hydrates and persists controlled filters under default-table[store][route]',
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           filters: {},
           onFilterChange,
           storeName: 'product_showcase_items',
@@ -257,6 +263,7 @@ it('hydrates and persists controlled filters under default-table[store][route]',
     renderer.act(() => {
       tree.update(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           filters: {integration: 'ifood'},
           onFilterChange,
           storeName: 'product_showcase_items',
@@ -294,6 +301,7 @@ it('preserves the compact toolbar total when the footer total is disabled', () =
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [],
           showTotalItemsInCompactToolbar: true,
@@ -307,6 +315,7 @@ it('preserves the compact toolbar total when the footer total is disabled', () =
   });
 it('forces cards when entering compact mode and still toggles between cards and list', () => {
     const props = {
+      appearance: 'default',
       columns: [{key: 'name', label: 'Nome'}],
       data: [{id: 1, name: 'Pedido 1'}],
       showColumnFiltersButton: false,
@@ -360,6 +369,7 @@ it('applies a custom rowStyle to rendered table rows', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [{id: 1, name: 'Pedido 1'}],
           onRowPress: () => {},
@@ -398,6 +408,7 @@ it('blocks row navigation while an inline cell is editing or saving', async () =
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           storeName: 'orders',
           actions: {save},
           columns: [{key: 'name', label: 'Nome', editable: true}],

package/src/tests/react/components/table/DefaultTable.group3.test.js

@@ -7,6 +7,7 @@ it('protects custom card openRow while a card field is editing', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome', editable: true}],
           data: [{id: 1, name: 'Cliente'}],
           onRowPress,
@@ -44,6 +45,7 @@ it('protects both custom row action navigation callbacks during inline editing',
   mockState.windowDimensions = {width: 1024, height: 800};
   let tree;
   renderer.act(() => {tree = renderer.create(React.createElement(DefaultTable, {
+          appearance: 'default',
     columns: [{key: 'name', label: 'Nome', editable: true}],
     data: [{id: 1, name: 'Cliente'}], onRowPress,
     rowActionsComponent: props => React.createElement('CustomRowActions', props),
@@ -82,6 +84,7 @@ it('renders a custom footer component when provided', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'name', label: 'Nome'}],
           data: [{id: 1, name: 'Pedido 1'}],
           footerComponent: FooterComponent,
@@ -113,6 +116,7 @@ it('keeps infinite scroll loading transparent over existing rows', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           showColumnFiltersButton: false,
           showRowActions: false,
           storeName: 'invoices',
@@ -157,6 +161,7 @@ it('uses the configured summary and labels before the store summary', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [{key: 'status', label: 'Situação'}],
           data: [{id: 332, status: 'Pago'}],
           showColumnFiltersButton: false,
@@ -200,6 +205,7 @@ it('opens a debug query modal when the store exposes debug.query', () => {
     renderer.act(() => {
       tree = renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           requestParams: {itemsPerPage: 50},
           storeName: 'orders',
         }),
@@ -239,6 +245,7 @@ it('uses store actions when no explicit table actions are passed', async () => {
     await renderer.act(async () => {
       renderer.create(
         React.createElement(DefaultTable, {
+          appearance: 'default',
           columns: [
             {
               key: 'jobTitle',

package/src/tests/react/components/table/DefaultTableCards.layout.test.js

@@ -11,6 +11,7 @@ jest.mock('react-native', () => {
     Text: props => React.createElement('Text', props, props.children),
     FlatList: props => React.createElement('List', {}, props.data.map((item, index) => props.renderItem({item, index}))),
     StyleSheet: {create: value => value},
+    useWindowDimensions: () => ({width: 1024, height: 800}),
     Platform: {select: value => value.web},
   };
 });

package/src/tests/react/components/table/defaultTableTestSetup.cjs

@@ -73,6 +73,7 @@ jest.mock('react-native', () => {
 
   return {
     FlatList,
+    KeyboardAvoidingView: createComponent('KeyboardAvoidingView'),
     Modal: createComponent('Modal'),
     Platform: {
       OS: 'web',