@fto-consult/expo-ui 2.29.0 → 2.29.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "2.29.0",
+  "version": "2.29.2",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -61,7 +61,7 @@
     "@emotion/native": "^11.10.0",
     "@expo/html-elements": "^0.2.0",
     "@expo/vector-icons": "^13.0.0",
-    "@fto-consult/common": "^1.25.4",
+    "@fto-consult/common": "^1.25.9",
     "@gorhom/portal": "^1.0.14",
     "@react-native-async-storage/async-storage": "~1.17.3",
     "@react-native-community/datetimepicker": "6.5.2",

package/src/components/Datagrid/Accordion/index.js

@@ -356,8 +356,8 @@ const DatagridFactory = (Factory)=>{
             }
 
             const titleProps = isObj(accordionProps.titleProps)? Object.assign({},accordionProps.titleProps) : {};
-            const titleStyle = Object.assign({},StyleSheet.flatten(titleProps.style));
-            const titleColor = Colors.isValid(titleStyle.color)? titleStyle.color : Colors.isValid(titleProps.color)? titleProps.color : Colors.setAlpha(theme.colors.text,0.87);
+            const labelStyle = Object.assign({},StyleSheet.flatten(titleProps.style));
+            const titleColor = Colors.isValid(labelStyle.color)? labelStyle.color : Colors.isValid(titleProps.color)? titleProps.color : Colors.setAlpha(theme.colors.text,0.87);
             this.accordionTitleProps = {
                 selectable: true,
                 ellipsizeMode: EllipsizeMode.tail,
@@ -388,8 +388,6 @@ const DatagridFactory = (Factory)=>{
     
             filter = defaultFunc(filter,x=>true);
             const showFooters = this.canShowFooters();
-            const showFilters = this.canShowFilters();
-            let max = this.getMaxSelectableRows();
             let restItems = [];
             
             /*if(max && this.isSelectableMultiple()){
@@ -473,6 +471,7 @@ const DatagridFactory = (Factory)=>{
                                 }}
                             />
                         </View> : null}
+                        
                         {this.isFilterable() ? <View>
                             <FiltersAccordionComponent
                                 testID={testID+"_HeaderFilters"}
@@ -485,9 +484,6 @@ const DatagridFactory = (Factory)=>{
                                 context = {this}
                             />
                         </View> : null}
-                        {this.renderSectionListMenu()}
-                        {this.renderDisplayTypes()}
-                        {this.renderAggregatorFunctionsMenu()}
                         <View pointerEvents={pointerEvents} testID={testID+"_HeaderPagination"} style = {styles.paginationItem}>
                             <Menu 
                                 testID={testID+"_HeaderMenus"}
@@ -524,9 +520,10 @@ const DatagridFactory = (Factory)=>{
                                 ]}
                             />
                         </View>
-                        <View>
-                            <RenderType />
-                        </View>
+                        {this.renderSectionListMenu()}
+                        {this.renderDisplayTypes()}
+                        {this.renderAggregatorFunctionsMenu()}
+                        {!canRenderChart ? <RenderType /> : null}
                     
                             {/*exportable && exportTableProps.pdf && (exportTableProps.pdf.footer) ? (
                                 <td  width="40px">

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

@@ -228,7 +228,6 @@ export default class CommonDatagridComponent extends AppComponent {
             sectionListHeaderFooters : {value : {}},
             sectionListDataSize : {value : {current : 0}},
             enablePointerEventsRef : {value : {current:false}},
-            configureSectionListSelectedValues : {value : {}},
             chartIdPrefix : {value : uniqid("datagrid-chart-id-prefix")},
             ///la liste des fonctions d'aggregations supportées
             aggregatorFunctions : {value : extendAggreagatorFunctions(this.props.aggregatorFunctions)},
@@ -238,7 +237,15 @@ export default class CommonDatagridComponent extends AppComponent {
         }) 
         const sessionAggregator = defaultStr(this.getSessionData("aggregatorFunction")).trim();
         const aggregatorProps = defaultStr(this.props.aggregatorFunction).trim();
-        this.state.aggregatorFunction= aggregatorProps && isValidAggregator(this.aggregatorFunctions[aggregatorProps]) ? aggregatorProps ? isNonNullString(sessionAggregator) && isValidAggregator(this.aggregatorFunctions[sessionAggregator]) : sessionAggregator : Object.keys(this.aggregatorFunctions)[0];
+        let aggregatorFunction = null;
+        if(aggregatorProps && isValidAggregator(this.aggregatorFunctions[aggregatorProps])){
+            aggregatorFunction = aggregatorProps;
+        } else if(isNonNullString(sessionAggregator) && isValidAggregator(this.aggregatorFunctions[sessionAggregator])){
+            aggregatorFunction = sessionAggregator;
+        } else {
+            aggregatorFunction = Object.keys(this.aggregatorFunctions)[0];
+        }
+        this.state.aggregatorFunction= aggregatorFunction;
         this.isLoading = this.isLoading.bind(this);
         this.getProgressBar = this.getProgressBar.bind(this);
         this.sortRef.current.dir = defaultStr(this.sortRef.current.dir,this.sortRef.current.column == "date"?"desc":'asc')
@@ -1134,10 +1141,25 @@ export default class CommonDatagridComponent extends AppComponent {
         const type = defaultStr(column.jsType,column.type).toLowerCase();
         return type.contains("date") || type =='time' ? true : false;
    }
+   setConfiguratedValue(key,value){
+        const val = this.getConfiguratedValues();
+        if(isObj(key)){
+            extendObj(val,key);
+        } else if(isNonNullString(key)){
+            val[key] = value;
+        }
+        return this.setSessionData("configuratedSectionListColumns",val);
+   }
+   getConfiguratedValues(key){
+     this.configureSectionListSelectedValues = defaultObj(this.getSessionData("configuratedSectionListColumns"),this.configureSectionListSelectedValues);
+     if(isNonNullString(key)) return this.configureSectionListSelectedValues[key];
+     return this.configureSectionListSelectedValues;
+   }
    /*** configure la  */
    configureSectionListColumn(column,toggleSectionList){
         if(!this.isSectionListColumnConfigurable(column)) return Promise.reject({message : 'type de colonne invalide, impossible de configurer la colonne, pour permettre qu\elle soit ajoutée dans les colonnes de groupe du tableau'});
-        const format = defaultStr(defaultObj(this.configureSectionListSelectedValues[column.field]).format,column.format,"dd/mm/yyyy")
+        const confV = defaultObj(this.getConfiguratedValues(column.field));
+        const format = defaultStr(confV.format,column.format,"dd/mm/yyyy")
         return new Promise((resolve,reject)=>{
             DialogProvider.open({
                 title : 'Format de date',
@@ -1159,7 +1181,7 @@ export default class CommonDatagridComponent extends AppComponent {
                     icon : "check",
                     onPress : ({data})=>{
                         column.format = data.dateFormat;
-                        this.configureSectionListSelectedValues[column.field] = {format:column.format}
+                        this.setConfiguratedValue(column.field,{format:column.format}); 
                         DialogProvider.close();
                         setTimeout(()=>{
                             resolve(column);
@@ -1473,7 +1495,7 @@ export default class CommonDatagridComponent extends AppComponent {
         });
         if(m.length <= 1 || !activeType) return null;
         if(!isMobileOrTabletMedia()){
-            m.unshift({text:"Type d'affichage des données",divider:true});
+            m.unshift({text:"Type d'affichage des données",divider:true,textBold:true});
         }
         return <Menu
             title = "Type d'affichage"
@@ -1805,6 +1827,7 @@ export default class CommonDatagridComponent extends AppComponent {
                     icon : "group",
                     closeOnPress : false,
                     divider : true,
+                    style : theme.styles.bold,
                 },
                 this.canDisplayOnlySectionListHeaders() && {
                     text : "Afficher uniquement totaux",
@@ -1996,7 +2019,7 @@ export default class CommonDatagridComponent extends AppComponent {
                          width,
                          type,
                          ...sListColumns[field],
-                         ...defaultObj(this.configureSectionListSelectedValues[field]),
+                         ...defaultObj(this.getConfiguratedValues(field)),
                     };///les colonnes de sections
                     this.sectionListColumnsSize.current++;
                 }
@@ -2089,19 +2112,19 @@ export default class CommonDatagridComponent extends AppComponent {
         this.hasFoundSectionData.current = false;
         this.sectionListDataSize.current = 0;
         const isSList = this.isSectionList(sectionListColumns);
-        if(this.canAutoSort() && isNonNullString(this.sortRef.current.column)){
-            if(isObj(this.state.columns) && this.state.columns[this.sortRef.current.column]){
-                let field = this.state.columns[this.sortRef.current.column];
-                const sortConfig = Object.assign({},this.sortRef.current);
-                sortConfig.getItem = (item,columnName,{getItem})=>{
-                    if(isObj(item) && (field.type =='decimal' || field.type =="number")){
-                        const v = item[columnName];
-                        return isDecimal(v)? v : isNonNullString(v)? parseDecimal(v) : 0;
-                    }
-                    return getItem(item,columnName);
+        const sortingField = isNonNullString(this.sortRef.current.column) && isObj(this.state.columns) && this.state.columns[this.sortRef.current.column] || {};
+        const hasSortField = Object.size(sortingField,true);
+        if(this.canAutoSort() && isNonNullString(this.sortRef.current.column) && hasSortField){
+            let field = sortingField;
+            const sortConfig = Object.assign({},this.sortRef.current);
+            sortConfig.getItem = (item,columnName,{getItem})=>{
+                if(isObj(item) && (field.type =='decimal' || field.type =="number")){
+                    const v = item[columnName];
+                    return isDecimal(v)? v : isNonNullString(v)? parseDecimal(v) : 0;
                 }
-                data = sortBy(data,sortConfig);//on trie tout d'abord les données
+                return getItem(item,columnName);
             }
+            data = sortBy(data,sortConfig);//on trie tout d'abord les données
         }
         if(hasLocalFilter || !isArr || canUpdateFooters || isSList) {
             if(canUpdateFooters){
@@ -2123,7 +2146,7 @@ export default class CommonDatagridComponent extends AppComponent {
                 }
             }
             let currentSectionListFooter = null;
-            const sectionListData = this.sectionListData;//l'ensemble des données de sectionList
+            let sectionListData = {};//l'ensemble des données de sectionList
             Object.map(data,(d,i,rowIndex)=>{
                 if(!isObj(d) || (hasLocalFilter && this.doLocalFilter({rowData:d,rowIndex:i}) === false)){
                     return;
@@ -2149,6 +2172,7 @@ export default class CommonDatagridComponent extends AppComponent {
                     }
                     this.hasFoundSectionData.current = true;
                 }
+
                 if(canUpdateFooters){
                     const result = [this.___evaluatedFootersValues]
                     if(currentSectionListFooter){
@@ -2161,6 +2185,12 @@ export default class CommonDatagridComponent extends AppComponent {
                 newData.push(d);
                 //push(d,i);
             });
+            if(this.hasFoundSectionData.current && hasSortField && defaultStr(sortingField.type).toLowerCase().contains("date")){
+                DateLib.sort(Object.keys(sectionListData)).map((k)=>{
+                    this.sectionListData[k] = sectionListData[k];
+                    return k;
+                });
+            }
             data = newData;
         } 
         this.INITIAL_STATE.data = data;
@@ -2276,7 +2306,7 @@ export default class CommonDatagridComponent extends AppComponent {
                 });
             }
         }
-        return <View testID={testID+"_ContentContainer"}  style={[theme.styles.w100,isA && theme.styles.ph2,theme.styles.justifyContentCenter,theme.styles.alignItemsCenter,theme.styles.pb1,!cells && theme.styles.ml1,theme.styles.mr1,cStyle]}>
+        return <View testID={testID+"_ContentContainer"}  style={[theme.styles.w100,isA ? theme.styles.ph2 : theme.styles.pt1,theme.styles.justifyContentCenter,theme.styles.alignItemsCenter,theme.styles.pb1,!cells && theme.styles.ml1,theme.styles.mr1,cStyle]}>
             <Label testID={testID+"_Label"} splitText numberOfLines={3} textBold style={[theme.styles.w100,{color:theme.colors.primaryOnSurface,fontSize:isA?15 :16},lStyle]}>{label}</Label>
             {cells ? <View testID={testID+"_TableRow"} style = {[theme.styles.w100,theme.styles.row,theme.styles.alignItemsFlexStart,isA && theme.styles.mt05]}
             >{cells}</View> : null}

package/src/components/Datagrid/SWRDatagrid.js

@@ -89,12 +89,22 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
         handleQueryLimit,
         onFetchData,
         beforeFetchData,
+        sort,
+        defaultSortColumn,
         ...rest
     } = props;
     rest = defaultObj(rest);
     rest.exportTableProps = defaultObj(rest.exportTableProps)
     const firstPage = 1;
     const tableName = defaultStr(table.tableName,table.table).trim().toUpperCase();
+    defaultSortColumn = defaultStr(defaultSortColumn,table.defaultSortColumn);
+    sort = isNonNullString(sort)? {column:sort} : isObj(sort)?sort : {};
+    const sColumn = defaultStr(sort.column,defaultSortColumn);
+    if(sColumn){
+        sort.column = sColumn;
+    } else {
+        delete sort.column;
+    }
     canMakePhoneCall = defaultBool(canMakePhoneCall,table.canMakePhoneCall);
     makePhoneCallProps = defaultObj(makePhoneCallProps,rest.makePhoneCallProps,table.makePhoneCallProps);
     const isExportable = !!Auth.isTableDataAllowed({table:tableName,action:'export'});
@@ -272,6 +282,7 @@ const SWRDatagridComponent = React.forwardRef((props,ref)=>{
             testID = {testID}
             {...defaultObj(table.datagrid)} 
             {...rest}
+            sort = {sort}
             onSort = {({sort})=>{
                 if(!canSortRemotely()) return;
                 fetchOptionsRef.current.sort = sort;
@@ -423,6 +434,8 @@ SWRDatagridComponent.displayName = "SWRDatagridComponent";
 
 SWRDatagridComponent.propTypes = {
     ...Datagrid.propTypes,
+    /*** le nom de la colonne de trie par défaut */
+    defaultSortColumn : PropTypes.string,
     fetchPath : PropTypes.string,
     fetchPathKey : PropTypes.string,//la clé permettant de suffixer l'url fecherPath afin que ce ne soit pas unique pour certaines tables
     fetchData : PropTypes.func,

package/src/components/Datagrid/Table/index.js

@@ -315,7 +315,7 @@ const DatagridFactory = (Factory)=>{
                             />
                         </View>
                         {/*filters !== false && <td  className="datagrid-local-filter-wrapper" ><LocalFilter title = {this.props.title} fields ={this.state.columns} onChange={this.onLocalFiltersChange.bind(this)}/></td>*/}
-                        <RenderType/>
+                        {!canRenderChart && <RenderType/> || null}
                     </View>
                 </ScrollView>
             </View> : null;

package/src/components/Filter/index.js

@@ -532,6 +532,7 @@ export default class Filter extends AppComponent {
                       text : !isMob ? 'Options' : ("Options de filtre ["+label+"]"),
                       icon : 'cog',
                       items : options,
+                      style : styles.bold,
                     },
                     {divider:true},
                      ...[hasFilterVal /*&& type !== 'select'*/? 

package/src/components/Menu/Item.js

@@ -25,6 +25,8 @@ const MenuItemComponent = React.forwardRef(({
   disabled,
   onPress,
   style,
+  textBold,
+  bold,
   contentStyle,
   testID,
   labelStyle,
@@ -34,9 +36,11 @@ const MenuItemComponent = React.forwardRef(({
   isBottomSheetItem,
   accessibilityLabel,
   right,
+  labelProps,
   contentContainerProps,
   ...rest
 },ref) => {
+  labelProps = defaultObj(labelProps);
   contentContainerProps = defaultObj(contentContainerProps);
   title = defaultVal(label,text,title);
   const disabledColor = color(theme.dark ? white : black)
@@ -52,7 +56,10 @@ const MenuItemComponent = React.forwardRef(({
     ? disabledColor
     : color(theme.colors.text).alpha(theme.ALPHA).rgb().string();
   iconProps = defaultObj(iconProps);
-  labelStyle = Object.assign({},StyleSheet.flatten(labelStyle));
+  labelStyle = Object.assign({},StyleSheet.flatten([labelProps.style,labelStyle]));
+  if(textBold || bold){
+    labelStyle.fontWeight = "bold";
+  }
   style = Object.assign({},StyleSheet.flatten(style));
 
   if(Colors.isValid(labelStyle.color)){
@@ -107,6 +114,7 @@ const MenuItemComponent = React.forwardRef(({
             selectable={false}
             numberOfLines={1}
             ellipsizeMode = {"tail"}
+            {...labelProps}
             style={[styles.title, { color: titleColor }, labelStyle,styles.noMargin,!right ? maxWidthTextStyle : null]}
           >
             {title}

package/src/components/Menu/utils.js

@@ -61,7 +61,7 @@ export const renderItems = (props)=>{
                 index,
                 _index,
             };
-           itProps.titleStyle = [StyleSheet.flatten(itemProps.style),StyleSheet.flatten(rest.style),cursorPointer];
+           itProps.labelStyle = StyleSheet.flatten([itemProps.style,rest.style,cursorPointer]);
             
            if(typeof renderItem ==='function'){
                _render = renderItem(itProps);

package/src/layouts/DatabaseStatistics/index.js

@@ -7,7 +7,7 @@ import theme from "$theme";
 import PropTypes from "prop-types";
 
 export const title = 'Statistiques en BD';
-export default function DatabaseStatisticScreen ({withScreen,title:customTitle,contentProps,containerProps,tables,Component,...props}){
+export default function DatabaseStatisticScreen ({withScreen,tableFilter,fetchCount,title:customTitle,contentProps,containerProps,tables,Component,...props}){
         Component = React.isComponent(Component)? Component : Grid;
         containerProps = defaultObj(containerProps);
         const title = containerProps.title = defaultStr(containerProps.title,DatabaseStatisticScreen.title);
@@ -18,8 +18,9 @@ export default function DatabaseStatisticScreen ({withScreen,title:customTitle,c
             containerProps.phoneSize = defaultNumber(containerProps.phoneSize,4);
         }
         let content = [];
+        tableFilter = typeof tableFilter ==="function"? tableFilter : x=>true;
         Object.map(tables,(table,index,suffix)=>{
-            if(isObj(table) && table.databaseStatistic !== false && table.databaseStatistics !== false){
+            if(isObj(table) && table.databaseStatistic !== false && table.databaseStatistics !== false && tableFilter(table) !== false){
                 content.push(
                     <Cell elevation = {5} withSurface mobileSize={12} desktopSize={3} tabletSize={4} {...contentProps} key = {index} >
                         <DatabaseStatistic
@@ -27,7 +28,10 @@ export default function DatabaseStatisticScreen ({withScreen,title:customTitle,c
                             key = {index}
                             table = {table}
                             index = {suffix}
-                            title = {table.text|| table.title}
+                            title = {defaultStr(table.text,table.label,table.title)}
+                            fetchCount = {table.fetchCount|| typeof fetchCount =='function'? (a,b)=>{
+                                return fetchCount({table,tableName:defaultStr(table.tableName,table.table)})
+                            }:undefined}
                         ></DatabaseStatistic>
                     </Cell>
                 )
@@ -50,5 +54,7 @@ DatabaseStatisticScreen.propTypes = {
     tables : PropTypes.oneOfType([
         PropTypes.arrayOf(PropTypes.object),
         PropTypes.objectOf(PropTypes.object)
-    ]).isRequired
+    ]).isRequired,
+    /*** la fonction de filtre utilisée pour filtrer les table devant figurer sur le databaseStatistics */
+    tableFilter : PropTypes.func,
 }