From b0cf464004142dce602fa882c8d638605be7e479 Mon Sep 17 00:00:00 2001 From: crupest Date: Fri, 16 Apr 2021 18:01:38 +0800 Subject: ... --- FrontEnd/src/app/App.tsx | 8 +- FrontEnd/src/app/locales/en/translation.json | 5 +- FrontEnd/src/app/locales/zh/translation.json | 5 +- FrontEnd/src/app/views/center/BoardWithUser.tsx | 111 --------------------- FrontEnd/src/app/views/center/BoardWithoutUser.tsx | 33 ------ FrontEnd/src/app/views/center/CenterBoards.tsx | 107 ++++++++++++++++++++ FrontEnd/src/app/views/center/index.tsx | 17 +--- FrontEnd/src/app/views/common/AppBar.tsx | 2 +- FrontEnd/src/app/views/home/TimelineListView.tsx | 18 ++-- FrontEnd/src/app/views/home/home.sass | 16 +-- 10 files changed, 139 insertions(+), 183 deletions(-) delete mode 100644 FrontEnd/src/app/views/center/BoardWithUser.tsx delete mode 100644 FrontEnd/src/app/views/center/BoardWithoutUser.tsx create mode 100644 FrontEnd/src/app/views/center/CenterBoards.tsx (limited to 'FrontEnd') diff --git a/FrontEnd/src/app/App.tsx b/FrontEnd/src/app/App.tsx index 39ef78f2..6431ebbb 100644 --- a/FrontEnd/src/app/App.tsx +++ b/FrontEnd/src/app/App.tsx @@ -45,9 +45,11 @@ const App: React.FC = () => { - -
- + {user != null ? ( + +
+ + ) : null} diff --git a/FrontEnd/src/app/locales/en/translation.json b/FrontEnd/src/app/locales/en/translation.json index a878badd..73cee2e6 100644 --- a/FrontEnd/src/app/locales/en/translation.json +++ b/FrontEnd/src/app/locales/en/translation.json @@ -30,10 +30,9 @@ "loadingHighlightTimelines": "Loading highlight timelines...", "loadedHighlightTimelines": "Here are some highlight timelines💡", "errorHighlightTimelines": "Failed to load highlight timelines, please try reloading!", - "highlightTimeline": "Highlight Timelines", - "relatedTimeline": "Timelines Related To You", - "publicTimeline": "Public Timelines", "bookmarkTimeline": "Bookmark Timelines", + "highlightTimeline": "Highlight Timelines", + "relatedTimeline": "Timelines You Participate", "message": { "moveHighlightFail": "Failed to move highlight timeline.", "deleteHighlightFail": "Failed to delete highlight timeline.", diff --git a/FrontEnd/src/app/locales/zh/translation.json b/FrontEnd/src/app/locales/zh/translation.json index 3f956d3d..1a1a70ab 100644 --- a/FrontEnd/src/app/locales/zh/translation.json +++ b/FrontEnd/src/app/locales/zh/translation.json @@ -30,10 +30,9 @@ "loadingHighlightTimelines": "正在加载高光时间线...", "loadedHighlightTimelines": "康康以下这些高光时间线💡", "errorHighlightTimelines": "加载高光时间线失败，刷新试试！", - "highlightTimeline": "高光时间线", - "relatedTimeline": "关于你的时间线", - "publicTimeline": "公开时间线", "bookmarkTimeline": "书签时间线", + "highlightTimeline": "高光时间线", + "relatedTimeline": "参与的时间线", "message": { "moveHighlightFail": "移动高光时间线失败。", "deleteHighlightFail": "删除高光时间线失败。", diff --git a/FrontEnd/src/app/views/center/BoardWithUser.tsx b/FrontEnd/src/app/views/center/BoardWithUser.tsx deleted file mode 100644 index 3263c745..00000000 --- a/FrontEnd/src/app/views/center/BoardWithUser.tsx +++ /dev/null @@ -1,111 +0,0 @@ -import React from "react"; -import { Row, Col } from "react-bootstrap"; -import { useTranslation } from "react-i18next"; - -import { AuthUser } from "@/services/user"; -import { pushAlert } from "@/services/alert"; - -import { getHttpHighlightClient } from "@/http/highlight"; -import { getHttpTimelineClient } from "@/http/timeline"; -import { getHttpBookmarkClient } from "@/http/bookmark"; - -import TimelineBoard from "./TimelineBoard"; - -const BoardWithUser: React.FC<{ user: AuthUser }> = ({ user }) => { - const { t } = useTranslation(); - - return ( - <> - - - getHttpBookmarkClient().list()} - editHandler={{ - onDelete: (timeline) => { - return getHttpBookmarkClient() - .delete(timeline) - .catch((e) => { - pushAlert({ - message: "home.message.deleteBookmarkFail", - type: "danger", - }); - throw e; - }); - }, - onMove: (timeline, index, offset) => { - return getHttpBookmarkClient() - .move( - { timeline, newPosition: index + offset + 1 } // +1 because backend contract: index starts at 1 - ) - .catch((e) => { - pushAlert({ - message: "home.message.moveBookmarkFail", - type: "danger", - }); - throw e; - }); - }, - }} - /> - - - - getHttpTimelineClient().listTimeline({ relate: user.username }) - } - /> - - - - - getHttpHighlightClient().list()} - editHandler={ - user.hasHighlightTimelineAdministrationPermission - ? { - onDelete: (timeline) => { - return getHttpHighlightClient() - .delete(timeline) - .catch((e) => { - pushAlert({ - message: "home.message.deleteHighlightFail", - type: "danger", - }); - throw e; - }); - }, - onMove: (timeline, index, offset) => { - return getHttpHighlightClient() - .move( - { timeline, newPosition: index + offset + 1 } // +1 because backend contract: index starts at 1 - ) - .catch((e) => { - pushAlert({ - message: "home.message.moveHighlightFail", - type: "danger", - }); - throw e; - }); - }, - } - : undefined - } - /> - - - - getHttpTimelineClient().listTimeline({ visibility: "Public" }) - } - /> - - - - ); -}; - -export default BoardWithUser; diff --git a/FrontEnd/src/app/views/center/BoardWithoutUser.tsx b/FrontEnd/src/app/views/center/BoardWithoutUser.tsx deleted file mode 100644 index d9c7fcf4..00000000 --- a/FrontEnd/src/app/views/center/BoardWithoutUser.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import React from "react"; -import { Row, Col } from "react-bootstrap"; -import { useTranslation } from "react-i18next"; - -import { getHttpHighlightClient } from "@/http/highlight"; -import { getHttpTimelineClient } from "@/http/timeline"; - -import TimelineBoard from "./TimelineBoard"; - -const BoardWithoutUser: React.FC = () => { - const { t } = useTranslation(); - - return ( - - - getHttpHighlightClient().list()} - /> - - - - getHttpTimelineClient().listTimeline({ visibility: "Public" }) - } - /> - - - ); -}; - -export default BoardWithoutUser; diff --git a/FrontEnd/src/app/views/center/CenterBoards.tsx b/FrontEnd/src/app/views/center/CenterBoards.tsx new file mode 100644 index 00000000..f5200415 --- /dev/null +++ b/FrontEnd/src/app/views/center/CenterBoards.tsx @@ -0,0 +1,107 @@ +import React from "react"; +import { Row, Col } from "react-bootstrap"; +import { useTranslation } from "react-i18next"; + +import { pushAlert } from "@/services/alert"; +import { useUserLoggedIn } from "@/services/user"; + +import { getHttpTimelineClient } from "@/http/timeline"; +import { getHttpBookmarkClient } from "@/http/bookmark"; +import { getHttpHighlightClient } from "@/http/highlight"; + +import TimelineBoard from "./TimelineBoard"; + +const CenterBoards: React.FC = () => { + const { t } = useTranslation(); + + const user = useUserLoggedIn(); + + return ( + <> + + + + + getHttpBookmarkClient().list()} + editHandler={{ + onDelete: (timeline) => { + return getHttpBookmarkClient() + .delete(timeline) + .catch((e) => { + pushAlert({ + message: "home.message.deleteBookmarkFail", + type: "danger", + }); + throw e; + }); + }, + onMove: (timeline, index, offset) => { + return getHttpBookmarkClient() + .move( + { timeline, newPosition: index + offset + 1 } // +1 because backend contract: index starts at 1 + ) + .catch((e) => { + pushAlert({ + message: "home.message.moveBookmarkFail", + type: "danger", + }); + throw e; + }); + }, + }} + /> + + + getHttpHighlightClient().list()} + editHandler={ + user.hasHighlightTimelineAdministrationPermission + ? { + onDelete: (timeline) => { + return getHttpHighlightClient() + .delete(timeline) + .catch((e) => { + pushAlert({ + message: "home.message.deleteHighlightFail", + type: "danger", + }); + throw e; + }); + }, + onMove: (timeline, index, offset) => { + return getHttpHighlightClient() + .move( + { timeline, newPosition: index + offset + 1 } // +1 because backend contract: index starts at 1 + ) + .catch((e) => { + pushAlert({ + message: "home.message.moveHighlightFail", + type: "danger", + }); + throw e; + }); + }, + } + : undefined + } + /> + + + + + + getHttpTimelineClient().listTimeline({ relate: user.username }) + } + /> + + + + ); +}; + +export default CenterBoards; diff --git a/FrontEnd/src/app/views/center/index.tsx b/FrontEnd/src/app/views/center/index.tsx index bcf6ad6e..0a2abb2c 100644 --- a/FrontEnd/src/app/views/center/index.tsx +++ b/FrontEnd/src/app/views/center/index.tsx @@ -3,11 +3,10 @@ import { useHistory } from "react-router"; import { useTranslation } from "react-i18next"; import { Row, Container, Button, Col } from "react-bootstrap"; -import { useUser } from "@/services/user"; -import SearchInput from "../common/SearchInput"; +import { useUserLoggedIn } from "@/services/user"; -import BoardWithoutUser from "./BoardWithoutUser"; -import BoardWithUser from "./BoardWithUser"; +import SearchInput from "../common/SearchInput"; +import CenterBoards from "./CenterBoards"; import TimelineCreateDialog from "./TimelineCreateDialog"; const HomePage: React.FC = () => { @@ -15,7 +14,7 @@ const HomePage: React.FC = () => { const { t } = useTranslation(); - const user = useUser(); + const user = useUserLoggedIn(); const [navText, setNavText] = React.useState(""); @@ -48,13 +47,7 @@ const HomePage: React.FC = () => { /> - {(() => { - if (user == null) { - return ; - } else { - return ; - } - })()} + {dialog === "create" && ( {