wip: migrate to ark

src/shared/avatarUploader.tsx

@@ -1,16 +1,16 @@
 import { message } from '@tauri-apps/plugin-dialog';
 import { Dispatch, SetStateAction, useState } from 'react';
 
-import { LoaderIcon } from '@shared/icons';
+import { useArk } from '@libs/ark';
 
-import { useNostr } from '@utils/hooks/useNostr';
+import { LoaderIcon } from '@shared/icons';
 
 export function AvatarUploader({
   setPicture,
 }: {
   setPicture: Dispatch<SetStateAction<string>>;
 }) {
-  const { upload } = useNostr();
+  const { ark } = useArk();
   const [loading, setLoading] = useState(false);
 
   const uploadAvatar = async () => {
@@ -18,7 +18,7 @@ export function AvatarUploader({
       // start loading
       setLoading(true);
 
-      const image = await upload();
+      const image = await ark.upload({});
 
       if (image) {
         setPicture(image);

src/shared/bannerUploader.tsx

@@ -1,16 +1,16 @@
 import { message } from '@tauri-apps/plugin-dialog';
 import { Dispatch, SetStateAction, useState } from 'react';
 
-import { LoaderIcon, PlusIcon } from '@shared/icons';
+import { useArk } from '@libs/ark';
 
-import { useNostr } from '@utils/hooks/useNostr';
+import { LoaderIcon, PlusIcon } from '@shared/icons';
 
 export function BannerUploader({
   setBanner,
 }: {
   setBanner: Dispatch<SetStateAction<string>>;
 }) {
-  const { upload } = useNostr();
+  const { ark } = useArk();
   const [loading, setLoading] = useState(false);
 
   const uploadBanner = async () => {
@@ -18,7 +18,7 @@ export function BannerUploader({
       // start loading
       setLoading(true);
 
-      const image = await upload();
+      const image = await ark.upload({});
 
       if (image) {
         setBanner(image);

src/shared/notes/notify.tsx

@@ -1,20 +1,21 @@
 import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
 import { memo } from 'react';
 
+import { useArk } from '@libs/ark';
+
 import { ReplyIcon, RepostIcon } from '@shared/icons';
 import { ChildNote, TextKind } from '@shared/notes';
 import { User } from '@shared/user';
 
 import { WIDGET_KIND } from '@utils/constants';
 import { formatCreatedAt } from '@utils/createdAt';
-import { useNostr } from '@utils/hooks/useNostr';
 import { useWidget } from '@utils/hooks/useWidget';
 
 export function NotifyNote({ event }: { event: NDKEvent }) {
-  const { getEventThread } = useNostr();
+  const { ark } = useArk();
   const { addWidget } = useWidget();
 
-  const thread = getEventThread(event.tags);
+  const thread = ark.getEventThread({ tags: event.tags });
   const createdAt = formatCreatedAt(event.created_at, false);
 
   if (event.kind === NDKKind.Reaction) {

src/shared/notes/replies/list.tsx

@@ -1,38 +1,42 @@
+import { NDKSubscription } from '@nostr-dev-kit/ndk';
 import { useEffect, useState } from 'react';
 
+import { useArk } from '@libs/ark';
+
 import { LoaderIcon } from '@shared/icons';
 import { Reply } from '@shared/notes';
 
-import { useNostr } from '@utils/hooks/useNostr';
 import { NDKEventWithReplies } from '@utils/types';
 
 export function ReplyList({ eventId }: { eventId: string }) {
-  const { fetchAllReplies, sub } = useNostr();
+  const { ark } = useArk();
   const [data, setData] = useState<null | NDKEventWithReplies[]>(null);
 
   useEffect(() => {
+    let sub: NDKSubscription;
     let isCancelled = false;
 
     async function fetchRepliesAndSub() {
-      const events = await fetchAllReplies(eventId);
+      const events = await ark.getThreads({ id: eventId });
       if (!isCancelled) {
         setData(events);
       }
       // subscribe for new replies
-      sub(
-        {
+      sub = ark.subscribe({
+        filter: {
           '#e': [eventId],
           since: Math.floor(Date.now() / 1000),
         },
-        (event: NDKEventWithReplies) => setData((prev) => [event, ...prev]),
-        false
-      );
+        closeOnEose: false,
+        cb: (event: NDKEventWithReplies) => setData((prev) => [event, ...prev]),
+      });
     }
 
     fetchRepliesAndSub();
 
     return () => {
       isCancelled = true;
+      if (sub) sub.stop();
     };
   }, [eventId]);
 
@@ -59,7 +63,7 @@ export function ReplyList({ eventId }: { eventId: string }) {
           </div>
         </div>
       ) : (
-        data.map((event) => <Reply key={event.id} event={event} root={eventId} />)
+        data.map((event) => <Reply key={event.id} event={event} />)
       )}
     </div>
   );

src/shared/notes/text.tsx

@@ -2,20 +2,21 @@ import { NDKEvent } from '@nostr-dev-kit/ndk';
 import { memo } from 'react';
 import { twMerge } from 'tailwind-merge';
 
+import { useArk } from '@libs/ark';
+
 import { ChildNote, NoteActions } from '@shared/notes';
 import { User } from '@shared/user';
 
 import { WIDGET_KIND } from '@utils/constants';
-import { useNostr } from '@utils/hooks/useNostr';
 import { useRichContent } from '@utils/hooks/useRichContent';
 import { useWidget } from '@utils/hooks/useWidget';
 
 export function TextNote({ event, className }: { event: NDKEvent; className?: string }) {
   const { parsedContent } = useRichContent(event.content);
   const { addWidget } = useWidget();
-  const { getEventThread } = useNostr();
+  const { ark } = useArk();
 
-  const thread = getEventThread(event.tags);
+  const thread = ark.getEventThread({ tags: event.tags });
 
   return (
     <div className={twMerge('mb-3 h-min w-full px-3', className)}>

src/shared/titleBar.tsx

@@ -1,4 +1,4 @@
-import { useStorage } from '@libs/storage/provider';
+import { useArk } from '@libs/ark';
 
 import { CancelIcon } from '@shared/icons';
 import { User } from '@shared/user';
@@ -14,7 +14,7 @@ export function TitleBar({
   title?: string;
   isLive?: boolean;
 }) {
-  const { db } = useStorage();
+  const { ark } = useArk();
   const { removeWidget } = useWidget();
 
   return (
@@ -33,13 +33,13 @@ export function TitleBar({
       <div className="col-span-1 flex justify-center">
         {id === '9999' ? (
           <div className="isolate flex -space-x-2">
-            {db.account.contacts
+            {ark.account.contacts
               ?.slice(0, 8)
               .map((item) => <User key={item} pubkey={item} variant="ministacked" />)}
-            {db.account.contacts?.length > 8 ? (
+            {ark.account.contacts?.length > 8 ? (
               <div className="inline-flex h-6 w-6 items-center justify-center rounded-full bg-neutral-300 text-neutral-900 ring-1 ring-white dark:bg-neutral-700 dark:text-neutral-100 dark:ring-black">
                 <span className="text-[8px] font-medium">
-                  +{db.account.contacts?.length - 8}
+                  +{ark.account.contacts?.length - 8}
                 </span>
               </div>
             ) : null}

src/shared/widgets/notification.tsx

@@ -3,6 +3,7 @@ import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query';
 import { useCallback, useEffect, useMemo } from 'react';
 import { VList } from 'virtua';
 
+import { useArk } from '@libs/ark';
 import { useNDK } from '@libs/ndk/provider';
 import { useStorage } from '@libs/storage/provider';
 
@@ -12,15 +13,12 @@ import { TitleBar } from '@shared/titleBar';
 import { WidgetWrapper } from '@shared/widgets';
 
 import { FETCH_LIMIT } from '@utils/constants';
-import { useNostr } from '@utils/hooks/useNostr';
 import { sendNativeNotification } from '@utils/notification';
 
 export function NotificationWidget() {
   const queryClient = useQueryClient();
 
-  const { db } = useStorage();
-  const { sub } = useNostr();
-  const { ndk, relayUrls, fetcher } = useNDK();
+  const { ark } = useArk();
   const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
     useInfiniteQuery({
       queryKey: ['notification'],

src/shared/widgets/thread.tsx

@@ -2,6 +2,8 @@ import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
 import { useCallback } from 'react';
 import { WVList } from 'virtua';
 
+import { useArk } from '@libs/ark';
+
 import { LoaderIcon } from '@shared/icons';
 import {
   ChildNote,
@@ -17,16 +19,15 @@ import { User } from '@shared/user';
 import { WidgetWrapper } from '@shared/widgets';
 
 import { useEvent } from '@utils/hooks/useEvent';
-import { useNostr } from '@utils/hooks/useNostr';
 import { Widget } from '@utils/types';
 
 export function ThreadWidget({ widget }: { widget: Widget }) {
   const { isFetching, isError, data } = useEvent(widget.content);
-  const { getEventThread } = useNostr();
+  const { ark } = useArk();
 
   const renderKind = useCallback(
     (event: NDKEvent) => {
-      const thread = getEventThread(event.tags);
+      const thread = ark.getEventThread({ tags: event.tags });
       switch (event.kind) {
         case NDKKind.Text:
           return (