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

56 lines
1.5 KiB
TypeScript

import { useEffect } from "react";
4 years ago
import { locationService, userService } from "../services";
import Sidebar from "../components/Sidebar";
import useLoading from "../hooks/useLoading";
import MemosHeader from "../components/MemosHeader";
import MemoEditor from "../components/MemoEditor";
import MemoFilter from "../components/MemoFilter";
import MemoList from "../components/MemoList";
4 years ago
import "../less/home.less";
function Home() {
const loadingState = useLoading();
useEffect(() => {
if (window.location.pathname !== locationService.getState().pathname) {
locationService.replaceHistory("/");
}
4 years ago
const { user } = userService.getState();
if (!user) {
userService
.doSignIn()
.catch(() => {
// do nth
})
.finally(() => {
if (userService.getState().user && locationService.getState().pathname !== "/") {
locationService.replaceHistory("/");
4 years ago
}
loadingState.setFinish();
4 years ago
});
} else {
loadingState.setFinish();
}
}, []);
return (
<section className="page-wrapper home">
4 years ago
{loadingState.isLoading ? null : (
<div className="page-container">
4 years ago
<Sidebar />
<main className="memos-wrapper">
<div className="memos-editor-wrapper">
<MemosHeader />
{userService.isNotVisitor() && <MemoEditor />}
<MemoFilter />
</div>
<MemoList />
</main>
</div>
4 years ago
)}
</section>
4 years ago
);
}
export default Home;