fix: evaluate default values of config only when storage is empty (#825)

* RM#87897

changelogs/unreleased/87897.json

@@ -0,0 +1,5 @@
+{
+  "title": "UI Configs: evaluate default values for config only when storage is empty",
+  "type": "fix",
+  "packages": "core"
+}

packages/core/src/auth/screens/UserScreen.js

@@ -17,14 +17,14 @@
  */
 
 import React, {useCallback, useEffect} from 'react';
-import {Dimensions, StyleSheet} from 'react-native';
-import DeviceInfo from 'react-native-device-info';
+import {StyleSheet} from 'react-native';
 import {Screen, ScrollView, useConfig} from '@axelor/aos-mobile-ui';
 import {useDispatch, useSelector} from '../../index';
 import {fetchLocalizations} from '../features/localizationSlice';
 import {fetchActiveUser} from '../features/userSlice';
 import {DashboardsCard, ShortcutsCard, UserCard} from '../components';
 import {PopupApplicationInformation} from '../../components';
+import {useDefaultValuesOfUser} from '../../hooks/use-storage-config';
 
 const UserScreen = ({children}) => {
   const dispatch = useDispatch();
@@ -34,8 +34,9 @@ const UserScreen = ({children}) => {
   const {loadingUser, isUser} = useSelector(state => state.user);
   const {mobileSettings} = useSelector(state => state.appConfig);
 
-  const {setFilterConfig, setVirtualKeyboardConfig, setNbDecimalDigitForQty} =
-    useConfig();
+  const {setNbDecimalDigitForQty} = useConfig();
+
+  useDefaultValuesOfUser();
 
   useEffect(() => {
     fetchUser();
@@ -48,16 +49,6 @@ const UserScreen = ({children}) => {
     }
   }, [baseConfig, setNbDecimalDigitForQty]);
 
-  useEffect(() => {
-    const SMALL_SCREEN_HEIGHT = 500;
-
-    DeviceInfo.getManufacturer().then(manufacturer =>
-      setVirtualKeyboardConfig(manufacturer === 'Zebra Technologies'),
-    );
-
-    setFilterConfig(Dimensions.get('window').height > SMALL_SCREEN_HEIGHT);
-  }, [setFilterConfig, setVirtualKeyboardConfig]);
-
   const fetchUser = useCallback(() => {
     dispatch(fetchActiveUser(userId));
   }, [dispatch, userId]);

packages/core/src/hooks/use-storage-config.ts

@@ -17,10 +17,13 @@
  */
 
 import {useCallback, useEffect, useMemo} from 'react';
+import {Dimensions} from 'react-native';
+import DeviceInfo from 'react-native-device-info';
 import {useConfig, useTheme} from '@axelor/aos-mobile-ui';
 import {storage} from '../storage/Storage';
 
 const CONFIG_STORAGE_KEY = 'ui_config';
+const SMALL_SCREEN_HEIGHT = 500;
 
 export const useStorageUpdater = () => {
   const {showFilter, showSubtitles, hideVirtualKeyboard} = useConfig();
@@ -70,3 +73,18 @@ export const useConfigUpdater = (): {updateConfigFromStorage: () => void} => {
 
   return useMemo(() => ({updateConfigFromStorage}), [updateConfigFromStorage]);
 };
+
+export const useDefaultValuesOfUser = () => {
+  const {setFilterConfig, setVirtualKeyboardConfig} = useConfig();
+
+  useEffect(() => {
+    const _config = storage.getItem(CONFIG_STORAGE_KEY);
+
+    if (_config == null) {
+      DeviceInfo.getManufacturer().then(manufacturer =>
+        setVirtualKeyboardConfig(manufacturer === 'Zebra Technologies'),
+      );
+      setFilterConfig(Dimensions.get('window').height > SMALL_SCREEN_HEIGHT);
+    }
+  }, [setFilterConfig, setVirtualKeyboardConfig]);
+};