@fto-consult/expo-ui 5.8.10 → 5.9.0

package/babel.config.alias.js

@@ -16,6 +16,29 @@ module.exports = (opts)=>{
     const cpath = fs.existsSync(euCommon)? path.resolve(euCommon,"babel.config.alias") : "@fto-consult/common/babel.config.alias";
     const r = require(`${cpath}`)(opts);
     const expo = path.resolve(expoUI,"src");
+    
+    /**** package json */
+    const packagePath = path.resolve(base,"package.json");
+    const configPath = path.resolve(expo,"app.config.json");
+    if(fs.existsSync(packagePath)){
+        try {
+            const packageObj = require(`${packagePath}`);
+            if(typeof packageObj.name =="string"){
+                packageObj.name = packageObj.name.toUpperCase();
+            }
+            if(packageObj){
+                ["scripts","private","main","repository","keywords","bugs","dependencies","devDependencies"].map(v=>{
+                    delete packageObj[v];
+                })
+                fs.writeFileSync(configPath,JSON.stringify(packageObj,null,"\t"));
+            }
+        } catch (e){
+            console.log(e," writing file sync on package JSON, file : $common/babel.config.alias")
+        }
+    }
+    if(fs.existsSync(configPath)){
+        r["$package.json"] = r["$packageJSON"] = configPath;
+    }
     r["$eauth"] = path.resolve(expo,"auth");
     r["$ecomponents"] = r["$expo-components"] = path.resolve(expo,"components");
     r["$etableLink"] = r["$eTableLink"] = path.resolve(r["$ecomponents"],"TableLink");

package/babel.config.js

@@ -14,7 +14,6 @@ module.exports = function(api,opts) {
       inlineDovOptions.path ='./.env';
     }
     /*** par défaut, les variables d'environnements sont stockés dans le fichier .env situé à la racine du projet, référencée par la prop base  */
-    
     const alias =  require("./babel.config.alias")(options);
     return {
       presets: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "5.8.10",
+  "version": "5.9.0",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -61,7 +61,7 @@
     "@emotion/native": "^11.10.6",
     "@expo/html-elements": "^0.2.0",
     "@expo/vector-icons": "^13.0.0",
-    "@fto-consult/common": "^3.12.0",
+    "@fto-consult/common": "^3.13.16",
     "@gorhom/portal": "^1.0.14",
     "@react-native-async-storage/async-storage": "^1.17.11",
     "@react-native-community/datetimepicker": "^6.7.3",

package/src/App.js

@@ -2,18 +2,11 @@ import '$session';
 import React from 'react';
 import {SWRConfig} from "$swr";
 import {defaultObj} from "$cutils";
-import  {updateTheme,defaultTheme} from "$theme";
-import {Provider as PaperProvider } from 'react-native-paper';
 import Index from './index';
 import notify  from "$notify";
 import { SafeAreaProvider } from 'react-native-safe-area-context';
-import { PreferencesContext } from './Preferences';
-import {AuthProvider} from '$cauth';
-import ErrorBoundary from "$ecomponents/ErrorBoundary";
 import {GestureHandlerRootView} from "react-native-gesture-handler";
-import StatusBar from "$ecomponents/StatusBar";
 import APP from "$app";
-import FontIcon from "$ecomponents/Icon/Font"
 import {isMobileNative} from "$cplatform";
 import {setDeviceIdRef} from "$capp";
 import appConfig from "$capp/config";
@@ -30,7 +23,7 @@ Object.map(Utils,(v,i)=>{
      window[i] = v;
   }
 });
-export default function getIndex({onMount,onUnmount,swrConfig,render,onRender,preferences:appPreferences,...rest}){
+export default function getIndex({onMount,onUnmount,swrConfig,onRender,...rest}){
   const isScreenFocusedRef = React.useRef(true);
     ///garde pour chaque écran sa date de dernière activité
     const screensRef = React.useRef({});//la liste des écrans actifs
@@ -97,19 +90,7 @@ export default function getIndex({onMount,onUnmount,swrConfig,render,onRender,pr
           }
         }
     },[])
-    const [theme,setTheme] = React.useState(updateTheme(defaultTheme));
-    const updatePreferenceTheme = (customTheme,persist)=>{
-      setTheme(updateTheme(customTheme));
-    };
-    const forceRender = React.useForceRender();
-    const pref = typeof appPreferences =='function'? appPreferences({setTheme,forceRender,updateTheme:updatePreferenceTheme}) : appPreferences;
-    const preferences = React.useMemo(()=>({
-        updateTheme:updatePreferenceTheme,
-        theme,
-        ...defaultObj(pref),
-    }),[theme,pref]);
-    const child = <Index {...rest} theme={theme}/>;
-    const content = typeof render == 'function'? render({children:child,appConfig,config:appConfig}) : child;  
+      
     return (
       <SWRConfig 
         value={{
@@ -160,25 +141,9 @@ export default function getIndex({onMount,onUnmount,swrConfig,render,onRender,pr
         }}
       >
           <GestureHandlerRootView style={{ flex: 1 }}>
-            <PaperProvider 
-                theme={theme}
-                settings={{
-                  icon: (props) => {
-                    return <FontIcon {...props}/>
-                  },
-                }}
-            >
-              <SafeAreaProvider>
-                <AuthProvider>
-                    <ErrorBoundary>
-                      <StatusBar/>
-                      <PreferencesContext.Provider value={preferences}>
-                        {React.isValidElement(content) && content || child}
-                      </PreferencesContext.Provider>  
-                    </ErrorBoundary>
-                  </AuthProvider>
-              </SafeAreaProvider>
-            </PaperProvider>
+          <SafeAreaProvider>
+            <Index {...rest}/>
+          </SafeAreaProvider>
         </GestureHandlerRootView>
       </SWRConfig>
     );

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

@@ -934,19 +934,22 @@ export default class CommonDatagridComponent extends AppComponent {
         })
         if(size === 1 && canMakePhoneCall === true && canMakeCall()){
             const rowKey = Object.keys(this.selectedRows)[0], rowData = defaultObj(this.selectedRows[rowKey]);
-            let callProps = typeof makePhoneCallProps == 'function'? makePhoneCallProps(rowData,rowKey) : makePhoneCallProps;
-            callProps = defaultObj(callProps);
-            r.push({
-                text : defaultStr(callProps.text,callProps.label,'Appeler'),
-                icon : defaultStr(callProps.icon,'phone'),
-                flat : true,
-                onPress : ()=>{
-                    return makePhoneCall(
-                        rowData,
-                        callProps
-                    );
-                }
-            })
+            const table = defaultStr(this.props.table,this.props.tableName).trim();
+            let callProps = typeof makePhoneCallProps == 'function'? makePhoneCallProps({rowData,rowKey,table,tableName:table,data:rowData,key:rowKey,context:this,props:this.props}) : makePhoneCallProps;
+            if(callProps !== false){
+                callProps = defaultObj(callProps);
+                r.push({
+                    text : defaultStr(callProps.text,callProps.label,'Appeler'),
+                    icon : defaultStr(callProps.icon,'phone'),
+                    flat : true,
+                    onPress : ()=>{
+                        return makePhoneCall(
+                            rowData,
+                            callProps
+                        );
+                    }
+                })   
+            }
         }
         if(isObj(this.props.columns) && size ===1){
             r.push({

package/src/components/Datagrid/SWRDatagrid.js

@@ -65,7 +65,7 @@ export const getSWROptions = ()=>{
     }
 }
 
-
+const isValidMakePhoneCallProps = p=> isObj(p) && Object.size(p,true) || typeof p ==='function';
 /****la fonction fetcher doit toujours retourner : 
  *  1. la liste des éléments fetchés dans la props data
  *  2. le nombre total d'éléments de la liste obtenue en escluant les clause limit et offset correspondant à la même requête
@@ -118,7 +118,7 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
         delete sort.column;
     }
     canMakePhoneCall = defaultBool(canMakePhoneCall,table.canMakePhoneCall);
-    makePhoneCallProps = defaultObj(makePhoneCallProps,rest.makePhoneCallProps,table.makePhoneCallProps);
+    makePhoneCallProps = isValidMakePhoneCallProps(makePhoneCallProps) && makePhoneCallProps || isValidMakePhoneCallProps(rest.makePhoneCallProps) && rest.makePhoneCallProps ||  isValidMakePhoneCallProps(table.makePhoneCallProps) && table.makePhoneCallProps || {};
     const isExportable = !!Auth.isTableDataAllowed({table:tableName,action:'export'});
     rest.exportable = isExportable;
     rowKey = defaultStr(rowKey,table.rowKey,table.primaryKeyColumnName);

package/src/components/Form/Fields/Field.js

@@ -3,9 +3,10 @@ import KeyboardEventHandler from "../KeyboardEventHandler";
 const {getActions,getFormFields,Forms} = require("../utils")
 import TextField,{parseDecimal} from "$ecomponents/TextField";
 import Icon from "$ecomponents/Icon";
-import {extendObj,isBool,isUndefined,uniqid,isValidDataFileName,defaultObj,isObj,defaultFunc,isFunction,isNumber,arrayValueExists,defaultVal,defaultStr,isNonNullString,defaultBool,defaultDecimal} from "$cutils";
+import {extendObj,isBool,isUndefined,uniqid,isValidDataFileName,isValidEmail,defaultObj,isObj,defaultFunc,isFunction,isNumber,arrayValueExists,defaultVal,defaultStr,isNonNullString,defaultBool,defaultDecimal} from "$cutils";
 import {Component as AppComponent} from "$react";
 import {observable,addObserver} from "$observable";
+import {isValidPhoneNumber} from "$ecomponents/PhoneInput";
 import {Validator} from "$validator";
 import theme,{grid} from "$theme";
 import React from "$react";
@@ -285,11 +286,23 @@ export default class Field extends AppComponent {
         });
     }
     onValidatorValid(args){
-        if(!this.isFilter() && ((this.props.allowWhiteSpaces === false) || ((this.type ==='id' || this.type =='piece') && this.props.allowWhiteSpaces !== true))){
-            const value = isNonNullString(args.value) && args.value.replaceAll("/","").replaceAll("\\",'') || undefined;
-        
-            if(value && this.type !=='email' && !defaultStr(this.getValidRule()).toLowerCase().contains('email') && (value.contains(" ") || !isValidDataFileName(value.replaceAll("@","")))){
-                return "Veuillez renseigner une valeur ne contenant pas d'espace ou de caractère accentués";
+        if(!this.isFilter()){
+            const vRule  =defaultStr(this.getValidRule()).toLowerCase();
+            const value = typeof args.value == "undefined" || args.value == null ? "" : String(args.value).replaceAll("/","").replaceAll("\\",'').trim();
+            if(value){
+                if(this.type ==='email' || vRule.contains('email')){
+                    if(!isValidEmail(value)){
+                        return "Veuillez saisir une addresse email valide";
+                    }
+                } else if(this.type ==="tel" || this.type =="phone"){
+                    if(!isValidPhoneNumber(value)){
+                        return "Merci d'entrer un numéro de téléphone valide";
+                    }
+                }  else if(((this.props.allowWhiteSpaces === false) || ((this.type ==='id' || this.type =='piece') && this.props.allowWhiteSpaces !== true))){
+                    if((value.contains(" ") || !isValidDataFileName(value.replaceAll("@","").replaceAll(".","")))){
+                        return "Veuillez renseigner une valeur ne contenant pas d'espace ou de caractère accentués";
+                    }
+                }
             }
         }
         if(isFunction(this.props.onValidatorValid)){

package/src/components/Form/Fields/SelectTableData/Component.js

@@ -33,7 +33,8 @@ const TableDataSelectField = React.forwardRef(({foreignKeyColumn,bindUpsert2Remo
     }
     convertFiltersToSQL = defaultVal(convertFiltersToSQL,willConvertFiltersToSQL());
     getForeignKeyTable = getForeignKeyTable || appConfig.getTableData;
-    let fKeyTable = typeof getForeignKeyTable =='function' ? getForeignKeyTable(foreignKeyTable,props) : undefined;
+    const foreignKeyTableStr = defaultStr(foreignKeyTable,props.table,props.tableName);
+    let fKeyTable = typeof getForeignKeyTable =='function' ? getForeignKeyTable(foreignKeyTableStr,props) : undefined;
     fetchItemsPath = defaultStr(fetchItemsPath).trim();
     
     if(!fetchItemsPath && (!isObj(fKeyTable) || !(defaultStr(fKeyTable.tableName,fKeyTable.table)))){
@@ -67,8 +68,8 @@ const TableDataSelectField = React.forwardRef(({foreignKeyColumn,bindUpsert2Remo
     const defaultFields = Array.isArray(foreignKeyColumn)? foreignKeyColumn : [foreignKeyColumn];
     if(Array.isArray(foreignKeyLabel)){
         foreignKeyLabel.map(f=>{
-            if(isNonNullString(f)){
-                defaultFields.push(f);
+            if(isNonNullString(f) && !defaultFields.includes(f.trim())){
+                defaultFields.push(f.trim());
             }
         })
     }

package/src/components/Form/FormData/FormData.js

@@ -94,6 +94,9 @@ export default class FormDataComponent extends AppComponent{
                             savedArgs = {...savedArgs,data}
                         }
                     }
+                    if(typeof saveDataMutator =='function'){
+                        saveDataMutator(savedArgs);
+                    }
                     return handleBeforeSaveCallback(this.beforeSave.bind(this),()=>{
                         return handleBeforeSaveCallback(beforeSave,()=>{
                             return handleBeforeSaveCallback(this.onSave.bind(this),()=>{

package/src/components/InlineIndicator/index.js

@@ -5,7 +5,7 @@ import {defaultObj,defaultVal} from "$cutils";
 import {isMobileMedia} from "$cplatform/dimensions";
 import TextFieldComponent from "$ecomponents/TextField";
 import { StyleSheet } from "react-native";
-
+import {METRICS_UNITS,WEIGHTS_UNITS} from "./utils";
 
 export {Select};
 
@@ -45,7 +45,7 @@ export const MetricUnit = React.forwardRef((props,ref)=>{
     inputProps.style = [styles.metricUnit,inputProps.style];
     rest = defaultObj(rest);
     return <Select
-        items = {PRODUCTS_CONSTANTS.METRICS_UNITS}
+        items = {METRICS_UNITS}
         withCheckedIcon = {isMob}
         {...rest}
         inputProps = {inputProps}
@@ -67,7 +67,7 @@ export const WeightUnit = React.forwardRef((props,ref)=>{
     inputProps.style = [styles.weightUnit,inputProps.style];
     rest = defaultObj(rest);
     return <Select
-        items = {PRODUCTS_CONSTANTS.WEIGHTS_UNITS}
+        items = {WEIGHTS_UNITS}
         renderItem = {({item,index})=>index}
         withCheckedIcon = {isMob}
         {...rest}
@@ -102,7 +102,7 @@ export const TextField = TextInput;
 WeightUnit.displayName = "WeightUnitInlineIndicatorComponent";
 
 export const Text = React.forwardRef((props,ref)=>{
-    return <LabelComponent.withRef ref={ref} {...props} {...state} style={[styles.text,props.style]}/>
+    return <LabelComponent.withRef ref={ref} {...props} style={[styles.text,props.style]}/>
 });
 
 export const Label = Text;

package/src/components/InlineIndicator/utils.js

@@ -0,0 +1,15 @@
+export const WEIGHTS_UNITS = {
+    t : 'Tonne',
+    kg : 'Kilogramme',
+    g : 'Gramme',
+    mg : 'Milligramme',
+    cg : 'Centigramme',
+    dg : 'Decigramme',
+};
+
+export const METRICS_UNITS = {
+    m : 'm',
+    dm : 'dm',
+    cm : 'cm',
+    mm : 'mm'
+};

package/src/components/PhoneInput/PhoneNumber.js

@@ -26,6 +26,7 @@ export const isValidNumber = (number,iso2)=>{
     }
     return false;
 }
+export const isValidPhoneNumber = isValidNumber;
 
 class PhoneNumber {
     // eslint-disable-next-line class-methods-use-this

package/src/components/SimpleSelect/index.js

@@ -322,7 +322,7 @@ const  SimpleSelect = React.forwardRef((props,ref)=>{
                         paddingHorizontal : 10,
                         paddingVertical:0,
                         height : !isMob?contentContainerHeight:'90%',
-                        width : !isMob ? layout.width : undefined,
+                        width : !isMob ? Math.max(layout.width,150) : undefined,
                     },
                     isMob && {flex:1},
                     !isMob && {paddingRight : 0},

package/src/components/SplashScreen/index.js

@@ -1,7 +1,7 @@
 /* @flow */
 /*** fork of https://www.npmjs.com/package/react-native-animated-splash-screen */
 import PropTypes from "prop-types"
-import * as React from "react"
+import React from "$react"
 import {Animated, StyleSheet } from "react-native";
 import View from "$ecomponents/View";
 import {isNativeMobile} from "$cplatform";
@@ -19,167 +19,136 @@ import styles, {
 const isNative = isNativeMobile();
 const Component = isNative? Animated.View : View;
 
-class AnimatedSplash extends React.Component {
-  static defaultProps = {
-    isLoaded: false,
-  }
-
-  state = {
+const SplashScreenComponent = ({isLoaded,children , duration, delay,logoWidth,logoHeight,backgroundColor,imageBackgroundSource,imageBackgroundResizeMode,
+  testID,
+  disableAppScale,
+  disableImageBackgroundAnimation,preload})=>{
+  const [state,setState] = React.useState({
     animationDone: false,
     loadingProgress: new Animated.Value(0)
-  }
-
-  componentDidUpdate(prevProps) {
-    const { isLoaded , duration, delay } = this.props
-    const { loadingProgress } = this.state
-
-    if (isLoaded && !prevProps.isLoaded) {
-      if(!isNativeMobile()){
-          this.setState({animationDone:true});
-      } else {
-        Animated.timing(loadingProgress, {
-            toValue: 100,
-            duration: duration || 1000,
-            delay: delay || 0,
-            useNativeDriver: true,
-        }).start(() => {
-            this.setState({
-              animationDone: true,
-            })
-        })
-      }
-    }
-  }
-
-  renderChildren() {
-    const { children, preload, isLoaded } = this.props
-    if (preload || preload == null) {
-      return children
+  });
+  const { loadingProgress, animationDone } = state;
+  const prevIsLoaded = React.usePrevious(isLoaded);
+  React.useEffect(()=>{
+    if(prevIsLoaded == isLoaded || !isLoaded) return;
+    if(!isNativeMobile()){
+      setState({...state,animationDone:true});
     } else {
-      if (isLoaded) {
-        return children
-      }
+      Animated.timing(loadingProgress, {
+          toValue: 100,
+          duration: duration || 1000,
+          delay: delay || 0,
+          useNativeDriver: true,
+      }).start(() => {
+          setState({
+            ...state,
+            animationDone: true,
+          })
+      })
     }
-
-    return null
+  },[isLoaded]);
+  testID = defaultStr(testID,"RN_SplashscreenComponent")
+  logoWidth = defaultDecimal(logoWidth,150);
+  logoHeight = defaultDecimal(logoHeight,250);
+  const opacityClearToVisible = {
+    opacity: loadingProgress.interpolate({
+      inputRange: [0, 15, 30],
+      outputRange: [0, 0, 1],
+      extrapolate: "clamp",
+    }),
+  }
+  const imageScale = {
+    transform: [
+      {
+        scale: loadingProgress.interpolate({
+          inputRange: [0, 10, 100],
+          outputRange: [1, 1, 65],
+        }),
+      },
+    ],
   }
 
-  render() {
-    const { loadingProgress, animationDone } = this.state
-    let {
-      logoImage,
-      logoWidth,
-      logoHeight,
-      backgroundColor,
-      imageBackgroundSource,
-      imageBackgroundResizeMode,
-      testID,
-      disableAppScale,
-      disableImageBackgroundAnimation,
-    } = this.props
-    testID = defaultStr(testID,"RN_SplashscreenComponent")
-    logoWidth = defaultDecimal(logoWidth,150);
-    logoHeight = defaultDecimal(logoHeight,250);
-    const opacityClearToVisible = {
-      opacity: loadingProgress.interpolate({
-        inputRange: [0, 15, 30],
-        outputRange: [0, 0, 1],
-        extrapolate: "clamp",
-      }),
-    }
-
-    const imageScale = {
-      transform: [
-        {
-          scale: loadingProgress.interpolate({
-            inputRange: [0, 10, 100],
-            outputRange: [1, 1, 65],
-          }),
-        },
-      ],
-    }
-
-    const logoScale = {
-      transform: [
-        {
-          scale: loadingProgress.interpolate({
-            inputRange: [0, 10, 100],
-            outputRange: [1, 0.8, 10],
-          }),
-        },
-      ],
-    }
+  const logoScale = {
+    transform: [
+      {
+        scale: loadingProgress.interpolate({
+          inputRange: [0, 10, 100],
+          outputRange: [1, 0.8, 10],
+        }),
+      },
+    ],
+  }
 
-    const logoOpacity = {
-      opacity: loadingProgress.interpolate({
-        inputRange: [0, 20, 100],
-        outputRange: [1, 0, 0],
-        extrapolate: "clamp",
-      }),
-    }
+  const logoOpacity = {
+    opacity: loadingProgress.interpolate({
+      inputRange: [0, 20, 100],
+      outputRange: [1, 0, 0],
+      extrapolate: "clamp",
+    }),
+  }
 
-    const appScale = {
-      transform: [
-        {
-          scale: loadingProgress.interpolate({
-            inputRange: [0, 7, 100],
-            outputRange: [1.1, 1.05, 1],
-          }),
-        },
-      ],
-    }
-    
-    return (
-      <View style={[styles.container]} testID={testID} nativeID={testID}>
-        {!animationDone && <View style={StyleSheet.absoluteFill} testID={testID+"_Animation"}/>}
-        <View style={styles.containerGlue}>
-          {!animationDone && (
-            <Animated.View
-              style={_staticBackground(logoOpacity, backgroundColor)}
-              testID={testID+"_AnimationDone"}
-            />
-          )}
-          {(animationDone || isNative) && <Component style={[!disableAppScale && appScale, opacityClearToVisible, styles.flex]}>
-            {this.renderChildren()}
-          </Component>}
-          {!animationDone && (
-            <Animated.Image
-              testID={testID+"AnimateImage"}
-              resizeMode={imageBackgroundResizeMode || "cover"}
-              source={imageBackgroundSource}
-              style={[disableImageBackgroundAnimation && _staticBackground(
-                logoOpacity,
-                backgroundColor
-              ), disableImageBackgroundAnimation && _dynamicImageBackground(
-                imageScale,
-                logoOpacity,
-                backgroundColor
-              )]}
-            />
-          )}
-          {!animationDone && (
-            <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>
-    )
+  const appScale = {
+    transform: [
+      {
+        scale: loadingProgress.interpolate({
+          inputRange: [0, 7, 100],
+          outputRange: [1.1, 1.05, 1],
+        }),
+      },
+    ],
   }
+  const child = (animationDone && isLoaded)? React.isValidElement(children) && children : null;
+  return (
+    <View style={[styles.container]} testID={testID} nativeID={testID}>
+      {!animationDone && <View style={StyleSheet.absoluteFill} testID={testID+"_Animation"}/>}
+      <View style={styles.containerGlue}>
+        {!animationDone && (
+          <Animated.View
+            style={_staticBackground(logoOpacity, backgroundColor)}
+            testID={testID+"_AnimationDone"}
+          />
+        )}
+        {(animationDone || isNative) && <Component style={[!disableAppScale && appScale, opacityClearToVisible, styles.flex]}>
+          {child}
+        </Component>}
+        {!animationDone && (
+          <Animated.Image
+            testID={testID+"AnimateImage"}
+            resizeMode={imageBackgroundResizeMode || "cover"}
+            source={imageBackgroundSource}
+            style={[disableImageBackgroundAnimation && _staticBackground(
+              logoOpacity,
+              backgroundColor
+            ), disableImageBackgroundAnimation && _dynamicImageBackground(
+              imageScale,
+              logoOpacity,
+              backgroundColor
+            )]}
+          />
+        )}
+        {!animationDone && (
+          <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>
+  )
 }
 
-AnimatedSplash.propTypes = {
+
+SplashScreenComponent.propTypes = {
   preload: PropTypes.bool,
   logoWidth: PropTypes.number,
   children: PropTypes.element,
@@ -197,4 +166,5 @@ AnimatedSplash.propTypes = {
   delay: PropTypes.number,
 }
 
-export default AnimatedSplash
+SplashScreenComponent.displayName = "SplashScreenComponent";
+export default SplashScreenComponent;

package/src/index.js

@@ -31,6 +31,13 @@ import {PortalProvider,PortalHost } from '$ecomponents/Portal';
 import ErrorBoundaryProvider from "$ecomponents/ErrorBoundary/Provider";
 import notify, {notificationRef} from "$notify";
 import DropdownAlert from '$ecomponents/Dialog/DropdownAlert';
+import {AuthProvider} from '$cauth';
+import { PreferencesContext } from './Preferences';
+import ErrorBoundary from "$ecomponents/ErrorBoundary";
+import  {updateTheme,defaultTheme} from "$theme";
+import StatusBar from "$ecomponents/StatusBar";
+import {Provider as PaperProvider } from 'react-native-paper';
+import FontIcon from "$ecomponents/Icon/Font";
 
 let MAX_BACK_COUNT = 1;
 let countBack = 0;
@@ -48,13 +55,13 @@ 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,getStartedRouteName}) {
+function App({init:initApp,initialRouteName:appInitialRouteName,render,preferences:appPreferences,getStartedRouteName}) {
   AppStateService.init();
   const [initialState, setInitialState] = React.useState(undefined);
   const appReadyRef = React.useRef(true);
   const [state,setState] = React.useState({
      isLoading : true,
-     isInitialized:true,
+     isInitialized:false,
   });
   React.useEffect(() => {
     const loadResources = ()=>{
@@ -220,35 +227,67 @@ function App({init:initApp,initialRouteName:appInitialRouteName,getStartedRouteN
       }
   },[isInitialized]);
   const hasGetStarted = state.hasGetStarted !== false? true : false;
+  
+  const [theme,setTheme] = React.useState(updateTheme(defaultTheme));
+    const updatePreferenceTheme = (customTheme,persist)=>{
+      setTheme(updateTheme(customTheme));
+    };
+    const forceRender = React.useForceRender();
+    const pref = typeof appPreferences =='function'? appPreferences({setTheme,forceRender,updateTheme:updatePreferenceTheme}) : appPreferences;
+    const preferences = React.useMemo(()=>({
+        updateTheme:updatePreferenceTheme,
+        theme,
+        ...defaultObj(pref),
+    }),[theme,pref]);
+  const isLoaded = !isLoading;
+  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 = {!isLoading}
+          onGetStart = {(e)=>{
+            setState({...state,hasGetStarted:true})
+          }}
+        />
+      </Portal.Host>
+    </PortalProvider>
+  </NavigationContainer>  : null;
+  const content = isLoaded ? typeof render == 'function'? render({children:child,appConfig,config:appConfig}) : child : null;
   return (<SplashScreen isLoaded={!isLoading}>
-      <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}
-                onGetStart = {(e)=>{
-                  setState({...state,hasGetStarted:true})
-                }}
-              />
-            </Portal.Host>
-          </PortalProvider>
-      </NavigationContainer> 
+      <AuthProvider>
+        <PaperProvider 
+          theme={theme}
+          settings={{
+            icon: (props) => {
+              return <FontIcon {...props}/>
+            },
+          }}
+        >
+          <ErrorBoundary>
+          <StatusBar/>
+          <PreferencesContext.Provider value={preferences}>
+            {React.isValidElement(content) && content || child}
+          </PreferencesContext.Provider>  
+        </ErrorBoundary>
+      </PaperProvider>
+      </AuthProvider>
   </SplashScreen>);
 }
 

package/src/layouts/DatabaseStatistics/index.js

@@ -54,7 +54,7 @@ export default function DatabaseStatisticScreen ({withScreen,fetchDataProps,tabl
         if(!content.length) {
             return null;
         }
-        content = <Component  {...containerProps} style={[containerProps.style,theme.styles.mr1,theme.styles.ml1]}>
+        content = <Component  {...containerProps} style={[containerProps.style,theme.styles.mr1,theme.styles.pv1,theme.styles.ml1]}>
             {content}
         </Component>;
         return  withScreen !== false ? <Screen containerProps={{style:[{flexGrow:0,flex:0}]}} withScrollView title={defaultVal(customTitle,title)} {...props}>{content}</Screen> : content;

package/src/layouts/Screen/FormData/List.js

@@ -33,30 +33,16 @@ export default class FormDataListScreen extends FormData{
         if(typeof show =='function'){
             show({...this.props,index:undefined,data:{}});
         }
-    }
-    doSave(args){
-
     }
     doSave2New(args){
-        if(!this.__canSaveListData) return;
         const {show} = this.props;
         if(typeof show =='function'){
             show({...args,index:undefined,data:{}});
         }
     }
     doSave2Close(args){
-        if(!this.__canSaveListData) return;
         return this.close();
     }
-    onSave(args){
-        let {formDataProps} = this.props;
-        this.__canSaveListData = true;
-        formDataProps = defaultObj(formDataProps);
-        if(typeof formDataProps.onSave =='function' && formDataProps.onSave(args) === false){
-            this.__canSaveListData = false;
-            return;
-        }
-    }
     _render(content){
         let {isAllowed} = this.props;
         if(typeof isAllowed ==='function'){

package/src/layouts/Screen/TableData.js

@@ -755,11 +755,14 @@ export default class TableDataScreenComponent extends FormDataScreen{
     getMakePhoneCallProps (){
         const table = this.table;
         const makePhoneCallProps = defaultVal(this.makePhoneCallProps,table.makePhoneCallProps);
-        return defaultObj(typeof makePhoneCallProps === 'function' ? makePhoneCallProps(this.getCurrentData()) : makePhoneCallProps);
+        const rowData = this.getCurrentData();
+        const mP = typeof makePhoneCallProps === 'function' ? makePhoneCallProps({rowData,data:rowData,isTableData:true,props:this.props,context:this,table,tableName:this.table}) : makePhoneCallProps;
+        return mP !== false ? defaultObj(mP) : null;
     }
     makePhoneCall(data){
-        if(!this.canMakePhoneCall() || !canMakePhoneCall()) return false;
-        makePCall(defaultObj(data || this.getCurrentData()),this.getMakePhoneCallProps());
+        const mP = this.getMakePhoneCallProps();
+        if(!this.canMakePhoneCall() || !canMakePhoneCall() || !isObj(mP)) return false;
+        makePCall(defaultObj(data || this.getCurrentData()),mP);
         return false;
     }
    

package/src/layouts/Screen/utils.js

@@ -103,8 +103,11 @@ export  function renderActions({context,isUpdate,newElementLabel,makePhoneCallPr
     rest = defaultObj(rest);
     newElementLabel = defaultStr(newElementLabel,"Nouveau");
     let permsObj = checkPermsActions.call(self,{...defaultObj(perms),isUpdate})
-    makePhoneCallProps = defaultObj(makePhoneCallProps);
+    makePhoneCallProps = typeof makePhoneCallProps ==='function'? makePhoneCallProps({data,rowData:data,context:{},isTableDataActions:true,table,tableName:table}): makePhoneCallProps;
     self.permsObj = permsObj;
+    if(makePhoneCallProps !== false){
+        makePhoneCallProps = defaultObj(makePhoneCallProps);
+    }
     let save = (!readOnly && !permsObj.canSave || (saveAction === false))? null: {
         text :hasManyData? 'Modifier': textSave,
         title :hasManyData? 'Modifier': textSave,
@@ -197,7 +200,7 @@ export  function renderActions({context,isUpdate,newElementLabel,makePhoneCallPr
             flat : true,
             onPress : createCallback({context:self,action:'new',callback:onPressToCreateNew})
         } : null,
-        makePhoneCall : (canMakePhoneCall && isUpdate)?{
+        makePhoneCall : (canMakePhoneCall && isUpdate && isObj(makePhoneCallProps))?{
             text : defaultStr(makePhoneCallProps.text,makePhoneCallProps.label,'Appeler'),
             isAction : true,
             icon : defaultStr(makePhoneCallProps.icon,'phone'),

package/src/screens/Auth/PermProfile.js

@@ -1,7 +1,7 @@
 import showConfirm from "$components/Dialog/confirm";
-import notify from "$components/Dialog/notify";
+import notify from "$notify";
 import {defaultArray,arrayValueExists,defaultStr,uniqid} from "$cutils";
-import userDbName from "$database/data/tables/users/dbName";
+import userDbName from "$database/tables/users/dbName";
 import Auth from "$auth";
 import getData from "$database/getData";
 import getDB from "$database/getDB";