@controleonline/ui-common 1.2.90 → 1.2.92

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

@@ -1,3 +1,6 @@
+import {useWebTranslationRefresh, useWebTranslationReset, useWebDeviceConfigReset, useWebRuntimeIp, useWebWebDeviceIdentity, useWebMainCompany, useWebDeviceRegistration, useWebPrinters, useWebPaymentTypes} from './DefaultProvider.web.lifecycle';
+import {useWebDeviceConfigFetch, useWebDeviceConfigSync, useWebMainConfigReset, useWebMainConfigDiscovery, useWebMainConfigSeed, useWebTranslationBootstrap, useWebBootstrapReady, useWebCompanies, useWebMenus, useWebThemeFetch, useWebThemePalette} from './DefaultProvider.web.configuration';
+import {resolveDomainThemeColors} from './resolveDomainThemeColors';
 import React, {
   createContext,
   useCallback,
@@ -316,75 +319,13 @@ export const DefaultProvider = ({
     ],
   );
 
-  useEffect(() => {
-    global.refreshTranslationsUI = () => {
-      setTranslateVersion(version => version + 1);
-    };
+  useWebTranslationRefresh({setTranslateVersion});
 
-    return () => {
-      if (global.refreshTranslationsUI) {
-        delete global.refreshTranslationsUI;
-      }
-    };
-  }, []);
+  useWebTranslationReset({isLogged, isPublicRouteActive, setTranslateReady, setActiveTranslateBootstrapKey, translateBootstrapKeyRef, translateActions});
 
-  useEffect(() => {
-    if (isLogged && !isPublicRouteActive) {
-      return;
-    }
+  useWebDeviceConfigReset({deviceConfigPeopleIri, lastDeviceConfigPeopleIriRef, setDeviceConfigFetched, setDeviceRuntimeConfigSynced, deviceConfigsActions});
 
-    setTranslateReady(true);
-    setActiveTranslateBootstrapKey('');
-    translateBootstrapKeyRef.current = '';
-    translateActions.setMessages({});
-    translateActions.setPendingMessages?.({});
-
-    if (global.t) {
-      delete global.t;
-    }
-  }, [isLogged, isPublicRouteActive, translateActions]);
-
-  useEffect(() => {
-    if (
-      !deviceConfigPeopleIri ||
-      lastDeviceConfigPeopleIriRef.current === deviceConfigPeopleIri
-    ) {
-      return;
-    }
-
-    lastDeviceConfigPeopleIriRef.current = deviceConfigPeopleIri;
-    setDeviceConfigFetched(false);
-    setDeviceRuntimeConfigSynced(false);
-    deviceConfigsActions.setItem({});
-  }, [deviceConfigPeopleIri, deviceConfigsActions]);
-
-  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]);
+  useWebRuntimeIp({isLogged, api, getRuntimeIpFromResponse, setWebRuntimeIp, user});
 
   const buildWebDevice = () => {
     const webDeviceId = getOrCreateWebDeviceInstanceId();
@@ -422,558 +363,37 @@ export const DefaultProvider = ({
   // effect pass (even when unchanged) re-entered the store after logout→login
   // and produced React #185 (app-community#827).
   const lastWebDeviceSyncRef = useRef('');
-  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]);
-
-  useEffect(() => {
-    if (isShopClientApp || device?.id) {
-      peopleActions.mainCompany().catch(() => {});
-    }
-  }, [device?.id, isShopClientApp, peopleActions]);
-
-  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,
-  ]);
-
-  useEffect(() => {
-    if (isShopClientApp || !isLogged || !currentCompany?.id) {
-      return;
-    }
-
-    printerActions
-      .ensureCompanyPrintersLoaded({people: currentCompany.id})
-      .catch(() => {});
-  }, [currentCompany?.id, isLogged, isShopClientApp, printerActions]);
-
-  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;
-    }
+  useWebWebDeviceIdentity({isLogged, isShopClientApp, buildWebDevice, lastWebDeviceSyncRef, setDevice, deviceActions, packageVersion, user, webRuntimeIp});
 
