diff --git a/client/shared/i18n/langs/en-US/translation.json b/client/shared/i18n/langs/en-US/translation.json
index 3fb02c9c4c7..7833045fe14 100644
--- a/client/shared/i18n/langs/en-US/translation.json
+++ b/client/shared/i18n/langs/en-US/translation.json
@@ -99,6 +99,7 @@
"k4539164b": "The OTP code is 6 digits",
"k45e2f71f": "Temporary users cannot verify email address, please claim account first",
"k4603baea": "Create Group Panel",
+ "k465636d6": "Loading webview...",
"k473d1bbf": "Builtin Email",
"k47489688": "Group Service",
"k48a38bc1": "Group not found",
diff --git a/client/shared/i18n/langs/zh-CN/translation.json b/client/shared/i18n/langs/zh-CN/translation.json
index 254b9e35fcf..59115597040 100644
--- a/client/shared/i18n/langs/zh-CN/translation.json
+++ b/client/shared/i18n/langs/zh-CN/translation.json
@@ -99,6 +99,7 @@
"k4539164b": "校验码为6位",
"k45e2f71f": "临时用户无法认证邮箱, 请先认领账号",
"k4603baea": "创建群组面板",
+ "k465636d6": "加载网页中...",
"k473d1bbf": "内置邮箱",
"k47489688": "群组服务",
"k48a38bc1": "群组不存在",
diff --git a/client/web/plugins/com.msgbyte.offline-icons/src/icons.json b/client/web/plugins/com.msgbyte.offline-icons/src/icons.json
index a12c32d4b08..ab07b3f72bc 100644
--- a/client/web/plugins/com.msgbyte.offline-icons/src/icons.json
+++ b/client/web/plugins/com.msgbyte.offline-icons/src/icons.json
@@ -70,6 +70,18 @@
"cog": {
"body": ""
},
+ "plus-circle-outline": {
+ "body": ""
+ },
+ "cloud-upload": {
+ "body": ""
+ },
+ "emoticon-happy-outline": {
+ "body": ""
+ },
+ "send-circle-outline": {
+ "body": ""
+ },
"pound": {
"body": ""
},
@@ -91,18 +103,6 @@
"file-question-outline": {
"body": ""
},
- "plus-circle-outline": {
- "body": ""
- },
- "cloud-upload": {
- "body": ""
- },
- "emoticon-happy-outline": {
- "body": ""
- },
- "send-circle-outline": {
- "body": ""
- },
"email-edit-outline": {
"body": ""
},
@@ -115,15 +115,15 @@
"magnify": {
"body": ""
},
+ "account-supervisor-outline": {
+ "body": ""
+ },
"dock-window": {
"body": ""
},
"account-multiple-plus-outline": {
"body": ""
},
- "account-supervisor-outline": {
- "body": ""
- },
"message-badge-outline": {
"body": ""
},
@@ -160,12 +160,12 @@
"puzzle": {
"body": ""
},
- "video-box": {
- "body": ""
- },
"compass": {
"body": ""
},
+ "video-box": {
+ "body": ""
+ },
"checkbox-marked-outline": {
"body": ""
},
diff --git a/client/web/src/components/Loading.tsx b/client/web/src/components/Loading.tsx
index 7f6c28167c1..b2403cc8503 100644
--- a/client/web/src/components/Loading.tsx
+++ b/client/web/src/components/Loading.tsx
@@ -7,9 +7,10 @@ export interface LoadingProps {
className?: string;
style?: React.CSSProperties;
children?: React.ReactNode;
+ tip?: string;
}
export const Loading: React.FC = React.memo((props) => {
- const { spinning = false, className, style } = props;
+ const { spinning = false, className, style, tip } = props;
return (
@@ -22,7 +23,7 @@ export const Loading: React.FC = React.memo((props) => {
}
)}
>
-
+
{props.children}
diff --git a/client/web/src/components/Webview.tsx b/client/web/src/components/Webview.tsx
index 7b42933aa65..cd2b0e451d7 100644
--- a/client/web/src/components/Webview.tsx
+++ b/client/web/src/components/Webview.tsx
@@ -1,5 +1,7 @@
-import React from 'react';
+import React, { useEffect, useRef, useState } from 'react';
+import { t } from 'tailchat-shared';
import { withKeepAliveOverlay } from './KeepAliveOverlay';
+import { Loading } from './Loading';
interface WebviewProps {
className?: string;
@@ -11,7 +13,29 @@ interface WebviewProps {
* 网页渲染容器
*/
export const Webview: React.FC = (props) => {
- return ;
+ const ref = useRef(null);
+ const [spinning, setSpinning] = useState(true);
+
+ useEffect(() => {
+ const callback = () => {
+ setSpinning(false);
+ };
+ ref.current?.addEventListener('load', callback);
+
+ return () => {
+ ref.current?.removeEventListener('load', callback);
+ };
+ }, []);
+
+ return (
+
+
+
+ );
};
Webview.displayName = 'Webview';