From c530e4ba723c3cf681cfa2f5e22fb77b04196bbe Mon Sep 17 00:00:00 2001
From: Kieran <kieran@harkin.me>
Date: Tue, 14 Nov 2023 10:51:58 +0000
Subject: [PATCH] feat: topics page

---
 packages/app/src/Element/RootTabs.tsx | 20 +++++++++++---------
 packages/app/src/Pages/Root.tsx       |  5 +++++
 packages/app/src/Pages/TopicsPage.tsx | 20 ++++++++++++++++++++
 packages/app/src/lang.json            |  3 +++
 packages/app/src/translations/en.json |  1 +
 5 files changed, 40 insertions(+), 9 deletions(-)
 create mode 100644 packages/app/src/Pages/TopicsPage.tsx

diff --git a/packages/app/src/Element/RootTabs.tsx b/packages/app/src/Element/RootTabs.tsx
index 8f709def..3a417963 100644
--- a/packages/app/src/Element/RootTabs.tsx
+++ b/packages/app/src/Element/RootTabs.tsx
@@ -89,6 +89,17 @@ export function RootTabs({ base }: { base?: string }) {
         </>
       ),
     },
+    {
+      tab: "tags",
+      path: `${base}/topics`,
+      show: tags.item.length > 0,
+      element: (
+        <>
+          <Icon name="hash" />
+          <FormattedMessage defaultMessage="Topics" />
+        </>
+      ),
+    },
   ] as Array<{
     tab: RootTab;
     path: string;
@@ -141,15 +152,6 @@ export function RootTabs({ base }: { base?: string }) {
               {a.element}
             </MenuItem>
           ))}
-        {tags.item.map(v => (
-          <MenuItem
-            onClick={() => {
-              navigate(`${base}/t/${v}`);
-            }}>
-            <Icon name="hash" />
-            {v}
-          </MenuItem>
-        ))}
       </Menu>
     </div>
   );
diff --git a/packages/app/src/Pages/Root.tsx b/packages/app/src/Pages/Root.tsx
index b9afdb10..19f01f87 100644
--- a/packages/app/src/Pages/Root.tsx
+++ b/packages/app/src/Pages/Root.tsx
@@ -18,6 +18,7 @@ import { TaskList } from "Tasks/TaskList";
 import TimelineFollows from "Element/Feed/TimelineFollows";
 import { RootTabs } from "Element/RootTabs";
 import { DeckContext } from "Pages/DeckLayout";
+import { TopicsPage } from "./TopicsPage";
 
 import messages from "./messages";
 
@@ -239,6 +240,10 @@ export const RootTabRoutes = [
     path: "t/:tag",
     element: <HashTagsPage />,
   },
+  {
+    path: "topics",
+    element: <TopicsPage />,
+  },
 ];
 
 export const RootRoutes = [
diff --git a/packages/app/src/Pages/TopicsPage.tsx b/packages/app/src/Pages/TopicsPage.tsx
new file mode 100644
index 00000000..00f9cc9b
--- /dev/null
+++ b/packages/app/src/Pages/TopicsPage.tsx
@@ -0,0 +1,20 @@
+import Timeline from "Element/Feed/Timeline";
+import useLogin from "Hooks/useLogin";
+
+export function TopicsPage() {
+  const { tags, pubKey } = useLogin(s => ({ tags: s.tags.item, pubKey: s.publicKey }));
+
+  return (
+    <Timeline
+      subject={{
+        type: "hashtag",
+        items: tags,
+        discriminator: pubKey ?? "",
+      }}
+      postsOnly={true}
+      method="TIME_RANGE"
+      loadMore={true}
+      window={60 * 60 * 6}
+    />
+  );
+}
diff --git a/packages/app/src/lang.json b/packages/app/src/lang.json
index 5105df0b..347e18be 100644
--- a/packages/app/src/lang.json
+++ b/packages/app/src/lang.json
@@ -1168,6 +1168,9 @@
   "kaaf1E": {
     "defaultMessage": "now"
   },
+  "kc79d3": {
+    "defaultMessage": "Topics"
+  },
   "kuPHYE": {
     "defaultMessage": "{n,plural,=0{{name} liked} other{{name} & {n} others liked}}"
   },
diff --git a/packages/app/src/translations/en.json b/packages/app/src/translations/en.json
index 423cb96b..ef04ccaf 100644
--- a/packages/app/src/translations/en.json
+++ b/packages/app/src/translations/en.json
@@ -384,6 +384,7 @@
   "kEZUR8": "Register an Iris username",
   "kJYo0u": "{n,plural,=0{{name} reposted} other{{name} & {n} others reposted}}",
   "kaaf1E": "now",
+  "kc79d3": "Topics",
   "kuPHYE": "{n,plural,=0{{name} liked} other{{name} & {n} others liked}}",
   "l+ikU1": "Everything in {plan}",
   "lCILNz": "Buy Now",