You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
memos/web/src/pages/Home.tsx

60 lines
1.7 KiB
TypeScript

import { useEffect } from "react";
import { useTranslation } from "react-i18next";
import { useLocation } from "react-router-dom";
import { useGlobalStore, useUserStore } from "../store/module";
import toastHelper from "../components/Toast";
import Header from "../components/Header";
import MemoEditor from "../components/MemoEditor";
import MemoFilter from "../components/MemoFilter";
import MemoList from "../components/MemoList";
import UpdateVersionBanner from "../components/UpdateVersionBanner";
import MobileHeader from "../components/MobileHeader";
import HomeSidebar from "../components/HomeSidebar";
4 years ago
import "../less/home.less";
function Home() {
const { t } = useTranslation();
const location = useLocation();
const globalStore = useGlobalStore();
const userStore = useUserStore();
const user = userStore.state.user;
4 years ago
useEffect(() => {
const { owner } = userStore.getState();
if (userStore.isVisitorMode()) {
if (!owner) {
toastHelper.error(t("message.user-not-found"));
}
}
}, [location]);
4 years ago
useEffect(() => {
if (user?.setting.locale) {
globalStore.setLocale(user.setting.locale);
}
}, [user?.setting.locale]);
4 years ago
return (
<section className="page-wrapper home">
<div className="banner-wrapper">
<UpdateVersionBanner />
</div>
<div className="page-container">
<Header />
<main className="memos-wrapper">
<MobileHeader />
<div className="memos-editor-wrapper">
{!userStore.isVisitorMode() && <MemoEditor />}
<MemoFilter />
</div>
<MemoList />
</main>
{!userStore.isVisitorMode() && <HomeSidebar />}
</div>
</section>
4 years ago
);
}
export default Home;