YourSelfHosted/memos
1
0
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-06-05 22:09:59 +02:00
Code Issues Packages Projects Releases Wiki Activity

chore: add user profile page (#2175)

Browse Source 
chore: some enhancements
This commit is contained in:
boojack
2023-08-25 23:10:51 +08:00
committed by GitHub
parent 8c312e647d
commit 4af0d03e93
18 changed files with 173 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
web/src/pages/UserProfile.tsx Normal file
View File

@ -0,0 +1,74 @@
import { useEffect } from "react";
import { toast } from "react-hot-toast";
import FloatingNavButton from "@/components/FloatingNavButton";
import MemoFilter from "@/components/MemoFilter";
import MemoList from "@/components/MemoList";
import UserAvatar from "@/components/UserAvatar";
import useLoading from "@/hooks/useLoading";
import { useGlobalStore, useUserStore } from "@/store/module";
import { useTranslate } from "@/utils/i18n";
const UserProfile = () => {
const t = useTranslate();
const globalStore = useGlobalStore();
const userStore = useUserStore();
const loadingState = useLoading();
const user = userStore.state.user;
useEffect(() => {
const currentUsername = userStore.getCurrentUsername();
userStore
.getUserByUsername(currentUsername)
.then(() => {
loadingState.setFinish();
})
.catch((error) => {
console.error(error);
toast.error(t("message.user-not-found"));
});
}, [userStore.getCurrentUsername()]);
useEffect(() => {
if (user?.setting.locale) {
globalStore.setLocale(user.setting.locale);
}
}, [user?.setting.locale]);
return (
<>
<section className="relative top-0 w-full min-h-full overflow-x-hidden bg-zinc-100 dark:bg-zinc-800">
<div className="relative w-full min-h-full mx-auto flex flex-col justify-start items-center">
{!loadingState.isLoading &&
(user ? (
<>
<main className="relative flex-grow max-w-2xl w-full min-h-full flex flex-col justify-start items-start px-4">
<div className="w-full flex flex-row justify-start items-start">
<div className="flex-grow shrink w-full">
<div className="w-full flex flex-col justify-start items-center py-8">
<UserAvatar className="w-16 h-auto mb-4 drop-shadow" avatarUrl={user?.avatarUrl} />
<div>
<p className="text-2xl font-bold text-gray-700 dark:text-gray-300">{user?.nickname}</p>
</div>
</div>
<div className="w-full h-auto flex flex-col justify-start items-start bg-zinc-100 dark:bg-zinc-800 rounded-lg">
<MemoFilter />
</div>
<MemoList />
</div>
</div>
</main>
</>
) : (
<>
<p>Not found</p>
</>
))}
</div>
</section>
<FloatingNavButton />
</>
);
};
export default UserProfile;