chore: update router

This commit is contained in:
Steven 2022-09-21 21:30:33 +08:00
parent d316c04837
commit 0dd2337663
5 changed files with 37 additions and 39 deletions

View File

@ -1,9 +1,8 @@
import dayjs from "dayjs";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
import { memoService, userService } from "../services";
import { isNullorUndefined } from "../helpers/utils";
import { Link } from "react-router-dom";
import { memoService } from "../services";
import { useAppSelector } from "../store";
import useLoading from "../hooks/useLoading";
import MemoContent from "../components/MemoContent";
@ -16,7 +15,6 @@ interface State {
const Explore = () => {
const { t, i18n } = useTranslation();
const navigate = useNavigate();
const user = useAppSelector((state) => state.user.user);
const location = useAppSelector((state) => state.location);
const [state, setState] = useState<State>({
@ -25,12 +23,6 @@ const Explore = () => {
const loadingState = useLoading();
useEffect(() => {
const { host } = userService.getState();
if (isNullorUndefined(host)) {
navigate("/auth");
return;
}
memoService.fetchAllMemos().then((memos) => {
setState({
memos,

View File

@ -1,9 +1,8 @@
import { useEffect } from "react";
import { useTranslation } from "react-i18next";
import { useLocation, useNavigate } from "react-router-dom";
import { useLocation } from "react-router-dom";
import { globalService, userService } from "../services";
import { useAppSelector } from "../store";
import { isNullorUndefined } from "../helpers/utils";
import toastHelper from "../components/Toast";
import Sidebar from "../components/Sidebar";
import MemosHeader from "../components/MemosHeader";
@ -15,25 +14,15 @@ import "../less/home.less";
function Home() {
const { t } = useTranslation();
const location = useLocation();
const navigate = useNavigate();
const user = useAppSelector((state) => state.user.user);
useEffect(() => {
const { host, owner, user } = userService.getState();
if (isNullorUndefined(host)) {
navigate("/auth");
return;
}
const { owner } = userService.getState();
if (userService.isVisitorMode()) {
if (!owner) {
toastHelper.error(t("message.user-not-found"));
}
} else {
if (isNullorUndefined(user)) {
navigate("/explore");
}
}
}, [location]);

View File

@ -1,10 +1,9 @@
import dayjs from "dayjs";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Link, useNavigate, useParams } from "react-router-dom";
import { memoService, userService } from "../services";
import { Link, useParams } from "react-router-dom";
import { memoService } from "../services";
import { UNKNOWN_ID } from "../helpers/consts";
import { isNullorUndefined } from "../helpers/utils";
import { useAppSelector } from "../store";
import useLoading from "../hooks/useLoading";
import toastHelper from "../components/Toast";
@ -18,7 +17,6 @@ interface State {
const MemoDetail = () => {
const { t, i18n } = useTranslation();
const navigate = useNavigate();
const params = useParams();
const user = useAppSelector((state) => state.user.user);
const location = useAppSelector((state) => state.location);
@ -30,12 +28,6 @@ const MemoDetail = () => {
const loadingState = useLoading();
useEffect(() => {
const { host } = userService.getState();
if (isNullorUndefined(host)) {
navigate("/auth");
return;
}
const memoId = Number(params.memoId);
if (memoId && !isNaN(memoId)) {
memoService

View File

@ -1,4 +1,5 @@
import { createBrowserRouter } from "react-router-dom";
import { createBrowserRouter, redirect } from "react-router-dom";
import { isNullorUndefined } from "../helpers/utils";
import { userService } from "../services";
import Auth from "../pages/Auth";
import Explore from "../pages/Explore";
@ -6,6 +7,10 @@ import Home from "../pages/Home";
import MemoDetail from "../pages/MemoDetail";
const router = createBrowserRouter([
{
path: "/auth",
element: <Auth />,
},
{
path: "/",
element: <Home />,
@ -15,12 +20,15 @@ const router = createBrowserRouter([
} catch (error) {
// do nth
}
const { host, user } = userService.getState();
if (isNullorUndefined(host)) {
return redirect("/auth");
} else if (isNullorUndefined(user)) {
return redirect("/explore");
}
},
},
{
path: "/auth",
element: <Auth />,
},
{
path: "/u/:userId",
element: <Home />,
@ -30,6 +38,11 @@ const router = createBrowserRouter([
} catch (error) {
// do nth
}
const { host } = userService.getState();
if (isNullorUndefined(host)) {
return redirect("/auth");
}
},
},
{
@ -41,6 +54,11 @@ const router = createBrowserRouter([
} catch (error) {
// do nth
}
const { host } = userService.getState();
if (isNullorUndefined(host)) {
return redirect("/auth");
}
},
},
{
@ -52,6 +70,11 @@ const router = createBrowserRouter([
} catch (error) {
// do nth
}
const { host } = userService.getState();
if (isNullorUndefined(host)) {
return redirect("/auth");
}
},
},
]);

View File

@ -1,5 +1,5 @@
import { configureStore } from "@reduxjs/toolkit";
import { TypedUseSelectorHook, useSelector } from "react-redux";
import { TypedUseSelectorHook, useDispatch, useSelector } from "react-redux";
import globalReducer from "./modules/global";
import userReducer from "./modules/user";
import memoReducer from "./modules/memo";
@ -19,7 +19,9 @@ const store = configureStore({
});
type AppState = ReturnType<typeof store.getState>;
type AppDispatch = typeof store.dispatch;
export const useAppSelector: TypedUseSelectorHook<AppState> = useSelector;
export const useAppDispatch: () => AppDispatch = useDispatch;
export default store;