@etsoo/react 1.2.66 → 1.2.70

package/lib/app/ReactApp.d.ts

@@ -82,11 +82,6 @@ export declare abstract class ReactApp<S extends IAppSettings, D extends IUser,
         culture: string;
         currency: string;
     };
-    /**
-     * Try login
-     * Will update user state with UserActionType.Unauthorized
-     */
-    tryLogin(): Promise<boolean>;
     /**
      * Set page data
      * @param data Page data
@@ -115,7 +110,12 @@ export declare abstract class ReactApp<S extends IAppSettings, D extends IUser,
      */
     userLogin(user: IUserData, refreshToken?: string, keep?: boolean): void;
     /**
-     * User logout extended
+     * User logout
+     * @param clearToken Clear refresh token or not
+     */
+    userLogout(clearToken?: boolean): void;
+    /**
+     * User unauthorized
      */
-    userLogout(): void;
+    userUnauthorized(): void;
 }

package/lib/app/ReactApp.js

@@ -73,21 +73,6 @@ export class ReactApp extends CoreApp {
     getMoneyFormatProps() {
         return { culture: this.culture, currency: this.currency };
     }
-    /**
-     * Try login
-     * Will update user state with UserActionType.Unauthorized
-     */
-    async tryLogin() {
-        const result = await super.tryLogin();
-        if (result && this.userStateDispatch != null) {
-            // There is delay during state update
-            // Not a good idea to try login multiple times with API calls
-            this.userStateDispatch({
-                type: UserActionType.Unauthorized
-            });
-        }
-        return result;
-    }
     /**
      * Set page data
      * @param data Page data
@@ -153,15 +138,30 @@ export class ReactApp extends CoreApp {
             });
     }
     /**
-     * User logout extended
+     * User logout
+     * @param clearToken Clear refresh token or not
      */
-    userLogout() {
+    userLogout(clearToken = true) {
+        // Super call
+        super.userLogout(clearToken);
         // Dispatch action
         if (this.userStateDispatch != null)
             this.userStateDispatch({
                 type: UserActionType.Logout
             });
+    }
+    /**
+     * User unauthorized
+     */
+    userUnauthorized() {
         // Super call
-        super.userLogout();
+        super.userUnauthorized();
+        if (this.userStateDispatch != null) {
+            // There is delay during state update
+            // Not a good idea to try login multiple times with API calls
+            this.userStateDispatch({
+                type: UserActionType.Unauthorized
+            });
+        }
     }
 }

package/lib/mu/TabBox.d.ts

@@ -17,14 +17,18 @@ export interface TabBoxPanel extends Omit<TabProps, 'value' | 'children'> {
  * Tabs with box props
  */
 export interface TabBoxPros extends BoxProps {
-    /**
-     * Root props
-     */
-    root?: BoxProps;
     /**
      * Container props
      */
     container?: Omit<TabsProps, 'value'>;
+    /**
+     * Add a hidden input and its name
+     */
+    inputName?: string;
+    /**
+     * Root props
+     */
+    root?: BoxProps;
     /**
      * Tabs
      */

package/lib/mu/TabBox.js

@@ -7,17 +7,18 @@ import React from 'react';
  */
 export function TabBox(props) {
     // Destruct
-    const { root, container = {}, tabs } = props;
+    const { inputName, root, container = {}, tabs } = props;
     const { onChange, ...rest } = container;
     // State
     const [value, setValue] = React.useState(0);
     // Layout
     return (React.createElement(React.Fragment, null,
+        inputName && (React.createElement("input", { type: "hidden", name: inputName, value: value })),
         React.createElement(Box, { ...root },
             React.createElement(Tabs, { value: value, onChange: (event, newValue) => {
                     setValue(newValue);
                     if (onChange)
                         onChange(event, newValue);
-                }, ...rest }, tabs.map(({ children, panel, ...tabRest }, index) => (React.createElement(Tab, { value: index, ...tabRest }))))),
-        tabs.map(({ children, panel }, index) => (React.createElement(Box, { hidden: value !== index, ...panel }, children)))));
+                }, ...rest }, tabs.map(({ children, panel, ...tabRest }, index) => (React.createElement(Tab, { key: index, value: index, ...tabRest }))))),
+        tabs.map(({ children, panel }, index) => (React.createElement(Box, { key: index, hidden: value !== index, ...panel }, children)))));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/react",
-    "version": "1.2.66",
+    "version": "1.2.70",
     "description": "TypeScript ReactJs framework",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -50,9 +50,9 @@
         "@emotion/react": "^11.5.0",
         "@emotion/style": "^0.8.0",
         "@emotion/styled": "^11.3.0",
