@etsoo/react 1.4.82 → 1.4.86

package/lib/app/ServiceApp.d.ts

@@ -34,8 +34,9 @@ export declare class ServiceApp<U extends IServiceUser = IServiceUser, P extends
     constructor(settings: S, name: string);
     /**
      * Go to the login page
+     * @param tryLogin Try to login again
      */
-    toLoginPage(): void;
+    toLoginPage(tryLogin?: boolean): void;
     /**
      * Refresh token
      * @param props Props

package/lib/app/ServiceApp.js

@@ -41,8 +41,9 @@ export class ServiceApp extends ReactApp {
     }
     /**
      * Go to the login page
+     * @param tryLogin Try to login again
      */
-    toLoginPage() {
+    toLoginPage(tryLogin) {
         const coreUrl = this.settings.webUrl;
         window.location.href =
             coreUrl +
@@ -51,7 +52,8 @@ export class ServiceApp extends ReactApp {
                 '&' +
                 DomUtils.CultureField +
                 '=' +
-                this.culture;
+                this.culture +
+                (tryLogin ? '' : '&tryLogin=false');
     }
     /**
      * Refresh token

package/lib/mu/AuditDisplay.js

@@ -1,5 +1,5 @@
 import { Utils } from '@etsoo/shared';
-import { Button, Divider, Table, TableBody, TableCell, TableHead, TableRow, useTheme } from '@mui/material';
+import { Button, Divider, Table, TableBody, TableCell, TableHead, TableRow, Typography, useTheme } from '@mui/material';
 import React from 'react';
 import { globalApp, NotificationMessageType } from '..';
 import { ListMoreDisplay } from './ListMoreDisplay';
@@ -32,6 +32,8 @@ const formatValue = (value) => {
 export function AuditDisplay(props) {
     // Theme
     const theme = useTheme();
+    // Label
+    const dataComparisonLabel = getLabel('dataComparison');
     // Show data comparison
     const showDataComparison = (data) => {
         if (typeof globalApp === 'undefined')
@@ -55,24 +57,28 @@ export function AuditDisplay(props) {
                 React.createElement(TableCell, null, getLabel(row.field)),
                 React.createElement(TableCell, { align: "right" }, formatValue(row.oldValue)),
                 React.createElement(TableCell, { align: "right" }, formatValue(row.newValue))))))));
-        globalApp.notifier.alert(undefined, undefined, NotificationMessageType.Info, { fullScreen: globalApp.smDown, inputs });
+        globalApp.notifier.alert([undefined, dataComparisonLabel], undefined, NotificationMessageType.Info, { fullScreen: globalApp.smDown, inputs });
     };
     // Destruct
     const { getItemStyle = (index, theme) => ({
-        padding: theme.spacing(1),
+        padding: [theme.spacing(1.5), theme.spacing(1)].join(' '),
         background: index % 2 === 0
             ? theme.palette.grey[100]
             : theme.palette.grey[50]
     }), itemRenderer = (data) => {
         return (React.createElement(React.Fragment, null,
-            formatDate(data.creation) +
+            data.changes != null && (React.createElement(Button, { variant: "outlined", size: "small", onClick: () => showDataComparison(data.changes), sx: {
+                    marginLeft: theme.spacing(1),
+                    marginTop: theme.spacing(-0.5),
+                    float: 'right'
+                } }, dataComparisonLabel)),
+            React.createElement(Typography, null, formatDate(data.creation) +
                 ', [' +
                 getLabel(data.action) +
                 '], ' +
-                data.user,
-            data.changes != null && (React.createElement(Button, { variant: "outlined", size: "small", onClick: () => showDataComparison(data.changes), sx: { marginLeft: theme.spacing(1) } }, getLabel('dataComparison')))));
+                data.user)));
     }, headerTitle = (React.createElement(React.Fragment, null,
-        getLabel('audits'),
+        React.createElement(Typography, null, getLabel('audits')),
         React.createElement(Divider, null))), ...rest } = props;
     // Layout
     return (React.createElement(ListMoreDisplay, { headerTitle: headerTitle, ...rest }, (data, index) => (React.createElement("div", { key: data.id, style: getItemStyle(index, theme) }, itemRenderer(data, index)))));

package/lib/mu/pages/ViewPage.js

@@ -18,6 +18,7 @@ function getItemField(field, data) {
     var _a, _b, _c;
     // Item data and label
     let itemData, itemLabel, gridProps = {};
+    let xs = 6;
     if (Array.isArray(field)) {
         const [fieldData, fieldType, renderProps] = field;
         itemData = GridDataFormat(data[fieldData], fieldType, renderProps);
@@ -25,11 +26,13 @@ function getItemField(field, data) {
     }
     else if (typeof field === 'object') {
         // Destruct
-        const { data: fieldData, dataType, label: fieldLabel, renderProps, singleRow = false, ...rest } = field;
+        const { data: fieldData, dataType, label: fieldLabel, renderProps, singleRow, ...rest } = field;
         gridProps = {
             ...rest,
             ...(singleRow && { xs: 12, sm: 12, md: 12, lg: 12, xl: 12 })
         };
+        if (singleRow === false)
+            xs = 12;
         // Field data
         if (typeof fieldData === 'function')
             itemData = fieldData(data);
@@ -50,7 +53,7 @@ function getItemField(field, data) {
     return [
         itemData,
         itemLabel,
-        { xs: 12, sm: 6, md: 6, lg: 4, xl: 3, ...gridProps }
+        { xs, sm: 6, md: 6, lg: 4, xl: 3, ...gridProps }
     ];
 }
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/react",
-    "version": "1.4.82",
+    "version": "1.4.86",
     "description": "TypeScript ReactJs framework",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -50,8 +50,8 @@
         "@emotion/react": "^11.7.1",
         "@emotion/style": "^0.8.0",
         "@emotion/styled": "^11.6.0",
-        "@etsoo/appscript": "^1.2.31",
-        "@etsoo/notificationbase": "^1.1.0",
+        "@etsoo/appscript": "^1.2.34",
+        "@etsoo/notificationbase": "^1.1.1",
         "@etsoo/shared": "^1.1.9",
         "@mui/icons-material": "^5.3.1",
         "@mui/material": "^5.4.0",

package/src/app/ServiceApp.ts

@@ -69,8 +69,9 @@ export class ServiceApp<
 
     /**
      * Go to the login page
+     * @param tryLogin Try to login again
      */
-    override toLoginPage() {
+    override toLoginPage(tryLogin?: boolean) {
         const coreUrl = this.settings.webUrl;
         window.location.href =
             coreUrl +
@@ -79,7 +80,8 @@ export class ServiceApp<
             '&' +
             DomUtils.CultureField +
             '=' +
-            this.culture;
+            this.culture +
+            (tryLogin ? '' : '&tryLogin=false');
     }
 
     /**

package/src/mu/AuditDisplay.tsx

@@ -8,6 +8,7 @@ import {
     TableHead,
     TableRow,
     Theme,
+    Typography,
     useTheme
 } from '@mui/material';
 import React, { CSSProperties } from 'react';
@@ -78,6 +79,9 @@ export function AuditDisplay(props: AuditDisplayProps) {
     // Theme
     const theme = useTheme();
 
+    // Label
+    const dataComparisonLabel = getLabel('dataComparison');
+
     // Show data comparison
     const showDataComparison = (data: AuditLineUpdateData) => {
         if (typeof globalApp === 'undefined') return;
@@ -123,7 +127,7 @@ export function AuditDisplay(props: AuditDisplayProps) {
         );
 
         globalApp.notifier.alert(
-            undefined,
+            [undefined, dataComparisonLabel],
             undefined,
             NotificationMessageType.Info,
             { fullScreen: globalApp.smDown, inputs }
@@ -133,7 +137,7 @@ export function AuditDisplay(props: AuditDisplayProps) {
     // Destruct
     const {
         getItemStyle = (index, theme) => ({
-            padding: theme.spacing(1),
+            padding: [theme.spacing(1.5), theme.spacing(1)].join(' '),
             background:
                 index % 2 === 0
                     ? theme.palette.grey[100]
@@ -142,27 +146,33 @@ export function AuditDisplay(props: AuditDisplayProps) {
         itemRenderer = (data) => {
             return (
                 <React.Fragment>
-                    {formatDate(data.creation) +
-                        ', [' +
-                        getLabel(data.action) +
-                        '], ' +
-                        data.user}
                     {data.changes != null && (
                         <Button
                             variant="outlined"
                             size="small"
                             onClick={() => showDataComparison(data.changes!)}
-                            sx={{ marginLeft: theme.spacing(1) }}
+                            sx={{
+                                marginLeft: theme.spacing(1),
+                                marginTop: theme.spacing(-0.5),
+                                float: 'right'
+                            }}
                         >
-                            {getLabel('dataComparison')}
+                            {dataComparisonLabel}
                         </Button>
                     )}
+                    <Typography>
+                        {formatDate(data.creation) +
+                            ', [' +
+                            getLabel(data.action) +
+                            '], ' +
+                            data.user}
+                    </Typography>
                 </React.Fragment>
             );
         },
         headerTitle = (
             <React.Fragment>
-                {getLabel('audits')}
+                <Typography>{getLabel('audits')}</Typography>
                 <Divider />
             </React.Fragment>
         ),

package/src/mu/pages/ViewPage.tsx

@@ -103,6 +103,8 @@ function getItemField<T>(
         itemLabel: React.ReactNode,
         gridProps: GridProps = {};
 
+    let xs = 6;
+
     if (Array.isArray(field)) {
         const [fieldData, fieldType, renderProps] = field;
         itemData = GridDataFormat(data[fieldData], fieldType, renderProps);
@@ -114,7 +116,7 @@ function getItemField<T>(
             dataType,
             label: fieldLabel,
             renderProps,
-            singleRow = false,
+            singleRow,
             ...rest
         } = field;
 
@@ -123,6 +125,8 @@ function getItemField<T>(
             ...(singleRow && { xs: 12, sm: 12, md: 12, lg: 12, xl: 12 })
         };
 
+        if (singleRow === false) xs = 12;
+
         // Field data
         if (typeof fieldData === 'function') itemData = fieldData(data);
         else if (dataType == null) itemData = formatItemData(data[fieldData]);
@@ -144,7 +148,7 @@ function getItemField<T>(
     return [
         itemData,
         itemLabel,
-        { xs: 12, sm: 6, md: 6, lg: 4, xl: 3, ...gridProps }
+        { xs, sm: 6, md: 6, lg: 4, xl: 3, ...gridProps }
     ];
 }