From e5bedae5eaad8ed377e7d9b689815dbd55fdb523 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Sat, 2 Mar 2024 11:00:21 +0000
Subject: feature: Show a loading indicator when tags are still being fetched

---
 .../app/dashboard/bookmarks/components/TextCard.tsx   | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

(limited to 'packages/web/app/dashboard/bookmarks/components/TextCard.tsx')

diff --git a/packages/web/app/dashboard/bookmarks/components/TextCard.tsx b/packages/web/app/dashboard/bookmarks/components/TextCard.tsx
index 5d571356..8170a304 100644
--- a/packages/web/app/dashboard/bookmarks/components/TextCard.tsx
+++ b/packages/web/app/dashboard/bookmarks/components/TextCard.tsx
@@ -11,6 +11,13 @@ import { useState } from "react";
 import { BookmarkedTextViewer } from "./BookmarkedTextViewer";
 import { Button } from "@/components/ui/button";
 
+function isStillTagging(bookmark: ZBookmark) {
+  return (
+    bookmark.taggingStatus == "pending" &&
+    Date.now().valueOf() - bookmark.createdAt.valueOf() < 30 * 1000
+  );
+}
+
 export default function TextCard({
   bookmark: initialData,
   className,
@@ -24,6 +31,16 @@ export default function TextCard({
     },
     {
       initialData,
+      refetchInterval: (query) => {
+        const data = query.state.data;
+        if (!data) {
+          return false;
+        }
+        if (isStillTagging(data)) {
+          return 1000;
+        }
+        return false;
+      },
     },
   );
   const [previewModalOpen, setPreviewModalOpen] = useState(false);
@@ -51,7 +68,7 @@ export default function TextCard({
           {bookmarkedText.text}
         </Markdown>
         <div className="mt-4 flex flex-none flex-wrap gap-1 overflow-hidden">
-          <TagList bookmark={bookmark} />
+          <TagList bookmark={bookmark} loading={isStillTagging(bookmark)} />
         </div>
         <div className="flex w-full justify-between">
           <div />
-- 
cgit v1.2.3-70-g09d2

