@fto-consult/expo-ui 5.2.0 → 5.4.0

package/appConfig.txt

@@ -20,4 +20,5 @@
     }
     getTableData : {function(tableName)=>table} retourne l'ojet table data,
     swrRefreshTimeout : {number} le délai d'inactivité auquel, une fois l'application active, les données de type listData sont rafraichies
+    handleHelpScreen : {boolean}, //if Help screen will be added on navigation's main drawer
  }

package/index.js

@@ -2,6 +2,19 @@ import { registerRootComponent } from "expo";
 import {Platform } from 'react-native';
 import App from "./src/App";
 const isWeb = Platform.OS === "web";
+
+/****
+ * les options sont de la forme : 
+ * {
+ *   @param init {function} ()=>Promise<{}>, initialise l'application, lorsque la promèsse n'est pas résolue, alors l'application considère qu'il s'agit d'une étape pour l'écran de GetStarted dans ce cas, 
+ *   l'option la route getStartedRouteName est utilisée comme route par défaut de l'application
+ *   @param initialRouteName {string} la route initiale, par d'afaut Home, valide lorsque la promèsse résultat de la fonction init est résolue
+ *   @param getStartedRouteName {string} la route de l'écran de GetStarted, valide lorsque la promèsse résultat de la fonction init n'est pas résolue
+ *      L'écran de route getStartedRouteName prend en paramètre onGetStarted {function}, qui est appelée lorsque le contenu de l'écran GetStarted est affiché à l'utilisateur
+ *   @maram {swrConfig}, les options supplémentaires à passer au gestinnaire swr
+ *   les écrans d'initialisation doivent garder la propriété Start à true ou doivent avoir le groupe INTALL, pour spécifier que ce sont es écrans qui apparaissent lorsque l'application n'est pas initialisée
+ * }
+ */
 export default function registerApp (options){
     options = options && typeof options =='object' && !Array.isArray(options)? options : {};
     registerRootComponent(function(props){

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "5.2.0",
+  "version": "5.4.0",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -61,7 +61,7 @@
     "@emotion/native": "^11.10.0",
     "@expo/html-elements": "^0.2.0",
     "@expo/vector-icons": "^13.0.0",
-    "@fto-consult/common": "^2.21.4",
+    "@fto-consult/common": "^3.3.5",
     "@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

@@ -40,7 +40,7 @@ Object.map(Utils,(v,i)=>{
      window[i] = v;
   }
 });
-export default function getIndex({onMount,onUnmount,onRender,preferences:appPreferences,...rest}){
+export default function getIndex({onMount,onUnmount,swrConfig,onRender,preferences:appPreferences,...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
@@ -49,6 +49,7 @@ export default function getIndex({onMount,onUnmount,onRender,preferences:appPref
     const appStateRef = React.useRef({});
     const isKeyboardOpenRef = React.useRef(false);
     React.useOnRender(onRender);
+    swrConfig = defaultObj(swrConfig);
     React.useEffect(()=>{
         ///la fonction de rappel lorsque le composant est monté
         let cb = typeof onMount =='function'? onMount() : null;
@@ -120,6 +121,7 @@ export default function getIndex({onMount,onUnmount,onRender,preferences:appPref
     return (
       <SWRConfig 
         value={{
+          ...swrConfig,
           provider: () => new Map(),
           isOnline() {
             /* Customize the network state detector */

package/src/components/AppBar/index.js

@@ -27,7 +27,6 @@ export const GO_BACK_EVENT = "STACK_NAVIGATOR_GO_BACK";
 *       @param menuProps : les props à passer au menu au cas où les actions de l'appBar son segmentés avec certaines qui sont découpées dans un menu more 
 
  */
-const isNullOrE = x => x === null || x === false;
 
 const AppBarComponent = React.forwardRef((props,ref)=> {
     let { bindResizeEvent,elevation,isMainDrawer,
@@ -66,6 +65,7 @@ const AppBarComponent = React.forwardRef((props,ref)=> {
     }
     title = defaultVal(title,params.title,APP.getName());
     backActionProps = Object.assign({},backActionProps);
+    backActionProps.testID = defaultStr(backActionProps.testID,testID+"_BackAction");
     
     let BackActionComponent  = backAction === false ? null : React.isComponent(backAction)? backAction : back ? Appbar.BackAction : Icon ;
     backActionProps.color = backActionProps.color && Colors.isValid(backActionProps.color)? backActionProps.color : anchorStyle.color;

package/src/components/Datagrid/SWRDatagrid.js

@@ -177,6 +177,9 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
             opts = defaultObj(opts);
             opts.fetchOptions = isObj(opts.fetchOptions)? Object.clone(opts.fetchOptions) : {};
             extendObj(true,opts.fetchOptions,fetchOptionsRef.current?.fetchOptions);
+            if(props.convertFiltersToSQL === false){
+                opts.fetchOptions.selector = extendObj(true,{},opts.fetchOptions.selector,fetchOptionsRef.current?.selector);
+            }
             opts.fetchOptions.sort = sortRef.current;
             if(canHandleLimit){
                 opts.fetchOptions.limit = limitRef.current;

package/src/index.js

@@ -33,7 +33,12 @@ const resetExitCounter = ()=>{
 
 const NAVIGATION_PERSISTENCE_KEY = 'NAVIGATION_STATE';
 
-function App({init:initApp}) {
+/****
+ *  init {function}: ()=>Promise<{}> est la fonction d'initialisation de l'application
+ *  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}) {
   AppStateService.init();
   const [initialState, setInitialState] = React.useState(undefined);
   const appReadyRef = React.useRef(true);
@@ -156,16 +161,16 @@ function App({init:initApp}) {
       console.log(e," is net info heinn")
     });
     loadResources().finally(()=>{
-      (typeof initApp =='function'?initApp : init)().then(()=>{
+      (typeof initApp =='function'?initApp : init)().then((args)=>{
         if(Auth.isLoggedIn()){
            Auth.loginUser(false);
         }
         setState({
-          ...state,isInitialized:true,isLoading : false,
+          ...state,hasGetStarted:true,...defaultObj(args && args?.state),isInitialized:true,isLoading : false,
         });  
       }).catch((e)=>{
           console.error(e," initializing app")
-          setState({...state,isInitialized:true,isLoading : false});
+          setState({...state,isInitialized:true,isLoading : false,hasGetStarted:false});
       })
     });
 
@@ -197,7 +202,6 @@ function App({init:initApp}) {
     }   
   }, []);
   const {isInitialized} = state;
-  const hasGetStarted = true;
   const isLoading = state.isLoading || !isInitialized || !appReadyRef.current? true : false;
     React.useEffect(()=>{
       if(isInitialized){
@@ -205,7 +209,7 @@ function App({init:initApp}) {
           trackIDLE(true);
       }
   },[isInitialized]);
-  const initialRouteName = "Home";
+  const hasGetStarted = state.hasGetStarted !== false? true : false;
   return (<SplashScreen isLoaded={!isLoading}>
       <NavigationContainer 
           ref={navigationRef}
@@ -216,9 +220,12 @@ function App({init:initApp}) {
         }
       >
           <Navigation
-            initialRouteName = {initialRouteName}
+            initialRouteName = {defaultStr(hasGetStarted ? appInitialRouteName : getStartedRouteName,"Home")}
             state = {state}
             hasGetStarted = {hasGetStarted}
+            onGetStart = {(e)=>{
+              setState({...state,hasGetStarted:true})
+            }}
           />
       </NavigationContainer> 
   </SplashScreen>);

package/src/navigation/index.js

@@ -6,15 +6,23 @@ import DrawerNavigator from "./Drawer";
 
 export * from "./utils";
 
+/**** la fonction onGetStart doit normalement être appélée lorsque l'application 
+ *  lorsque hasGetStarted est à false, celle-ci rend l'écran Start permettant de rendre le contenu GetStarted
+*/
 export default function NavigationComponent (props){
-    let {state,hasGetStarted,initialRouteName,extra} = props;
+    let {state,hasGetStarted,onGetStart,initialRouteName,extra} = props;
     const allScreens = initScreens({Factory:Stack,ModalFactory:Stack,filter:({name,Screen})=>{
-        return (name === initialRouteName? defaultObj(extra) : true);
+        if(name === initialRouteName){
+            extra = defaultObj(extra);
+            extra.onGetStart = onGetStart;
+            extra.state = state;
+            return extra;
+        }
+        return true;
     }});
-    
     initialRouteName = sanitizeName(initialRouteName);
-    const drawerScreens = handleContent({screens:allScreens,hasGetStarted,initialRouteName,state,Factory:Stack});
-    const stackScreens = handleContent({screens:allScreens.modals,hasGetStarted,initialRouteName,state,Factory:Stack});
+    const drawerScreens = handleContent({screens:allScreens,onGetStart,hasGetStarted,initialRouteName,state,Factory:Stack});
+    const stackScreens = handleContent({screens:allScreens.modals,onGetStart,hasGetStarted,initialRouteName,state,Factory:Stack});
     if(!drawerScreens.length && !stackScreens.length){
        console.error("apps will stuck on splash screen because any valid screen has been found on screens ",allScreens);
     }

package/src/screens/Auth/Profile.js

@@ -1,6 +1,6 @@
 import FormDataScreen from "$elayouts/Screen/FormData";
 import {defaultStr,defaultObj,isObjOrArray,isObj} from "$utils";
-import Auth from "$auth";
+import Auth from "$cauth";
 import {navigate} from "$cnavigation";
 import SelectTheme from "$themeSelectorComponent";
 import Preloader from "$epreloader";

package/src/screens/Help/PrivacyPolicy/content.js

@@ -6,7 +6,7 @@ import Label from "$components/Label";
 
 export default function ContentPrivacy (){
     return <Label primary style={{fontSize:15,fontWeight:'bold',padding:10}}>
-    Pour modifier le contenu de la police de sécurité, il suffit de déclarer dans les alias, l'alias 
+    Pour modifier le contenu de la politique de confidentialité, il suffit de déclarer dans les alias, l'alias 
     $PrivacyPolicy prointant vers un fichier javascript dans lequel on exporte par défaut, soit un composant React
     où encore un élément react valide dont le rendu remplacera ledit contenu.
 </Label>

package/src/screens/ScreenWrapper.js

@@ -62,7 +62,7 @@ export default function ScreenWrapperNavComponent(_props){
         }
     },[]);
     setScreenOptions(options);
-    const allowDrawer = typeof options.allowDrawer ==='boolean'? options.allowDrawer : typeof Screen.allowDrawer =='boolean'? Screen.allowDrawer : Screen.isModalScreen == true ? false : true;
+    const allowDrawer = typeof options.allowDrawer ==='boolean'? options.allowDrawer : typeof options.withDrawer =='boolean'? options.withDrawer : typeof Screen.allowDrawer =='boolean'? Screen.allowDrawer : Screen.isModalScreen == true ? false : true;
     return <Screen 
         {...rest}
         key = {sanitizedName}

package/src/screens/index.js

@@ -7,8 +7,7 @@ import { SCREEN_OPTIONS } from "./utils";
 
 export * from "./utils";
 
-
-export const handleScreen = ({Screen,Factory,ModalFactory,result,useTheme,filter,index})=>{
+export const handleScreen = ({Screen,Factory,ModalFactory,result,filter,index})=>{
     result = defaultObj(result);
     result.screens = defaultObj(result.screens);
     result.groups = defaultObj(result.groups);
@@ -18,7 +17,7 @@ export const handleScreen = ({Screen,Factory,ModalFactory,result,useTheme,filter
     let screenOptions = undefined;
     if(Array.isArray(Screen)){
         Screen.map((S,i)=>{
-            return handleScreen({Screen:S,Factory,ModalFactory,result,groups,useTheme,filter,index:i});
+            return handleScreen({Screen:S,Factory,ModalFactory,result,groups,filter,index:i});
         })
     } else if(typeof Screen ==='object' && React.isComponent(Screen.Component) && isNonNullString(Screen.screenName)){
         screenName = Screen.screenName;
@@ -40,11 +39,15 @@ export const handleScreen = ({Screen,Factory,ModalFactory,result,useTheme,filter
             if(!GROUP_NAMES[groupName]){
                 groupName = GROUP_NAMES.PRIVATE;
             }
-            if(!authRequired){
-                groupName = groupName || GROUP_NAMES.PUBLIC;
-            } else{
-                groupName = GROUP_NAMES.PRIVATE;
-                authRequired = true;
+            if( groupName !== GROUP_NAMES.INSTALL){
+                if(!authRequired){
+                    groupName = groupName || GROUP_NAMES.PUBLIC;
+                } else{
+                    groupName = GROUP_NAMES.PRIVATE;
+                    authRequired = true;
+                }
+            } else {
+                authRequired = false;
             }
             groups[groupName] = defaultObj(groups[groupName]);
             groups[groupName][sanitizeName] = name;
@@ -84,7 +87,6 @@ export const handleScreen = ({Screen,Factory,ModalFactory,result,useTheme,filter
  * @param Factory {typeof Factory : voir @https://reactnavigation.org/}
  * @param screens {Object {screns:{screens:{},groups:{}}}} l'objet dans lequel le screensat sera retourné
  * @param screens {array} la liste des écrans à rendre dynamiquement dans le FactoryContainer
- * @param useTheme {boolean} si le composant sera wrapper par le hook withTheme de react-native-paper
  * @return {object} : objet comportant deux propriétés : 
  *      screens : {} : liste des écrans de l'application initialisés. il est à noter que, tous les écrans sont dans les sous répertoire du dossier courant
             screens screens est de la forme : {group1:[],group2:[], ...groupN:[]}:
@@ -92,7 +94,7 @@ export const handleScreen = ({Screen,Factory,ModalFactory,result,useTheme,filter
             
         groups : {} : la liste des différents groupes d'écrans rendus par la méthode
  */
-export default function initScreens ({Factory,ModalFactory,useTheme,screens,result,filter}){
+export default function initScreens ({Factory,ModalFactory,screens,result,filter}){
     if(!isArray(screens) || !screens.length){
         screens = mainScreens;
     }
@@ -100,7 +102,6 @@ export default function initScreens ({Factory,ModalFactory,useTheme,screens,resu
     result.screens = defaultObj(result.screens);
     result.groups = defaultObj(result.groups);
     ///lorsque les écrans sont passés enparamètres, par défaut, le wrapper withTheme n'est pas utilisé
-    useTheme = defaultBool(useTheme,false);
     filter = typeof filter =="function" ? filter : x=> true;
     defaultArray(screens).map((Screen,index)=>{
         handleScreen({Screen,result,Factory,ModalFactory,filter,index})
@@ -108,7 +109,7 @@ export default function initScreens ({Factory,ModalFactory,useTheme,screens,resu
     return result;
 }
 
-export const handleContent = ({screens,hasGetStarted,state,Factory})=>{
+export const handleContent = ({screens,hasGetStarted,onGetStart,state,Factory})=>{
     const content = [];
     state = defaultObj(state);
     screens = defaultObj(screens);