From b96adb2f18ca34736f48bcb7d45c082ab35e230a Mon Sep 17 00:00:00 2001
From: Innei <i@innei.in>
Date: Wed, 17 Jul 2024 15:54:35 +0800
Subject: [PATCH] feat: add local records in search panel

Signed-off-by: Innei <i@innei.in>
---
 .../src/components/common/ExPromise.tsx       | 22 +++++
 src/renderer/src/hono.ts                      | 45 ++++++----
 src/renderer/src/modules/search/cmdk.tsx      | 82 +++++++++++++------
 src/renderer/src/store/search/index.ts        |  8 +-
 src/renderer/src/store/search/types.ts        |  6 ++
 5 files changed, 119 insertions(+), 44 deletions(-)
 create mode 100644 src/renderer/src/components/common/ExPromise.tsx

diff --git a/src/renderer/src/components/common/ExPromise.tsx b/src/renderer/src/components/common/ExPromise.tsx
new file mode 100644
index 0000000000..430bb0fc53
--- /dev/null
+++ b/src/renderer/src/components/common/ExPromise.tsx
@@ -0,0 +1,22 @@
+import {
+  useLayoutEffect,
+  useState,
+} from "react"
+
+const NOT_RESOLVED = Symbol("NOT_RESOLVED")
+export const ExPromise = <T,>({
+  children,
+  promise,
+}: {
+  promise: Promise<T>
+  children: (value: T) => JSX.Element
+}) => {
+  // use() is a hook that returns the value of the promise, but in react 19
+
+  const [value, setValue] = useState<T | symbol>(NOT_RESOLVED)
+  useLayoutEffect(() => {
+    promise.then(setValue)
+  }, [promise])
+
+  return value === NOT_RESOLVED ? null : children(value as T)
+}
diff --git a/src/renderer/src/hono.ts b/src/renderer/src/hono.ts
index e1198b3018..50322fad82 100644
--- a/src/renderer/src/hono.ts
+++ b/src/renderer/src/hono.ts
@@ -2398,7 +2398,6 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     name: string | null;
                     id: string;
