aboutsummaryrefslogtreecommitdiff
path: root/FrontEnd/src/views/timeline/index.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'FrontEnd/src/views/timeline/index.tsx')
-rw-r--r--FrontEnd/src/views/timeline/index.tsx72
1 files changed, 6 insertions, 66 deletions
diff --git a/FrontEnd/src/views/timeline/index.tsx b/FrontEnd/src/views/timeline/index.tsx
index 65bb90f6..cb9fb46f 100644
--- a/FrontEnd/src/views/timeline/index.tsx
+++ b/FrontEnd/src/views/timeline/index.tsx
@@ -1,82 +1,22 @@
import React from "react";
-import { HubConnectionState } from "@microsoft/signalr";
import { useParams } from "react-router-dom";
import { UiLogicError } from "@/common";
-import { HttpTimelineInfo } from "@/http/timeline";
-import { generatePalette, setPalette } from "@/palette";
import Timeline from "./Timeline";
-import TimelineCard from "./TimelineCard";
const TimelinePage: React.FC = () => {
- const { owner: ownerUsername, timeline: timelineNameParam } = useParams();
+ const { owner, timeline: timelineNameParam } = useParams();
- if (ownerUsername == null || ownerUsername == "")
+ if (owner == null || owner == "")
throw new UiLogicError("Route param owner is not set.");
- const timelineName =
- timelineNameParam == null || timelineNameParam === ""
- ? "self"
- : timelineNameParam;
-
- const [timeline, setTimeline] = React.useState<HttpTimelineInfo | null>(null);
-
- const [reloadKey, setReloadKey] = React.useState<number>(0);
- const reload = (): void => setReloadKey(reloadKey + 1);
-
- const [connectionStatus, setConnectionStatus] =
- React.useState<HubConnectionState>(HubConnectionState.Connecting);
-
- React.useEffect(() => {
- if (timeline != null && timeline.color != null) {
- return setPalette(generatePalette({ primary: timeline.color }));
- }
- }, [timeline]);
-
- const cardCollapseLocalStorageKey = `timeline.${ownerUsername}.${timelineName}.cardCollapse`;
-
- const [cardCollapse, setCardCollapse] = React.useState<boolean>(true);
-
- React.useEffect(() => {
- const savedCollapse = window.localStorage.getItem(
- cardCollapseLocalStorageKey
- );
- setCardCollapse(savedCollapse == null ? true : savedCollapse === "true");
- }, [cardCollapseLocalStorageKey]);
-
- const toggleCardCollapse = (): void => {
- const newState = !cardCollapse;
- setCardCollapse(newState);
- window.localStorage.setItem(
- cardCollapseLocalStorageKey,
- newState.toString()
- );
- };
+ const timeline = timelineNameParam || "self";
return (
- <>
- {timeline != null ? (
- <TimelineCard
- className="timeline-template-card"
- timeline={timeline}
- collapse={cardCollapse}
- toggleCollapse={toggleCardCollapse}
- onReload={reload}
- connectionStatus={connectionStatus}
- />
- ) : null}
- <div className="container">
- <Timeline
- timelineOwner={ownerUsername}
- timelineName={timelineName}
- reloadKey={reloadKey}
- onReload={reload}
- onTimelineLoaded={(t) => setTimeline(t)}
- onConnectionStateChanged={setConnectionStatus}
- />
- </div>
- </>
+ <div className="container">
+ <Timeline timelineOwner={owner} timelineName={timeline} />
+ </div>
);
};