@etsoo/react 1.3.54 → 1.3.58

package/lib/app/ReactApp.d.ts

@@ -13,6 +13,7 @@ import { InputDialogProps } from './InputDialogProps';
  * Case 1: undefined, when refresh the whole page
  * Case 2: false, unauthorized
  * Case 3: true, authorized or considered as authorized (maynot, like token expiry)
+ * Case 4: property or properties changed
  * @param props Props
  * @returns Component
  */

package/lib/app/ReactApp.js

@@ -1,5 +1,4 @@
 import { CoreApp, createClient } from '@etsoo/appscript';
-import { Utils } from '@etsoo/shared';
 import React from 'react';
 import { NotifierMU } from '../mu/NotifierMU';
 import { ProgressCount } from '../mu/ProgressCount';
@@ -14,6 +13,7 @@ let globalApp;
  * Case 1: undefined, when refresh the whole page
  * Case 2: false, unauthorized
  * Case 3: true, authorized or considered as authorized (maynot, like token expiry)
+ * Case 4: property or properties changed
  * @param props Props
  * @returns Component
  */
@@ -24,24 +24,25 @@ export function ReactAppStateDetector(props) {
     const { state } = globalApp == null
         ? { state: {} }
         : React.useContext(globalApp.userState.context);
-    // Match fields
-    const changedFields = state.lastChangedFields;
-    let matchedFields;
-    if (targetFields == null || changedFields == null) {
-        matchedFields = changedFields;
-    }
-    else {
-        matchedFields = [];
-        targetFields.forEach((targetField) => {
-            if (changedFields.includes(targetField))
-                matchedFields === null || matchedFields === void 0 ? void 0 : matchedFields.push(targetField);
-        });
-    }
     // Ready
     React.useEffect(() => {
+        // Match fields
+        const changedFields = state.lastChangedFields;
+        let matchedFields;
+        if (targetFields == null || changedFields == null) {
+            matchedFields = changedFields;
+        }
+        else {
+            matchedFields = [];
+            targetFields.forEach((targetField) => {
+                if (changedFields.includes(targetField))
+                    matchedFields === null || matchedFields === void 0 ? void 0 : matchedFields.push(targetField);
+            });
+        }
+        console.log('ReactAppStateDetector', changedFields, targetFields, matchedFields);
         // Callback
         update(state.authorized, matchedFields);
-    }, [state.authorized, matchedFields]);
+    }, [state]);
     // return
     return React.createElement(React.Fragment);
 }
@@ -211,15 +212,10 @@ export class ReactApp extends CoreApp {
      * @param keep Keep in local storage or not
      */
     userLogin(user, refreshToken, keep) {
-        // Changed
-        const dataChanged = !this.authorized ||
-            this.userData == null ||
-            !Utils.objectEqual(this.userData, user, ['seconds', 'token']);
         // Super call, set token
         super.userLogin(user, refreshToken, keep);
         // Dispatch action
-        // Only when unauthorized or with changes except 'token' and 'seconds'
-        if (this.userStateDispatch != null && dataChanged)
+        if (this.userStateDispatch != null)
             this.userStateDispatch({
                 type: UserActionType.Login,
                 user

package/lib/states/UserState.js

@@ -67,7 +67,8 @@ export class UserState {
         this.provider = provider;
     }
     getChangedFields(input, init) {
-        return Utils.getDataChanges(input, init, [
+        return Utils.objectUpdated(input, init, [
+            'authorized',
             'seconds',
             'lastChangedFields'
         ]);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/react",
-    "version": "1.3.54",
+    "version": "1.3.58",
     "description": "TypeScript ReactJs framework",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -52,7 +52,7 @@
         "@emotion/styled": "^11.6.0",
         "@etsoo/appscript": "^1.1.79",
         "@etsoo/notificationbase": "^1.0.94",
-        "@etsoo/shared": "^1.0.76",
+        "@etsoo/shared": "^1.0.78",
         "@mui/icons-material": "^5.2.4",
         "@mui/material": "^5.2.4",
         "@reach/router": "^1.3.4",

package/src/app/ReactApp.ts

@@ -7,7 +7,7 @@ import {
     IUserData
 } from '@etsoo/appscript';
 import { NotificationRenderProps } from '@etsoo/notificationbase';
-import { DataTypes, Utils } from '@etsoo/shared';
+import { DataTypes } from '@etsoo/shared';
 import React from 'react';
 import { NotifierMU } from '../mu/NotifierMU';
 import { ProgressCount } from '../mu/ProgressCount';
@@ -37,6 +37,7 @@ let globalApp: IReactApp<IAppSettings, any, IPageData>;
  * Case 1: undefined, when refresh the whole page
  * Case 2: false, unauthorized
  * Case 3: true, authorized or considered as authorized (maynot, like token expiry)
+ * Case 4: property or properties changed
  * @param props Props
  * @returns Component
  */
@@ -52,24 +53,31 @@ export function ReactAppStateDetector(props: IStateProps) {
                   (globalApp.userState as UserState<IUser>).context
               );
 
-    // Match fields
-    const changedFields = state.lastChangedFields;
-    let matchedFields: string[] | undefined;
-    if (targetFields == null || changedFields == null) {
-        matchedFields = changedFields;
-    } else {
-        matchedFields = [];
-        targetFields.forEach((targetField) => {
-            if (changedFields.includes(targetField))
-                matchedFields?.push(targetField);
-        });
-    }
-
     // Ready
     React.useEffect(() => {
+        // Match fields
+        const changedFields = state.lastChangedFields;
+        let matchedFields: string[] | undefined;
+        if (targetFields == null || changedFields == null) {
+            matchedFields = changedFields;
+        } else {
+            matchedFields = [];
+            targetFields.forEach((targetField) => {
+                if (changedFields.includes(targetField))
+                    matchedFields?.push(targetField);
+            });
+        }
+
+        console.log(
+            'ReactAppStateDetector',
+            changedFields,
+            targetFields,
+            matchedFields
+        );
+
         // Callback
         update(state.authorized, matchedFields);
-    }, [state.authorized, matchedFields]);
+    }, [state]);
 
     // return
     return React.createElement(React.Fragment);
@@ -356,18 +364,11 @@ export class ReactApp<
         refreshToken: string,
         keep?: boolean
     ): void {
-        // Changed
-        const dataChanged =
-            !this.authorized ||
-            this.userData == null ||
-            !Utils.objectEqual(this.userData, user, ['seconds', 'token']);
-
         // Super call, set token
         super.userLogin(user, refreshToken, keep);
 
         // Dispatch action
-        // Only when unauthorized or with changes except 'token' and 'seconds'
-        if (this.userStateDispatch != null && dataChanged)
+        if (this.userStateDispatch != null)
             this.userStateDispatch({
                 type: UserActionType.Login,
                 user

package/src/states/UserState.ts

@@ -123,7 +123,8 @@ export class UserState<D extends IUser> {
     }
 
     private getChangedFields(input: {}, init: {}) {
-        return Utils.getDataChanges(input, init, [
+        return Utils.objectUpdated(input, init, [
+            'authorized',
             'seconds',
             'lastChangedFields'
         ]);