@fto-consult/expo-ui 2.12.6 → 2.12.8

package/src/components/Datagrid/SWRDatagrid.js

@@ -1,9 +1,12 @@
 // Copyright 2022 @fto-consult/Boris Fouomene. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
-
+/****
+ *  @see : https://swr.vercel.app/examples/infinite-loading
+ *  @see : 
+ */
 import Datagrid from "./IndexComponent";
-import {defaultStr,defaultObj,defaultVal,extendObj} from "$utils";
+import {defaultStr,defaultObj,defaultVal,isObjOrArray,isObj,extendObj} from "$utils";
 import React from "$react";
 import Auth from "$cauth";
 import DateLib from "$lib/date";
@@ -28,10 +31,14 @@ export const swrOptions = {
     errorRetryCount : 5,
 }
 
+/****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
+ */
 const SWRDatagridComponent = React.forwardRef((props,ref)=>{
     let {
         table,
-        data,
+        data:customData,
         saveButton,
         title,
         fab,
@@ -82,9 +89,11 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
         title
     },rest.exportTableProps.pdf);
     const fetchOptionsRef = React.useRef({});
+    const refreshCBRef = React.useRef(null);
     fetchPath = defaultStr(fetchPath,table.queryPath,tableName.toLowerCase()).trim();
     const innerRef = React.useRef(null);
-    let {data:fetchedData, error, isValidating,size, setSize,isLoading,refresh} =  useSWR(fetchPath,{
+    const showProgressRef = React.useRef(true);
+    const {data:fetchedData, error, isValidating,size, setSize,isLoading,refresh} =  useSWR(fetchPath,{
         fetchOptionsMutator : (opts)=>{
             const {url} = opts;
             const fo = fetchOptionsRef.current;
@@ -99,32 +108,59 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
             ...defaultObj(appConfig.swr),
         },
     });
+    const fetchedRef = React.useRef(fetchedData);
+    const hasResult = !isLoading && !isValidating && isObj(fetchedData) && 'data' in fetchedData;
+    if(hasResult){
+        fetchedRef.current = fetchedData;
+    }
+    const data = fetchedRef.current?.data;
+    const total = fetchedRef.current?.total;
     React.useEffect(()=>{
         innerRef.current && innerRef.current.setIsLoading && innerRef.current.setIsLoading(isLoading);
     },[isLoading])
+    React.useEffect(()=>{
+        const cb = refreshCBRef.current;
+        refreshCBRef.current = null;
+        if(!isValidating && !isLoading && typeof cb =='function'){
+            cb();
+        }
+    },[isValidating,isLoading])
+    const doRefresh = (showProgress)=>{
+        showProgressRef.current = showProgress ? typeof showProgress ==='boolean' : false;
+        refreshCBRef.current = ()=>{
+            showProgressRef.current = true;
+        };
+        refresh();
+    }
     React.useEffect(()=>{
         const upsert = cAction.upsert(tableName);
         const remove = cAction.remove(tableName);
-        APP.on(remove,refresh);
-        APP.on(upsert,refresh);
+        const onUpsert = ()=>{
+            doRefresh(false);
+        }
+        APP.on(remove,onUpsert);
+        APP.on(upsert,onUpsert);
         return ()=>{
-            APP.off(upsert,refresh);
-            APP.off(remove,refresh);
+            APP.off(upsert,onUpsert);
+            APP.off(remove,onUpsert);
         }
-    },[])
+    },[]);
     return (
         <Datagrid 
             {...rest}
             {...defaultObj(table.datagrid)} 
-            isLoading = {isLoading|| isValidating}
+            isLoading = {isLoading|| isValidating && !error && showProgressRef.current && true || false}
             beforeFetchData = {({fetchOptions:opts})=>{
                 opts.fields = fetchFields;
-                opts = getFetchOptions({fetcher,...opts});
+                opts = getFetchOptions({fetcher,showError:showProgressRef.current,...opts});
+                opts.queryParams.withTotal = true;
                 fetchOptionsRef.current = opts;
-                refresh();
+                doRefresh(true);
+                return false;
             }}
+            isTableData
             fetchData = {undefined}
-            data = {error ? data : defaultObj(fetchedData).data}
+            data = {data}
             canMakePhoneCall={canMakePhoneCall} 
             key={tableName} 
             sessionName={defaultStr(sessionName,'list-data')} 

package/src/components/Grid/Cell.js

@@ -20,22 +20,42 @@ export const defaultDesktopSize = 4;
 
 const isV = x=> typeof x =='number' && x && x <= totalSize ? true : false;
 export const getSizeStyle = (props)=>{
-    let {size,smallPhoneSize,paddingMultiplicator,phoneSize,marginMultiplicator,mobileSize,tabletSize,gutter,desktopSize} = defaultObj(props);
+    let {size,smallPhoneSize,paddingMultiplicator,phoneSize,marginMultiplicator,mobileSize,tabletSize,gutter,desktopSize
+        ,smallPhoneGutter,phoneGutter,mobileGutter,tabletGutter,desktopGutter,
+    } = defaultObj(props);
     gutter = gutter === false ? 0 : typeof gutter =='number'? gutter : undefined;
-    if(Dimensions.isSmallPhoneMedia()){
-        size = isV(smallPhoneSize) ? smallPhoneSize : size || defaultMobileSize;
+    let hasFound = false;
+    const isValidSmallSize = isV(smallPhoneSize),
+    isValidPhoneSize = isV(phoneSize),
+    isValidMobileSize = isV(mobileSize),
+    isValidTabletSize = isV(tabletSize),
+    isValidDesktopSize = isV(desktopSize);
+    if(Dimensions.isSmallPhoneMedia() && isValidSmallSize){
+        size =  smallPhoneSize;
+        if(smallPhoneGutter !== undefined){gutter = smallPhoneGutter;}
         gutter = gutter !== undefined ? gutter : medias.sp;
-    } else if(Dimensions.isPhoneMedia()){
-        size = isV(phoneSize) ? phoneSize : size || defaultMobileSize;
+        hasFound = true;
+    } 
+    if(!hasFound && Dimensions.isPhoneMedia() && isValidPhoneSize){
+        size = phoneSize;
+        if(phoneGutter !== undefined){gutter = phoneGutter;}
         gutter = gutter !== undefined ? gutter : medias.mp;
-    } else if(Dimensions.isMobileMedia()){
-        size = isV(mobileSize) ? mobileSize : size || defaultMobileSize;
+        hasFound = true;
+    }
+    if(!hasFound && Dimensions.isMobileMedia()){
+        size = isValidMobileSize? mobileSize : size || defaultMobileSize;
+        if(mobileGutter !== undefined) gutter = mobileGutter;
         gutter = gutter !== undefined ? gutter : medias.xs;
-    } else if(Dimensions.isTabletMedia()){
-        size = isV(tabletSize) ? tabletSize : size || defaultTabletSize;
+        hasFound = true;
+    } 
+    if(!hasFound && Dimensions.isTabletMedia()){
+        size = isValidTabletSize ? tabletSize : size || defaultTabletSize;
+        if(tabletGutter !== undefined) gutter = tabletGutter;
         gutter = gutter !== undefined ? gutter : medias.sm;
-    } else {
-        size = isV(desktopSize)? desktopSize : size || defaultDesktopSize;
+        hasFound = true;
+    } else if(!hasFound){
+        size = isValidDesktopSize ? desktopSize : size || defaultDesktopSize;
+        if(desktopGutter !== undefined) gutter = desktopGutter;
         gutter = gutter !== undefined ? gutter : medias.md;
     }
     if(!isV(size)){

package/src/layouts/Screen/TableData.js

@@ -1,7 +1,7 @@
 import {defaultStr,isNumber,isPromise,defaultVal,extendObj,defaultObj,uniqid,isObj,isObjOrArray} from "$utils";
 import {FormData} from "$ecomponents/Form";
 import FormDataScreen from "./FormData";
-import ScreenContainer from "$screen";
+import ScreenContainer from "./Screen";
 import React from "$react";
 import { StyleSheet} from "react-native";
 import ScrollView from "$ecomponents/ScrollView";

package/src/layouts/Screen/index.js

@@ -8,5 +8,5 @@ Screen.FormData = FormData;
 Screen.List = List;
 
 export default Screen;
-
+export {default as TableData} from "./TableData";
 export {FormData,List,ScreenWithoutAuthContainer};

package/src/media/file-system/exports.js

@@ -0,0 +1,16 @@
+import { readAsStringAsync } from "./utils";
+import { loadAsset } from "../Assets/utils";
+
+
+export * from "./utils";
+
+export const readFileAsText = async (asset)=>{
+    return await new Promise((resolve,reject)=>{
+        loadAsset(asset).then((a)=>{
+            readAsStringAsync(a.localUri).then((data) => {
+                resolve(data);
+            }).catch(reject);
+        }).catch(reject);
+    })
+}
+export const readFile = readFileAsText;

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

@@ -1,20 +1,9 @@
-import { readAsStringAsync } from "./utils";
-import { loadAsset } from "../Assets/utils";
+// Copyright 2022 @fto-consult/Boris Fouomene. All rights reserved.
+// Use of this source code is governed by a BSD-style
+// license that can be found in the LICENSE file.
 
-export * from "./utils";
+import * as FileSystem from "./exports";
 
-export const readFileAsText = async (asset)=>{
-    return await new Promise((resolve,reject)=>{
-        loadAsset(asset).then((a)=>{
-            readAsStringAsync(a.localUri).then((data) => {
-                resolve(data);
-            }).catch(reject);
-        }).catch(reject);
-    })
-}
-export const readFile = readFileAsText;
+export default FileSystem;
 
-export default {
-    readFileAsText,
-    readFile,
-}
+export * from "./exports";

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

@@ -29,4 +29,6 @@ const readAs = async (asset,fn)=>{
 }
 export const readAsStringAsync = async (asset)=>{
     return readAs(asset);
-}
+}
+
+export * from "./write";

package/src/media/file-system/utils/write.js

@@ -1,9 +1,12 @@
 // Copyright 2022 @fto-consult/Boris Fouomene. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
-import {defaultStr,isNonNullString,defaultNumber,defaultBool,dataURLToBase64,isBlob,isBase64,isDataURL} from "$utils";
+import {defaultStr,isNonNullString,getFileName,getFileExtension,defaultNumber,defaultBool,dataURLToBase64,isBlob,isBase64,isDataURL} from "$utils";
 const FileSaver = require('file-saver');
 const mime = require('mime-types')
+const XLSX = require("xlsx");
+import Preloader from "$preloader";
+
 /**** sauvegarde un fichier sur le disque 
      *  @param {object} {
      *      content {mix}: le contenu du fichier à enregistrer
@@ -16,9 +19,9 @@ const mime = require('mime-types')
      *      isBinary : si c'est un fichier binaire
      *  }
     */
- export const write = ({content,type,isBinary,timeout,delay,share,contentType,filename,path,directory,fileName})=>{    
+ export const write = ({content,type,isBinary,timeout,delay,share,contentType,path,directory,fileName})=>{    
     share = defaultBool(share,true);
-    fileName = sanitizeFileName(defaultStr(fileName,filename));
+    fileName = sanitizeFileName(fileName);
     contentType = defaultStr(contentType)  || mime.contentType(fileName) || mime.contentType(".txt");
     return new Promise((resolve,reject)=>{
         if(!isNonNullString(fileName)){
@@ -27,7 +30,7 @@ const mime = require('mime-types')
         }
         content = isBlob(content)? content : new Blob(content,contentType);
         try {
-            FileSaver.saveAs(blob, fileName);
+            FileSaver.saveAs(content, fileName);
             setTimeout(() => {
                 resolve({path:fileName,isWeb : true});
             }, defaultNumber(timeout,delay,3000));
@@ -39,4 +42,27 @@ const mime = require('mime-types')
 
 export const writeText = (args)=>{
     return write({...args,contentType:mime.contentType(".txt")});
+}
+/***
+ * @see https://ourtechroom.com/tech/mime-type-for-excel/ for excel mimesTypes
+ * .xls	 : application/vnd.ms-excel
+ */
+export const writeExcel = ({workbook,content,contentType,fileName,...rest})=>{
+    if(!isNonNullString(contentType) || !contentType.contains("application/vnd.")){
+        //contentType = "application/vnd.ms-excel";
+        contentType : "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+    }
+    let ext = defaultStr(getFileExtension(fileName,true),"xlsx");
+    fileName = sanitizeFileName(getFileName(fileName,true))+"."+ext;
+    if(!isNonNullString(fileName)){
+        return Promise.reject({status:false,message:'Nom de fichier invalide pour le contenu excel à créer'});
+    }
+    if(isBlob(content)){
+        return write({...rest,content,fileName,contentType})
+    }
+    Preloader.open("génération du fichier excel "+fileName);
+    XLSX.writeFile(workbook, fileName);
+    setTimeout(()=>{
+        Preloader.close();
+    },1000);
 }