-        "@etsoo/appscript": "^1.1.19",
-        "@etsoo/notificationbase": "^1.0.88",
-        "@etsoo/shared": "^1.0.57",
+        "@etsoo/appscript": "^1.1.21",
+        "@etsoo/notificationbase": "^1.0.89",
+        "@etsoo/shared": "^1.0.58",
         "@mui/icons-material": "^5.0.4",
         "@mui/material": "^5.0.4",
         "@reach/router": "^1.3.4",

package/src/app/ReactApp.ts

@@ -150,22 +150,6 @@ export abstract class ReactApp<
         return { culture: this.culture, currency: this.currency };
     }
 
-    /**
-     * Try login
-     * Will update user state with UserActionType.Unauthorized
-     */
-    override async tryLogin() {
-        const result = await super.tryLogin();
-        if (result && this.userStateDispatch != null) {
-            // There is delay during state update
-            // Not a good idea to try login multiple times with API calls
-            this.userStateDispatch({
-                type: UserActionType.Unauthorized
-            });
-        }
-        return result;
-    }
-
     /**
      * Set page data
      * @param data Page data
@@ -229,7 +213,11 @@ export abstract class ReactApp<
      * @param refreshToken Refresh token
      * @param keep Keep in local storage or not
      */
-    userLogin(user: IUserData, refreshToken?: string, keep?: boolean): void {
+    override userLogin(
+        user: IUserData,
+        refreshToken?: string,
+        keep?: boolean
+    ): void {
         // Changed
         const dataChanged =
             !this.authorized ||
@@ -249,16 +237,33 @@ export abstract class ReactApp<
     }
 
     /**
-     * User logout extended
+     * User logout
+     * @param clearToken Clear refresh token or not
      */
-    userLogout(): void {
+    override userLogout(clearToken: boolean = true): void {
+        // Super call
+        super.userLogout(clearToken);
+
         // Dispatch action
         if (this.userStateDispatch != null)
             this.userStateDispatch({
                 type: UserActionType.Logout
             });
+    }
 
+    /**
+     * User unauthorized
+     */
+    override userUnauthorized() {
         // Super call
-        super.userLogout();
+        super.userUnauthorized();
+
+        if (this.userStateDispatch != null) {
+            // There is delay during state update
+            // Not a good idea to try login multiple times with API calls
+            this.userStateDispatch({
+                type: UserActionType.Unauthorized
+            });
+        }
     }
 }

package/src/mu/TabBox.tsx

@@ -21,14 +21,19 @@ export interface TabBoxPanel extends Omit<TabProps, 'value' | 'children'> {
  */
 export interface TabBoxPros extends BoxProps {
     /**
-     * Root props
+     * Container props
      */
-    root?: BoxProps;
+    container?: Omit<TabsProps, 'value'>;
 
     /**
-     * Container props
+     * Add a hidden input and its name
      */
-    container?: Omit<TabsProps, 'value'>;
+    inputName?: string;
+
+    /**
+     * Root props
+     */
+    root?: BoxProps;
 
     /**
      * Tabs
@@ -43,7 +48,7 @@ export interface TabBoxPros extends BoxProps {
  */
 export function TabBox(props: TabBoxPros) {
     // Destruct
-    const { root, container = {}, tabs } = props;
+    const { inputName, root, container = {}, tabs } = props;
     const { onChange, ...rest } = container;
 
     // State
@@ -52,6 +57,9 @@ export function TabBox(props: TabBoxPros) {
     // Layout
     return (
         <React.Fragment>
+            {inputName && (
+                <input type="hidden" name={inputName} value={value} />
+            )}
             <Box {...root}>
                 <Tabs
                     value={value}
@@ -62,12 +70,12 @@ export function TabBox(props: TabBoxPros) {
                     {...rest}
                 >
                     {tabs.map(({ children, panel, ...tabRest }, index) => (
-                        <Tab value={index} {...tabRest} />
+                        <Tab key={index} value={index} {...tabRest} />
                     ))}
                 </Tabs>
             </Box>
             {tabs.map(({ children, panel }, index) => (
-                <Box hidden={value !== index} {...panel}>
+                <Box key={index} hidden={value !== index} {...panel}>
                     {children}
                 </Box>
             ))}