-    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,
-  ]);
-
-  useEffect(() => {
-    if (!device?.id || !isLogged || !deviceConfigPeopleIri) {
-      return;
-    }
-
-    setDeviceConfigFetched(false);
-    setDeviceRuntimeConfigSynced(false);
-    deviceConfigsActions.setItem({});
-
-    deviceConfigsActions
-      .getItems({
-        'device.device': device.id,
-        people: deviceConfigPeopleIri,
-        type: runtimeDeviceType,
-      })
-      .then(data => {
-        const selectedConfig = selectRuntimeDeviceConfig({
-          items: data,
-          deviceId: device.id,
-          companyId: deviceConfigPeopleIri,
-          runtimeDeviceType,
-        });
-
-        if (selectedConfig) {
-          const nextItem = {
-            ...selectedConfig,
-            configs: parseConfigsObject(selectedConfig?.configs),
-          };
-          deviceConfigsActions.setItem(nextItem);
-          return;
-        }
-
-        deviceConfigsActions.setItem({});
-      })
-      .catch(() => {})
-      .finally(() => {
-        setDeviceConfigFetched(true);
-      });
-  }, [
-    device?.id,
-    deviceConfigPeopleIri,
-    deviceConfigsActions,
-    isLogged,
-    runtimeDeviceType,
-  ]);
-
-  useEffect(() => {
-    if (
-      !deviceConfigFetched ||
-      !isLogged ||
-      !deviceConfigPeopleIri ||
-      !device?.id ||
-      deviceRuntimeConfigSynced
-    ) {
-      return;
-    }
-
-    const isNewPdvConfig =
-      runtimeDeviceType === 'PDV' &&
-      !device_config?.id &&
-      !device_config?.['@id'];
-    const buildDeviceConfigs = isNewPdvConfig
-      ? buildDefaultDeviceConfigs
-      : buildProviderManagedDeviceConfigs;
-    const {nextConfigs, needsUpdate} = buildDeviceConfigs({
-      configs: device_config?.configs,
-      appVersion,
-      deviceInfo: device,
-    });
-
-    if (!needsUpdate) {
-      setDeviceRuntimeConfigSynced(true);
-      return;
-    }
-
-    // app-community#821: never auto-persist device_config from global bootstrap.
-    // Provider-managed fields (config-version, pos-gateway, screen metrics) stay
-    // in memory only. POST/PUT to /device_configs* is reserved for explicit
-    // device settings UI — avoids 403 from DeviceFinancialConfigAuthorizationSubscriber
-    // on pages like order-history (PDV/MANAGER types are fully protected).
-    const currentItem = device_config || {};
-    deviceConfigsActions.setItem({
-      ...currentItem,
-      configs: nextConfigs,
-      device: currentItem.device || device.id,
-      people: currentItem.people || deviceConfigPeopleIri,
-      type: currentItem.type || runtimeDeviceType,
-    });
-    setDeviceRuntimeConfigSynced(true);
-  }, [
-    appVersion,
-    device?.id,
-    device?.manufacturer,
-    device?.isEmulator,
-    deviceConfigFetched,
-    deviceConfigPeopleIri,
-    deviceRuntimeConfigSynced,
-    deviceConfigsActions,
-    device_config,
-    isLogged,
-    runtimeDeviceType,
-    user,
-  ]);
+  useWebMainCompany({isShopClientApp, device, peopleActions});
 
