refactor: avatar_file_hash instead of avatar

This commit is contained in:
CrescentLeaf
2025-10-24 20:29:51 +08:00
parent bef6e88bf7
commit 72016c5da1
13 changed files with 40 additions and 28 deletions

View File

@@ -4,7 +4,7 @@ export default class Chat {
declare type: ChatType
declare id: string
declare title: string
declare avatar?: string
declare avatar_file_hash?: string
declare settings?: { [key: string]: unknown }
declare is_member: boolean

View File

@@ -2,5 +2,5 @@ export default class User {
declare id: string
declare username?: string
declare nickname: string
declare avatar?: string
declare avatar_file_hash?: string
}

View File

@@ -0,0 +1,3 @@
export default function getUrlForFileByHash(file_hash?: string, defaultUrl?: string) {
return file_hash ? "uploaded_files/" + file_hash: defaultUrl
}

View File

@@ -24,6 +24,7 @@ import AddContactDialog from './dialog/AddContactDialog.tsx'
import CreateGroupDialog from './dialog/CreateGroupDialog.tsx'
import UserProfileDialog from "./dialog/UserProfileDialog.tsx"
import DataCaches from "../api/DataCaches.ts"
import getUrlForFileByHash from "../getUrlForFileByHash.ts"
declare global {
namespace React {
@@ -160,7 +161,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={openMyProfileDialogButtonRef} />
<Avatar src={getUrlForFileByHash(myUserProfileCache?.avatar_file_hash)} 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>

View File

@@ -23,6 +23,7 @@ import AddContactDialog from './dialog/AddContactDialog.tsx'
import CreateGroupDialog from './dialog/CreateGroupDialog.tsx'
import UserProfileDialog from "./dialog/UserProfileDialog.tsx"
import DataCaches from "../api/DataCaches.ts"
import getUrlForFileByHash from "../getUrlForFileByHash.ts"
declare global {
namespace React {
@@ -200,7 +201,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={openMyProfileDialogButtonRef} />
<Avatar src={getUrlForFileByHash(myUserProfileCache?.avatar_file_hash)} text={myUserProfileCache?.nickname} avatarRef={openMyProfileDialogButtonRef} />
</mdui-button-icon>
</mdui-top-app-bar>
{
@@ -226,7 +227,7 @@ export default function AppMobile() {
<ContactsList
openChatInfoDialog={openChatInfoDialog}
addContactDialogRef={addContactDialogRef as any}
createGroupDialogRef={createGroupDialogRef}
createGroupDialogRef={createGroupDialogRef as any}
display={navigationItemSelected == "Contacts"} />
}
</div>

View File

@@ -11,6 +11,7 @@ import React from "react"
import isMobileUI from "../isMobileUI.ts"
import ReactJson from 'react-json-view'
import User from "../../api/client_data/User.ts"
import getUrlForFileByHash from "../../getUrlForFileByHash.ts"
interface Args extends React.HTMLAttributes<HTMLElement> {
userId: string
@@ -29,7 +30,7 @@ export default function Message({ userId, rawData, renderHTML, message, openUser
useAsyncEffect(async () => {
const user = await DataCaches.getUserProfile(userId)
setNickName(user.nickname)
setAvatarUrl(user?.avatar)
setAvatarUrl(getUrlForFileByHash(user?.avatar_file_hash))
}, [userId])
const dropDownRef = React.useRef<Dropdown>(null)
@@ -40,7 +41,7 @@ export default function Message({ userId, rawData, renderHTML, message, openUser
useEventListener(dropDownRef, 'closed', (e) => {
setDropDownOpen(false)
})
const [isDropDownOpen, setDropDownOpen] = React.useState(false)
return (
@@ -114,8 +115,11 @@ export default function Message({ userId, rawData, renderHTML, message, openUser
padding: "15px",
alignSelf: isAtRight ? "flex-end" : "flex-start",
}}>
<mdui-dialog close-on-overlay-click close-on-esc ref={messageJsonDialogRef}>
<ReactJson src={message} />
<mdui-dialog close-on-overlay-click close-on-esc fullscreen ref={messageJsonDialogRef}>
{
// @ts-ignore 这是可以正常工作的
<ReactJson src={message} />
}
</mdui-dialog>
<mdui-dropdown trigger="manual" ref={dropDownRef} open={isDropDownOpen}>
<span

View File

@@ -7,6 +7,7 @@ import { Dialog } from "mdui"
import Avatar from "../Avatar.tsx"
import { checkApiSuccessOrSncakbar } from "../snackbar.ts"
import User from "../../api/client_data/User.ts"
import getUrlForFileByHash from "../../getUrlForFileByHash.ts"
interface Args extends React.HTMLAttributes<HTMLElement> {
chat: Chat
@@ -36,7 +37,7 @@ export default function ChatInfoDialog({ chat, chatInfoDialogRef, openChatFragme
display: 'flex',
alignItems: 'center',
}}>
<Avatar src={chat?.avatar as string} text={chat?.nickname as string} style={{
<Avatar src={getUrlForFileByHash(chat?.avatar_file_hash as string)} text={chat?.nickname as string} style={{
width: '50px',
height: '50px',
}} />

View File

@@ -8,6 +8,7 @@ import * as CryptoJS from 'crypto-js'
import data from "../../Data.ts"
import Avatar from "../Avatar.tsx"
import User from "../../api/client_data/User.ts"
import getUrlForFileByHash from "../../getUrlForFileByHash.ts"
interface Refs {
myProfileDialogRef: React.MutableRefObject<Dialog>
@@ -50,7 +51,7 @@ export default function MyProfileDialog({
display: 'flex',
alignItems: 'center',
}}>
<Avatar src={user?.avatar} text={user?.nickname} style={{
<Avatar src={getUrlForFileByHash(user?.avatar_file_hash)} text={user?.nickname} style={{
width: '50px',
height: '50px',
}} />
@@ -111,7 +112,7 @@ export default function MyProfileDialog({
display: 'flex',
alignItems: 'center',
}}>
<Avatar src={user?.avatar} text={user?.nickname} avatarRef={editAvatarButtonRef} style={{
<Avatar src={getUrlForFileByHash(user?.avatar_file_hash)} text={user?.nickname} avatarRef={editAvatarButtonRef} style={{
width: '50px',
height: '50px',
}} />

View File

@@ -1,13 +1,12 @@
import * as React from 'react'
import { Button, Dialog, TextField, dialog } from "mdui"
import useEventListener from "../useEventListener.ts"
import { checkApiSuccessOrSncakbar, snackbar } from "../snackbar.ts"
import { Dialog } from "mdui"
import { checkApiSuccessOrSncakbar } from "../snackbar.ts"
import Client from "../../api/Client.ts"
import * as CryptoJS from 'crypto-js'
import data from "../../Data.ts"
import Avatar from "../Avatar.tsx"
import User from "../../api/client_data/User.ts"
import getUrlForFileByHash from "../../getUrlForFileByHash.ts"
interface Refs {
userProfileDialogRef: React.MutableRefObject<Dialog>
@@ -28,7 +27,7 @@ export default function UserProfileDialog({
display: 'flex',
alignItems: 'center',
}}>
<Avatar src={user?.avatar} text={user?.nickname} style={{
<Avatar src={getUrlForFileByHash(user?.avatar_file_hash)} text={user?.nickname} style={{
width: '50px',
height: '50px',
}} />

View File

@@ -1,4 +1,5 @@
import Chat from "../../api/client_data/Chat.ts"
import getUrlForFileByHash from "../../getUrlForFileByHash.ts"
import Avatar from "../Avatar.tsx"
import React from 'react'
@@ -8,7 +9,7 @@ interface Args extends React.HTMLAttributes<HTMLElement> {
}
export default function ContactsListItem({ contact, ...prop }: Args) {
const { id, title, avatar } = contact
const { id, title, avatar_file_hash } = contact
const ref = React.useRef<HTMLElement>(null)
return (
@@ -20,7 +21,7 @@ export default function ContactsListItem({ contact, ...prop }: Args) {
<span style={{
width: "100%",
}}>{title}</span>
<Avatar src={avatar as string} text={title} slot="icon" />
<Avatar src={getUrlForFileByHash(avatar_file_hash as string)} text={title} slot="icon" />
</mdui-list-item>
)
}

View File

@@ -2,6 +2,7 @@ import { $ } from "mdui/jq"
import RecentChat from "../../api/client_data/RecentChat.ts"
import Avatar from "../Avatar.tsx"
import React from 'react'
import getUrlForFileByHash from "../../getUrlForFileByHash.ts"
interface Args extends React.HTMLAttributes<HTMLElement> {
recentChat: RecentChat
@@ -10,7 +11,7 @@ interface Args extends React.HTMLAttributes<HTMLElement> {
}
export default function RecentsListItem({ recentChat, openChatFragment, active }: Args) {
const { id, title, avatar, content } = recentChat
const { id, title, avatar_file_hash, content } = recentChat
const itemRef = React.useRef<HTMLElement>(null)
React.useEffect(() => {
@@ -22,7 +23,7 @@ export default function RecentsListItem({ recentChat, openChatFragment, active }
marginBottom: '3px',
}} onClick={() => openChatFragment(id)} active={active} ref={itemRef}>
{title}
<Avatar src={avatar} text={title} slot="icon" />
<Avatar src={getUrlForFileByHash(avatar_file_hash as string)} text={title} slot="icon" />
<span slot="description"
style={{
width: "100%",