...

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>
   );
 };