make tags links

src/views/torrents/components/torrent-table-row.tsx

@@ -1,6 +1,6 @@
 import { memo, useMemo, useRef } from "react";
 import { ButtonGroup, IconButton, Link, Td, Tr } from "@chakra-ui/react";
-import { Link as RouterLink } from "react-router-dom";
+import { Link as RouterLink, useLocation } from "react-router-dom";
 
 import { getTorrentMagnetLink, getTorrentSize, getTorrentTitle } from "../../../helpers/nostr/torrents";
 import { NostrEvent } from "../../../types/nostr-event";
@@ -14,19 +14,48 @@ import { formatBytes } from "../../../helpers/number";
 import NoteZapButton from "../../../components/note/note-zap-button";
 import TorrentMenu from "./torrent-menu";
 
+type DisplayCategory = { name: string; tags: string[] };
+
 function TorrentTableRow({ torrent }: { torrent: NostrEvent }) {
   const ref = useRef<HTMLTableRowElement | null>(null);
   useRegisterIntersectionEntity(ref, getEventUID(torrent));
 
   const magnetLink = useMemo(() => getTorrentMagnetLink(torrent), [torrent]);
 
+  const categories: DisplayCategory[] = [];
+  const chain: string[] = [];
+  for (const tag of torrent.tags) {
+    if (tag[0] !== "t") continue;
+    const name = tag[1];
+    chain.push(tag[1]);
+    categories.push({ name, tags: Array.from(chain) });
+  }
+
+  const location = useLocation();
+  const createTagLink = (c: DisplayCategory) => {
+    if (location.pathname.startsWith("/torrents")) {
+      const params = new URLSearchParams(location.search);
+      params.set("tags", c.tags.join(","));
+      return `/torrents` + params.toString();
+    }
+    return `/torrents?tags=${c.tags.join(",")}`;
+  };
+
   return (
     <Tr ref={ref}>
       <Td>
-        {torrent.tags
-          .filter((t) => t[0] === "t")
-          .map((t) => t[1])
-          .join(" > ")}
+        {categories
+          .map((c) => (
+            <Link as={RouterLink} to={createTagLink(c)}>
+              {c.name}
+            </Link>
+          ))
+          .map((el, i, arr) => (
+            <>
+              {el}
+              {i !== arr.length - 1 && <span key={String(i) + "-div"}>{" > "}</span>}
+            </>
+          ))}
       </Td>
       <Td>
         <Link as={RouterLink} to={`/torrents/${getNeventCodeWithRelays(torrent.id)}`} isTruncated maxW="lg">