@fto-consult/expo-ui 3.2.0 → 3.3.1

package/bin/index.js

@@ -1,4 +1,4 @@
-#!/usr/bin/env node
+//#!/usr/bin/env node
 /**@see : https://blog.shahednasser.com/how-to-create-a-npx-tool/ */
 'use strict';
 process.on('unhandledRejection', err => {
@@ -25,6 +25,7 @@ if(!parsedArgs.script || !(parsedArgs.script in supportedScript)){
 const {script} = parsedArgs;
 let cmd = null;
 /**** 
+ *    1. installer electron globallement : npm i -g electron@latest
  *  cmde : [cmd] start electron config=[path-to-config-relative-to-project-dir] 
  *        splash=[path-to-splashcreen-relative-to-project-root] 
  *        output-dir|out = [path-to-output-dir-relative-to-root-project]
@@ -64,10 +65,9 @@ if(parsedArgs.electron){
       if(parsedArgs.compile || !fs.existsSync(path.resolve(webBuildDir,"index.html"))){
         cmd = "npx expo export:web";
         console.log("******************** exporting app : "+cmd);
-        return exec({cmd:cmd,projectRoot}).then(next).catch(reject);
-      } else {
-         next();
+        return exec({cmd,projectRoot}).then(next).catch(reject);
       }
+      next();
   });
   return promise.then(()=>{
     if(!fs.existsSync(buildOutDir) || !fs.existsSync(indexFile)){
@@ -75,15 +75,22 @@ if(parsedArgs.electron){
     }
     switch(script){
         case "start":
-           cmd = "npx electron ./";
-           console.log("executing electron script "+cmd)
-           return exec({
-              cmd, projectRoot : electronDir,
+           cmd = "electron "+electronDir;
+           return new Promise((resolve,reject)=>{
+              exec({
+                cmd, 
+                projectRoot : electronDir,
+              }).finally(()=>{
+                console.log("ant to exit");
+              })
+              setTimeout(resolve,1000)
            })
           break;
         case "build":
           break;
     }
+  }).catch((e)=>{
+    console.log(e," is cathing ggg");
   }).finally(()=>{
     process.exit();
   });

package/electron/exec.js

@@ -1,8 +1,9 @@
 const exec = require('child_process').exec;
 const fs = require("fs");
 const _exec = (cmd,cmdOpts,logMessages)=>{
+    cmdOpts = typeof cmdOpts =='object' && cmdOpts || {};
     return new Promise((resolve,reject)=>{
-        const timer = loaderTimer();
+        const timer = cmdOpts.loader !==false ? loaderTimer(cmd) : null;
         exec(cmd,cmdOpts, (error, stdout, stderr) => {
             if (error) {
                 logMessages !== false && console.log(`error: ${error.message}`);;
@@ -25,11 +26,12 @@ const _exec = (cmd,cmdOpts,logMessages)=>{
     })
 }
 const loaderTimer = function(timout) {
+    const text = typeof timout =='string' && timout ||'';
     timout = typeof timout =='number'? timout : 250;
     var P = ["\\", "|", "/", "-"];
     var x = 0;
     return setInterval(function() {
-      process.stdout.write("\r" + P[x++]);
+      process.stdout.write("\r"+text+" "+P[x++]);
       x &= 3;
     }, timout);
   };

package/electron/index.js

@@ -1,21 +1,44 @@
 const {app, BrowserWindow,Tray,Menu,MenuItem,systemPreferences,powerMonitor,dialog, nativeTheme} = require('electron')
 const appConfig  = {}//require("../src/app/config");
-const session = require("./session");
+const session = require("./src/session");
 const path = require("path");
+const paths = require("./paths.json");
+const images = paths.$images, assets = paths.$assets, logo = paths.logo;
 // Gardez une reference globale de l'objet window, si vous ne le faites pas, la fenetre sera
 // fermee automatiquement quand l'objet JavaScript sera garbage collected.
 let win = undefined;
 let fs = require("fs");
-let icon = undefined;
-const imagesPath = path.join(__dirname,"assets/images")
-if(process.platform =="win32" && fs.existsSync(path.join(imagesPath, "icon.ico"))){
-   icon = path.join(imagesPath, "icon.ico");
-} else if(process.platform =="linux" && fs.existsSync(path.join(imagesPath, "icon.png"))){
-   icon = path.join(imagesPath, "icon.png");
-} else if(process.platform =='darwin' && fs.existsSync(path.join(imagesPath, "icon.incs"))){
-  icon = path.join(imagesPath, "icon.incs");
+const isWindow = process.platform =="win32",
+isMac = process.platform =='darwin',
+isLinux = process.platform =="linux";
+const getIcon = (p)=>{
+    if(Array.isArray(p)){
+       for(let i in p){
+         const r = getIcon(p[i]);
+         if(r) return r;
+       }
+    } else if(typeof p =='string' && p && fs.existsSync(p)){
+      const ext = isWindow ? ".ico" : isMac ? ".incs" : ".png";
+      const possibles =  ["icon","logo","favicon"];
+      for(let i in possibles){
+        const icon = path.join(p,possibles[i]+ext);
+        if(fs.existsSync(icon)){
+           return icon;
+        }
+      }
+    }
+    return undefined;
 }
-
+const icon = isLinux && logo && fs.existsSync(logo) && logo || getIcon(
+    logo && fs.existsSync(logo) && path.dirname(logo),
+    images,
+    assets,
+)
+/*console.log(icon," is iccccccc");
+console.log(logo," is logo ",images,assets);
+throw {
+  message : "icon is "+icon+" logo is "+logo+" image is "+images+" assets is "+assets
+}*/
 Menu.setApplicationMenu(null);
 let clipboadContextMenu = (_, props) => {
   if (props.isEditable || props.selectionText) {
@@ -248,7 +271,7 @@ app.whenReady().then(() => {
   });
 })
 
-let {ipcMain} = require("electron");
+const {ipcMain} = require("electron");
 
 ipcMain.on("electron-restart-app",x =>{
   app.relaunch();
@@ -291,7 +314,7 @@ ipcMain.on("update-system-tray",(event,opts)=>{
   tray.setContextMenu(contextMenu) 
 })
 ipcMain.on("electron-get-path",(event,pathName)=>{
-  let p = app.getPath(pathName);
+  const p = app.getPath(pathName);
   event.returnValue = p;
   return p;
 });

package/electron/src/preload.js

@@ -1,7 +1,6 @@
 (function(window) {
     let showingExitApp = undefined;
-    let sudo = require('sudo-prompt');
-    const { exec } = require('child_process');
+    const exec = require("../exec");
     if(typeof window.isElectron != 'function'){
         Object.defineProperties(window,{
             ELECTRON : {
@@ -23,8 +22,7 @@
             },
         })
     } 
-    ELECTRON;
-    let fs = require("fs");
+    const fs = require("fs");
     let _app = require("./app.config");
     require("./pload")(ELECTRON);
     const {ipcRenderer} = require('electron')
@@ -286,65 +284,7 @@
                 value : getPath, override:false,writable:false
             },
             exec : {
-                value : (opts,successCB,errorCB)=>{
-                    if(isNonNullString(opts)){
-                        opts = {cmd:opts};
-                    }
-                    let {cmd} = opts;
-                    opts = defaultObj(opts);
-                    successCB = defaultFunc(successCB,opts.onSuccess)
-                    errorCB = defaultFunc(errorCB,opts.onError);
-                    return new Promise((resolve,reject)=>{
-                        let handle = function(error, stdout, stderr) {
-                            if(error){
-                                errorCB({error,stderr})
-                                return reject({error,stderr})
-                            }
-                            successCB(stdout);
-                            resolve(stdout);
-                        }
-                        if(opts.sudo || opts.runAsAdmin){
-                            sudo.exec(cmd, opts,handle)   
-                        } else {
-                            exec(cmd,handle);
-                        }
-                    })
-                }
-            },
-            installNewAppVersion : {
-                value : (conf,successCB,errorCB)=>{
-                    if(isNonNullString(conf)){
-                        conf = {filePath:conf}
-                    }
-                    conf = defaultObj(conf);
-                    let {notify} = APP.require("$dialog");
-                    
-                    if(isNonNullString(conf.filePath) && fs.existsSync(conf.filePath)){
-                        let cmd = conf.filePath;
-                        if(ELECTRON.DEVICE.isLinux){
-                            cmd = "dpkg -i "+cmd;
-                        }
-                        let rootPath = path.join(__dirname,'..')
-                        let incs = path.join(rootPath, ELECTRON.DEVICE.isWindows?'icon.ico':ELECTRON.DEVICE.isLinux?'icon.png':'incs');
-                        const options = {
-                            title : "Authorisez "+APP.getName()+"",
-                            name: APP.getName(),
-                            incs,
-                            icon : incs,
-                            cmd,
-                            sudo:true,
-                            onSoucces : (stdout)=>{
-                                let message = "Le processus d'installation de la mise à jour de l'application a été exécutée evec succès. Veuillez relancer l'application";
-                                notify.success(message);
-                            },
-                            onError: ({error})=>{
-                                notify.error("Erreur lors de l'exécution du fichier d'installation : "+defaultStr(error.message));
-                            }
-                            //icns: '/Applications/Electron.app/Contents/Resources/Electron.icns'
-                        };
-                        return ELECTRON.exec(options,successCB,errorCB)       
-                    }
-                }, override : false, writable : false
+                value : exec,
             },
             updateSystemTheme : {
                 value : (theme)=>{

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "3.2.0",
+  "version": "3.3.1",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -42,7 +42,7 @@
     "delete-node-modules": "rimraf ./**/node_modules",
     "modifier-url-remote-git": "git remote set-url origin 'https://borispipo@github.com/borispipo/smart-eneo.git'"
   },
-  "bin": "bin/index.js",
+  "bin": "./bin/index.js",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/borispipo/expo-ui.git"

package/src/auth/Login.js

@@ -86,7 +86,11 @@ export default function LoginComponent(props){
             },1000)
         }
     },[withPortal])
-    const {header,withScrollView:customWithScrollView,children,initialize,contentTop,data:loginData,canGoToNext,keyboardEvents,onSuccess:onLoginSuccess,mutateData,beforeSubmit:beforeSubmitForm,canSubmit:canSubmitForm,onStepChange,...loginProps} = defaultObj(getProps({
+    const {header,
+        headerTopContent:HeaderTopContent,
+        containerProps : customContainerProps,
+        contentProp,
+        withScrollView:customWithScrollView,children,initialize,contentTop,data:loginData,canGoToNext,keyboardEvents,onSuccess:onLoginSuccess,mutateData,beforeSubmit:beforeSubmitForm,canSubmit:canSubmitForm,onStepChange,...loginProps} = defaultObj(getProps({
         ...state,
         setState,
         state,
@@ -101,6 +105,8 @@ export default function LoginComponent(props){
         ProviderSelector,
         previousButtonRef,
     }));
+    const containerProps = defaultObj(customContainerProps);
+
     React.useEffect(()=>{
         Preloader.closeAll();
         /*** pour initializer les cordonnées du composant login */
@@ -191,13 +197,22 @@ export default function LoginComponent(props){
     });
     const withScrollView = typeof customWithScrollView =='boolean'? customWithScrollView : true;
     const Wrapper = withPortal ? ScreenWithoutAuthContainer  : withScrollView ? ScrollView: View;
+    const mQueryUpdateProps = (a)=>{
+        const style = StyleSheet.flatten([updateMediaQueryStyle(),containerProps.style]);
+        if(typeof containerProps.updateMediaQueryStyle =='function'){
+            return containerProps.updateMediaQueryStyle({style})
+        }
+        return {style};
+    };
     const wrapperProps = withPortal ? {appBarProps,authRequired:false,title:loginTitle,withScrollView} : { style:styles.wrapper};
+    const sH = React.isComponent(HeaderTopContent)? <HeaderTopContent
+        mediaQueryUpdateNativeProps = {mQueryUpdateProps}
+    /> : React.isValidElement(HeaderTopContent)? HeaderTopContent : null;
     return <Wrapper testID = {testID+"_Wrapper" }{...wrapperProps}>
         <DialogProvider ref={dialogProviderRef}/>
+        {sH}
         <Surface style={[styles.container,{backgroundColor}]} testID={testID}>
-            <Surface elevation = {0} mediaQueryUpdateNativeProps = {(a)=>{
-                return {style:updateMediaQueryStyle()}
-            }} testID={testID+"_Content"} style={[styles.content,updateMediaQueryStyle(),{backgroundColor}]}>
+            <Surface elevation = {0} {...containerProps} mediaQueryUpdateNativeProps = {mQueryUpdateProps} {...containerProps} testID={testID+"_Content"} style={[styles.content,updateMediaQueryStyle(),{backgroundColor},containerProps.style]}>
                 <FormData 
                     formName = {formName}
                     testID = {testID+"_FormData"}

package/src/components/Avatar/AutoHeightImage/index.js

@@ -1,5 +1,5 @@
 ///@see : https://github.com/vivaxy/react-native-auto-height-image
-import React, { useEffect, useState, useRef } from 'react';
+import React, { useEffect, useState, useRef } from '$react';
 import ImagePolyfill from './ImagePolyfill';
 import AnimatableImage from './AnimatableImage';
 import PropTypes from 'prop-types';
@@ -22,6 +22,7 @@ function AutoHeightImage(props) {
     maxHeight,
     onError,
     testID:cTestID,
+    preloader,
     ...rest
   } = props;
   const [height, setHeight] = useState(
@@ -29,14 +30,14 @@ function AutoHeightImage(props) {
       DEFAULT_HEIGHT
   );
   const mountedRef = useRef(false);
-
-  useEffect(function () {
+  const toolgeMounted = function () {
     mountedRef.current = true;
     return function () {
       mountedRef.current = false;
     };
-  }, []);
-
+  }
+  useEffect(toolgeMounted,[])
+  React.useOnRender(toolgeMounted,0);
   useEffect(
     function () {
       (async function () {
@@ -75,7 +76,7 @@ function AutoHeightImage(props) {
         onError={onError}
         {...rest}
       />
-      {!mountedRef.current ? <ActivityIndicator testID={testID+"_ActivityIndicator"} color={theme.colors.primary}/> : null}
+      {!mountedRef.current && preloader !== false && (!width || !height) ? <ActivityIndicator testID={testID+"_ActivityIndicator"} color={theme.colors.primary}/> : null}
   </View>
   );
 }
@@ -85,13 +86,15 @@ AutoHeightImage.propTypes = {
   width: PropTypes.number.isRequired,
   maxHeight: PropTypes.number,
   onHeightChange: PropTypes.func,
-  animated: PropTypes.bool
+  animated: PropTypes.bool,
+  preloader : PropTypes.bool,//si l'on affichera le preloader
 };
 
 AutoHeightImage.defaultProps = {
   maxHeight: Infinity,
   onHeightChange: NOOP,
-  animated: false
+  animated: false,
+  preloader : true,
 };
 
 export default AutoHeightImage;

package/src/components/Image/index.js

@@ -72,7 +72,7 @@ export default function ImageComponent(props){
     drawProps = defaultObj(drawProps);
     const flattenStyle = StyleSheet.flatten(props.style) || {};
     defaultSrc = defaultVal(defaultSrc);
-    editable = defaultBool(editable,true);
+    editable = defaultBool(editable,false);
     if(disabled){
         editable = false;
     }