-  useEffect(() => {
-    if (!isLogged || !currentCompany?.id || !device?.id) {
-      return;
-    }
+  useWebDeviceRegistration({isLogged, device, currentCompany, canAdministerCompany, mainCompany, user, deviceActions, buildDeviceRegistrationPayload, app_type, hasDeviceRecordChanges, runtimeDeviceType, setDevice});
 
-    setMainConfigsDiscovered(false);
-  }, [isLogged, currentCompany?.id, device?.id]);
-
-  useEffect(() => {
-    if (
-      !isLogged ||
-      !currentCompany?.id ||
-      !device?.id ||
-      mainConfigsDiscovered
-    ) {
-      return;
-    }
+  useWebPrinters({isShopClientApp, isLogged, currentCompany, printerActions});
 
-    configActions
-      .discoveryMainConfigs({
-        people: '/people/' + currentCompany.id,
-      })
-      .catch(() => { })
-      .finally(() => {
-        setMainConfigsDiscovered(true);
-      });
-  }, [configActions, currentCompany?.id, device?.id, isLogged, mainConfigsDiscovered]);
-
-  useEffect(() => {
-    if (
-      isLogged &&
-      currentCompany &&
-      Object.entries(currentCompany).length > 0 &&
-      !mainConfigsDiscovered
-    ) {
-      configActions.setItems(currentCompany.configs);
-    }
-  }, [currentCompany, isLogged, mainConfigsDiscovered]);
+  useWebPaymentTypes({isShopClientApp, companyConfigs, currentCompany, device_config, walletPaymentTypeRequestRef, walletPaymentTypeLoadedKeyRef, paymentTypeActions, mainConfigsDiscovered, resolveDevicePaymentTypeIds, api, selectPosWalletPaymentTypes, getPaymentGateway});
 
-  useEffect(() => {
-    if (!currentRouteName || isPublicRouteActive) {
-      return;
-    }
+  useWebDeviceConfigFetch({device, isLogged, deviceConfigPeopleIri, setDeviceConfigFetched, setDeviceRuntimeConfigSynced, deviceConfigsActions, runtimeDeviceType, selectRuntimeDeviceConfig, parseConfigsObject});
 
-    if (
-      !isLogged ||
-      !hasCurrentCompany ||
-      !deviceConfigFetched ||
-      !expectedTranslateBootstrapKey
-    ) {
-      return;
-    }
+  useWebDeviceConfigSync({deviceConfigFetched, isLogged, deviceConfigPeopleIri, device, deviceRuntimeConfigSynced, runtimeDeviceType, device_config, buildDefaultDeviceConfigs, buildProviderManagedDeviceConfigs, appVersion, setDeviceRuntimeConfigSynced, deviceConfigsActions, user});
 
-    const currentConfig = JSON.parse(localStorage.getItem('config') || '{}');
+  useWebMainConfigReset({isLogged, currentCompany, device, setMainConfigsDiscovered});
 
-    if (
-      translateBootstrapKeyRef.current === expectedTranslateBootstrapKey &&
-      global.t
-    ) {
-      global.t.companies = companies;
-      global.t.currentCompany = currentCompany;
-      global.t.mainCompany = mainCompany;
-      setActiveTranslateBootstrapKey(expectedTranslateBootstrapKey);
-      setTranslateReady(true);
+  useWebMainConfigDiscovery({isLogged, currentCompany, device, mainConfigsDiscovered, configActions, setMainConfigsDiscovered});
 
-      return;
-    }
+  useWebMainConfigSeed({isLogged, currentCompany, mainConfigsDiscovered, configActions});
 
-    setTranslateReady(false);
+  useWebTranslationBootstrap({currentRouteName, isPublicRouteActive, isLogged, hasCurrentCompany, deviceConfigFetched, expectedTranslateBootstrapKey, translateBootstrapKeyRef, companies, currentCompany, mainCompany, setActiveTranslateBootstrapKey, setTranslateReady, configuredTranslationLanguage, Translate, stores, translateStore});
 
-    if (currentConfig.language !== configuredTranslationLanguage) {
-      const nextConfig = {
-        ...currentConfig,
-        language: configuredTranslationLanguage,
-      };
-      localStorage.setItem(
-        'config',
-        JSON.stringify(nextConfig),
-      );
-    }
+  useWebBootstrapReady({isLogged, hasCurrentCompany, currentRouteName, isTranslateBootstrapReady, onBootstrapReady});
 
-    translateBootstrapKeyRef.current = expectedTranslateBootstrapKey;
-    global.t = new Translate(
-      companies,
-      mainCompany,
-      currentCompany,
-      Object.keys(stores),
-      translateStore,
-    );
-    setActiveTranslateBootstrapKey(expectedTranslateBootstrapKey);
-    setTranslateReady(true);
-    global.refreshTranslationsUI?.();
-  }, [
-    companies,
-    configuredTranslationLanguage,
-    currentCompany,
-    currentRouteName,
-    mainCompany,
-    deviceConfigFetched,
-    expectedTranslateBootstrapKey,
-    hasCurrentCompany,
-    isLogged,
-    isPublicRouteActive,
-    translateStore,
-  ]);
-
-  useEffect(() => {
-    if (
-      !isLogged ||
-      !hasCurrentCompany ||
-      (currentRouteName && isTranslateBootstrapReady)
-    ) {
-      onBootstrapReady?.();
-    }
-  }, [
-    currentRouteName,
-    hasCurrentCompany,
-    isLogged,
-    isTranslateBootstrapReady,
-    onBootstrapReady,
-  ]);
-
-  useEffect(() => {
-    if (device && device.id && isLogged) {
-      peopleActions.myCompanies();
-    }
-  }, [isLogged, device?.id]);
+  useWebCompanies({device, isLogged, peopleActions});
 
