@fto-consult/expo-ui 5.7.8 → 5.7.10

package/package.json

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

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

@@ -152,6 +152,9 @@ Object.map(displayTypes,(c,k)=>{
 const dataSourceArgs = {};
 export const footerFieldName = "dgrid-fters-fields";
 
+const checkPerm = (perm,args)=>{
+    return typeof perm ==='function'? perm(args) : isNonNullString(perm) ? Auth.isAllowedFromStr(perm) : typeof perm =='boolean'? perm : true;
+}
 
 /*****
  * 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 
@@ -165,9 +168,10 @@ export default class CommonDatagridComponent extends AppComponent {
         let {
             data,
             selectedRows,
-            chartAllowedPerm,
-            exportToPDFAllowedPerm,
-            exportToExcelAllowedPerm,
+            renderChartIsAllowed,
+            exportToPDFIsAllowed,
+            exportToExcelIsAllowed,
+            renderSectionListIsAllowed,
             ...rest
         } = props;
         if(this.bindResizeEvents()){
@@ -198,9 +202,11 @@ export default class CommonDatagridComponent extends AppComponent {
         });
         const disTypes = {};
         let hasFoundDisplayTypes = false;
-        const perm = isNonNullString(chartAllowedPerm)? Auth.isAllowedFromStr(chartAllowedPerm) : true;
-        const ePDFIsAllowed = isNonNullString(exportToPDFAllowedPerm)? Auth.isAllowedFromStr(exportToPDFAllowedPerm) : true;
-        const eExcelISAllowed = isNonNullString(exportToExcelAllowedPerm)? Auth.isAllowedFromStr(exportToExcelAllowedPerm) : true;
+        const pArgs = {context:this,data,props:this.props}
+        const perm = checkPerm(renderChartIsAllowed,pArgs)
+        const ePDFIsAllowed = checkPerm(exportToPDFIsAllowed,pArgs);
+        const eExcelISAllowed = checkPerm(exportToExcelIsAllowed,pArgs);
+        const renderSectionListIsAllowedP = checkPerm(renderSectionListIsAllowed,pArgs);
         Object.map(this.props.displayTypes,(dType,v)=>{
             if(isNonNullString(dType)){
                 dType = dType.toLowerCase().trim();
@@ -247,6 +253,7 @@ export default class CommonDatagridComponent extends AppComponent {
             isChartAllowed : {value : perm},
             isExcellExportAllowed : {value:eExcelISAllowed},
             isPDFExportAllowed : {value: ePDFIsAllowed},
+            renderSectionListIsAllowed : {value:renderSectionListIsAllowedP},
             currentFilteringColumns : {value:{}},
             emptySectionListHeaderValue : {value : uniqid("empty-section-list-header-val").toUpperCase()},
             getSectionListHeaderProp : {value : typeof this.props.getSectionListHeader =='function'? this.props.getSectionListHeader : undefined},
@@ -2367,6 +2374,7 @@ export default class CommonDatagridComponent extends AppComponent {
    }
    /*** permet d'effectuer le rendu des colonnes groupable dans le menu item */
    renderSectionListMenu(){
+        if(!this.renderSectionListIsAllowed) return null;
         const m = Array.isArray(this.preparedColumns?.sectionListColumnsMenuItems)? this.preparedColumns?.sectionListColumnsMenuItems : [];
         const mm = [];
         Object.map(m,(_)=>{
@@ -2744,7 +2752,7 @@ export default class CommonDatagridComponent extends AppComponent {
                 if(!isObj(d) || (hasLocalFilter && this.doLocalFilter({rowData:d,rowIndex:i}) === false)){
                     return;
                 }
-                if(hasSectionColumns){
+                if(hasSectionColumns  && this.renderSectionListIsAllowed){
                     let sHeader = this.getSectionListHeader({config,data:d,columnsLength : sectionListColumnsSize,fieldsSize:sectionListColumnsSize,sectionListColumnsLength:sectionListColumnsSize,sectionListColumnsSize,allData:data,rowData:d,index:i,rowIndex,context:this,columns,fields:columns});
                     if(sHeader === false) return;//on omet la donnée si la fonction de récupération de son header retourne false
                     if(!isNonNullString(sHeader) || sHeader.toLowerCase().trim() =="undefined"){
@@ -3995,11 +4003,28 @@ CommonDatagridComponent.propTypes = {
         sectionListHeadersSeries : PropTypes.arrayOf(PropTypes.string),
     }),
     /*** la permission autorisée pour l'export en pdf */
-    exportToPDFAllowedPerm : PropTypes.string,
+    exportToPDFIsAllowed : PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.func,
+        PropTypes.bool,
+    ]),
     /*** la permission autorisée pour l'export en excel*/
-    exportToExcelAllowedPerm : PropTypes.string,
+    exportToExcelIsAllowed : PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.func,
+        PropTypes.bool,
+    ]),
+    renderSectionListIsAllowed : PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.func,
+        PropTypes.bool,
+    ]),
     /*** la permission que doit avoir l'utilisateur pour pouvoir visualiser les graphes à partir du diagrame */
-    chartAllowedPerm : PropTypes.string,
+    renderChartIsAllowed : PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.func,
+        PropTypes.bool,
+    ]),
     displayType : chartDisplayType,
     /*** les types d'afichates supportés par l'application */
     displayTypes : PropTypes.arrayOf(chartDisplayType),

