@controleonline/ui-default 1.0.270 → 1.0.273

package/src/react/utils/tableVisibleColumnsPreferences.js

@@ -3,12 +3,45 @@ export const TABLE_VIEW_MODE_PREFERENCES_KEY = 'viewMode';
 export const TABLE_SORT_PREFERENCES_KEY = 'sort';
 export const TABLE_FILTER_PREFERENCES_KEY = 'filters';
 export const DEFAULT_TABLE_PREFERENCES_STORAGE_KEY = 'default-table';
+export const REQUIRED_VISIBLE_COLUMN_KEYS = ['id'];
 
 const isPlainObject = value =>
   !!value && typeof value === 'object' && !Array.isArray(value);
 
 const getColumnKey = column => column?.key || column?.name || '';
 
+const normalizeColumnKey = value => String(value || '').trim().toLowerCase();
+
+export const isRequiredVisibleColumn = column => {
+  const key = normalizeColumnKey(getColumnKey(column));
+  if (!key) {
+    return false;
+  }
+
+  if (column?.required === true || column?.hideable === false) {
+    return true;
+  }
+
+  return REQUIRED_VISIBLE_COLUMN_KEYS.includes(key);
+};
+
+export const isRequiredVisibleColumnKey = (key, columns = []) => {
+  const normalizedKey = normalizeColumnKey(key);
+  if (!normalizedKey) {
+    return false;
+  }
+
+  const column = (Array.isArray(columns) ? columns : []).find(
+    item => normalizeColumnKey(getColumnKey(item)) === normalizedKey,
+  );
+
+  if (column) {
+    return isRequiredVisibleColumn(column);
+  }
+
+  return REQUIRED_VISIBLE_COLUMN_KEYS.includes(normalizedKey);
+};
+
 const normalizePreferenceSegment = value =>
   String(value || '')
     .trim()