-  useEffect(() => {
-    if (!isLogged || !currentCompany?.id) {
-      actions.setMenus([]);
-      return undefined;
-    }
-
-    let cancelled = false;
-
-    api
-      .fetch('menus-people', {
-        params: {
-          myCompany: currentCompany.id,
-          appType,
-          menuType: 'home',
-        },
-      })
-      .then(result => {
-        if (!cancelled) {
-          actions.setMenus(normalizeRuntimeMenuResponse(result, {appType}));
-        }
-      })
-      .catch(() => {
-        if (!cancelled) {
-          actions.setMenus(normalizeRuntimeMenuResponse(null, {appType}));
-        }
-      });
-
-    return () => {
-      cancelled = true;
-    };
-  }, [actions, appType, currentCompany?.id, isLogged]);
-
-  useEffect(() => {
-    const fetchColors = async () => {
-      try {
-        const cssText = await api.fetch('themes-colors.css', {
-          responseType: 'text',
-        });
-        const parsedColors = parseThemeCss(cssText);
-        setBaseThemeColors(parsedColors);
-        actions.setColors(parsedColors);
-      } catch {
-        setBaseThemeColors({});
-      }
-    };
-
-    fetchColors();
-  }, [actions, currentCompany?.id, mainCompany?.id, device?.id]);
+  useWebMenus({isLogged, currentCompany, actions, api, appType, normalizeRuntimeMenuResponse});
 
-  useEffect(() => {
-    const companyThemeColors = isShopClientApp
-      ? mainCompany?.theme?.colors || {}
-      : currentCompany?.theme?.colors || mainCompany?.theme?.colors || {};
-    const mergedThemeColors = {
-      ...(baseThemeColors || {}),
-      ...(companyThemeColors || {}),
-    };
-
-    const palette = resolveThemePalette(mergedThemeColors, runtimeColors);
-    applyPaletteToRuntimeColors(palette, runtimeColors);
-    applyThemeCssVariables({
-      themeColors: mergedThemeColors,
-      palette,
-    });
+  useWebThemeFetch({api, parseThemeCss, setBaseThemeColors, actions, currentCompany, mainCompany, device});
 
-    actions.setColors(mergedThemeColors);
-  }, [
-    actions,
-    baseThemeColors,
-    currentCompany?.id,
-    currentCompany?.theme?.colors,
-    mainCompany?.id,
-    mainCompany?.theme?.colors,
-    isShopClientApp,
-  ]);
+  useWebThemePalette({resolveDomainThemeColors, baseThemeColors, mainCompany, resolveThemePalette, runtimeColors, applyPaletteToRuntimeColors, applyThemeCssVariables, actions, currentCompany, isShopClientApp});
 
   if (requiresTranslateBootstrap && !isTranslateBootstrapReady) {
     return <View style={providerStyles.loadingContainer} />;