@fto-consult/expo-ui 6.69.1 → 6.70.1

package/bin/create-app/App.js

@@ -35,6 +35,16 @@ export default function AppMainEntry(){
             profilePropsMutator : ({fields,...props})=>({fields,...props}),//la fonction permettant de muter les champs liés à l'écran de mise à jour d'un profil utilisateur
         }}
         components = {{
+            /**
+             * ///le composant permettant de faire office de provider principal de l'application,
+               //ce composatnn permet de wrapper le contenu principal de l'application, les utilitaires de navigation, de la boîte de dialogue et bien d'autre ne doivent pas être utilisé
+               il peut être utilisé pour par exemple wrapper le contenu au travaer d'un store redux et bien d'autre 
+             * @param {*} param0 
+             * @returns 
+             */
+            MainProvider : function({children,...props}){
+                return children;
+            },
             /*** logo : ReactNode|ReactElement | ReactComponent | object {
                image{ReactComponent} :,text {ReactComponent}
             },*/
@@ -55,8 +65,8 @@ export default function AppMainEntry(){
             return Promise.resolve("app is initialized");
         }}
         /*** if you need to wrap main application content with some custom react Provider*/
-        render = {function({render,appConfig}){
-            return render;           
+        children = {function({children,appConfig}){
+            return children;           
         }}
         ///fonction de rappel appelée avant d'exit l'application, doit retourner une promesse que lorsque résolue, exit l'application
         beforeExit = {()=>Promise.resolve(true)}    

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "6.69.1",
+  "version": "6.70.1",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "main",
   "scripts": {

package/src/App.js

@@ -13,8 +13,8 @@ import App from "./AppEntry";
  * }
  */
 
-export default function ExpoUIAppEntryProvider({render,children,init,...rest}){
+export default function ExpoUIAppEntryProvider({children,init,...rest}){
     return  <Provider {...rest}>
-        <App init={init} children={children} render={render}/>
+        <App init={init} children={children}/>
     </Provider>
 }

package/src/AppEntry/RootView.js

@@ -1,16 +1,20 @@
 import {View,StyleSheet} from "react-native";
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
-export default function AppEntryRootView(props){
+import React from "$react";
+export default function AppEntryRootView({MainProvider,...props}){
+    const Wrapper = React.isComponent(MainProvider)? MainProvider : React.Fragment;
     const insets = useSafeAreaInsets();
-    return <View
-        testID="RN_MainAppEntryRootView"
-        {...props}
-        style = {StyleSheet.flatten([
-        {
-            paddingBottom: insets.bottom,
-            paddingLeft: insets.left,
-            paddingRight: insets.right,
-          },
-        props.style,{flex:1}])}
-    />
+    return <Wrapper>
+        <View
+            testID="RN_MainAppEntryRootView"
+            {...props}
+            style = {StyleSheet.flatten([
+            {
+                paddingBottom: insets.bottom,
+                paddingLeft: insets.left,
+                paddingRight: insets.right,
+              },
+            props.style,{flex:1}])}
+        />
+    </Wrapper>
 }

package/src/AppEntry/index.js

@@ -62,9 +62,9 @@ const NAVIGATION_PERSISTENCE_KEY = 'NAVIGATION_STATE';
  *  initialRouteName : la route initiale par défaut
  *  getStartedRouteName : la route par défaut de getStarted lorsque l'application est en mode getStarted, c'est à dire lorsque la fonction init renvoie une erreur (reject)
  */
-function App({init:initApp,initialRouteName:appInitialRouteName,render}) {
+function App({init:initApp,initialRouteName:appInitialRouteName,children}) {
   AppStateService.init();
-  const {FontsIconsFilter,beforeExit,preferences:appPreferences,navigation,getStartedRouteName} = useContext();
+  const {FontsIconsFilter,beforeExit,AppWrapper,preferences:appPreferences,navigation,getStartedRouteName,components:{MainProvider}} = useContext();
   const {containerProps} = navigation;
   const [initialState, setInitialState] = React.useState(undefined);
   const appReadyRef = React.useRef(true);
@@ -289,10 +289,10 @@ function App({init:initApp,initialRouteName:appInitialRouteName,render}) {
           }}
         />
   </NavigationContainer>  : null;
-  const content = isLoaded ? typeof render == 'function'? render({children:child,appConfig,config:appConfig}) : child : null;
+  const content = isLoaded ? typeof children == 'function'? children({children:child,appConfig,config:appConfig}) : child : null;
   return <SafeAreaProvider>
             <GestureHandlerRootView testID={"RN_MainAppGestureHanleRootView"}  style={styles.gesture}>
-                <AppEntryRootView>
+                <AppEntryRootView MainProvider={MainProvider}>
                     <PaperProvider 
                       theme={theme}
                       settings={{

package/src/context/Provider.js

@@ -48,6 +48,7 @@ Object.map(Utils,(v,i)=>{
     handleHelpScreen : {boolean}, //si l'écran d'aide sera pris en compte, l'écran d'aide ainsi que les écrans des termes d'utilisations et autres
     convertFiltersToSQL : {boolean}, si les filtres de datagrid ou filtres seront convertis au format SQL
     components : {
+        MainProvider : {ReactComponent}, //le composant qui permet de wrapper le contenu de l'application expo. Nb, ce composant ne peut utiliser ni les routes, nis les DialogProvider,
         logo : ReactNode | ReactComponent | object {
            image{ReactComponent} :,
            text {ReactComponent}
@@ -57,9 +58,11 @@ Object.map(Utils,(v,i)=>{
         },
         customFormFields{Object}, //les composant personalisés des forms fields
         tableLinkPropsMutator : ({object})=><{object}>, la fonction permettant de muter les props du composant TableLink,
+        fabPropsMutator : ({object})=><{object}>, la fonction permettant de muter les props du composant Fab, affiché dans les écrans par défaut,
         TableDataScreen | TableDataScreenItem : {ReactComponent}, le composant TableDataScreenItem, à utiliser pour le rendu des écrans
         TableDataScreenList | TableDataListScreen {ReactComponent}, le composant TableDataList à utiliser pour le rendu des écrans listants les éléments du table data
     },
+    
     navigation : {
       screens : {Array}, les écrans de navigation,
       screenOptions : {object}, les options du composant Stack.Navigator, voir https://reactnavigation.org/docs/native-stack-navigator/

package/src/layouts/Fab/index.js

@@ -7,26 +7,28 @@ import {navigateToTableData} from "$enavigation/utils";
 import PropTypes from "prop-types";
 import theme from "$theme";
 import {isLoggedIn as isAuthLoggedIn} from "$cauth/utils/session";
+import useExpoUI from "$econtext/hooks";
+import Auth from "$cauth";
 
 export * from "./utils";
 
-const FabLayoutComponent = React.forwardRef(({style,screenName,tables,...props},ref)=>{
+const FabLayoutComponent = React.forwardRef((p,ref)=>{ 
+  const {components:{fabPropsMutator},tablesData} = useExpoUI();
+  const {style,actions:fabActions,...props} = typeof fabPropsMutator == 'function'? extendObj({},p,fabPropsMutator({...p,isLoggedIn})) : p;
   const [isLoggedIn,setIsLoggedIn] = React.useState(isAuthLoggedIn());
   const isMounted = React.useIsMounted();
+  const tables = isObjOrArray(fabActions)? fabActions : tablesData;
   const actions = React.useMemo(()=>{
+      if(Array.isArray(fabActions)) return fabActions;
       if(!isLoggedIn) return null;
       const a = [];
       Object.map(tables,(table,i,index)=>{
-          if(!isObj(table) || table.showInFab === false) return;
+          if(!isObj(table) || table.showInFab === false || typeof  table.showInFab =="function" && table.showInFab() === false) return;
           const icon  = defaultStr(table.addIcon,"material-add");
           const text = defaultStr(table.text,table.label);
           const addText = defaultStr(table.newElementLabel,"Nouveau");
           const tableName = defaultStr(table.table,table.tableName);
-          let auth = true;
-          if(typeof Auth !=='undefined' && Auth && Auth.isTableDataAllowed){
-             auth = Auth.isTableDataAllowed({table:tableName,action:'create'});
-          }
-          if(!table || !icon || !text || !auth) return;
+          if(!table || !icon || !text || !Auth.isTableDataAllowed({table:tableName,action:'create'})) return;
           let fabProps = typeof table.getFabProps ==='function'? table.getFabProps({tableName}) : defaultObj(table.fabProps);;
           if(fabProps === false) return;
           fabProps = defaultObj(fabProps);
@@ -48,7 +50,8 @@ const FabLayoutComponent = React.forwardRef(({style,screenName,tables,...props},
           })
       })
       return a.length ? a : null;
-  },[isLoggedIn]);
+  },[isLoggedIn,fabActions,tables]);
+
   React.useEffect(()=>{
       const onLogin = ()=>{
           if(!isMounted())return;
@@ -66,7 +69,6 @@ const FabLayoutComponent = React.forwardRef(({style,screenName,tables,...props},
   },[])
   return actions ? <Fab.Group
         {...props}
-        screenName = {screenName}
         ref = {ref}
         style={[styles.fab,style]}
         actions = {actions}
@@ -86,9 +88,7 @@ const styles = StyleSheet.create({
   FabLayoutComponent.displayName = "FabLayoutComponent";
 
   FabLayoutComponent.propTypes = {
-    tables : PropTypes.oneOfType([
-        PropTypes.objectOf(PropTypes.object),
-        PropTypes.arrayOf(PropTypes.object)
-    ]),
+    ...Fab.propTypes,
+    actions : PropTypes.array, //les actions du fab layout
     screenName : PropTypes.string,
   }

package/src/layouts/Screen/Screen.js

@@ -19,9 +19,6 @@ export default function MainScreenComponent({profilAvatarProps,withDrawer,allowD
        withDrawer = false;
     }
     const withProfilAvatarOnAppBar = cWithPorilAvatarOnAppbar !== false && withDrawer && !theme.showProfilAvatarOnDrawer ? true : false;
-    if(authRequired === false){
-      props.withFab = false;
-    }
     return <Container authProps={authProps} required={authRequired}>
         <ScreenWithoutAuthContainer
           {...props}