@@ -18,6 +51,7 @@ const normalizePreferenceSegment = value =>
     .replace(/-+/g, '-');
 
 export const resolveDefaultTablePreferenceScope = ({
+  companyId = '',
   preferenceKey = '',
   route = null,
   storeName = '',
@@ -30,11 +64,13 @@ export const resolveDefaultTablePreferenceScope = ({
     'unknown-route';
 
   /*
-   * @agents DefaultTable preferences are saved as [store][route].
-   * The same store can back different screens, so filters, sort, view mode,
-   * and column visibility must never be keyed only by store or only by route.
+   * @agents DefaultTable preferences are saved as [company][store][route].
+   * The same store can back different screens, and the same user can switch
+   * companies, so filters, sort, view mode, and column visibility must be
+   * keyed by company, store and route together.
    */
   return {
+    companyKey: normalizePreferenceSegment(companyId),
     routeKey: routeName,
     storeKey: normalizePreferenceSegment(storeName) || 'unknown-store',
   };
@@ -45,10 +81,13 @@ const normalizePreferenceScope = scope => {
     return null;
   }
 
+  const companyKey = normalizePreferenceSegment(scope.companyKey);
   const storeKey = normalizePreferenceSegment(scope.storeKey);
   const routeKey = normalizePreferenceSegment(scope.routeKey);
 
-  return storeKey && routeKey ? {storeKey, routeKey} : null;
+  return companyKey && storeKey && routeKey
+    ? {companyKey, storeKey, routeKey}
+    : null;
 };
 
 const readStoredPreferences = () => {
@@ -86,7 +125,10 @@ const readScopedPreference = scope => {
   }
 
   const storedPreferences = readStoredPreferences();
-  const storePreferences = storedPreferences[resolvedScope.storeKey];
+  const companyPreferences = storedPreferences[resolvedScope.companyKey];
+  const storePreferences = isPlainObject(companyPreferences)
+    ? companyPreferences[resolvedScope.storeKey]
+    : null;
   const routePreferences = isPlainObject(storePreferences)
     ? storePreferences[resolvedScope.routeKey]
     : null;
@@ -101,8 +143,13 @@ const writeScopedPreference = (scope, nextValues = {}) => {
   }
 
   const storedPreferences = readStoredPreferences();
-  const storePreferences = isPlainObject(storedPreferences[resolvedScope.storeKey])
-    ? storedPreferences[resolvedScope.storeKey]
+  const companyPreferences = isPlainObject(
+    storedPreferences[resolvedScope.companyKey],
+  )
+    ? storedPreferences[resolvedScope.companyKey]
+    : {};
+  const storePreferences = isPlainObject(companyPreferences[resolvedScope.storeKey])
+    ? companyPreferences[resolvedScope.storeKey]
     : {};
   const routePreferences = isPlainObject(storePreferences[resolvedScope.routeKey])
     ? storePreferences[resolvedScope.routeKey]
@@ -110,11 +157,14 @@ const writeScopedPreference = (scope, nextValues = {}) => {
 
   writeStoredPreferences({
     ...storedPreferences,
-    [resolvedScope.storeKey]: {
-      ...storePreferences,
-      [resolvedScope.routeKey]: {
-        ...routePreferences,
-        ...nextValues,
+    [resolvedScope.companyKey]: {
+      ...companyPreferences,
+      [resolvedScope.storeKey]: {
+        ...storePreferences,
+        [resolvedScope.routeKey]: {
+          ...routePreferences,
+          ...nextValues,
+        },
       },
     },
   });
@@ -124,11 +174,41 @@ export const buildDefaultVisibleColumns = columns =>
   (Array.isArray(columns) ? columns : []).reduce((accumulator, column) => {
     const key = getColumnKey(column);
     if (key) {
-      accumulator[key] = column?.visible !== false;
+      accumulator[key] = isRequiredVisibleColumn(column)
+        ? true
+        : column?.visible !== false;
     }
     return accumulator;
   }, {});
 
+const enforceRequiredVisibleColumns = (columns = [], visibleColumns = {}) => {
+  const nextVisibleColumns = {...visibleColumns};
+  const columnList = Array.isArray(columns) ? columns : [];
+
+  columnList.forEach(column => {
+    const key = getColumnKey(column);
+    if (key && isRequiredVisibleColumn(column)) {
+      nextVisibleColumns[key] = true;
+    }
+  });
+
+  const hasVisibleColumn = Object.keys(nextVisibleColumns).some(
+    key => nextVisibleColumns[key] !== false,
+  );
+
+  if (!hasVisibleColumn) {
+    const fallbackColumn =
+      columnList.find(column => isRequiredVisibleColumn(column)) ||
+      columnList.find(column => getColumnKey(column));
+    const fallbackKey = getColumnKey(fallbackColumn);
+    if (fallbackKey) {
+      nextVisibleColumns[fallbackKey] = true;
+    }
+  }
+
+  return nextVisibleColumns;
+};
+
 export const sanitizeVisibleColumnsPreference = ({
   columns = [],
   visibleColumns = null,
@@ -136,16 +216,34 @@ export const sanitizeVisibleColumnsPreference = ({
   const defaultVisibleColumns = buildDefaultVisibleColumns(columns);
 
   if (!isPlainObject(visibleColumns)) {
-    return defaultVisibleColumns;
+    return enforceRequiredVisibleColumns(columns, defaultVisibleColumns);
   }
 
-  return Object.keys(defaultVisibleColumns).reduce((accumulator, key) => {
+  const sanitized = Object.keys(defaultVisibleColumns).reduce((accumulator, key) => {
     accumulator[key] =
       typeof visibleColumns[key] === 'boolean'
         ? visibleColumns[key]
         : defaultVisibleColumns[key];
     return accumulator;
   }, {});
+
+  return enforceRequiredVisibleColumns(columns, sanitized);
+};
+
+export const canHideVisibleColumn = ({
+  columns = [],
+  fieldName = '',
+  visibleColumns = {},
+} = {}) => {
+  if (isRequiredVisibleColumnKey(fieldName, columns)) {
+    return false;
+  }
+
+  const visibleCount = Object.keys(visibleColumns || {}).filter(
+    key => visibleColumns[key] !== false,
+  ).length;
+
+  return visibleCount > 1;
 };
 
 export const sanitizeTableFiltersPreference = ({

package/src/tests/react/components/address/defaultAddressHelpers.test.js

@@ -0,0 +1,104 @@
+/**
+ * Unit tests for defaultAddressHelpers (app-community#283).
+ */
+import {
+  emptyForm,
+  hasCoordinates,
+  hydrateFromRow,
+  mergePostalCodeData,
+  onlyDigits,
+  parseOptionalCoordinate,
+  buildMapMarkerPayload,
+} from '../../../../react/components/address/defaultAddressHelpers';
+
+describe('defaultAddressHelpers', () => {
+  test('onlyDigits strips non-digits', () => {
+    expect(onlyDigits('12.345-678')).toBe('12345678');
+    expect(onlyDigits(null)).toBe('');
+  });
+
+  test('parseOptionalCoordinate accepts number and comma decimal', () => {
+    expect(parseOptionalCoordinate('-23.5505')).toBe(-23.5505);
+    expect(parseOptionalCoordinate('-46,6333')).toBeCloseTo(-46.6333);
+    expect(parseOptionalCoordinate('')).toBeNull();
+    expect(parseOptionalCoordinate('abc')).toBeNull();
+  });
+
+  test('hasCoordinates requires both finite values', () => {
+    expect(hasCoordinates({latitude: -23.5, longitude: -46.6})).toBe(true);
+    expect(hasCoordinates({latitude: null, longitude: -46.6})).toBe(false);
+    expect(hasCoordinates(emptyForm)).toBe(false);
+  });
+
+  test('hydrateFromRow maps nested street/district/city/state', () => {
+    const row = {
+      nickname: 'Matriz',
+      number: 100,
+      latitude: -23.5,
+      longitude: -46.6,
+      street: {
+        street: 'Av Paulista',
+        cep: {cep: '01310100'},
+        district: {
+          district: 'Bela Vista',
+          city: {
+            city: 'São Paulo',
+            state: {
+              uf: 'SP',
+              state: 'São Paulo',
+              country: {countrycode: 'BR', countryname: 'Brazil'},
+            },
+          },
+        },
+      },
+    };
+    const form = hydrateFromRow(row);
+    expect(form.street).toBe('Av Paulista');
+    expect(form.district).toBe('Bela Vista');
+    expect(form.city).toBe('São Paulo');
+    expect(form.uf).toBe('SP');
+    expect(form.cep).toBe('01310100');
+    expect(form.latitude).toBe(-23.5);
+    expect(form.longitude).toBe(-46.6);
+  });
+
+  test('mergePostalCodeData fills lat/long from provider payload', () => {
+    const prev = {...emptyForm, street: 'Rua A'};
+    const data = {
+      cep: '01310100',
+      street: 'Av Paulista',
+      city: 'São Paulo',
+      uf: 'SP',
+      country: 'Brasil',
+      latitude: -23.561,
+      longitude: -46.656,
+      map: {staticUrl: 'https://example.com/map'},
+      provider: 'googlemaps',
+    };
+    const next = mergePostalCodeData(prev, data);
+    expect(next.latitude).toBe(-23.561);
+    expect(next.longitude).toBe(-46.656);
+    expect(next.provider).toBe('googlemaps');
+    expect(next.mapStaticUrl).toBe('https://example.com/map');
+    expect(next.countryCode).toBe('BR');
+  });
+
+  test('buildMapMarkerPayload returns null without address or coords', () => {
+    expect(buildMapMarkerPayload(emptyForm)).toBeNull();
+  });
+
+  test('buildMapMarkerPayload includes coords when present', () => {
+    const payload = buildMapMarkerPayload({
+      ...emptyForm,
+      street: 'Av Paulista',
+      number: '1000',
+      city: 'São Paulo',
+      uf: 'SP',
+      latitude: -23.5,
+      longitude: -46.6,
+    });
+    expect(payload).not.toBeNull();
+    expect(payload.latitude).toBe(-23.5);
+    expect(payload.longitude).toBe(-46.6);
+  });
+});

package/src/tests/react/components/files/DefaultFile.test.js

@@ -20,6 +20,7 @@ jest.mock('@store', () => ({
 }));
 
 jest.mock('react-native', () => ({
+  Platform: {OS: 'android'},
   Image: props => React.createElement('image', props, props.children),
 }));
 
@@ -35,7 +36,7 @@ describe('DefaultFile', () => {
     jest.clearAllTimers();
   });
 
-  it('renders backend download files with app-domain query and headers', () => {
+  it('renders backend download files with path app-domain and headers', () => {
     let tree;
 
     renderer.act(() => {
@@ -58,11 +59,11 @@ describe('DefaultFile', () => {
 
     const image = tree.root.findByType('image');
 
-    expect(image.props.source).toEqual({
-      uri: 'https://api.controleonline.com/files/3/download?app-domain=maincompany.controleonline.com',
-      headers: {
-        Authorization: 'Bearer token',
-        'app-domain': 'maincompany.controleonline.com',
+    expect(image.props.source).toEqual({
+      uri: 'https://api.controleonline.com/maincompany.controleonline.com/files/3/download',
+      headers: {
+        Authorization: 'Bearer token',
+        'app-domain': 'maincompany.controleonline.com',
       },
     });
     expect(image.props.resizeMode).toBe('contain');
@@ -78,3 +79,18 @@ describe('DefaultFile', () => {
     expect(tree.toJSON()).toBeNull();
   });
 });
+
+it('uses the domain company from the store when another company is selected', () => {
+  require('@store').useStore.mockReturnValue({getters: {
+    mainCompany: {id: 1, domain: 'domain.example'},
+    currentCompany: {id: 2, domain: 'selected.example'},
+  }});
+  let tree;
+  renderer.act(() => {
+    tree = renderer.create(React.createElement(DefaultFile, {file: {id: 7, url: '/files/7/download'}}));
+  });
+  const source = tree.root.findByType('image').props.source;
+  expect(source.uri).toBe('https://api.controleonline.com/domain.example/files/7/download');
+  expect(source.headers['app-domain']).toBe('domain.example');
+  renderer.act(() => tree.unmount());
+});

package/src/tests/react/components/files/DefaultFileColumn.company.test.js

@@ -0,0 +1,24 @@
+const React = require('react');
+const renderer = require('react-test-renderer');
+const {expect, it, jest} = require('@jest/globals');
+global.IS_REACT_ACT_ENVIRONMENT = true;
+jest.mock('react-native', () => ({View: 'View', Text: 'Text', TouchableOpacity: 'TouchableOpacity',
+  Linking: {openURL: jest.fn()}, StyleSheet: {create: x => x}}));
+jest.mock('react-native-vector-icons/Feather', () => 'Icon');
+jest.mock('@store', () => ({useStore: jest.fn()}));
+jest.mock('../../../../react/components/files/DefaultFile', () => 'Preview');
+jest.mock('../../../../react/components/files/DefaultFileColumn.utils', () => ({
+  normalizeDefaultFileColumnItems: jest.fn(() => []), normalizeFileColumnText: value => value,
+}));
+const {useStore} = require('@store');
+const {normalizeDefaultFileColumnItems} = require('../../../../react/components/files/DefaultFileColumn.utils');
+const Column = require('../../../../react/components/files/DefaultFileColumn').default;
+it('passes the domain company to file URL resolution when B is selected', () => {
+  const mainCompany = {id: 1, domain: 'domain.example'};
+  useStore.mockImplementation(name => name === 'people'
+    ? {getters: {mainCompany, currentCompany: {id: 2}}} : {getters: {colors: {}}});
+  let tree;
+  renderer.act(() => { tree = renderer.create(React.createElement(Column, {})); });
+  expect(normalizeDefaultFileColumnItems.mock.calls.at(-1)[0].company).toEqual(mainCompany);
+  renderer.act(() => tree.unmount());
+});

package/src/tests/react/components/form/DefaultForm.test.js

@@ -78,4 +78,127 @@ describe('DefaultForm', () => {
     const inputAfterTyping = capturedInputs[capturedInputs.length - 1];
     expect(inputAfterTyping.value).toBe('Cliente desistiu');
   });
+
+  it('saves hidden create payload columns with row and default values', async () => {
+    const save = jest.fn(() => Promise.resolve({id: 10}));
+    const columns = [
+      {
+        name: 'price',
+        label: 'value',
+      },
+      {
+        name: 'receiver',
+        createPayload: true,
+        visibleForm: false,
+        saveFormat: value => `/people/${value}`,
+      },
+      {
+        name: 'invoiceType',
+        createPayload: true,
+        defaultValue: 'invoice',
+        visibleForm: false,
+      },
+    ];
+    let tree;
+
+    await renderer.act(async () => {
+      tree = renderer.create(
+        React.createElement(DefaultForm, {
+          actions: {save},
+          columns,
+          mode: 'create',
+          row: {receiver: 21},
+          storeName: 'invoice',
+        }),
+      );
+    });
+
+    await renderer.act(async () => {
+      capturedInputs[capturedInputs.length - 1].onChangeValue('123.45');
+    });
+
+    const saveButton = tree.root.findAllByType('TouchableOpacity')[1];
+
+    await renderer.act(async () => {
+      await saveButton.props.onPress();
+    });
+
+    expect(save).toHaveBeenCalledWith({
+      price: 123.45,
+      receiver: '/people/21',
+      invoiceType: 'invoice',
+    });
+  });
+
+  it('preserves primitive ids for hidden create payload list columns', async () => {
+    const save = jest.fn(() => Promise.resolve({id: 11}));
+    const columns = [
+      {
+        name: 'price',
+      },
+      {
+        name: 'receiver',
+        createPayload: true,
+        list: 'people/getItems',
+        visibleForm: false,
+        formatList: value => {
+          if (!value || typeof value !== 'object') {
+            return {value, label: String(value || '')};
+          }
+
+          return {value: value.id, label: value.name};
+        },
+        saveFormat: value => `/people/${value?.value || value}`,
+      },
+    ];
+    let tree;
+
+    await renderer.act(async () => {
+      tree = renderer.create(
+        React.createElement(DefaultForm, {
+          actions: {save},
+          columns,
+          mode: 'create',
+          row: {receiver: 21},
+          storeName: 'invoice',
+        }),
+      );
+    });
+
+    await renderer.act(async () => {
+      capturedInputs[capturedInputs.length - 1].onChangeValue('1.23');
+    });
+
+    await renderer.act(async () => {
+      await tree.root.findAllByType('TouchableOpacity')[1].props.onPress();
+    });
+
+    expect(save).toHaveBeenCalledWith({
+      price: 1.23,
+      receiver: '/people/21',
+    });
+  });
+
+  it('uses explicit form labels before translated column fallbacks', async () => {
+    const columns = [
+      {
+        name: 'paymentType',
+        label: 'paymentType.paymentType',
+        formLabel: 'Tipo de pagamento',
+      },
+    ];
+
+    await renderer.act(async () => {
+      renderer.create(
+        React.createElement(DefaultForm, {
+          actions: {save: jest.fn()},
+          columns,
+          mode: 'create',
+          storeName: 'invoice',
+        }),
+      );
+    });
+
+    expect(capturedInputs[capturedInputs.length - 1].label).toBe('Tipo de pagamento');
+  });
 });

package/src/tests/react/components/help/DefaultTooltip.test.js

@@ -0,0 +1,93 @@
+/* global jest */
+
+const React = require('react');
+const TestRenderer = require('react-test-renderer');
+const {act} = TestRenderer;
+const {describe, expect, it} = global;
+
+jest.mock('react-native', () => {
+  const React = require('react');
+  const component = name => props => React.createElement(name, props, props.children);
+
+  return {
+    Modal: props =>
+      React.createElement('modal', props, props.visible ? props.children : null),
+    Pressable: component('pressable'),
+    StyleSheet: {create: styles => styles},
+    Text: component('text'),
+    TouchableOpacity: component('touchable-opacity'),
+    View: component('view'),
+  };
+});
+
+const DefaultTooltip = require('../../../../react/components/help/DefaultTooltip').default;
+
+describe('DefaultTooltip', () => {
+  it('keeps the existing text message contract', () => {
+    let renderer;
+    act(() => {
+      renderer = TestRenderer.create(
+        React.createElement(DefaultTooltip, {
+          message: 'Ajuda já existente',
+          testID: 'message-trigger',
+        }),
+      );
+    });
+
+    const trigger = renderer.root
+      .findAllByType('touchable-opacity')
+      .find(node => node.props.testID === 'message-trigger');
+
+    act(() => trigger.props.onPress());
+
+    const renderedText = renderer.root
+      .findAllByType('text')
+      .flatMap(node => node.children)
+      .join(' ');
+    expect(renderedText).toContain('Ajuda já existente');
+  });
+
+  it('renders structured rows and closes from the action or backdrop', () => {
+    let renderer;
+    act(() => {
+      renderer = TestRenderer.create(
+        React.createElement(DefaultTooltip, {
+          backdropTestID: 'tooltip-backdrop',
+          closeAccessibilityLabel: 'Fechar detalhes',
+          dialogTestID: 'tooltip-dialog',
+          label: 'i',
+          rows: [
+            {key: 'company', label: 'Empresa', value: 'GYROS'},
+            {key: 'device', label: 'Device', value: null},
+          ],
+          testID: 'tooltip-trigger',
+          title: 'Detalhes',
+        }),
+      );
+    });
+
+    expect(renderer.root.findAllByProps({testID: 'tooltip-dialog'})).toHaveLength(0);
+
+    const trigger = renderer.root
+      .findAllByType('touchable-opacity')
+      .find(node => node.props.testID === 'tooltip-trigger');
+
+    act(() => trigger.props.onPress());
+
+    const renderedText = renderer.root
+      .findAllByType('text')
+      .flatMap(node => node.children)
+      .join(' ');
+    expect(renderedText).toContain('GYROS');
+    expect(renderedText).toContain('Não configurado');
+
+    act(() =>
+      renderer.root.findByProps({accessibilityLabel: 'Fechar detalhes'}).props.onPress(),
+    );
+    expect(renderer.root.findAllByProps({testID: 'tooltip-dialog'})).toHaveLength(0);
+
+    act(() => trigger.props.onPress());
+    act(() => renderer.root.findByProps({testID: 'tooltip-backdrop'}).props.onPress());
+    expect(renderer.root.findAllByProps({testID: 'tooltip-dialog'})).toHaveLength(0);
+  });
+});