@fto-consult/expo-ui 6.26.0 → 6.26.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "6.26.0",
+  "version": "6.26.2",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -67,7 +67,8 @@
     "@emotion/react": "^11.11.1",
     "@expo/html-elements": "^0.5.1",
     "@expo/vector-icons": "^13.0.0",
-    "@fto-consult/common": "^3.28.1",
+    "@faker-js/faker": "^8.0.2",
+    "@fto-consult/common": "^3.28.4",
     "@gorhom/portal": "^1.0.14",
     "@pchmn/expo-material3-theme": "^1.3.1",
     "@react-native-async-storage/async-storage": "1.18.2",
@@ -121,7 +122,6 @@
   "devDependencies": {
     "@expo/metro-config": "latest",
     "@expo/webpack-config": "^18.1.2",
-    "@faker-js/faker": "^8.0.2",
     "babel-plugin-inline-dotenv": "^1.7.0",
     "babel-plugin-module-resolver": "^5.0.0",
     "uninstall": "^0.0.0"

package/src/App.js

@@ -3,9 +3,6 @@ import React from 'react';
 import {SWRConfig} from "$swr";
 import Index from './index';
 import notify  from "$notify";
-import { SafeAreaProvider } from 'react-native-safe-area-context';
-import {GestureHandlerRootView} from "react-native-gesture-handler";
-import KeyboardAvoidingViewComponent from '$ecomponents/KeyboardAvoidingView';
 import APP from "$app";
 import {isMobileNative} from "$cplatform";
 import {setDeviceIdRef} from "$capp";
@@ -144,13 +141,7 @@ export default function getIndex({onMount,onUnmount,render,onRender,init}){
           }
         }}
       >
-        <GestureHandlerRootView style={{ flex: 1,flexGrow:1,flexShrink:1}} testID={"RN_GestureHandlerRootView"}>
-          <KeyboardAvoidingViewComponent testID={"RN_AppKeyboardAvoidingView"}>
-            <SafeAreaProvider testID={"RN_AppSafeAreaProvider"}>
-              <Index onMount={onMount} render={render} onUnmount={onUnmount} onRender={onRender} init={init}/>
-            </SafeAreaProvider>
-          </KeyboardAvoidingViewComponent>
-        </GestureHandlerRootView>
+       <Index onMount={onMount} render={render} onUnmount={onUnmount} onRender={onRender} init={init}/>
       </SWRConfig>
     );
 };

package/src/components/Datagrid/Actions/index.js

