@controleonline/ui-common 1.2.89 → 1.2.91

package/src/react/components/DefaultProvider.web.lifecycle.js

@@ -0,0 +1,336 @@
+import {useEffect} from 'react';
+
+// Extracted bootstrap effects retain their dependency arrays and invocation order.
+
+export function useWebTranslationRefresh({setTranslateVersion}) {
+  useEffect(() => {
+    global.refreshTranslationsUI = () => {
+      setTranslateVersion(version => version + 1);
+    };
+
+    return () => {
+      if (global.refreshTranslationsUI) {
+        delete global.refreshTranslationsUI;
+      }
+    };
+  }, []);
+}
+
+export function useWebTranslationReset({isLogged, isPublicRouteActive, setTranslateReady, setActiveTranslateBootstrapKey, translateBootstrapKeyRef, translateActions}) {
+  useEffect(() => {
+    if (isLogged && !isPublicRouteActive) {
+      return;
+    }
+
+    setTranslateReady(true);
+    setActiveTranslateBootstrapKey('');
+    translateBootstrapKeyRef.current = '';
+    translateActions.setMessages({});
+    translateActions.setPendingMessages?.({});
+
+    if (global.t) {
+      delete global.t;
+    }
+  }, [isLogged, isPublicRouteActive, translateActions]);
+}
+
+export function useWebDeviceConfigReset({deviceConfigPeopleIri, lastDeviceConfigPeopleIriRef, setDeviceConfigFetched, setDeviceRuntimeConfigSynced, deviceConfigsActions}) {
+  useEffect(() => {
+    if (
+      !deviceConfigPeopleIri ||
+      lastDeviceConfigPeopleIriRef.current === deviceConfigPeopleIri
+    ) {
+      return;
+    }
+
+    lastDeviceConfigPeopleIriRef.current = deviceConfigPeopleIri;
+    setDeviceConfigFetched(false);
+    setDeviceRuntimeConfigSynced(false);
+    deviceConfigsActions.setItem({});
+  }, [deviceConfigPeopleIri, deviceConfigsActions]);
+}
+
+export function useWebRuntimeIp({isLogged, api, getRuntimeIpFromResponse, setWebRuntimeIp, user}) {
+  useEffect(() => {
+    if (!isLogged) {
+      return;
+    }
+
+    let cancelled = false;
+
+    api
+      .fetch('runtime/ip', {
+        method: 'GET',
+      })
+      .then(response => {
+        const nextRuntimeIp = getRuntimeIpFromResponse(response);
+        if (!nextRuntimeIp || cancelled) {
+          return;
+        }
+
+        setWebRuntimeIp(currentIp =>
+          currentIp === nextRuntimeIp ? currentIp : nextRuntimeIp,
+        );
+      })
+      .catch(() => {});
+
+    return () => {
+      cancelled = true;
+    };
+  }, [isLogged, user?.id]);
+}
+
+export function useWebWebDeviceIdentity({isLogged, isShopClientApp, buildWebDevice, lastWebDeviceSyncRef, setDevice, deviceActions, packageVersion, user, webRuntimeIp}) {
+  useEffect(() => {
+    if (!isLogged && !isShopClientApp) {
+      return;
+    }
+
+    const nextDevice = buildWebDevice();
+    if (!nextDevice) {
+      return;
+    }
+
+    const signature = JSON.stringify({
+      id: nextDevice.id,
+      appVersion: nextDevice.appVersion,
+      appName: nextDevice.appName,
+      type: nextDevice.type,
+      metadata: nextDevice.metadata || {},
+      externalIp: nextDevice.externalIp || null,
+    });
+
+    if (lastWebDeviceSyncRef.current === signature) {
+      return;
+    }
+
+    lastWebDeviceSyncRef.current = signature;
+    setDevice(nextDevice);
+    localStorage.setItem('device', JSON.stringify(nextDevice));
+    deviceActions.setItem(nextDevice);
+    localStorage.removeItem('master-device');
+  }, [deviceActions, isLogged, isShopClientApp, packageVersion, user?.id, webRuntimeIp]);
+}
+
+export function useWebMainCompany({isShopClientApp, device, peopleActions}) {
+  useEffect(() => {
+    if (isShopClientApp || device?.id) {
+      peopleActions.mainCompany().catch(() => {});
+    }
+  }, [device?.id, isShopClientApp, peopleActions]);
+}
+
+export function useWebDeviceRegistration({isLogged, device, currentCompany, canAdministerCompany, mainCompany, user, deviceActions, buildDeviceRegistrationPayload, app_type, hasDeviceRecordChanges, runtimeDeviceType, setDevice}) {
+  useEffect(() => {
+    if (!isLogged || !device?.id) {
+      return;
+    }
+
+    // Device registration changes tenant context and is not valid without an
+    // active company or administrative authority for that company.
+    if (
+      !currentCompany?.id ||
+      !canAdministerCompany({company: currentCompany, mainCompany, user})
+    ) {
+      return;
+    }
+
+    let cancelled = false;
+
+    const syncDeviceRegistration = async () => {
+      const items = await deviceActions.getItems({
+        device: device.id,
+      });
+
+      if (cancelled) {
+        return;
+      }
+
+      const existingDevice =
+        Array.isArray(items) && items.length > 0 ? items[0] : null;
+      const nextDevice = buildDeviceRegistrationPayload({
+        deviceInfo: device,
+        appType: app_type,
+        existingDevice,
+      });
+
+      if (!hasDeviceRecordChanges({existingDevice, nextDevice})) {
+        const nextLocalDevice = {
+          ...device,
+          entityId: existingDevice?.id || device?.entityId || null,
+          entityIri:
+            existingDevice?.['@id'] ||
+            device?.entityIri ||
+            (existingDevice?.id ? `/devices/${existingDevice.id}` : null),
+          alias: existingDevice?.alias || nextDevice.alias,
+          type: device?.type || runtimeDeviceType,
+          metadata: existingDevice?.metadata || nextDevice.metadata,
+        };
+
+        if (JSON.stringify(nextLocalDevice) !== JSON.stringify(device)) {
+          setDevice(nextLocalDevice);
+          localStorage.setItem('device', JSON.stringify(nextLocalDevice));
+          deviceActions.setItem(nextLocalDevice);
+        }
+        return;
+      }
+
+      const savedDevice = await deviceActions.save(nextDevice);
+      if (cancelled || !savedDevice) {
+        return;
+      }
+
+      const nextLocalDevice = {
+        ...device,
+        entityId: savedDevice?.id || device?.entityId || null,
+        entityIri:
+          savedDevice?.['@id'] ||
+          device?.entityIri ||
+          (savedDevice?.id ? `/devices/${savedDevice.id}` : null),
+        alias: savedDevice.alias || nextDevice.alias,
+        type: device?.type || runtimeDeviceType,
+        metadata: savedDevice.metadata || nextDevice.metadata,
+      };
+
+      if (JSON.stringify(nextLocalDevice) !== JSON.stringify(device)) {
+        setDevice(nextLocalDevice);
+        localStorage.setItem('device', JSON.stringify(nextLocalDevice));
+        deviceActions.setItem(nextLocalDevice);
+      }
+    };
+
+    syncDeviceRegistration().catch(() => {});
+
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    device?.appVersion,
+    device?.batteryLevel,
+    device?.buildNumber,
+    device?.deviceType,
+    device?.externalIp,
+    device?.id,
+    device?.manufacturer,
+    device?.model,
+    device?.systemVersion,
+    isLogged,
+    currentCompany,
+    mainCompany,
+    runtimeDeviceType,
+    user,
+  ]);
+}
+
+export function useWebPrinters({isShopClientApp, isLogged, currentCompany, printerActions}) {
+  useEffect(() => {
+    if (isShopClientApp || !isLogged || !currentCompany?.id) {
+      return;
+    }
+
+    printerActions
+      .ensureCompanyPrintersLoaded({people: currentCompany.id})
+      .catch(() => {});
+  }, [currentCompany?.id, isLogged, isShopClientApp, printerActions]);
+}
+
+export function useWebPaymentTypes({isShopClientApp, companyConfigs, currentCompany, device_config, walletPaymentTypeRequestRef, walletPaymentTypeLoadedKeyRef, paymentTypeActions, mainConfigsDiscovered, resolveDevicePaymentTypeIds, api, selectPosWalletPaymentTypes, getPaymentGateway}) {
+  useEffect(() => {
+    const paymentConfigSource = isShopClientApp
+      ? Object.keys(companyConfigs || {}).length > 0
+        ? companyConfigs
+        : currentCompany?.configs
+      : device_config?.configs;
+
+    if (!currentCompany?.id || !paymentConfigSource) {
+      walletPaymentTypeRequestRef.current = {key: '', promise: null};
+      walletPaymentTypeLoadedKeyRef.current = '';
+      paymentTypeActions.setItems([]);
+      return;
+    }
+
+    if (!isShopClientApp && !mainConfigsDiscovered) {
+      return;
+    }
+
+    const paymentTypeSignature = resolveDevicePaymentTypeIds(paymentConfigSource)
+      .sort()
+      .join(',');
+    const requestKey = `${currentCompany.id}:${paymentTypeSignature}`;
+
+    if (walletPaymentTypeLoadedKeyRef.current === requestKey) {
+      return;
+    }
+
+    const existingRequestPromise =
+      walletPaymentTypeRequestRef.current.key === requestKey &&
+      walletPaymentTypeRequestRef.current.promise
+        ? walletPaymentTypeRequestRef.current.promise
+        : null;
+
+    let isMounted = true;
+
+    const requestPromise =
+      existingRequestPromise ||
+      api.fetch('wallet_payment_types', {
+          params: {
+            people: `/people/${currentCompany.id}`,
+          },
+        });
+
+    if (!existingRequestPromise) {
+      walletPaymentTypeRequestRef.current = {
+        key: requestKey,
+        promise: requestPromise,
+      };
+    }
+
+    requestPromise
+      .then(response => {
+        if (!isMounted) {
+          return;
+        }
+
+        const walletPaymentTypes = Array.isArray(response?.member)
+          ? response.member
+          : Array.isArray(response?.['hydra:member'])
+            ? response['hydra:member']
+            : Array.isArray(response)
+              ? response
+              : [];
+        paymentTypeActions.setItems(
+          selectPosWalletPaymentTypes({
+            walletPaymentTypes,
+            deviceConfigs: paymentConfigSource,
+            companyConfigs,
+            gateway: getPaymentGateway(device_config || paymentConfigSource),
+          }),
+        );
+        walletPaymentTypeLoadedKeyRef.current = requestKey;
+      })
+      .catch(() => {
+        if (isMounted) {
+          paymentTypeActions.setItems([]);
+        }
+      })
+      .finally(() => {
+        if (
+          walletPaymentTypeRequestRef.current.key === requestKey &&
+          walletPaymentTypeRequestRef.current.promise === requestPromise
+        ) {
+          walletPaymentTypeRequestRef.current = {key: '', promise: null};
+        }
+      });
+
+    return () => {
+      isMounted = false;
+    };
+  }, [
+    companyConfigs,
+    currentCompany?.configs,
+    currentCompany?.id,
+    device_config?.configs,
+    isShopClientApp,
+    paymentTypeActions,
+  ]);
+}

