From 42434a44869310e1021e0aa8e7e765e44ac7ac20 Mon Sep 17 00:00:00 2001
From: Sebastian Korotkiewicz <skorotkiewicz@gmail.com>
Date: Fri, 20 Oct 2023 03:16:32 +0200
Subject: [PATCH] add sorting by tags

---
 src/App.jsx               |  2 ++
 src/components/Editor.jsx |  6 +++++-
 src/components/Snip.jsx   |  2 ++
 src/pages/SnipByTag.jsx   | 30 ++++++++++++++++++++++++++++++
 4 files changed, 39 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/SnipByTag.jsx

diff --git a/src/App.jsx b/src/App.jsx
index c25da5a..6afd88c 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -16,6 +16,7 @@ import { getLoginKeys } from "./utils";
 import { useNostr } from "./context/NostrProvider";
 import Sniped from "./pages/Sniped";
 import { Loading } from "./components/Loading";
+import SnipByTag from "./pages/SnipByTag";
 
 export default function App() {
   const [keypair, setKeypair] = useAtom("keypair");
@@ -41,6 +42,7 @@ export default function App() {
     <Routes>
       <Route path="/" element={<Layout />}>
         <Route index element={<Home />} />
+        <Route path="lang/:lang" element={<SnipByTag />} />
         <Route path="about" element={<About />} />
         <Route path="profile?/:id" element={<Profile />} />
         <Route path="snip?/:id" element={<Sniped />} />
diff --git a/src/components/Editor.jsx b/src/components/Editor.jsx
index 6d556fc..1e385c4 100644
--- a/src/components/Editor.jsx
+++ b/src/components/Editor.jsx
@@ -33,7 +33,11 @@ const Editor = () => {
     sendSignEvent({
       kind: 1,
       keypair,
-      tags: [["t", TOPIC]],
+      // tags: [["t", TOPIC]],
+      tags: [
+        ["t", TOPIC],
+        ["l", mode],
+      ],
       content: JSON.stringify({ snip, mode, fileName }),
       publish,
     }).then(() => {
diff --git a/src/components/Snip.jsx b/src/components/Snip.jsx
index af908e0..9b6208d 100644
--- a/src/components/Snip.jsx
+++ b/src/components/Snip.jsx
@@ -50,6 +50,8 @@ const Snip = ({ events }) => {
                 {shortPubKey(data.pubkey, 7)}
               </Link>
             </p>
+
+            <Link to={`/lang/${s.mode}`}>#{s.mode}</Link>
           </div>
         );
       })}
diff --git a/src/pages/SnipByTag.jsx b/src/pages/SnipByTag.jsx
new file mode 100644
index 0000000..c6a6d01
--- /dev/null
+++ b/src/pages/SnipByTag.jsx
@@ -0,0 +1,30 @@
+import { useParams } from "react-router-dom";
+import { Loading } from "../components/Loading";
+import Snip from "../components/Snip";
+import { TOPIC } from "../config";
+import { useNostrEvents } from "../context/NostrProvider";
+
+const SnipByTag = () => {
+  const { lang } = useParams();
+
+  const { events, isLoading } = useNostrEvents({
+    filter: {
+      // since: dateToUnix(now.current),
+      // until: dateToUnix(now.current),
+      kinds: [1],
+      "#t": [TOPIC],
+      "#l": [lang],
+      limit: 100,
+    },
+  });
+
+  return (
+    <div>
+      <h2>#{lang}</h2>
+
+      {isLoading ? <Loading /> : <Snip events={events} />}
+    </div>
+  );
+};
+
+export default SnipByTag;