@@ -16,7 +16,7 @@ export default function DatagridActions ({actions,actionProps,...props}){
   const selectedRowsCount = useGetSelectedRowsCount();
   useWindowDimensions();
   const selected = !!selectedRowsCount;
-  actions = selected ? context?.renderSelectedRowsActions.call(context,actions) : actions;
+  actions = selected ? context?.renderSelectedRowsActions.call(context,{}) : actions;
   if(selected){
     actionProps = Object.assign({},actionProps);
     actionProps.style = Object.assign({},StyleSheet.flatten(actionProps.style));

package/src/components/Datagrid/Common/Common.js

@@ -3560,7 +3560,8 @@ export default class CommonDatagridComponent extends AppComponent {
     }
     isAllRowsSelected(){
         const count = this.getSelectedRowsCount() - this.getSectionListDataSize();
-        return count >=0 && count >= this.getMaxSelectableRows()? true : false;
+        if(count <= 0) return false;
+        return count >= this.getMaxSelectableRows();
     }
     getDefaultPaginationRowsPerPageItems (){
         return [5,10,15,20,25,30,40,50,60,80,100];

package/src/components/Datagrid/utils.js

@@ -173,9 +173,9 @@ export const getRowStyle = ({row,bordered,numColumns,rowData,isAccordion,isTable
         style.push(rowIndex%2===0?styles.even : theme.isDark()?styles.oddDark : styles.odd)
     }
     if(selected){
-        const selectedBcolor = theme.isDark()? SELECTED_BORDER_COLOR : theme.colors.primary;
-        const bordered = isAccordion ? null : {borderBottomWidth:1,borderBottomColor:selectedBcolor,borderTopWidth:1,borderTopColor:selectedBcolor};
-        style.push(styles.selected,bordered);
+        //const selectedBcolor = theme.isDark()? SELECTED_BORDER_COLOR : theme.colors.primary;
+        //const bordered = null;//isAccordion ? null : {borderBottomWidth:1,borderBottomColor:selectedBcolor,borderTopWidth:1,borderTopColor:selectedBcolor};
+        style.push(styles.selected);
     }
     if(paid || row.paid){
         style.push(styles.paid);

package/src/components/Drawer/DrawerItems/index.js

@@ -6,12 +6,13 @@ import DrawerSection from "./DrawerSection"
 import PropTypes from "prop-types";
 import Divider from "$ecomponents/Divider";
 import View from "$ecomponents/View";
+import Auth from "$cauth";
+import { useDrawer } from '../Provider';
 
 export * from "./utils";
 
 const DrawerItemsComponent = React.forwardRef((props,ref)=> {
   let {items:_items,minimized} = props;
-  const hasAuth = typeof window.Auth !=='undefined' && Auth && Auth.isAllowedFromStr ? true : false;
   _items = typeof _items ==='function'? _items(props) : _items;
   if(React.isValidElement(_items)){
      return _items;
@@ -19,7 +20,7 @@ const DrawerItemsComponent = React.forwardRef((props,ref)=> {
   const r = React.useMemo(()=>{
     let items = []
     const renderExpandableOrSection = ({item,key,items})=>{
-          if(hasAuth && isNonNullString(item.perm) && !Auth.isAllowedFromStr(item.perm)) return null;
+          if(isNonNullString(item.perm) && !Auth.isAllowedFromStr(item.perm)) return null;
           const {section,items:itx2,...rest} = item;
           if(section){
             return <DrawerSection 
@@ -53,7 +54,7 @@ const DrawerItemsComponent = React.forwardRef((props,ref)=> {
           Object.map(item.items,(it,j)=>{
               if(!isObj(it)) return ;
               getDefaultProps(it);
-              const r = renderItem({minimized,hasAuth,renderExpandableOrSection,items:item.items,item:it,key:i+j,props});
+              const r = renderItem({minimized,renderExpandableOrSection,items:item.items,item:it,key:i+j,props});
               if(r){
                 itx.push(r);
               }
@@ -65,7 +66,7 @@ const DrawerItemsComponent = React.forwardRef((props,ref)=> {
               }
           }
       } else {
-          const r = renderItem({minimized,hasAuth,renderExpandableOrSection,items:_items,item,key:i+"",props});
+          const r = renderItem({minimized,renderExpandableOrSection,items:_items,item,key:i+"",props});
           if(r){
             items.push(r);
           }
@@ -120,14 +121,14 @@ const getDefaultProps = function(item){
   return item;
 }
 
-const renderItem = ({item,minimized,hasAuth,renderExpandableOrSection,index,key})=>{
+const renderItem = ({item,minimized,renderExpandableOrSection,index,key})=>{
   key = key||index;
   if(React.isValidElement(item)){
     return <React.Fragment key={key}>
         {item}
     </React.Fragment>
   } else {
-    if(hasAuth && isNonNullString(item.perm) && !Auth.isAllowedFromStr(item.perm)) return null;
+    if(isNonNullString(item.perm) && !Auth.isAllowedFromStr(item.perm)) return null;
     if(!item.label && !item.text && !item.icon) {
         if(item.divider === true){
           const {divider,...rest} = item;

package/src/components/ErrorBoundary/index.js

@@ -46,7 +46,6 @@ class ErrorBoundary extends React.Component {
         )
       }
     }
-
     return this.props.children
   }
 }

package/src/components/Menu/Menu.js

@@ -94,16 +94,12 @@ class _Menu extends AppComponent {
     });
 
   updateVisibility = async () => {
-    // _Menu is rendered in Portal, which updates items asynchronously
-    // We need to do the same here so that the ref is up-to-date
-    await Promise.resolve();
-
     if (this.props.visible) {
       this.show();
     } else {
       this.hide();
     }
-  };
+  }
 
   isBrowser = () => Platform.OS === 'web' && 'document' in global;
 
@@ -161,69 +157,62 @@ class _Menu extends AppComponent {
       document.removeEventListener('keyup', this.handleKeypress);
   };
 
-  show = async () => {
+  show (){
     if(!this._isMounted()) return;
-    const windowLayout = Dimensions.get('window');
-    const [menuLayout, anchorLayout] = await Promise.all([
+    return Promise.all([
       this.measureMenuLayout(),
       this.measureAnchorLayout(),
-    ]);
-
-    // When visible is true for first render
-    // native views can be still not rendered and
-    // measureMenuLayout/measureAnchorLayout functions
-    // return wrong values e.g { x:0, y: 0, width: 0, height: 0 }
-    // so we have to wait until views are ready
-    // and rerun this function to show menu
-    if (
-      !windowLayout.width ||
-      !windowLayout.height ||
-      !menuLayout.width ||
-      !menuLayout.height ||
-      (!anchorLayout.width) ||
-      (!anchorLayout.height)
-    ) {
-      requestAnimationFrame(this.show);
-      return;
-    }
-
-    this.setState(
-      () => ({
-        left: anchorLayout.x,
-        top: anchorLayout.y,
-        anchorLayout: {
-          height: anchorLayout.height,
-          width: anchorLayout.width,
-        },
-        menuLayout: {
-          width: menuLayout.width,
-          height: menuLayout.height,
-        },
-      }),
-      () => {
-        this.attachListeners();
-
-        const animation = theme.animation;
-        Animated.parallel([
-          Animated.timing(this.state.scaleAnimation, {
-            toValue: { x: menuLayout.width, y: menuLayout.height },
-            duration: ANIMATION_DURATION * animation.scale,
-            easing: EASING,
-            useNativeDriver: true,
-          }),
-          Animated.timing(this.state.opacityAnimation, {
-            toValue: 1,
-            duration: ANIMATION_DURATION * animation.scale,
-            easing: EASING,
-            useNativeDriver: true,
-          }),
-        ]).start(({ finished }) => {
-          if (finished) {
-            this.focusFirstDOMNode(this.menu);
-          }
-        });
+    ]).then(([menuLayout, anchorLayout])=>{
+      const windowLayout = Dimensions.get('window');
+      if (
+        !windowLayout.width ||
+        !windowLayout.height ||
+        !menuLayout.width ||
+        !menuLayout.height ||
+        (!anchorLayout.width) ||
+        (!anchorLayout.height)
+      ) {
+        requestAnimationFrame(this.show.bind(this));
+        return;
       }
-    );
+      this.setState({
+          left: anchorLayout.x,
+          top: anchorLayout.y,
+          rendered : true,
+          anchorLayout: {
+            height: anchorLayout.height,
+            width: anchorLayout.width,
+          },
+          menuLayout: {
+            width: menuLayout.width,
+            height: menuLayout.height,
+          },
+        },
+        () => {
+          this.attachListeners();
+  
+          const animation = theme.animation;
+          Animated.parallel([
+            Animated.timing(this.state.scaleAnimation, {
+              toValue: { x: menuLayout.width, y: menuLayout.height },
+              duration: ANIMATION_DURATION * animation.scale,
+              easing: EASING,
+              useNativeDriver: true,
+            }),
+            Animated.timing(this.state.opacityAnimation, {
+              toValue: 1,
+              duration: ANIMATION_DURATION * animation.scale,
+              easing: EASING,
+              useNativeDriver: true,
+            }),
+          ]).start(({ finished }) => {
+            if (finished) {
+              this.focusFirstDOMNode(this.menu);
+            }
+          });
+        }
+      );
+    });
   };
 
   hide = (cb) => {
@@ -237,7 +226,7 @@ class _Menu extends AppComponent {
       useNativeDriver: true,
     }).start(({ finished }) => {
       if (finished) {
-        this.setState({ menuLayout: { width: 0, height: 0 }},(e)=>{if(typeof cb ==='function') cb();});
+        this.setState({ rendered:false,menuLayout: { width: 0, height: 0 }},(e)=>{if(typeof cb ==='function') cb();});
         this.state.scaleAnimation.setValue({ x: 0, y: 0 });
         this.focusFirstDOMNode(this.anchor);
       }
@@ -294,7 +283,7 @@ class _Menu extends AppComponent {
 
     // We need to translate menu while animating scale to imitate transform origin for scale animation
     const positionTransforms = [];
-
+  
     // Check if menu fits horizontally and if not align it to right.
     if (left <= windowLayout.width - menuLayout.width - SCREEN_INDENT) {
       positionTransforms.push({
@@ -315,9 +304,7 @@ class _Menu extends AppComponent {
           outputRange: [menuLayout.width / 2, 0],
         }),
       });
-
       left += anchorLayout.width - menuLayout.width;
-
       const right = left + menuLayout.width;
       // Check if menu position has enough space from right side
       if (right > windowLayout.width - SCREEN_INDENT) {
@@ -325,7 +312,6 @@ class _Menu extends AppComponent {
       }
     }
     const handleScroll = canHandleScroll !== false? true : false;
-    
     // If the menu is larger than available vertical space,
     // calculate the height of scrollable view
     let scrollableMenuHeight = 0;
@@ -469,50 +455,48 @@ class _Menu extends AppComponent {
         style = {{backgroundColor:'transparent'}}
       >
         {anchor}
-        {true ? (
-          <Portal>
-            {rendered ? <TouchableWithoutFeedback
-              testID={testID+"_TouchableWithoutFeedBack"}
-              accessibilityLabel={overlayAccessibilityLabel}
-              role="button"
-              onPress={onDismiss}
-              style = {[hiddenStyle]}
-            >
-              <View style={[StyleSheet.absoluteFill,{flex:1,backgroundColor:'transparent'}]} testID={testID+"_Backdrop"} />
-            </TouchableWithoutFeedback>:null}
-            <View
-              testID = {testID+"_ContentContainer"}
-              ref={(ref) => {
-                this.menu = ref;
-              }}
-              collapsable={false}
-              accessibilityViewIsModal={visible}
-              style={[styles.wrapper, positionStyle, style,hiddenStyle]}
-              pointerEvents={visible ? 'box-none' : 'none'}
-              onAccessibilityEscape={onDismiss}
-            >
-              {rendered?<Animated.View style={{ transform: positionTransforms }} testID={testID+"_Animated"}>
-                <Surface
-                  elevation = {5}
-                  testID= {testID+"_Content"}
-                  style={
-                    [
-                      styles.shadowMenuContainer,
-                      shadowMenuContainerStyle,
-                      contentStyle,
-                      {backgroundColor : theme.colors.surface},
-                      minWidth && {minWidth : Math.max(minWidth,MIN_WIDTH)},
-                      sameWidth && anchorLayout.width ? {width:Math.max(anchorLayout.width,minWidth,MIN_WIDTH)} : undefined,
-                    ]
-                  }
-                >
-                  {((scrollableMenuHeight|| contentContainerStyle) && (<ScrollView contentContainerStyle={contentContainerStyle} testID={testID+"_ScrollView"}>{children}</ScrollView>
-                  )) || children}
-                </Surface>
-              </Animated.View> : null}
-            </View>
-          </Portal>
-        ) : null}
+        <Portal>
+          {rendered ? <TouchableWithoutFeedback
+            testID={testID+"_MenuTouchableWithoutFeedBack"}
+            accessibilityLabel={overlayAccessibilityLabel}
+            role="button"
+            onPress={onDismiss}
+            style = {[hiddenStyle]}
+          >
+            <View style={[StyleSheet.absoluteFill,{flex:1,backgroundColor:'transparent'}]} testID={testID+"_Backdrop"} />
+          </TouchableWithoutFeedback>:null}
+          <View
+            testID = {testID+"_MenuContentContainer"}
+            ref={(ref) => {
+              this.menu = ref;
+            }}
+            collapsable={false}
+            accessibilityViewIsModal={visible}
+            style={[styles.wrapper, positionStyle, style,hiddenStyle]}
+            pointerEvents={visible ? 'box-none' : 'none'}
+            onAccessibilityEscape={onDismiss}
+          >
+            {rendered?<Animated.View style={{ transform: positionTransforms }} testID={testID+"_Animated"}>
+              <Surface
+                elevation = {5}
+                testID= {testID+"_MenuContent"}
+                style={
+                  [
+                    styles.shadowMenuContainer,
+                    shadowMenuContainerStyle,
+                    contentStyle,
+                    {backgroundColor : theme.colors.surface},
+                    minWidth && {minWidth : Math.max(minWidth,MIN_WIDTH)},
+                    sameWidth && anchorLayout.width ? {width:Math.max(anchorLayout.width,minWidth,MIN_WIDTH)} : undefined,
+                  ]
+                }
+              >
+                {((scrollableMenuHeight|| contentContainerStyle) && (<ScrollView contentContainerStyle={contentContainerStyle} testID={testID+"_ScrollView"}>{children}</ScrollView>
+                )) || children}
+              </Surface>
+            </Animated.View> : null}
+          </View>
+        </Portal>
       </View>
     );
   }

package/src/components/SplashScreen/index.js

@@ -7,8 +7,6 @@ import View from "$ecomponents/View";
 import {isNativeMobile} from "$cplatform";
 import {defaultDecimal} from "$cutils";
 import {LogoProgress} from "$ecomponents/Logo";
-import { Provider as PaperProvider,Portal as PaperPortal} from "react-native-paper";
-import {PortalProvider } from '$ecomponents/Portal';
 import {defaultStr} from "$cutils";
 import styles, {
   _solidBackground,
@@ -100,8 +98,8 @@ const SplashScreenComponent = ({isLoaded,children , duration, delay,logoWidth,lo
     ],
   }
   const child = (animationDone && isLoaded)? React.isValidElement(children) && children : null;
-  return (
-    <View style={[styles.container]} testID={testID} id={testID}>
+  if(animationDone) return child;
+  return <View style={[styles.container]} testID={testID} id={testID}>
       {!animationDone ? <View style={StyleSheet.absoluteFill} testID={testID+"_Animation"}/> : null}
       <View style={styles.containerGlue} testID={testID+"_ContainerGlue"}>
         {!animationDone && (
@@ -112,30 +110,23 @@ const SplashScreenComponent = ({isLoaded,children , duration, delay,logoWidth,lo
         )}
         {(animationDone || isNative) && child}
         {!animationDone && (
-          <PortalProvider>
-            <PaperProvider>
-              <PaperPortal.Host>
-                  <View testID={testID+"_LogoContainer"} style={[StyleSheet.absoluteFill, styles.logoStyle]}>
-                  {(
-                    <Animated.View
-                      testID={testID+"_Logo"}
-                      style={_dynamicCustomComponentStyle(
-                            logoScale,
-                            logoOpacity,
-                            logoWidth,
-                            logoHeight
-                        )}>
-                      {<LogoProgress/>}
-                    </Animated.View>
-                  )}
-                </View>
-              </PaperPortal.Host>
-            </PaperProvider>
-          </PortalProvider>
+            <View testID={testID+"_LogoContainer"} style={[StyleSheet.absoluteFill, styles.logoStyle]}>
+            {(
+              <Animated.View
+                testID={testID+"_Logo"}
+                style={_dynamicCustomComponentStyle(
+                      logoScale,
+                      logoOpacity,
+                      logoWidth,
+                      logoHeight
+                  )}>
+                {<LogoProgress/>}
+              </Animated.View>
+            )}
+          </View>
         )}
       </View>
     </View>
-  )
 }
 
 

package/src/index.js

@@ -40,6 +40,9 @@ import StatusBar from "$ecomponents/StatusBar";
 import {Provider as PaperProvider } from 'react-native-paper';
 import FontIcon from "$ecomponents/Icon/Font";
 import useContext from "$econtext/hooks";
+import {GestureHandlerRootView} from "react-native-gesture-handler";
+import KeyboardAvoidingViewComponent from '$ecomponents/KeyboardAvoidingView';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
 export * from "./context";
 
 let MAX_BACK_COUNT = 1;
@@ -253,55 +256,59 @@ function App({init:initApp,initialRouteName:appInitialRouteName,render,onMount})
       onMountRef.current = true;
     }
   },[isLoaded])
-  const child = isLoaded ? <NavigationContainer 
-    ref={navigationRef}
-    initialState={initialState}
-    onStateChange={(state) =>{
-        setSession(NAVIGATION_PERSISTENCE_KEY,decycle(state),false);
-    }
-  }
-  >
-    <PortalProvider>
-      <Portal.Host>
-        <PreloaderProvider/>   
-        <DialogProvider responsive/>
-        <AlertProvider SimpleSelect={SimpleSelect}/>
-        <FormDataDialogProvider/>  
-        <BottomSheetProvider/>
-        <DropdownAlert ref={notificationRef}/>
-        <ErrorBoundaryProvider/>  
-        <Navigation
-          initialRouteName = {defaultStr(hasGetStarted ? appInitialRouteName : getStartedRouteName,"Home")}
-          state = {state}
-          hasGetStarted = {hasGetStarted}
-          isInitialized = {isInitialized}
-          onGetStart = {(e)=>{
-            setState({...state,hasGetStarted:true})
-          }}
-        />
-      </Portal.Host>
-    </PortalProvider>
-  </NavigationContainer>  : null;
+  const child = isLoaded ? <Navigation
+      initialRouteName = {defaultStr(hasGetStarted ? appInitialRouteName : getStartedRouteName,"Home")}
+      state = {state}
+      hasGetStarted = {hasGetStarted}
+      isInitialized = {isInitialized}
+      onGetStart = {(e)=>{
+        setState({...state,hasGetStarted:true})
+      }}
+  />: null;
   const content = isLoaded ? typeof render == 'function'? render({children:child,appConfig,config:appConfig}) : child : null;
-  return (<SplashScreen isLoaded={isLoaded}>
-      <AuthProvider>
-        <PaperProvider 
+  return <AuthProvider>
+      <NavigationContainer
+          ref={navigationRef}
+          initialState={initialState}
+          onStateChange={(state) =>{
+            if(!isLoaded) return;
+            setSession(NAVIGATION_PERSISTENCE_KEY,decycle(state),false);
+          }}
+      >
+      <PaperProvider 
           theme={theme}
           settings={{
             icon: (props) => {
               return <FontIcon {...props}/>
             },
           }}
-        >
-          <ErrorBoundary>
-          <StatusBar/>
-          <PreferencesContext.Provider value={preferences}>
-            {React.isValidElement(content) && content || child}
-          </PreferencesContext.Provider>  
-        </ErrorBoundary>
+      >
+        <PortalProvider>
+          <Portal.Host>
+            <PreloaderProvider/>   
+            <DialogProvider responsive/>
+            <AlertProvider SimpleSelect={SimpleSelect}/>
+            <FormDataDialogProvider/>  
+            <BottomSheetProvider/>
+            <DropdownAlert ref={notificationRef}/>
+            <ErrorBoundaryProvider/>
+            <GestureHandlerRootView style={{ flex: 1,flexGrow:1,flexShrink:1}} testID={"RN_GestureHandlerRootView"}>
+              <SafeAreaProvider testID={"RN_AppSafeAreaProvider"}>
+                <SplashScreen isLoaded={isLoaded}>
+                    <ErrorBoundary>
+                      <StatusBar/>
+                      <PreferencesContext.Provider value={preferences}>
+                        {React.isValidElement(content) && content || child}
+                      </PreferencesContext.Provider>  
+                    </ErrorBoundary>
+                </SplashScreen>
+              </SafeAreaProvider>
+            </GestureHandlerRootView>
+          </Portal.Host>
+        </PortalProvider>
       </PaperProvider>
-      </AuthProvider>
-  </SplashScreen>);
+    </NavigationContainer>
+  </AuthProvider>
 }
 
 export default App;

package/src/navigation/Drawer/index.js

@@ -25,9 +25,11 @@ const DrawerNavigator = React.forwardRef(({content,children:customChildren,state
             setIsLoggedIn(false);
         }
         const refreshItems = ()=>{
-            refreshItemsRef.current = true;
-            forceRender();
-            refreshItemsRef.current = false;
+            setTimeout(()=>{
+                refreshItemsRef.current = true;
+                forceRender();
+                refreshItemsRef.current = false;
+            },100)
         };
         APP.on(APP.EVENTS.AUTH_LOGOUT_USER,onLogoutUser);
         APP.on(APP.EVENTS.UPDATE_THEME,refreshItems);

package/src/navigation/Drawer/items/index.js

@@ -29,12 +29,12 @@ const useGetItems = (options)=>{
         APP.on(APP.EVENTS.REFRESH_MAIN_DRAWER,refreshItems);
         APP.on(APP.EVENTS.AUTH_LOGIN_USER,refreshItems);
         APP.on(APP.EVENTS.AUTH_LOGOUT_USER,refreshItems);
-        APP.on(APP.EVENTS.UPDATE_THEME,refreshItems);
+        //APP.on(APP.EVENTS.UPDATE_THEME,refreshItems);
         return ()=>{
             APP.off(APP.EVENTS.REFRESH_MAIN_DRAWER,refreshItems);
             APP.off(APP.EVENTS.AUTH_LOGIN_USER,refreshItems);
             APP.off(APP.EVENTS.AUTH_LOGOUT_USER,refreshItems);
-            APP.off(APP.EVENTS.UPDATE_THEME,refreshItems);
+            //APP.off(APP.EVENTS.UPDATE_THEME,refreshItems);
         }
     },[])
     return useMemo(()=>{