package/src/react/components/resolveDomainThemeColors.js

@@ -0,0 +1,5 @@
+// The domain palette owns branding. Franchise selection must not change it.
+export const resolveDomainThemeColors = (baseThemeColors = {}, mainCompany = {}) => ({
+  ...(mainCompany?.theme?.colors || {}),
+  ...(baseThemeColors || {}),
+});

package/src/react/pages/Connections.js

@@ -209,13 +209,11 @@ export default function Connections() {
           showColumnFiltersButton
           onRowPress={openWhatsAppChannel}
           renderCard={renderConnectionCard}
-          searchProps={{
-            compact: true,
-            placeholder:
-              tt('connections_label', 'search') || 'Buscar conexao, telefone ou status',
-            searchKey: 'search',
-            storeName: 'connections',
-          }}
+          showSearch
+          searchPlaceholder={
+            tt('connections_label', 'search') || 'Buscar conexao, telefone ou status'
+          }
+          searchKey="search"
           totalItemsLabel="connections"
           visibleColumnsPreferenceKey="connections"
           accentColor={brandColors.primary}

package/src/react/pages/MercadoLivreIntegrationPage.js

@@ -23,6 +23,10 @@ import {
 } from '@controleonline/../../src/styles/branding';
 
 import styles from './IntegrationConfigPage.styles';
+import {
+  normalizeTextValue, isConnected, formatApiError, resolveFrontOAuthRedirectUri,
+  replaceFrontOAuthStatus, formatOAuthStatusError,
+} from './mercadoLivreIntegrationHelpers';
 
 const PROVIDER = {
   key: 'mercadolivre',
@@ -45,81 +49,6 @@ const shadowStyle = Platform.select({
   web: {boxShadow: '0 10px 24px rgba(15,23,42,0.08)'},
 });
 
-const normalizeTextValue = value => String(value ?? '').trim();
-
-const isConnected = value =>
-  value === true ||
-  value === 1 ||
-  value === '1' ||
-  String(value).trim().toLowerCase() === 'true';
-
-const formatApiError = error =>
-  error?.message ||
-  error?.description ||
-  error?.error ||
-  tt('marketplace_error', 'mercadoLivreLoad') ||
-  'Nao foi possivel carregar a integracao Mercado Livre.';
-
-const MERCADO_LIVRE_OAUTH_QUERY_KEYS = [
-  'code',
-  'state',
-  'error',
-  'error_description',
-  'mercadolivre_connected',
-  'mercadolivre_error',
-  'mercadolivre_message',
-];
-
-const resolveFrontOAuthRedirectUri = () => {
-  if (Platform.OS !== 'web' || typeof window === 'undefined') {
-    return undefined;
-  }
-
-  const url = new URL(window.location.href);
-  MERCADO_LIVRE_OAUTH_QUERY_KEYS.forEach(key => url.searchParams.delete(key));
-  url.hash = '';
-
-  return url.toString();
-};
-
-const replaceFrontOAuthStatus = statusParams => {
-  if (Platform.OS !== 'web' || typeof window === 'undefined') {
-    return;
-  }
-
-  const url = new URL(window.location.href);
-  MERCADO_LIVRE_OAUTH_QUERY_KEYS.forEach(key => url.searchParams.delete(key));
-  Object.entries(statusParams || {}).forEach(([key, value]) => {
-    if (value !== undefined && value !== null && value !== '') {
-      url.searchParams.set(key, String(value));
-    }
-  });
-  window.history.replaceState({}, document.title, url.toString());
-};
-
-const formatOAuthStatusError = (error, message) => {
-  const messageText = normalizeTextValue(message);
-  if (messageText) {
-    return `${
-      tt('marketplace_error', 'mercadoLivreConnectWithMessage') ||
-      'Nao foi possivel conectar o Mercado Livre:'
-    } ${messageText}`;
-  }
-
-  const errorText = normalizeTextValue(error);
-  if (!errorText) {
-    return (
-      tt('marketplace_error', 'mercadoLivreConnect') ||
-      'Nao foi possivel conectar o Mercado Livre.'
-    );
-  }
-
-  return `${
-    tt('marketplace_error', 'mercadoLivreConnect') ||
-    'Nao foi possivel conectar o Mercado Livre.'
-  } (${errorText}).`;
-};
-
 export default function MercadoLivreIntegrationPage() {
   const peopleStore = useStore('people');
   const themeStore = useStore('theme');
@@ -513,6 +442,7 @@ export default function MercadoLivreIntegrationPage() {
           </View>
 
           <TouchableOpacity
+            accessibilityRole="button"
             style={[
               styles.saveButton,
               {backgroundColor: PROVIDER.button},

package/src/react/pages/mercadoLivreIntegrationHelpers.js

@@ -0,0 +1,79 @@
+import {Platform} from 'react-native';
+
+const tt = (type, key) => global.t?.t('configs', type, key);
+
+export const normalizeTextValue = value => String(value ?? '').trim();
+
+export const isConnected = value =>
+  value === true ||
+  value === 1 ||
+  value === '1' ||
+  String(value).trim().toLowerCase() === 'true';
+
+export const formatApiError = error =>
+  error?.message ||
+  error?.description ||
+  error?.error ||
+  tt('marketplace_error', 'mercadoLivreLoad') ||
+  'Nao foi possivel carregar a integracao Mercado Livre.';
+
+const MERCADO_LIVRE_OAUTH_QUERY_KEYS = [
+  'code',
+  'state',
+  'error',
+  'error_description',
+  'mercadolivre_connected',
+  'mercadolivre_error',
+  'mercadolivre_message',
+];
+
+export const resolveFrontOAuthRedirectUri = () => {
+  if (Platform.OS !== 'web' || typeof window === 'undefined') {
+    return undefined;
+  }
+
+  const url = new URL(window.location.href);
+  MERCADO_LIVRE_OAUTH_QUERY_KEYS.forEach(key => url.searchParams.delete(key));
+  url.hash = '';
+
+  return url.toString();
+};
+
+export const replaceFrontOAuthStatus = statusParams => {
+  if (Platform.OS !== 'web' || typeof window === 'undefined') {
+    return;
+  }
+
+  const url = new URL(window.location.href);
+  MERCADO_LIVRE_OAUTH_QUERY_KEYS.forEach(key => url.searchParams.delete(key));
+  Object.entries(statusParams || {}).forEach(([key, value]) => {
+    if (value !== undefined && value !== null && value !== '') {
+      url.searchParams.set(key, String(value));
+    }
+  });
+  window.history.replaceState({}, document.title, url.toString());
+};
+
+export const formatOAuthStatusError = (error, message) => {
+  const messageText = normalizeTextValue(message);
+  if (messageText) {
+    return `${
+      tt('marketplace_error', 'mercadoLivreConnectWithMessage') ||
+      'Nao foi possivel conectar o Mercado Livre:'
+    } ${messageText}`;
+  }
+
+  const errorText = normalizeTextValue(error);
+  if (!errorText) {
+    return (
+      tt('marketplace_error', 'mercadoLivreConnect') ||
+      'Nao foi possivel conectar o Mercado Livre.'
+    );
+  }
+
+  return `${
+    tt('marketplace_error', 'mercadoLivreConnect') ||
+    'Nao foi possivel conectar o Mercado Livre.'
+  } (${errorText}).`;
+};
+

package/src/tests/browser/manager/bottom-navigation-role-toolbar.spec.js

@@ -141,9 +141,23 @@ const installSession = async (page, {companyId = 3} = {}) => {
           active: 1,
           mycompany: companyId,
           roles: ['ROLE_ADMIN'],
+          name: 'Test User',
+          realname: 'Test User',
+          username: 'tester',
         }),
       );
       set('config', JSON.stringify({language: 'pt-br'}));
+      // Resolve menu labels locally; the mock API does not provide translations.
+      const labels = {
+        home: 'Início', opportunities: 'Oportunidades',
+        customers: 'Clientes', profile: 'Perfil',
+      };
+      const companyMessages = {
+        menu: {menu: labels}, configs: {toolbar: labels},
+      };
+      set('translates', JSON.stringify({
+        'pt-br': {companies: {3: companyMessages, 9: companyMessages}},
+      }));
       set('app-type', 'MANAGER');
       set(
         'device',

package/src/tests/browser/manager/connections.spec.js

@@ -64,6 +64,13 @@ const mockConnectionsApi = async page => {
       return route.fulfill({status: 204, headers: CORS_HEADERS, body: ''});
     }
 
+    if (pathname === 'people/companies/my') {
+      return route.fulfill({
+        status: 200, headers: jsonHeaders(),
+        body: JSON.stringify(collection([company])),
+      });
+    }
+
     if (pathname === 'companies' || pathname.startsWith('people/')) {
       return route.fulfill({
         status: 200,
@@ -103,9 +110,20 @@ const mockConnectionsApi = async page => {
           active: 1,
           mycompany: 3,
           roles: ['ROLE_ADMIN'],
+          name: 'Test User',
+          realname: 'Test User',
+          username: 'tester',
         }),
       );
       set('config', JSON.stringify({language: 'pt-br'}));
+      set('translates', JSON.stringify({
+        'pt-br': {companies: {3: {configs: {
+          connections_title: {connections: 'Conexões'},
+          connections_label: {
+            whatsApp: 'WhatsApp', search: 'Buscar conexao, telefone ou status',
+          },
+        }}}},
+      }));
       set('app-type', 'ERP');
       set(
         'device',

package/src/tests/browser/manager/device-detail-alias-save.spec.js

@@ -1,3 +1,4 @@
+const {installManagerSession} = require('./managerSession.fixture');
 /**
  * Smoke browser: Manager /device-detail alias save updates header without refresh.
  * fluxo: manager-devices
@@ -16,7 +17,7 @@ const { API_ORIGIN } = require('../../../../../../../src/tests/browser/apiOrigin
 const APP_VERSION = packageJson?.version || '1.0.0';
 const CURRENT_DEVICE_ID = 'web-7';
 const DEVICE_ENTITY_ID = 396;
-const INITIAL_ALIAS = 'Caixa atual';
+const INITIAL_ALIAS = 'Caixa Santa Redonda';
 const NEXT_ALIAS = 'Caixa Renomeado #382';
 
 const CORS_HEADERS = {
@@ -86,6 +87,7 @@ const MODULES_MAX_500 = [
 ];
 
 const mockDevicesApi = async (page) => {
+  await installManagerSession(page);
   const company = {
     id: 3,
     name: 'Teste',

package/src/tests/browser/manager/device-detail-copy-config.spec.js

@@ -1,3 +1,4 @@
+const {installManagerSession} = require('./managerSession.fixture');
 /**
  * Smoke browser: Manager /device-detail copy configs from another device.
  * fluxo: manager-devices
@@ -110,6 +111,7 @@ const otherTenant = createDeviceConfig({
 });
 
 const mockCopyApi = async (page) => {
+  await installManagerSession(page);
   const company = {
     id: 3,
     name: 'Teste',
@@ -328,6 +330,10 @@ test.describe('device-detail copy config (browser smoke #629)', () => {
     await expect(page.getByTestId('copy-device-config-hint')).toContainText(
       DEST_ALIAS,
     );
+    // The translated prefix cannot supply a fixture alias: target identity is dynamic.
+    await expect(page.getByTestId('copy-device-config-hint')).not.toContainText(
+      SRC_ALIAS,
+    );
     await shot('02-copy-modal-picker.png');
 
     await expect(

package/src/tests/browser/manager/device-detail-pdv-current-company.spec.js

@@ -1,3 +1,4 @@
+const {installManagerSession} = require('./managerSession.fixture');
 /**
  * Smoke browser: DeviceConfig PDV detail opens without currentCompany ReferenceError.
  * fluxo: device-configuracao
@@ -91,6 +92,7 @@ const createDeviceConfig = ({id, type, device = currentDevice}) => ({
 });
 
 const mockDevicesApi = async page => {
+  await installManagerSession(page);
   const company = {
     id: 3,
     name: 'Teste',
@@ -248,7 +250,7 @@ test.describe('device-detail PDV currentCompany (#704)', () => {
 
     await page.getByTestId(`device-config-${PDV_CONFIG_ID}`).click();
     await expect(page).toHaveURL(/device-detail/, {timeout: 15000});
-    await expect(page.getByText('Configuração do PDV')).toBeVisible({
+    await expect(page.getByText('Detalhes do Device', {exact: true})).toBeVisible({
       timeout: 15000,
     });
     await writeEvidence(