chore: clean up

src/routes/columns/_layout/create-group.tsx

@@ -1,9 +1,14 @@
-import { NostrAccount } from "@/system";
+import { commands } from "@/commands.gen";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/columns/_layout/create-group")({
 	loader: async () => {
-		const contacts = await NostrAccount.getContactList();
-		return contacts;
+		const res = await commands.getContactList();
+
+		if (res.status === "ok") {
+			return res.data;
+		} else {
+			throw new Error(res.error);
+		}
 	},
 });

src/routes/columns/_layout/gallery.lazy.tsx

@@ -56,9 +56,9 @@ function Screen() {
 						<button
 							type="button"
 							onClick={() => install(column)}
-							className="text-xs uppercase font-semibold w-max h-7 pl-2.5 pr-2 hidden group-hover:inline-flex items-center justify-center rounded-full bg-neutral-200 hover:bg-blue-500 hover:text-white dark:bg-black/10"
+							className="text-xs uppercase font-semibold w-16 h-7 hidden group-hover:inline-flex items-center justify-center rounded-full bg-neutral-200 hover:bg-blue-500 hover:text-white dark:bg-black/10"
 						>
-							Install
+							Open
 						</button>
 					</div>
 				))}

src/routes/columns/_layout/global.tsx

@@ -1,10 +1,8 @@
-import { Spinner } from "@/components";
-import { Conversation } from "@/components/conversation";
-import { Quote } from "@/components/quote";
-import { RepostNote } from "@/components/repost";
-import { TextNote } from "@/components/text";
-import { type LumeEvent, NostrQuery } from "@/system";
-import { type ColumnRouteSearch, Kind } from "@/types";
+import { commands } from "@/commands.gen";
+import { toLumeEvents } from "@/commons";
+import { Quote, RepostNote, Spinner, TextNote } from "@/components";
+import type { LumeEvent } from "@/system";
+import { Kind } from "@/types";
 import { ArrowCircleRight } from "@phosphor-icons/react";
 import * as ScrollArea from "@radix-ui/react-scroll-area";
 import { useInfiniteQuery } from "@tanstack/react-query";
@@ -13,17 +11,6 @@ import { useCallback, useRef } from "react";
 import { Virtualizer } from "virtua";
 
 export const Route = createFileRoute("/columns/_layout/global")({
-	validateSearch: (search: Record<string, string>): ColumnRouteSearch => {
-		return {
-			account: search.account,
-			label: search.label,
-			name: search.name,
-		};
-	},
-	beforeLoad: async () => {
-		const settings = await NostrQuery.getUserSettings();
-		return { settings };
-	},
 	component: Screen,
 });
 
@@ -40,8 +27,14 @@ export function Screen() {
 		queryKey: [label, account],
 		initialPageParam: 0,
 		queryFn: async ({ pageParam }: { pageParam: number }) => {
-			const events = await NostrQuery.getGlobalEvents(pageParam);
-			return events;
+			const until = pageParam > 0 ? pageParam.toString() : undefined;
+			const res = await commands.getGlobalEvents(until);
+
+			if (res.status === "error") {
+				throw new Error(res.error);
+			}
+
+			return toLumeEvents(res.data);
 		},
 		getNextPageParam: (lastPage) => lastPage?.at(-1)?.created_at - 1,
 		select: (data) => data?.pages.flat(),
@@ -57,15 +50,11 @@ export function Screen() {
 				case Kind.Repost:
 					return <RepostNote key={event.id} event={event} className="mb-3" />;
 				default: {
-					if (event.isConversation) {
-						return (
-							<Conversation key={event.id} className="mb-3" event={event} />
-						);
-					}
 					if (event.isQuote) {
 						return <Quote key={event.id} event={event} className="mb-3" />;
+					} else {
+						return <TextNote key={event.id} event={event} className="mb-3" />;
 					}
-					return <TextNote key={event.id} event={event} className="mb-3" />;
 				}
 			}
 		},
@@ -81,12 +70,10 @@ export function Screen() {
 			<ScrollArea.Viewport ref={ref} className="h-full px-3 pb-3">
 				<Virtualizer scrollRef={ref}>
 					{isFetching && !isLoading && !isFetchingNextPage ? (
-						<div className="flex items-center justify-center w-full mb-3 h-12 bg-black/5 dark:bg-white/5 rounded-xl">
-							<div className="flex items-center justify-center gap-2">
-								<Spinner className="size-5" />
-								<span className="text-sm font-medium">
-									Getting new notes...
-								</span>
+						<div className="z-50 fixed top-0 left-0 w-full h-14 flex items-center justify-center px-3">
+							<div className="w-max h-8 pl-2 pr-3 inline-flex items-center justify-center gap-1.5 rounded-full shadow-lg text-sm font-medium text-white bg-black dark:text-black dark:bg-white">
+								<Spinner className="size-4" />
+								Getting new notes...
 							</div>
 						</div>
 					) : null}
@@ -96,13 +83,13 @@ export function Screen() {
 							<span className="text-sm font-medium">Loading...</span>
 						</div>
 					) : !data.length ? (
-						<div className="flex items-center justify-center">
-							Yo. You're catching up on all the things happening around you.
+						<div className="mb-3 flex items-center justify-center h-20 text-sm rounded-xl bg-black/5 dark:bg-white/5">
+							🎉 Yo. You're catching up on all latest notes.
 						</div>
 					) : (
 						data.map((item) => renderItem(item))
 					)}
-					{data?.length && hasNextPage ? (
+					{hasNextPage ? (
 						<div>
 							<button
 								type="button"

src/routes/columns/_layout/notification.lazy.tsx

@@ -1,9 +1,8 @@
+import { commands } from "@/commands.gen";
 import { decodeZapInvoice, formatCreatedAt } from "@/commons";
-import { Spinner } from "@/components";
-import { Note } from "@/components/note";
-import { User } from "@/components/user";
-import { type LumeEvent, NostrQuery, useEvent } from "@/system";
-import { Kind } from "@/types";
+import { Note, Spinner, User } from "@/components";
+import { LumeEvent, useEvent } from "@/system";
+import { Kind, type NostrEvent } from "@/types";
 import { Info, Repeat } from "@phosphor-icons/react";
 import * as ScrollArea from "@radix-ui/react-scroll-area";
 import * as Tabs from "@radix-ui/react-tabs";
@@ -24,7 +23,15 @@ function Screen() {
 	const { isLoading, data } = useQuery({
 		queryKey: ["notification", account],
 		queryFn: async () => {
-			const events = await NostrQuery.getNotifications();
+			const res = await commands.getNotifications();
+
+			if (res.status === "error") {
+				throw new Error(res.error);
+			}
+
+			const data: NostrEvent[] = res.data.map((item) => JSON.parse(item));
+			const events = data.map((ev) => new LumeEvent(ev));
+
 			return events;
 		},
 		select: (events) => {