package/src/components/PhoneInput/index.js

@@ -66,10 +66,10 @@ export default function PhoneInputComponent(props){
     contentContainerProps.style = [styles.inputContainer,contentContainerProps.style];
     const ref = React.useRef(null);
     const [state,setState] = React.useState({
-        visible : false,
         ...prepareState({defaultValue,country})
-    })
-    const prevVisible = React.usePrevious(state.visible);
+    });
+    const [visible,setVisible] = React.useState(false);
+    const prevVisible = React.usePrevious(visible);
     label = defaultVal(label,text);
     React.useEffect(()=>{
         React.setRef(ref,ref.current,setRef);
@@ -82,8 +82,8 @@ export default function PhoneInputComponent(props){
         }
     },[defaultValue,country])
     const onPressFlag = (e)=>{
-        if(!state.visible){
-            setState({...state,visible:true})
+        if(!visible){
+            setVisible(true);
         }
     }
     inputProps = defaultObj(inputProps);
@@ -131,12 +131,17 @@ export default function PhoneInputComponent(props){
     return <SelectCountry
         label = {label}
         controlled = {true}
-        visible = {state.visible}
+        visible = {visible}
         defaultValue = {state.country}
         testID = {testID+"_SelectCountry"}
         onDismiss = {({value},force) =>{
-            if(force !== true && value === state.country && state.visible == prevVisible) return;
-            setState({...state,...prepareState({country:value,defaultValue:state.country==value?state.defaultValue:""}),visible:false})
+            if(force !== true && value === state.country && visible == prevVisible) return;
+            if(visible){
+                setVisible(false);
+            }
+        }}
+        onChange = {({value})=>{
+            setState({...state,...prepareState({country:value,defaultValue:state.country==value?state.defaultValue:""})});
         }}
         anchor = {
             <>

package/src/components/SimpleSelect/index.js

@@ -16,13 +16,15 @@ import { matchOperators,getSearchTimeout,canAutoFocusSearchField} from "$ecompon
 import Dialog from "$ecomponents/Dialog";
 
 const  SimpleSelect = React.forwardRef((props,ref)=>{
-    let {style : customStyle,onMount,mode,showSearch,anchorContainerProps,renderText,contentContainerProps,withCheckedIcon,testID,selectionColor,dialogProps,onShow,anchor,onUnmont,controlled,onDismiss,visible:controlledVisible,selectedColor,inputProps,itemProps,itemContainerProps,label,listProps,editable,readOnly,text,filter,renderItem,itemValue,getItemValue,defaultValue,items:menuItems,onPress,onChange,disabled,...rest} = props;
+    let {style : customStyle,onMount,mode,showSearch,anchorContainerProps,renderText,contentContainerProps,withCheckedIcon,testID,selectionColor,dialogProps,onShow,anchor,onUnmont,controlled:cr,onDismiss,visible:controlledVisible,selectedColor,inputProps,itemProps,itemContainerProps,label,listProps,editable,readOnly,text,filter,renderItem,itemValue,getItemValue,defaultValue,items:menuItems,onPress,onChange,disabled,...rest} = props;
     const flattenStyle = StyleSheet.flatten(customStyle) || {};
+    const controlledRef = React.useRef(typeof controlledVisible ==='boolean'? true : false);
+    const controlled = controlledRef.current;
     const [layout,setLayout] = React.useState({
         height: 0,
         width: 0,
     });
-    const [visible,setVisible] = React.useState(controlled?controlledVisible:false)
+    const [visible,setVisible] = controlled ? [controlledVisible] : React.useState(controlled?controlledVisible:false);
     const [value,setValue] = React.useState(defaultValue !== undefined? defaultValue:undefined);
     contentContainerProps = defaultObj(contentContainerProps);
     const prevLayout = React.usePrevious(layout);
@@ -94,13 +96,12 @@ const  SimpleSelect = React.forwardRef((props,ref)=>{
         if(update !== true && compare(value,node.value)) return;
         selectedRef.current = node;
         if(update === true){
+            setValue(node.value);
             if(controlled && onDismiss){
                 if(onDismiss({visible,value,items,defaultValue},defaultObj(selectedRef.current)) === false) return;
             }
-            setValue(node.value);
-            const vv = controlled?undefined:false;
-            if(typeof vv =='boolean' && vv !==visible){
-                setVisible(vv);
+            if(!controlled && visible){
+                setVisible(false);
             }
         }
     }