Merge branch 'main' into docs

package.json

@@ -1,23 +1,22 @@
 {
   "name": "@huolala-tech/page-spy-web",
-  "version": "1.3.3",
+  "version": "1.4.0",
   "description": "All-In-One Remote Debugging Tool",
   "homepage": "https://huolalatech.github.io/page-spy-web",
   "license": "MIT",
   "scripts": {
+    "postinstall": "bash scripts/public-files.sh",
     "start:doc": "vite --mode doc",
-    "prestart:client": "bash scripts/public-files.sh",
     "start:client": "vite --mode client",
     "start:server": "page-spy-api",
     "build:doc": "vite build --mode doc",
-    "prebuild:client": "bash scripts/public-files.sh",
     "build:client": "vite build --mode client",
     "preview": "vite preview",
     "lint": "eslint --ext .js,.jsx,.ts,.tsx ./src"
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.19.1",
-    "@huolala-tech/page-spy": "^1.3.1",
+    "@huolala-tech/page-spy": "^1.4.1",
     "@mdx-js/rollup": "^2.3.0",
     "@types/lodash-es": "^4.17.7",
     "@types/mdx": "^2.0.4",
@@ -46,7 +45,7 @@
   },
   "dependencies": {
     "@ant-design/icons": "^4.7.0",
-    "@huolala-tech/react-json-view": "^1.1.0",
+    "@huolala-tech/react-json-view": "^1.2.2",
     "@huolala-tech/request": "^1.1.2",
     "ahooks": "^3.1.9",
     "antd": "^5.2.1",

src/assets/locales/en.json

@@ -105,7 +105,10 @@
     "device": "Device"
   },
   "storage": {
-    "empty-detail": "Select one to preview its value"
+    "empty-detail": "Select one to preview its value",
+    "entries-be-modified": "Some entries have been modified",
+    "data-be-stale": "Data may be stale",
+    "total-entries": "Total entries"
   },
   "socket": {
     "client-name": "Client",

src/assets/locales/ja.json

@@ -105,7 +105,10 @@
     "device": "デバイス"
   },
   "storage": {
-    "empty-detail": "値を表示するアイテムを選択"
+    "empty-detail": "値を表示するアイテムを選択",
+    "entries-be-modified": "一部のエントリが変更されました",
+    "data-be-stale": "データが古くなっている可能性があります",
+    "total-entries": "合計エントリー"
   },
   "socket": {
     "client-name": "クライアント",

src/assets/locales/ko.json

@@ -105,7 +105,10 @@
     "device": "장치"
   },
   "storage": {
-    "empty-detail": "값을 볼 항목을 선택하십시오."
+    "empty-detail": "값을 볼 항목을 선택하십시오.",
+    "entries-be-modified": "일부 항목이 수정되었습니다",
+    "data-be-stale": "데이터가 오래되었을 수 있습니다",
+    "total-entries": "총 항목"
   },
   "socket": {
     "client-name": "클라이언트",

src/assets/locales/zh.json

@@ -105,7 +105,10 @@
     "device": "设备"
   },
   "storage": {
-    "empty-detail": "选择查看其中一项的值"
+    "empty-detail": "选择查看其中一项的值",
+    "entries-be-modified": "一些条目可能已经被修改",
+    "data-be-stale": "数据可能已经过时",
+    "total-entries": "总记录数"
   },
   "socket": {
     "client-name": "客户端",

src/pages/Devtools/ConnectStatus/index.tsx

@@ -6,6 +6,7 @@ import { ReactComponent as UserSvg } from '@/assets/image/user-1.svg';
 import Icon from '@ant-design/icons';
 import { useTranslation } from 'react-i18next';
 import { useSocketMessageStore } from '@/store/socket-message';
+import { CUSTOM_EVENT } from '@/store/socket-message/socket';
 
 interface ConnectionStatus {
   client?: SpySocket.Connection | null;
@@ -30,9 +31,9 @@ export const ConnectStatus = memo(() => {
       const { detail } = evt as CustomEvent<ConnectionStatus>;
       setConnections(detail);
     };
-    socket.addEventListener('connect-status', statusListener);
+    socket.addEventListener(CUSTOM_EVENT.ConnectStatus, statusListener);
     return () => {
-      socket.removeEventListener('connect-status', statusListener);
+      socket.removeEventListener(CUSTOM_EVENT.ConnectStatus, statusListener);
     };
   }, [socket]);
 

src/pages/Devtools/PagePanel/index.tsx

@@ -19,12 +19,6 @@ const PagePanel = () => {
   const [loading, setLoading] = useState(false);
   const frameRef = useRef<HTMLIFrameElement | null>(null);
 
-  useEffect(() => {
-    setLoading(true);
-    refresh('page');
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
   useEffect(() => {
     if (html) {
       const frameDocument = frameRef.current!.contentDocument;

src/pages/Devtools/StoragePanel/TableContent/index.less

@@ -0,0 +1,16 @@
+.database-info {
+  height: 100%;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  .database-table {
+    overflow: auto;
+    flex: 1;
+  }
+  .database-total-entries {
+    padding: 8px;
+    color: #666;
+    box-shadow: 0 -1px 1px 1px #eee;
+    z-index: 10;
+  }
+}