@fto-consult/expo-ui 2.34.2 → 2.34.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "2.34.2",
+  "version": "2.34.4",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {

package/src/App.js

@@ -107,7 +107,7 @@ export default function getIndex(options){
             const date = screensRef.current[screen];
             const diff = new Date().getTime() - date.getTime();
             const timeout = defaultNumber(appConfig.get("swrRefreshTimeout"),SWR_REFRESH_TIMEOUT)
-            //console.log(diff,"is diff and ",date.toFormat("HH:MM:ss"),screensRef,screen);
+            screensRef.current[screen] = new Date();
             return diff >= timeout ? true : false;
           },
           initFocus(callback) {

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

@@ -155,7 +155,7 @@ export const footerFieldName = "dgrid-fters-fields";
 
 
 /*****
- * Pour spécifier qu'un champ du datagrid n'existe pas en bd il s'uffit de suffixer le nom du champ par le suffix : "FoundInDB" et de renseigner false comme valeur 
+ * Pour spécifier qu'un champ du datagrid n'existe pas en bd il s'ufit de suffixer le nom du champ par le suffix : "FoundInDB" et de renseigner false comme valeur 
 de l'objet rowData de cette propriété
  */
 export default class CommonDatagridComponent extends AppComponent {
@@ -719,7 +719,7 @@ export default class CommonDatagridComponent extends AppComponent {
             if(header.type.contains("date")){
                 this.dateFields[header.field] = header;
             }
-            /**** pour ignorer une colonne du datagrid, il suffit de passer le paramètre datagrid à false */
+            /**** pour ignorer une colonne du datagrid, il sufit de passer le paramètre datagrid à false */
             if(!isNonNullString(header.field) || header.datagrid === false) {
                 return;
             }
@@ -2094,6 +2094,10 @@ export default class CommonDatagridComponent extends AppComponent {
        let totalWidths = 0;
        let columnIndex = 0,visibleColumnIndex=0;
        this.sectionListColumnsSize.current = 0;
+       /*** la props widht de la colonne peut être en pourcentage
+        * l'on peut également définir la valeur minWidth en entier qui représentera la longuer minimale du champ
+        * la props fitWidth permet de dire que le champ devra occuper l'espace restant sur la page
+        */
        Object.map(columns,(header,headerIndex) => {
             let {
                 field,
@@ -2115,6 +2119,9 @@ export default class CommonDatagridComponent extends AppComponent {
             
             const type = defaultStr(header.jsType,header.type,"text").toLowerCase();
             sortType = defaultStr(sortType,type).toLowerCase();
+            if(typeof width =='string' && width.contains("%")){
+                width = ((parseFloat(width.replaceAll(" ","").split('%')[0].trim())|0)*windowWidth)/100;
+            }
             width = defaultDecimal(width);
             if(width <COLUMN_WIDTH/2){
                 width = COLUMN_WIDTH;
@@ -2129,6 +2136,9 @@ export default class CommonDatagridComponent extends AppComponent {
             } else if(type =="select_country" || type =='selectcountry'){
                 width = Math.max(width,90);
             }
+            if(typeof restCol.minWidth =='number'){
+                width = Math.max(width,minWidth);
+            }
             totalWidths +=width;
             widths[header.field] = width;
             const colProps = {id,key}
@@ -2139,6 +2149,7 @@ export default class CommonDatagridComponent extends AppComponent {
             }
             const title = header.text = header.text || header.label || header.title||header.field
             visibleColumnsNames[header.field] = visible ? true : false;
+           
             visibleColumns.push({
                 onPress : ()=>{
                     setTimeout(() => {

package/src/components/Datagrid/SWRDatagrid.js

@@ -49,7 +49,7 @@ export const setSessionData = (key,value)=>{
 
 
 
-export const timeout = 5000*60//*60;
+export const timeout = 5000*60;//5 minutes
 /***@see : https://swr.vercel.app/docs/api */
 
 export const getSWROptions = ()=>{
@@ -170,11 +170,13 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
     const canHandleLimit = handleQueryLimit !== false ? true : false;
     const limitRef = React.useRef(!canHandleLimit ?0 : defaultNumber(getSessionData("limit"),500));
     const isInitializedRef = React.useRef(false);
-    testID = defaultStr(testID,"RNSWRDatagridComponent")
-    const {error, isValidating,isLoading,refresh} = useSWR(fetchPath,{
+    testID = defaultStr(testID,"RNSWRDatagridComponent");
+    const isLoadingRef = React.useRef(true);
+    const {error, isValidating,isLoading:customIsLoading,refresh} = useSWR(fetchPath,{
         fetcher : (url,opts)=>{
             if(!isInitializedRef.current) {
                 isFetchingRef.current = false;
+                isLoadingRef.current = false;
                 return;
             }
             opts = extendObj({},opts,fetchOptionsRef.current);
@@ -206,6 +208,7 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
                 url = setQueryParams(url,opts.queryParams);
                 return fetcher(url,opts).then(fetchCB).finally(()=>{
                     isFetchingRef.current = false;
+                    isLoadingRef.current = false;
                 });
             }
             const {url:fUrl,fetcher:cFetcher,...rest} = getFetcherOptions(url,opts);
@@ -219,22 +222,21 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
             ...defaultObj(appConfig.swr),
         },
     });
+    const isLoading = isLoadingRef.current  && customIsLoading || false;
     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'){
+        if(!isValidating && !customIsLoading && typeof cb =='function'){
             cb();
         }
-    },[isValidating,isLoading])
+    },[isValidating,customIsLoading])
     const doRefresh = (showProgress)=>{
         showProgressRef.current = showProgress ? typeof showProgress ==='boolean' : false;
         if(isFetchingRef.current) return;
-        refreshCBRef.current = ()=>{
-            //showProgressRef.current = false;
-        };
+        isLoadingRef.current = true;
         refresh();
     }
     const canPaginate = ()=>{
@@ -272,7 +274,7 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
         ///si le nombre total d'élements est inférieur au nombre limite alors le trie peut être fait localement
         return totalRef.current > limitRef.current && true || false;
     }
-    const loading = (isLoading|| isValidating);
+    const loading = (isLoadingRef.current && (isLoading|| isValidating));
     const pointerEvents = loading ?"node" : "auto";
     const itLimits = [{
         text : "Limite nbre elts par page",

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

@@ -34,6 +34,15 @@ const TableDataSelectField = React.forwardRef((_props,ref)=>{
     }
     fKeyTable = defaultObj(fKeyTable);
     foreignKeyTable = defaultStr(fKeyTable.tableName,fKeyTable.table,foreignKeyTable).trim().toUpperCase();
+    const sortColumn = defaultStr(fKeyTable.defaultSortColumn);
+    const sortDir = defaultStr(fKeyTable.defaultSortOrder).toLowerCase().trim();
+    const sort = {};
+    if(sortColumn){
+        sort.column = sortColumn;
+        if(sortDir =='asc' || sortDir =='desc'){
+            sort.dir = sortDir;
+        }
+    }
     const isMounted = React.useIsMounted();
     const showAdd = isFilter || !foreignKeyTable ? false : React.useRef(Auth.isTableDataAllowed({foreignKeyTable,action:'create'}) ? defaultVal(props.showAdd,props.showAddBtn,true) : false).current;
     const [state,setState] = React.useState({
@@ -44,6 +53,9 @@ const TableDataSelectField = React.forwardRef((_props,ref)=>{
     const cFetch = typeof customFetchItem =='function' && customFetchItem;
     const fetchItems = (opts)=>{
         opts.showError = false;
+        if(sortColumn){
+            opts.sort = sort;
+        }
         if(cFetch) return cFetch(queryPath,opts);
         if(queryPath){
             return fetch(queryPath,opts);

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

@@ -109,6 +109,7 @@ export const getFilterComponentProps = (_props)=>{
     } else if(isNonNullString(props.foreignKeyColumn) && isNonNullString(props.foreignKeyTable)) {
         component = Fields.SelectTableData;
         props.multiple = true;
+        type = "select";
     }else {
         const tt = type.replaceAll("_","").toLowerCase();
         if(React.isComponent(componentTypes[tt])){