refactored eventcollector & index page

2023-04-13 16:29:52 +07:00
parent 1f73be3a06
commit 2fced53a60
11 changed files with 235 additions and 243 deletions
@@ -1,42 +1,177 @@
 import BaseLayout from '@layouts/base';

+import { RelayContext } from '@components/relaysProvider';
+
+import { dateToUnix, hoursAgo } from '@utils/getDate';
+import { getParentID, pubkeyArray } from '@utils/transform';
+
 import LumeSymbol from '@assets/icons/Lume';

-import { writeStorage } from '@rehooks/local-storage';
+import useLocalStorage, { writeStorage } from '@rehooks/local-storage';
 import { useRouter } from 'next/router';
-import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useCallback, useEffect } from 'react';
+import {
+  JSXElementConstructor,
+  ReactElement,
+  ReactFragment,
+  ReactPortal,
+  useCallback,
+  useContext,
+  useEffect,
+  useRef,
+  useState,
+} from 'react';

 export default function Page() {
+  const [pool, relays]: any = useContext(RelayContext);
  const router = useRouter();

+  const [lastLogin] = useLocalStorage('lastLogin', new Date());
+
+  const now = useRef(new Date());
+  const eose = useRef(0);
+  const unsubscribe = useRef(null);
+
  const fetchActiveAccount = useCallback(async () => {
    const { getAccounts } = await import('@utils/bindings');
    return await getAccounts();
  }, []);

-  const fetchFollowsByAccount = useCallback(async (id) => {
+  const fetchPlebsByAccount = useCallback(async (id: number, kind: number) => {
    const { getPlebs } = await import('@utils/bindings');
-    return await getPlebs({ account_id: id, kind: 0 });
+    return await getPlebs({ account_id: id, kind: kind });
  }, []);

+  const totalNotes = useCallback(async () => {
+    const { countTotalNotes } = await import('@utils/commands');
+    return countTotalNotes();
+  }, []);
+
+  const totalChannels = useCallback(async () => {
+    const { countTotalChannels } = await import('@utils/commands');
+    return countTotalChannels();
+  }, []);
+
+  const totalChats = useCallback(async () => {
+    const { countTotalChats } = await import('@utils/commands');
+    return countTotalChats();
+  }, []);
+
+  const fetchData = useCallback(
+    async (account, follows) => {
+      const { createNote } = await import('@utils/bindings');
+      const { createChat } = await import('@utils/bindings');
+      const { createChannel } = await import('@utils/bindings');
+
+      const notes = await totalNotes();
+      const channels = await totalChannels();
+      const chats = await totalChats();
+
+      const query = [];
+      let since: number;
+
+      // kind 1 (notes) query
+      if (notes === 0) {
+        since = dateToUnix(hoursAgo(24, now.current));
+      } else {
+        since = dateToUnix(new Date(lastLogin));
+      }
+      query.push({
+        kinds: [1],
+        authors: follows,
+        since: since,
+        until: dateToUnix(now.current),
+      });
+      // kind 4 (chats) query
+      if (chats === 0) {
+        query.push({
+          kinds: [4],
+          '#p': [account.pubkey],
+          since: 0,
+          until: dateToUnix(now.current),
+        });
+      }
+      // kind 40 (channels) query
+      if (channels === 0) {
+        query.push({
+          kinds: [40],
+          since: 0,
+          until: dateToUnix(now.current),
+        });
+      }
+      // subscribe relays
+      unsubscribe.current = pool.subscribe(
+        query,
+        relays,
+        (event) => {
+          if (event.kind === 1) {
+            const parentID = getParentID(event.tags, event.id);
+            // insert event to local database
+            createNote({
+              event_id: event.id,
+              pubkey: event.pubkey,
+              kind: event.kind,
+              tags: JSON.stringify(event.tags),
+              content: event.content,
+              parent_id: parentID,
+              parent_comment_id: '',
+              created_at: event.created_at,
+              account_id: account.id,
+            }).catch(console.error);
+          } else if (event.kind === 4) {
+            if (event.pubkey !== account.pubkey) {
+              createChat({
+                pubkey: event.pubkey,
+                created_at: event.created_at,
+                account_id: account.id,
+              }).catch(console.error);
+            }
+          } else if (event.kind === 40) {
+            createChannel({ event_id: event.id, content: event.content, account_id: account.id }).catch(console.error);
+          } else {
+            console.error;
+          }
+        },
+        undefined,
+        () => {
+          eose.current += 1;
+          if (eose.current > relays.length / 2) {
+            router.replace('/newsfeed/following');
+          }
+        }
+      );
+    },
+    [router, pool, relays, lastLogin, totalChannels, totalChats, totalNotes]
+  );
+
  useEffect(() => {
+    let account;
+    let follows;
+
    fetchActiveAccount()
      .then((res: any) => {
        if (res.length > 0) {
-          // fetch follows
-          fetchFollowsByAccount(res[0].id).then((follows) => {
-            writeStorage('activeAccountFollows', follows);
-          });
+          account = res[0];
          // update local storage
          writeStorage('activeAccount', res[0]);
-          // redirect
-          router.replace('/init');
+          // fetch plebs, kind 0 = following
+          fetchPlebsByAccount(res[0].id, 0).then((res) => {
+            follows = pubkeyArray(res);
+            writeStorage('activeAccountFollows', res);
+            // fetch data
+            fetchData(account, follows);
+          });
        } else {
          router.replace('/onboarding');
        }
      })
      .catch(console.error);
-  }, [fetchActiveAccount, fetchFollowsByAccount, router]);
+
+    return () => {
+      if (unsubscribe.current) {
+        unsubscribe.current();
+      }
+    };
+  }, [fetchActiveAccount, fetchPlebsByAccount, totalNotes, fetchData, router]);

  return (
    <div className="relative h-full overflow-hidden">
@@ -1,144 +0,0 @@
-import BaseLayout from '@layouts/base';
-
-import { RelayContext } from '@components/relaysProvider';
-
-import { dateToUnix, hoursAgo } from '@utils/getDate';
-import { getParentID, pubkeyArray } from '@utils/transform';
-
-import LumeSymbol from '@assets/icons/Lume';
-
-import { useLocalStorage } from '@rehooks/local-storage';
-import { invoke } from '@tauri-apps/api/tauri';
-import { useRouter } from 'next/router';
-import {
-  JSXElementConstructor,
-  ReactElement,
-  ReactFragment,
-  ReactPortal,
-  useCallback,
-  useContext,
-  useEffect,
-  useRef,
-  useState,
-} from 'react';
-
-export default function Page() {
-  const router = useRouter();
-  const [pool, relays]: any = useContext(RelayContext);
-
-  const now = useRef(new Date());
-  const unsubscribe = useRef(null);
-
-  const [eose, setEose] = useState(false);
-
-  const [lastLogin] = useLocalStorage('lastLogin', '');
-  const [activeAccount]: any = useLocalStorage('activeAccount', {});
-  const [follows] = useLocalStorage('activeAccountFollows', []);
-
-  const fetchData = useCallback(
-    async (since: Date) => {
-      const { createNote } = await import('@utils/bindings');
-
-      unsubscribe.current = pool.subscribe(
-        [
-          {
-            kinds: [1],
-            authors: pubkeyArray(follows),
-            since: dateToUnix(since),
-            until: dateToUnix(now.current),
-          },
-        ],
-        relays,
-        (event) => {
-          const parentID = getParentID(event.tags, event.id);
-          // insert event to local database
-          createNote({
-            event_id: event.id,
-            pubkey: event.pubkey,
-            kind: event.kind,
-            tags: JSON.stringify(event.tags),
-            content: event.content,
-            parent_id: parentID,
-            parent_comment_id: '',
-            created_at: event.created_at,
-            account_id: activeAccount.id,
-          }).catch(console.error);
-        },
-        undefined,
-        () => {
-          setEose(true);
-        }
-      );
-    },
-    [activeAccount.id, follows, pool, relays]
-  );
-
-  const isNoteExist = useCallback(async () => {
-    invoke('count_total_notes').then((res: number) => {
-      if (res > 0) {
-        const parseDate = new Date(lastLogin);
-        fetchData(parseDate);
-      } else {
-        fetchData(hoursAgo(24, now.current));
-      }
-    });
-  }, [fetchData, lastLogin]);
-
-  useEffect(() => {
-    if (eose === false) {
-      isNoteExist();
-    } else {
-      router.replace('/newsfeed/following');
-    }
-
-    return () => {
-      unsubscribe.current;
-    };
-  }, [router, eose, isNoteExist]);
-
-  return (
-    <div className="relative h-full overflow-hidden">
-      {/* dragging area */}
-      <div data-tauri-drag-region className="absolute left-0 top-0 z-20 h-16 w-full bg-transparent" />
-      {/* end dragging area */}
-      <div className="relative flex h-full flex-col items-center justify-center">
-        <div className="flex flex-col items-center gap-2">
-          <LumeSymbol className="h-16 w-16 text-black dark:text-white" />
-          <div className="text-center">
-            <h3 className="text-lg font-semibold leading-tight text-zinc-900 dark:text-zinc-100">Loading...</h3>
-            <p className="font-medium text-zinc-300 dark:text-zinc-600">
-              Keep calm as Lume fetches events... &#129305;
-            </p>
-          </div>
-        </div>
-        <div className="absolute bottom-16 left-1/2 -translate-x-1/2 transform">
-          <svg
-            className="h-5 w-5 animate-spin text-black dark:text-white"
-            xmlns="http://www.w3.org/2000/svg"
-            fill="none"
-            viewBox="0 0 24 24"
-          >
-            <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
-            <path
-              className="opacity-75"
-              fill="currentColor"
-              d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-            ></path>
-          </svg>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-Page.getLayout = function getLayout(
-  page:
-    | string
-    | number
-    | boolean
-    | ReactElement<unknown, string | JSXElementConstructor<unknown>>
-    | ReactFragment
-    | ReactPortal
-) {
-  return <BaseLayout>{page}</BaseLayout>;
-};