@etsoo/materialui 1.2.56 → 1.2.58

package/lib/pages/ViewPage.d.ts

@@ -73,6 +73,10 @@ export interface ViewPageProps<T extends DataTypes.StringRecord> extends Omit<Co
      * Grid container reference
      */
     gridRef?: React.Ref<HTMLDivElement>;
+    /**
+     * Refresh seed
+     */
+    refreshSeed?: number;
 }
 /**
  * View page

package/lib/pages/ViewPage.js

@@ -78,7 +78,7 @@ function getItemField(field, data) {
  */
 export function ViewPage(props) {
     // Destruct
-    const { actions, children, fields, loadData, paddings = MUGlobal.pagePaddings, spacing = MUGlobal.half(MUGlobal.pagePaddings), supportRefresh = true, fabColumnDirection = true, fabTop = true, supportBack = true, pullToRefresh = true, gridRef, ...rest } = props;
+    const { actions, children, fields, loadData, paddings = MUGlobal.pagePaddings, spacing = MUGlobal.half(MUGlobal.pagePaddings), supportRefresh = true, fabColumnDirection = true, fabTop = true, supportBack = true, pullToRefresh = true, gridRef, refreshSeed = 0, ...rest } = props;
     // Data
     const [data, setData] = React.useState();
     // Labels
@@ -86,12 +86,18 @@ export function ViewPage(props) {
     // Container
     const pullContainer = "#page-container";
     // Load data
-    const refresh = async () => {
+    const refresh = React.useCallback(async () => {
         const result = await loadData();
         if (result == null)
             return;
         setData(result);
-    };
+    }, [loadData]);
+    React.useEffect(() => {
+        // Only refresh after the first data load
+        if (refreshSeed === 0 || data == null)
+            return;
+        refresh();
+    }, [refreshSeed]);
     return (React.createElement(CommonPage, { paddings: paddings, onRefresh: supportRefresh ? refresh : undefined, onUpdate: supportRefresh ? undefined : refresh, ...rest, scrollContainer: globalThis, fabColumnDirection: fabColumnDirection, fabTop: fabTop, supportBack: supportBack }, data == null ? (React.createElement(LinearProgress, null)) : (React.createElement(React.Fragment, null,
         React.createElement(Grid, { container: true, justifyContent: "left", spacing: spacing, className: "ET-ViewPage", ref: gridRef, sx: {
                 ".MuiTypography-subtitle2": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.2.56",
+  "version": "1.2.58",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -52,7 +52,7 @@
     "@emotion/styled": "^11.11.0",
     "@etsoo/appscript": "^1.4.19",
     "@etsoo/notificationbase": "^1.1.25",
-    "@etsoo/react": "^1.6.90",
+    "@etsoo/react": "^1.6.92",
     "@etsoo/shared": "^1.2.5",
     "@mui/icons-material": "^5.11.16",
     "@mui/material": "^5.13.5",

package/src/pages/ViewPage.tsx

@@ -115,6 +115,11 @@ export interface ViewPageProps<T extends DataTypes.StringRecord>
    * Grid container reference
    */
   gridRef?: React.Ref<HTMLDivElement>;
+
+  /**
+   * Refresh seed
+   */
+  refreshSeed?: number;
 }
 
 function formatItemData(fieldData: unknown): string | undefined {
@@ -214,6 +219,7 @@ export function ViewPage<T extends DataTypes.StringRecord>(
     supportBack = true,
     pullToRefresh = true,
     gridRef,
+    refreshSeed = 0,
     ...rest
   } = props;
 
@@ -227,11 +233,17 @@ export function ViewPage<T extends DataTypes.StringRecord>(
   const pullContainer = "#page-container";
 
   // Load data
-  const refresh = async () => {
+  const refresh = React.useCallback(async () => {
     const result = await loadData();
     if (result == null) return;
     setData(result);
-  };
+  }, [loadData]);
+
+  React.useEffect(() => {
+    // Only refresh after the first data load
+    if (refreshSeed === 0 || data == null) return;
+    refresh();
+  }, [refreshSeed]);
 
   return (
     <CommonPage