1 files changed, 37 insertions, 0 deletions
diff --git a/FrontEnd/src/app/views/timeline/index.tsx b/FrontEnd/src/app/views/timeline/index.tsx
new file mode 100644
index 00000000..225a1a59
--- /dev/null
+++ b/FrontEnd/src/app/views/timeline/index.tsx
@@ -0,0 +1,37 @@
+import React from "react";
+import { useParams } from "react-router";
+
+import TimelinePageTemplate from "../timeline-common/TimelinePageTemplate";
+
+import TimelinePageUI from "./TimelinePageUI";
+import { OrdinaryTimelineManageItem } from "./TimelineInfoCard";
+import TimelineDeleteDialog from "./TimelineDeleteDialog";
+
+const TimelinePage: React.FC = (_) => {
+  const { name } = useParams<{ name: string }>();
+
+  const [dialog, setDialog] = React.useState<OrdinaryTimelineManageItem | null>(
+    null
+  );
+
+  let dialogElement: React.ReactElement | undefined;
+  if (dialog === "delete") {
+    dialogElement = (
+      <TimelineDeleteDialog open close={() => setDialog(null)} name={name} />
+    );
+  }
+
+  return (
+    <>
+      <TimelinePageTemplate
+        name={name}
+        UiComponent={TimelinePageUI}
+        onManage={(item) => setDialog(item)}
+        notFoundI18nKey="timeline.timelineNotExist"
+      />
+      {dialogElement}
+    </>
+  );
+};
+
+export default TimelinePage;