@fto-consult/expo-ui 7.24.3 → 8.0.0

package/src/media/file-system/utils/FileSaver.native.js

@@ -6,38 +6,75 @@ import * as Sharing from 'expo-sharing';
 export const save = ({content,isBase64:isB64,share,directory,fileName,path})=>{
     path = defaultStr(path,directory,Directories.DOCUMENTS).trim().rtrim("/");
     share = defaultBool(share,true);
-    let hasFound = false;
+    let foundDirectory = null,dirToMake = null;
     for(let i in Directories){
         if(path.includes(Directories[i].rtrim("/"))){
-           hasFound = true;
+           foundDirectory = Directories[i];
            break;
         }
     }
-    if(!hasFound){
+    if(!foundDirectory){
        path = Directories.DOCUMENTS;
+    } else {
+        dirToMake = path.split(foundDirectory)[1];
+        path = foundDirectory;
+        if(dirToMake){
+            const dd = [];
+            dirToMake = dirToMake.replaceAll("\\","/").trim().split("/").filter((d)=>{
+                d = d.trim().rtrim("/").ltrim("/");
+                if(d){
+                    dd.push(d);
+                    return true;
+                }
+                return false;
+            });
+            dirToMake = dd;
+        } else dirToMake = null;
     }
-    path = p.join(path,fileName);
-    const cb = (r,resolve)=>{
-        setTimeout(()=>{
-            if(share){
-                Sharing.shareAsync(path);
-            }
-        },0);
-        const r2 = {fileName,path,result:r};
-        typeof resolve =='function' && resolve(r2);;
-        return r2;
+    const success = ()=>{
+        path = p.join(path,fileName);
+        const cb = (r,resolve)=>{
+            setTimeout(()=>{
+                if(share){
+                    Sharing.shareAsync(path);
+                }
+            },0);
+            const r2 = {fileName,path,result:r};
+            typeof resolve =='function' && resolve(r2);;
+            return r2;
+        }
+        if(isB64 || isBase64(content)){
+            return FileSystem.writeAsStringAsync(path,content,{ encoding: FileSystem.EncodingType.Base64 }).then(cb);
+        }
+        return new Promise((resolve,reject)=>{
+            const fr = new FileReader();
+            fr.onload = () => {
+              return FileSystem.writeAsStringAsync(path, fr.result.split(',')[1], { encoding: FileSystem.EncodingType.Base64 }).then((r)=>{
+                return cb(r,resolve);
+              }).catch(reject);
+            };
+            fr.onerror(reject);
+            fr.readAsDataURL(content);
+        });
     }
-    if(isB64 || isBase64(content)){
-        return FileSystem.writeAsStringAsync(path,content,{ encoding: FileSystem.EncodingType.Base64 }).then(cb);
+    if(Array.isArray(dirToMake) && dirToMake.length){
+        return new Promise((resolve,reject)=>{
+            const next = ()=>{
+                if(!dirToMake.length){
+                    return success().then(resolve).catch(reject);
+                }
+                const dir = dirToMake.shift();
+                path = p.join(path,dir);
+                return FileSystem.makeDirectoryAsync(path,{ intermediates: true }).then(next).catch(reject);
+            }
+            return (typeof FileSystem.requestDirectoryPermissionsAsync == "function"? FileSystem.requestDirectoryPermissionsAsync: ()=>Promise.resolve(({directoryUri:path,granted:true})))(path).then(({directoryUri,granted})=>{
+                if(granted){
+                    path = directoryUri;
+                    return next();
+                }
+                return {message:`Accès au repertoire ${path} non autorisé par l'utilisateur`}
+            }).catch(reject);
+        });
     }
-    return new Promise((resolve,reject)=>{
-        const fr = new FileReader();
-        fr.onload = () => {
-          return FileSystem.writeAsStringAsync(path, fr.result.split(',')[1], { encoding: FileSystem.EncodingType.Base64 }).then((r)=>{
-            return cb(r,resolve);
-          }).catch(reject);
-        };
-        fr.onerror(reject);
-        fr.readAsDataURL(content);
-    });
+    return success();
 }

package/src/media/file-system/utils/native/index.js

@@ -1,3 +1,4 @@
+import { isNonNullString } from '$cutils';
 import * as FileSystem from 'expo-file-system';
 export * from "expo-file-system";
 
@@ -10,4 +11,13 @@ export const Directories = {
   }
 }
 
-export {FileSystem};
+export {FileSystem};
+
+export const deleteFile = (filePath,...options)=>{
+  if(!isNonNullString(filePath)){
+    return Promise.reject({message:`Impossible de supprimer le fichier de chemin invalide!! veuillez spécifier une chaine de caractère comme chemin de fichier à supprimer`,filePath})
+  }
+  return FileSystem.deleteAsync(filePath,...options);
+}
+
+export {deleteFile as delete};

package/src/media/file-system/utils/web/index.js

@@ -1,5 +1,6 @@
 import { isAssets } from "../../../Assets/utils";
 import {isNonNullString} from "$cutils";
+import {isElectron} from "$cplatform";
 
 export const readBlob = (asset)=>{
     const uri = isAssets(asset)? asset.uri :isNonNullString(asset)? asset : undefined;
@@ -31,4 +32,23 @@ export const readAsStringAsync = async (asset)=>{
     return readAs(asset);
 }
 
-export const Directories = {};
+export const Directories = {};
+
+export const deleteFile = (filePath,...options)=>{
+    if(!isNonNullString(filePath)){
+        return Promise.reject({message:`Impossible de supprimer le fichier de chemin invalide!! veuillez spécifier une chaine de caractère comme chemin de fichier à supprimer`,filePath})
+    }
+    if(!isElectron() || !window?.ELECTRON || !window.ELECTRON?.FILE || typeof ELECTRON.FILE?.deleteFile !=="function"){
+        return Promise.reject({message:`Impossible de supprimer le fichier dans cet environnement, cet environnement ne supporte  pas la supression des fichier`});
+    }
+    return new Promise((resolve,reject)=>{
+        try {
+            ELECTRON.FILE.deleteFile(filePath,...options);
+            resolve(true);
+        } catch(e){
+            reject(e);
+        }
+    });
+}
+
+export {deleteFile as delete};

package/src/media/index.js

@@ -1,7 +1,8 @@
-import {isObj} from "$cutils";
+import {isObj,isBase64} from "$cutils";
 import notify from "$enotify";
 import Camera from "./camera";
 import {isMobileNative} from "$platform";
+import {getFilePickerOptions} from "./utils";
 import React from "react";
 
 let cameraRef = null;
@@ -26,9 +27,9 @@ export const MEDIA_TYPES = {
 
 export {ImagePicker};
 
-export function checkPermission (){
+export function checkPermission (method){
     return new Promise((resolve,reject)=>{
-        ImagePicker.requestMediaLibraryPermissionsAsync().then((r)=>{
+        (typeof method =="function" && method || ImagePicker.requestMediaLibraryPermissionsAsync)().then((r)=>{
             if(isObj(r) && (r.granted || r.status =='granted')){
                 resolve(r);
                 return true;
@@ -43,23 +44,24 @@ export function checkPermission (){
     })
 }
 
+export * from "./utils";
+
+const prepareImageResult = (result)=>{
+    if(!isObj(result)) return result;
+    result.dataURL = result.dataUrl = isBase64(result.base64) ? ('data:image/jpeg;base64,'+result.base64) : undefined;
+    return result;
+}
+
 /**** @see : https://docs.expo.dev/versions/latest/sdk/imagepicker/#imagepickeroptions 
  *  form more options.
  */
 export const pickImageOrVideo = (options)=>{
     return checkPermission().then(()=>{
         return new Promise((resolve,reject)=>{
-            ImagePicker.launchImageLibraryAsync(extendObj({},{
-                allowsEditing : true,
-                allowsMultipleSelection : false,///web only
-                aspect : [4,3], //[number, number]An array with two entries [x, y] specifying the aspect ratio to maintain if the user is allowed to edit the image (by passing allowsEditing: true). This is only applicable on Android, since on iOS the crop rectangle is always a square.
-                base64 : false, //Whether to also include the image data in Base64 format.
-                exif : false, //Whether to also include the EXIF data for the image. On iOS the EXIF data does not include GPS tags in the camera case.
-                mediaTypes : ImagePicker.MediaTypeOptions.All, //@see : https://docs.expo.dev/versions/latest/sdk/imagepicker/#mediatypeoptions
-                quality : 1, //Specify the quality of compression, from 0 to 1. 0 means compress for small size, 1 means compress for maximum quality.
-            },options)).then((result)=>{
-                if(!result.cancelled) resolve(result);
-                else {
+            ImagePicker.launchImageLibraryAsync(getFilePickerOptions(options)).then((result)=>{
+                if(!result.cancelled) {
+                    resolve(prepareImageResult(result));
+                } else {
                     notify.warning("Opération annulée par l'utilisateur");
                     reject(result);
                 }
@@ -101,33 +103,23 @@ export {Camera};
 export async function canTakePhoto(){
     if(!isMobileNative()) return false;
     return true;
-    const canTake = await Camera.isAvailableAsync();
-    return canTake;
-    return isMobileNative() || canTake;
 }
 
 export const takePhoto = (options)=>{
-    console.log(cameraRef," is camera ref")
-    if(!cameraRef){
-        return Promise.reject({
-            msg : "Camera non initialisée"
-        })
-    }
     return new Promise((resolve,reject)=>{
-        (async ()=>{
-            let takeP = await canTakePhoto();
-            if(takeP){
-                //const types = await Camera.getAvailableCameraTypesAsync();
-                //console.log(types," is stypes hein")
-                const permission = await Camera.requestCameraPermissionsAsync();
-                if(permission.status === 'granted' || permission.granted){
-                    return cameraRef.takePictureAsync(options).then(resolve).catch(reject);
+        return checkPermission(ImagePicker.requestCameraPermissionsAsync).then((perm)=>{
+            options = {base64:true,...Object.assign({},options)}
+            return ImagePicker.launchCameraAsync({...getFilePickerOptions(options)}).then((result)=>{
+                if(!result.cancelled) {
+                    resolve(prepareImageResult(result));
                 } else {
-                    notify.error("Impossible d'utiliser l'appareil photo car vous avez interdit l'utilisation de votre camera.")
-                    reject(permission)
+                    notify.warning("Opération annulée par l'utilisateur");
+                    reject(result);
                 }
-            }
-        })();
+                return null;
+            })
+        }).catch(reject);
     })
 }
 
+export const takePicture = takePhoto;

package/src/media/utils.js

@@ -0,0 +1,27 @@
+import { extendObj } from "$cutils";
+import * as ImagePicker from 'expo-image-picker';
+/*** retourne les optiosn pour la sélection d'un fchier ou d'un audio */
+export const getFilePickerOptions = (options)=>{
+    return extendObj({},{
+        allowsEditing : true,
+        allowsMultipleSelection : false,///web only
+        aspect : [4,3], //[number, number]An array with two entries [x, y] specifying the aspect ratio to maintain if the user is allowed to edit the image (by passing allowsEditing: true). This is only applicable on Android, since on iOS the crop rectangle is always a square.
+        base64 : false, //Whether to also include the image data in Base64 format.
+        exif : false, //Whether to also include the EXIF data for the image. On iOS the EXIF data does not include GPS tags in the camera case.
+        mediaTypes : ImagePicker.MediaTypeOptions.All, //@see : https://docs.expo.dev/versions/latest/sdk/imagepicker/#mediatypeoptions
+        quality : 1, //Specify the quality of compression, from 0 to 1. 0 means compress for small size, 1 means compress for maximum quality.
+    },options);
+}
+/*** retourne les ooptions pour la capture d'une photo
+    @see : https://docs.expo.dev/versions/v49.0.0/sdk/camera/#camerapictureoptions,
+*/
+export const getTakePhotoOptions = (options)=>{
+    const opts = extendObj({},{
+        base64 : false, //Whether to also include the image data in Base64 format.
+        quality : 0.8, //Specify the quality of compression, from 0 to 1. 0 means compress for small size, 1 means compress for maximum quality.
+    },options);
+    if(typeof opts.height !=="number"){
+        delete opts.height;
+    }
+    return opts;
+}  

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

@@ -125,7 +125,7 @@ const useGetItems = (options)=>{
         });
         let hasCapture = false;
         const captureSide = {
-            label : <RecordingButton/>,
+            label : (p)=><RecordingButton/>,
             style : [theme.styles.noPadding],
             labelProps : {style : [{flexShrink : 1},theme.styles.alignItemsFlexStart,theme.styles.w100]}
         };

package/src/navigation/animationTypes.js

@@ -0,0 +1,48 @@
+import {isMobileNative,isAndroid,isIos} from "$cplatform";
+import {CardStyleInterpolators,TransitionPresets} from "./Stack";
+import Auth from "$cauth";
+import { isNonNullString,isObj } from "$cutils";
+
+const sessionKey = "screen-nav-animation-type";
+
+//@see : https://reactnavigation.org/docs/stack-navigator/
+export function getAnimationType (){
+    return prepareAnimType(Auth.getSessionData(sessionKey));
+}
+export const setAnimationType = (anim)=>{
+    return Auth.setSessionData(sessionKey,prepareAnimType(anim));
+}
+
+export const prepareAnimType = (animType)=>{
+    if(!isNonNullString(animType) || !animationTypes[animType]){
+        animType = isAndroid() ? "FadeFromBottomAndroid" : "DefaultTransition"
+    }
+    if(!TransitionPresets[animType]){
+        for(let i in TransitionPresets){
+            if(isObj(TransitionPresets[i])){
+                return i;
+            }
+        }
+    }
+    return animType;
+}
+
+/*** retourne l'animation courante */
+export const getAnimation = ()=>{
+    const animType = getAnimationType();
+    return TransitionPresets[animType] || {};
+}
+
+export const animationTypes = isIos()? {
+    SlideFromRightIOS : {code:"SlideFromRightIOS",label:"Standard"},
+    ModalSlideFromBottomIOS : {code : "ModalSlideFromBottomIOS",label:"Navigation standard"},
+    //ModalPresentationIOS : {code : "ModalPresentationIOS",label : "Présentation modal, version iOS >=13"},
+    DefaultTransition : {code:"DefaultTransition",label:"Par défaut",default:true},
+ } :  isAndroid() ?  {
+    FadeFromBottomAndroid : {code:"FadeFromBottomAndroid",label:"Transition haut vers le bas"},
+    RevealFromBottomAndroid : {code : "RevealFromBottomAndroid",label : "Animation standard"},
+    ScaleFromCenterAndroid : {code:"ScaleFromCenterAndroid",label:"Transition vers le centre, version android > 10"},
+    DefaultTransition : {code:"DefaultTransition",label:"Par défaut",default:true}
+} : {
+    DefaultTransition : {code:"DefaultTransition",label:"Par défaut",default:true},
+};

package/src/navigation/index.js

@@ -6,7 +6,8 @@ import DrawerNavigator from "./Drawer";
 import useContext from "$econtext/hooks";
 import { MainNavigationProvider } from "./hooks";
 import {isWeb,isAndroid} from "$cplatform";
-import Stack,{CardStyleInterpolators} from "./Stack";
+import Stack  from "./Stack";
+import { getAnimation } from "./animationTypes";
 import {extendObj,defaultObj} from "$cutils";
 import theme from "$theme";;
 
@@ -19,7 +20,7 @@ export * from "./utils";
 */
 export default function NavigationComponent (props){
     let {state,hasGetStarted,isLoading,onGetStart,initialRouteName,...rest} = props;
-    const cardStyleInterpolator = isAndroid() ? CardStyleInterpolators.forFadeFromBottomAndroid : CardStyleInterpolators.forHorizontalIOS;
+    const cardStyleInterpolator = null;//getAnimation();
     const {navigation:{screens,screenOptions}} = useContext();
     const allScreens = initScreens({Factory:Stack,screens,ModalFactory:Stack});
     initialRouteName = sanitizeName(initialRouteName);
@@ -40,6 +41,7 @@ export default function NavigationComponent (props){
             animationEnabled : !isWeb(),
             detachPreviousScreen: !navigation.isFocused(),
             cardStyleInterpolator,
+            ...Object.assign({},getAnimation()),
             ...defaultObj(opt2),
         },sOptions);
     }
@@ -53,10 +55,10 @@ export default function NavigationComponent (props){
                 initialRouteName={initialRouteName} 
                 screenOptions={getScreenOptions}
             >
-                    {drawerScreens.length ? <Stack.Group>
+                    {<Stack.Group>
                         {drawerScreens}
-                    </Stack.Group>:null}
-                    {stackScreens.length ? <Stack.Group
+                    </Stack.Group>}
+                    <Stack.Group
                         key = {"MODAL-DRAWERS-SCREENS"}
                         screenOptions={function(options){
                             return getScreenOptions(options,{
@@ -67,10 +69,12 @@ export default function NavigationComponent (props){
                         }}
                     >
                         {stackScreens}
-                    </Stack.Group>:null}
+                    </Stack.Group>
                 </Stack.Navigator> }
         </DrawerNavigator>
     </MainNavigationProvider>
 }
 
-export * from "$cnavigation";
+export * from "$cnavigation";
+
+export * from "./animationTypes";

package/src/screens/Auth/Profile.js

@@ -14,6 +14,8 @@ import {isElectron} from "$cplatform";
 import {isValidUrl} from "$cutils";
 import {screenName} from "./utils";
 import notify from "$notify";
+import {getAnimationType,setAnimationType,animationTypes} from "$enavigation/animationTypes"
+import {isWeb} from "$cplatform";
 
 export default function UserProfileScreen({fields,...p}){
     const {auth:{profilePropsMutator}} = useContext();
@@ -32,6 +34,15 @@ export default function UserProfileScreen({fields,...p}){
             },
             ...defaultObj(fields?.avatar),
         },
+        animationType : {
+            type : "select",
+            label : "Transition entre les écrans",
+            items : animationTypes,
+            itemValue : ({item})=>item.code,
+            renderItem : ({item})=>item.label,
+            defaultValue : getAnimationType(),
+            required : true,
+        },
     })
     const p2 = {...p,fields};
     const props = typeof profilePropsMutator =='function'? extendObj({},p,profilePropsMutator(p2)) : p2;
@@ -104,6 +115,7 @@ export default function UserProfileScreen({fields,...p}){
                 APP.trigger(APP.EVENTS.UPDATE_THEME,user.theme);
                 APP.trigger(APP.EVENTS.AUTH_UPDATE_PROFILE,toSave);
             },100);
+            setAnimationType(data.animationType);
             if(typeof props.onSave ==='function' && props.onSave({...rest,data:toSave,response,goBack,navigate}) === false) return;
             if(props.navigateToHomeOnSave !== true && typeof goBack =='function' && !hasChangeRef.current){
                 return goBack(true);

package/src/screens/Help/openLibraries.js

@@ -1,7 +1,7 @@
 module.exports = {
 	"@fto-consult/expo-ui": {
 		"name": "@fto-consult/expo-ui",
-		"version": "7.23.1",
+		"version": "7.24.3",
 		"repository": {
 			"type": "git",
 			"url": "git+https://github.com/borispipo/expo-ui.git"
@@ -49,12 +49,12 @@ module.exports = {
 		"license": "MIT"
 	},
 	"@fto-consult/common": {
-		"version": "4.7.2",
+		"version": "4.8.33",
 		"url": "https://github.com/borispipo/common#readme",
 		"license": "ISC"
 	},
 	"@fto-consult/node-utils": {
-		"version": "1.4.5",
+		"version": "1.4.7",
 		"license": "MIT"
 	},
 	"@pchmn/expo-material3-theme": {
@@ -123,7 +123,7 @@ module.exports = {
 		"license": "MIT"
 	},
 	"expo": {
-		"version": "49.0.21",
+		"version": "49.0.22",
 		"url": "https://github.com/expo/expo/tree/main/packages/expo",
 		"license": "MIT"
 	},
@@ -205,11 +205,6 @@ module.exports = {
 		"version": "3.7.5",
 		"license": "BSD-3-Clause"
 	},
-	"pdfmake": {
-		"version": "0.2.9",
-		"url": "http://pdfmake.org",
-		"license": "MIT"
-	},
 	"process": {
 		"version": "0.11.10",
 		"url": "git://github.com/shtylman/node-process.git",
@@ -249,6 +244,11 @@ module.exports = {
 		"url": "https://github.com/RonRadtke/react-native-blob-util",
 		"license": "MIT"
 	},
+	"react-native-gesture-handler": {
+		"version": "2.12.1",
+		"url": "https://github.com/software-mansion/react-native-gesture-handler#readme",
+		"license": "MIT"
+	},
 	"react-native-get-random-values": {
 		"version": "1.9.0",
 		"license": "MIT"

package/webpack.config.js

@@ -73,5 +73,10 @@ module.exports = async function(env, argv,opts) {
         }
       });
     }
+    config.resolve.fallback = {
+      ...Object.assign({},config.resolve.fallback),
+      crypto: require.resolve("crypto-browserify"),
+      stream: require.resolve("stream-browserify"),
+    }
     return config;
 };;

package/docs/drawerItems/index.js

@@ -1,17 +0,0 @@
-import introduction from "./introduction";
-
-export default function(){
-    return {
-        introduction : {
-            section : true,
-            label :"Introduction",
-            items : introduction,
-        },
-        components : {
-            section : true,
-            label : "Composants",
-            icon : "",
-            items : [],
-        }
-    }
-}

package/docs/drawerItems/introduction.js

@@ -1,8 +0,0 @@
-import Introdoction from "../screens/Introduction";
-export default [
-    {
-        text : "Introduction",
-        icon : "introduction",
-        routeName : Introdoction.screenName,
-    }
-]