rename: (User -> My)ProfileDialog

2025-10-03 12:49:28 +08:00
parent 6c9ee005fd
commit 376177d78e
3 changed files with 50 additions and 55 deletions
--- a/client/ui/App.tsx
+++ b/client/ui/App.tsx
@@ -14,7 +14,7 @@ import { checkApiSuccessOrSncakbar } from "./snackbar.ts"

 import RegisterDialog from "./dialog/RegisterDialog.tsx"
 import LoginDialog from "./dialog/LoginDialog.tsx"
-import UserProfileDialog from "./dialog/UserProfileDialog.tsx"
+import MyProfileDialog from "./dialog/MyProfileDialog.tsx"
 import ContactsList from "./main/ContactsList.tsx"
 import RecentsList from "./main/RecentsList.tsx"
 import useAsyncEffect from "./useAsyncEffect.ts"
@@ -52,10 +52,10 @@ export default function App() {
    const registerInputNickNameRef = React.useRef<TextField>(null)
    const registerInputPasswordRef = React.useRef<TextField>(null)

-    const userProfileDialogRef = React.useRef<Dialog>(null)
-    const openMyUserProfileDialogButtonRef = React.useRef<HTMLElement>(null)
-    useEventListener(openMyUserProfileDialogButtonRef, 'click', (_event) => {
-        userProfileDialogRef.current!.open = true
+    const myProfileDialogRef = React.useRef<Dialog>(null)
+    const openMyProfileDialogButtonRef = React.useRef<HTMLElement>(null)
+    useEventListener(openMyProfileDialogButtonRef, 'click', (_event) => {
+        myProfileDialogRef.current!.open = true
    })
    
    const addContactDialogRef = React.useRef<Dialog>(null)
@@ -112,8 +112,8 @@ export default function App() {
                loginInputAccountRef={loginInputAccountRef}
                loginInputPasswordRef={loginInputPasswordRef} />

-            <UserProfileDialog
-                userProfileDialogRef={userProfileDialogRef as any}
+            <MyProfileDialog
+                myProfileDialogRef={myProfileDialogRef as any}
                user={myUserProfileCache} />

            <ChatInfoDialog
@@ -129,7 +129,7 @@ export default function App() {

            <mdui-navigation-rail contained value="Recents" ref={navigationRailRef}>
                <mdui-button-icon slot="top">
-                    <Avatar src={myUserProfileCache?.avatar} text={myUserProfileCache?.nickname} avatarRef={openMyUserProfileDialogButtonRef} />
+                    <Avatar src={myUserProfileCache?.avatar} text={myUserProfileCache?.nickname} avatarRef={openMyProfileDialogButtonRef} />
                </mdui-button-icon>

                <mdui-navigation-rail-item icon="watch_later--outlined" active-icon="watch_later--filled" value="Recents"></mdui-navigation-rail-item>
--- a/client/ui/AppMobile.tsx
+++ b/client/ui/AppMobile.tsx
@@ -13,7 +13,7 @@ import { checkApiSuccessOrSncakbar } from "./snackbar.ts"

 import RegisterDialog from "./dialog/RegisterDialog.tsx"
 import LoginDialog from "./dialog/LoginDialog.tsx"
-import UserProfileDialog from "./dialog/UserProfileDialog.tsx"
+import MyProfileDialog from "./dialog/MyProfileDialog.tsx"
 import ContactsList from "./main/ContactsList.tsx"
 import RecentsList from "./main/RecentsList.tsx"
 import useAsyncEffect from "./useAsyncEffect.ts"
@@ -51,10 +51,10 @@ export default function AppMobile() {
    const registerInputNickNameRef = React.useRef<TextField>(null)
    const registerInputPasswordRef = React.useRef<TextField>(null)

-    const userProfileDialogRef = React.useRef<Dialog>(null)
-    const openMyUserProfileDialogButtonRef = React.useRef<HTMLElement>(null)
-    useEventListener(openMyUserProfileDialogButtonRef, 'click', (_event) => {
-        userProfileDialogRef.current!.open = true
+    const myProfileDialogRef = React.useRef<Dialog>(null)
+    const openMyProfileDialogButtonRef = React.useRef<HTMLElement>(null)
+    useEventListener(openMyProfileDialogButtonRef, 'click', (_event) => {
+        myProfileDialogRef.current!.open = true
    })
    
    const addContactDialogRef = React.useRef<Dialog>(null)
@@ -131,8 +131,8 @@ export default function AppMobile() {
                loginInputAccountRef={loginInputAccountRef}
                loginInputPasswordRef={loginInputPasswordRef} />

-            <UserProfileDialog
-                userProfileDialogRef={userProfileDialogRef as any}
+            <MyProfileDialog
+                myProfileDialogRef={myProfileDialogRef as any}
                user={myUserProfileCache} />

            <ChatInfoDialog
@@ -164,7 +164,7 @@ export default function AppMobile() {
                }}></div>
                <mdui-button-icon icon="settings"></mdui-button-icon>
                <mdui-button-icon>
-                    <Avatar src={myUserProfileCache?.avatar} text={myUserProfileCache?.nickname} avatarRef={openMyUserProfileDialogButtonRef} />
+                    <Avatar src={myUserProfileCache?.avatar} text={myUserProfileCache?.nickname} avatarRef={openMyProfileDialogButtonRef} />
                </mdui-button-icon>
            </mdui-top-app-bar>
            {
--- a/client/ui/dialog/UserProfileDialog.tsx
+++ b/client/ui/dialog/UserProfileDialog.tsx
@@ -10,12 +10,12 @@ import Avatar from "../Avatar.tsx"
 import User from "../../api/client_data/User.ts"

 interface Refs {
-    userProfileDialogRef: React.MutableRefObject<Dialog>
+    myProfileDialogRef: React.MutableRefObject<Dialog>
    user: User
 }

-export default function UserProfileDialog({
-    userProfileDialogRef,
+export default function MyProfileDialog({
+    myProfileDialogRef,
    user
 }: Refs) {
    const isMySelf = Client.myUserProfile?.id == user?.id
@@ -47,7 +47,7 @@ export default function UserProfileDialog({
        {
            // 公用 - 資料卡
        }
-        <mdui-dialog close-on-overlay-click close-on-esc ref={userProfileDialogRef}>
+        <mdui-dialog close-on-overlay-click close-on-esc ref={myProfileDialogRef}>
            <div style={{
                display: 'flex',
                alignItems: 'center',
@@ -66,41 +66,36 @@ export default function UserProfileDialog({
            }}></mdui-divider>

            <mdui-list>
-                {!isMySelf && <mdui-list-item icon="edit" rounded>編輯聯絡人訊息</mdui-list-item>}
-                {
-                    isMySelf && <>
-                        <mdui-list-item icon="edit" rounded onClick={() => userProfileEditDialogRef.current!.open = true}>編輯資料</mdui-list-item>
-                        {/*
-                        <mdui-list-item icon="settings" rounded>賬號設定</mdui-list-item>
-                        <mdui-list-item icon="lock" rounded>隱私設定</mdui-list-item>
-                        */}
-                        <mdui-divider style={{
-                            marginTop: "10px",
-                            marginBottom: "10px",
-                        }}></mdui-divider>
-                        <mdui-list-item icon="logout" rounded onClick={() => dialog({
-                            headline: "退出登錄",
-                            description: "確定要退出登錄嗎? (若您的賬號未設定 用戶名, 請無務必複製 用戶 ID, 以免丟失賬號!)",
-                            actions: [
-                                {
-                                    text: "取消",
-                                    onClick: () => {
-                                        return true
-                                    },
-                                },
-                                {
-                                    text: "確定",
-                                    onClick: () => {
-                                        data.access_token = ''
-                                        data.apply()
-                                        location.reload()
-                                        return true
-                                    },
-                                }
-                            ],
-                        })}>退出登錄</mdui-list-item>
-                    </>
-                }
+                <mdui-list-item icon="edit" rounded onClick={() => userProfileEditDialogRef.current!.open = true}>編輯資料</mdui-list-item>
+                {/*
+                <mdui-list-item icon="settings" rounded>賬號設定</mdui-list-item>
+                <mdui-list-item icon="lock" rounded>隱私設定</mdui-list-item>
+                */}
+                <mdui-divider style={{
+                    marginTop: "10px",
+                    marginBottom: "10px",
+                }}></mdui-divider>
+                <mdui-list-item icon="logout" rounded onClick={() => dialog({
+                    headline: "退出登錄",
+                    description: "確定要退出登錄嗎? (若您的賬號未設定 用戶名, 請無務必複製 用戶 ID, 以免丟失賬號!)",
+                    actions: [
+                        {
+                            text: "取消",
+                            onClick: () => {
+                                return true
+                            },
+                        },
+                        {
+                            text: "確定",
+                            onClick: () => {
+                                data.access_token = ''
+                                data.apply()
+                                location.reload()
+                                return true
+                            },
+                        }
+                    ],
+                })}>退出登錄</mdui-list-item>
            </mdui-list>
        </mdui-dialog>
        {