From 1e6e30ec4bdf58b5b6bc19edf8c34f15656e9eb2 Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Fri, 20 Nov 2020 18:31:15 +0800
Subject: ...

---
 FrontEnd/src/app/views/admin/AdminNav.tsx | 41 +++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 FrontEnd/src/app/views/admin/AdminNav.tsx

(limited to 'FrontEnd/src/app/views/admin/AdminNav.tsx')

diff --git a/FrontEnd/src/app/views/admin/AdminNav.tsx b/FrontEnd/src/app/views/admin/AdminNav.tsx
new file mode 100644
index 00000000..040b479f
--- /dev/null
+++ b/FrontEnd/src/app/views/admin/AdminNav.tsx
@@ -0,0 +1,41 @@
+import React from "react";
+import { Nav } from "react-bootstrap";
+import { useHistory, useRouteMatch } from "react-router";
+
+const AdminNav: React.FC = () => {
+  const match = useRouteMatch<{ name: string }>();
+  const history = useHistory();
+
+  const name = match.params.name;
+
+  function toggle(newTab: string): void {
+    history.push(`/admin/${newTab}`);
+  }
+
+  return (
+    <Nav variant="tabs" className="my-2">
+      <Nav.Item>
+        <Nav.Link
+          active={name === "users"}
+          onClick={() => {
+            toggle("users");
+          }}
+        >
+          Users
+        </Nav.Link>
+      </Nav.Item>
+      <Nav.Item>
+        <Nav.Link
+          active={name === "highlighttimelines"}
+          onClick={() => {
+            toggle("highlighttimelines");
+          }}
+        >
+          Highlight Timelines
+        </Nav.Link>
+      </Nav.Item>
+    </Nav>
+  );
+};
+
+export default AdminNav;
-- 
cgit v1.2.3