@@ -2408,6 +2407,7 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                     handle: string | null;
                     createdAt: string;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2418,8 +2418,8 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
         $post: {
             input: {};
             output: {
-                code: 0;
                 data: string;
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2450,10 +2450,10 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     transactionHash: string;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2473,7 +2473,6 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     type: "tip" | "mint" | "burn" | "withdraw";
                     createdAt: string;
@@ -2518,6 +2517,7 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                         ownerUserId: string | null;
                     } | null;
                 }[];
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2527,10 +2527,10 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
         $post: {
             input: {};
             output: {
-                code: 0;
                 data: {
                     transactionHash: string;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2540,10 +2540,10 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
         $get: {
             input: {};
             output: {
-                code: 0;
                 data: {
                     ttl: number;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2557,12 +2557,12 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     title: string | null;
                     id: string;
                     powerToken: string;
                 }[];
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2576,10 +2576,10 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     transactionHash: string;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2594,7 +2594,6 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     createdAt: string;
                     userId: string;
@@ -2603,6 +2602,7 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                     dailyPowerToken: string;
                     cashablePowerToken: string;
                 }[];
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2610,7 +2610,6 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
         $post: {
             input: {};
             output: {
-                code: 0;
                 data: {
                     createdAt: string;
                     userId: string;
@@ -2619,6 +2618,7 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                     dailyPowerToken: string;
                     cashablePowerToken: string;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2761,10 +2761,10 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     [x: string]: number;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2795,8 +2795,8 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: boolean;
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2876,13 +2876,13 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
+                    json: string;
                     xml: string;
                     description: string;
                     content: string;
-                    json: string;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -2911,7 +2911,6 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     readCount: number;
                     feed: {
@@ -2940,6 +2939,7 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                         isPrivate: boolean;
                     } | undefined;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -3056,12 +3056,12 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
         $post: {
             input: {};
             output: {
-                code: 0;
                 data: {
                     userId: string;
                     sessionToken: string;
                     expires: string;
                 };
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -3092,6 +3092,15 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
             status: hono_utils_http_status.StatusCode;
         };
     };
+} & {
+    [x: `/entries/read-histories/${string}`]: {
+        [x: `$${Lowercase<string>}`]: {
+            input: Partial<hono.ValidationTargets>;
+            output: any;
+            outputFormat: string;
+            status: hono_utils_http_status.StatusCode;
+        };
+    };
 } & {
     "/entries": {
         $post: {
@@ -3247,7 +3256,6 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     description: string | null;
                     title: string | null;
@@ -3270,6 +3278,7 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                         title?: string | undefined;
                     }[] | null | undefined;
                 }[];
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
@@ -3285,7 +3294,6 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                 };
             };
             output: {
-                code: 0;
                 data: {
                     title: string | null;
                     userId: string;
@@ -3310,6 +3318,7 @@ declare const _routes: hono_hono_base.HonoBase<hono_types.BlankEnv, {
                     category: string | null;
                     isPrivate: boolean;
                 }[];
+                code: 0;
             };
             outputFormat: "json";
             status: 200;
diff --git a/src/renderer/src/modules/search/cmdk.tsx b/src/renderer/src/modules/search/cmdk.tsx
index ebbebec04e..30902b268b 100644
--- a/src/renderer/src/modules/search/cmdk.tsx
+++ b/src/renderer/src/modules/search/cmdk.tsx
@@ -1,4 +1,5 @@
 import { setAppSearchOpen, useAppSearchOpen } from "@renderer/atoms/app"
+import { ExPromise } from "@renderer/components/common/ExPromise"
 import { LoadMoreIndicator } from "@renderer/components/common/LoadMoreIndicator"
 import { EmptyIcon } from "@renderer/components/icons/empty"
 import { Logo } from "@renderer/components/icons/logo"
@@ -171,7 +172,11 @@ export const SearchCmdK: React.FC = () => {
                   return (
                     <SearchItem
                       key={entry.item.id}
-                      view={feed?.id ? getSubscriptionByFeedId(feed.id)?.view : undefined}
+                      view={
+                        feed?.id ?
+                          getSubscriptionByFeedId(feed.id)?.view :
+                          undefined
+                      }
                       title={entry.item.title!}
                       feedId={entry.feedId}
                       entryId={entry.item.id}
@@ -265,12 +270,8 @@ const SearchItem = memo(function Item({
       }}
     >
       <div className="relative z-10 flex w-full items-center justify-between px-1 py-2">
-        {icon && (
-          <SiteIcon className="mr-2 size-5 shrink-0" url={icon} />
-        )}
-        <span className="block min-w-0 flex-1 shrink-0 truncate">
-          {title}
-        </span>
+        {icon && <SiteIcon className="mr-2 size-5 shrink-0" url={icon} />}
+        <span className="block min-w-0 flex-1 shrink-0 truncate">{title}</span>
         <span className="block min-w-0 shrink-0 grow-0 text-xs font-medium text-zinc-800 opacity-60 dark:text-slate-200/80">
           {subtitle}
         </span>
@@ -292,26 +293,57 @@ const SearchGroupHeading: FC<{ icon: string, title: string }> = ({
 const SearchResultCount: FC<{
   count?: number
 }> = ({ count }) => {
+  const searchInstance = React.useContext(SearchCmdKContext)
   const hasKeyword = useSearchStore((s) => !!s.keyword)
-  if (!count) return null
+  const searchType = useSearchStore((s) => s.searchType)
+  const recordCountPromise = useMemo(async () => {
+    let count = 0
+    const counts = await searchInstance?.then((s) => s.counts)
+    if (!counts) return 0
+    if (searchType & SearchType.Entry) {
+      count += counts.entries || 0
+    }
+    if (searchType & SearchType.Feed) {
+      count += counts.feeds || 0
+    }
+    if (searchType & SearchType.Subscription) {
+      count += counts.subscriptions || 0
+    }
+    return count
+  }, [searchInstance, searchType])
+
   return (
-    hasKeyword && (
-      <Tooltip>
-        <TooltipTrigger asChild>
-          <small className="center absolute bottom-3 right-3 shrink-0 gap-1 opacity-80">
-            {count}
-            {" "}
-            {pluralize("result", count)}
-            {" "}
-            (Local mode)
-            <i className="i-mingcute-question-line" />
-          </small>
-        </TooltipTrigger>
-        <TooltipContent>
-          This search run on local database, the result may not be up-to-date.
-        </TooltipContent>
-      </Tooltip>
-    )
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <small className="center absolute bottom-3 right-3 shrink-0 gap-1 opacity-80">
+          {hasKeyword ? (
+            <span>
+              {count}
+              {" "}
+              {pluralize("result", count || 0)}
+            </span>
+          ) : (
+            <ExPromise promise={recordCountPromise}>
+              {(count) => (
+                <>
+                  {count}
+                  {" "}
+                  local
+                  {" "}
+                  {pluralize("record", count)}
+                </>
+              )}
+            </ExPromise>
+          )}
+          {" "}
+          (Local mode)
+          <i className="i-mingcute-question-line" />
+        </small>
+      </TooltipTrigger>
+      <TooltipContent>
+        This search run on local database, the result may not be up-to-date.
+      </TooltipContent>
+    </Tooltip>
   )
 }
 const SearchOptions: Component = memo(({ children }) => {
diff --git a/src/renderer/src/store/search/index.ts b/src/renderer/src/store/search/index.ts
index 9581e19ea5..089f64d99a 100644
--- a/src/renderer/src/store/search/index.ts
+++ b/src/renderer/src/store/search/index.ts
@@ -52,14 +52,20 @@ class SearchActions {
       "title",
       "content",
       "description",
+      "id",
     ])
-    const feedsFuse = this.createFuse(feeds, ["title", "description"])
+    const feedsFuse = this.createFuse(feeds, ["title", "description", "id"])
     const subscriptionsFuse = this.createFuse(subscriptions, [
       "title",
       "category",
     ])
 
     return defineSearchInstance({
+      counts: {
+        entries: entries.length,
+        feeds: feeds.length,
+        subscriptions: subscriptions.length,
+      },
       search(keyword: string) {
         const type = get().searchType
         const entries =
diff --git a/src/renderer/src/store/search/types.ts b/src/renderer/src/store/search/types.ts
index 04fc4b63e0..e5bf6bd5e1 100644
--- a/src/renderer/src/store/search/types.ts
+++ b/src/renderer/src/store/search/types.ts
@@ -19,4 +19,10 @@ export interface SearchState {
 }
 export interface SearchInstance {
   search: (keyword: string) => SearchState
+
+  counts: {
+    feeds: number
+    entries: number
+    subscriptions: number
+  }
 }