feat: migrate frontend to new backend

packages/ark/src/ark.ts

@@ -5,7 +5,18 @@ export class Ark {
 	public account: CurrentAccount;
 
 	constructor() {
-		this.account = null;
+		this.account = { pubkey: "" };
+	}
+
+	public async verify_signer() {
+		try {
+			const cmd: string = await invoke("verify_signer");
+			if (!cmd) return false;
+			this.account.pubkey = cmd;
+			return true;
+		} catch (e) {
+			console.error(String(e));
+		}
 	}
 
 	public async event_to_bech32(id: string, relays: string[]) {
@@ -15,8 +26,8 @@ export class Ark {
 				relays,
 			});
 			return cmd;
-		} catch {
-			console.error("get nevent id failed");
+		} catch (e) {
+			console.error(String(e));
 		}
 	}
 
@@ -26,7 +37,70 @@ export class Ark {
 			const event = JSON.parse(cmd) as Event;
 			return event;
 		} catch (e) {
-			console.error("failed to get event", id);
+			console.error(String(e));
+		}
+	}
+
+	public async get_text_events(limit: number, until?: number) {
+		try {
+			const cmd: Event[] = await invoke("get_text_events", { limit, until });
+			return cmd;
+		} catch (e) {
+			console.error(String(e));
+		}
+	}
+
+	public async publish(content: string) {
+		try {
+			const cmd: string = await invoke("publish", { content });
+			return cmd;
+		} catch (e) {
+			console.error(String(e));
+		}
+	}
+
+	public async reply_to(content: string, tags: string[]) {
+		try {
+			const cmd: string = await invoke("reply_to", { content, tags });
+			return cmd;
+		} catch (e) {
+			console.error(String(e));
+		}
+	}
+
+	public async repost(id: string, pubkey: string) {
+		try {
+			const cmd: string = await invoke("repost", { id, pubkey });
+			return cmd;
+		} catch (e) {
+			console.error(String(e));
+		}
+	}
+
+	public async upvote(id: string, pubkey: string) {
+		try {
+			const cmd: string = await invoke("upvote", { id, pubkey });
+			return cmd;
+		} catch (e) {
+			console.error(String(e));
+		}
+	}
+
+	public async downvote(id: string, pubkey: string) {
+		try {
+			const cmd: string = await invoke("downvote", { id, pubkey });
+			return cmd;
+		} catch (e) {
+			console.error(String(e));
+		}
+	}
+
+	public async get_event_thread(id: string) {
+		try {
+			const cmd: Event[] = await invoke("get_event_thread", { id });
+			return cmd;
+		} catch (e) {
+			console.error(String(e));
 		}
 	}
 
@@ -72,7 +146,7 @@ export class Ark {
 			const cmd: Metadata = await invoke("get_profile", { id });
 			return cmd;
 		} catch (e) {
-			console.error("failed to get profile", id);
+			console.error(String(e));
 		}
 	}
 
@@ -83,8 +157,8 @@ export class Ark {
 				relays,
 			});
 			return cmd;
-		} catch {
-			console.error("get nprofile id failed");
+		} catch (e) {
+			console.error(String(e));
 		}
 	}
 }

packages/ark/src/components/note/buttons/pin.tsx

@@ -1,15 +1,11 @@
 import { PinIcon } from "@lume/icons";
-import { COL_TYPES } from "@lume/utils";
 import * as Tooltip from "@radix-ui/react-tooltip";
 import { useTranslation } from "react-i18next";
-import { useColumnContext } from "../../column/provider";
 import { useNoteContext } from "../provider";
 
 export function NotePin() {
 	const event = useNoteContext();
-
 	const { t } = useTranslation();
-	const { addColumn } = useColumnContext();
 
 	return (
 		<Tooltip.Provider>
@@ -17,13 +13,6 @@ export function NotePin() {
 				<Tooltip.Trigger asChild>
 					<button
 						type="button"
-						onClick={async () =>
-							await addColumn({
-								kind: COL_TYPES.thread,
-								title: "Thread",
-								content: event.id,
-							})
-						}
 						className="inline-flex items-center justify-center gap-2 pl-2 pr-3 text-sm font-medium rounded-full h-7 w-max bg-neutral-100 hover:bg-neutral-200 dark:hover:bg-neutral-800 dark:bg-neutral-900"
 					>
 						<PinIcon className="size-4" />

packages/ark/src/components/note/content.tsx

@@ -1,3 +1,4 @@
+import { useStorage } from "@lume/storage";
 import { Kind } from "@lume/types";
 import {
 	AUDIOS,
@@ -31,6 +32,7 @@ export function NoteContent({
 }: {
 	className?: string;
 }) {
+	const storage = useStorage();
 	const event = useNoteContext();
 
 	const [content, setContent] = useState(event.content);
@@ -221,7 +223,7 @@ export function NoteContent({
 		}
 	};
 
-	if (event.kind !== NDKKind.Text) {
+	if (event.kind !== Kind.Text) {
 		return <NIP89 className={className} />;
 	}
 

packages/ark/src/components/note/mentions/user.tsx

@@ -2,17 +2,11 @@ import { COL_TYPES } from "@lume/utils";
 import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
-import { useArk } from "../../../hooks/useArk";
 import { useProfile } from "../../../hooks/useProfile";
-import { useColumnContext } from "../../column/provider";
 
 export function MentionUser({ pubkey }: { pubkey: string }) {
-	const ark = useArk();
-	const cleanPubkey = ark.getCleanPubkey(pubkey);
-
 	const { isLoading, isError, user } = useProfile(pubkey);
 	const { t } = useTranslation();
-	const { addColumn } = useColumnContext();
 
 	return (
 		<DropdownMenu.Root>
@@ -21,12 +15,12 @@ export function MentionUser({ pubkey }: { pubkey: string }) {
 					? "@anon"
 					: isError
 					  ? pubkey
-					  : `@${user?.name || user?.displayName || user?.username || "anon"}`}
+					  : `@${user?.name || user?.display_name || user?.name || "anon"}`}
 			</DropdownMenu.Trigger>
 			<DropdownMenu.Content className="flex w-[200px] p-2 flex-col overflow-hidden rounded-2xl bg-white/50 dark:bg-black/50 ring-1 ring-black/10 dark:ring-white/10 backdrop-blur-2xl focus:outline-none">
 				<DropdownMenu.Item asChild>
 					<Link
-						to={`/users/${cleanPubkey}`}
+						to={`/users/${pubkey}`}
 						className="inline-flex items-center gap-3 px-3 text-sm font-medium rounded-lg h-9 text-black/70 hover:bg-black/10 hover:text-black focus:outline-none dark:text-white/70 dark:hover:bg-white/10 dark:hover:text-white"
 					>
 						{t("note.buttons.viewProfile")}
@@ -35,13 +29,6 @@ export function MentionUser({ pubkey }: { pubkey: string }) {
 				<DropdownMenu.Item asChild>
 					<button
 						type="button"
-						onClick={async () =>
-							await addColumn({
-								kind: COL_TYPES.user,
-								title: user?.name || user?.displayName || "User",
-								content: cleanPubkey,
-							})
-						}
 						className="inline-flex items-center gap-3 px-3 text-sm font-medium rounded-lg h-9 text-black/70 hover:bg-black/10 hover:text-black focus:outline-none dark:text-white/70 dark:hover:bg-white/10 dark:hover:text-white"
 					>
 						{t("note.buttons.pin")}

packages/ark/src/components/note/menu.tsx

@@ -5,7 +5,6 @@ import { writeText } from "@tauri-apps/plugin-clipboard-manager";
 import { useTranslation } from "react-i18next";
 import { Link, useNavigate } from "react-router-dom";
 import { useArk } from "../../hooks/useArk";
-import { useColumnContext } from "../column/provider";
 import { useNoteContext } from "./provider";
 
 export function NoteMenu() {
@@ -14,7 +13,6 @@ export function NoteMenu() {
 	const navigate = useNavigate();
 
 	const { t } = useTranslation();
-	const { addColumn } = useColumnContext();
 
 	const copyID = async () => {
 		await writeText(await ark.event_to_bech32(event.id, [""]));
@@ -93,13 +91,6 @@ export function NoteMenu() {
 					<DropdownMenu.Item asChild>
 						<button
 							type="button"
-							onClick={() =>
-								addColumn({
-									kind: COL_TYPES.user,
-									title: "User",
-									content: event.pubkey,
-								})
-							}
 							className="inline-flex items-center gap-3 px-3 text-sm font-medium rounded-lg h-9 text-black/70 hover:bg-black/10 hover:text-black focus:outline-none dark:text-white/70 dark:hover:bg-white/10 dark:hover:text-white"
 						>
 							{t("note.menu.pinAuthor")}

packages/ark/src/components/note/primitives/childReply.tsx

@@ -1,9 +1,7 @@
-import { NDKEvent } from "@nostr-dev-kit/ndk";
+import { Event } from "@lume/types";
 import { Note } from "..";
 
-export function ChildReply({
-	event,
-}: { event: NDKEvent; rootEventId?: string }) {
+export function ChildReply({ event }: { event: Event; rootEventId?: string }) {
 	return (
 		<Note.Provider event={event}>
 			<Note.Root className="py-2">

packages/ark/src/components/note/primitives/repost.tsx

@@ -1,6 +1,6 @@
 import { RepostIcon } from "@lume/icons";
+import { Event } from "@lume/types";
 import { cn } from "@lume/utils";
-import { NDKEvent, NostrEvent } from "@nostr-dev-kit/ndk";
 import { useQuery } from "@tanstack/react-query";
 import { useTranslation } from "react-i18next";
 import { Note } from "..";
@@ -10,7 +10,7 @@ import { User } from "../../user";
 export function RepostNote({
 	event,
 	className,
-}: { event: NDKEvent; className?: string }) {
+}: { event: Event; className?: string }) {
 	const ark = useArk();
 
 	const { t } = useTranslation();
@@ -23,11 +23,11 @@ export function RepostNote({
 		queryFn: async () => {
 			try {
 				if (event.content.length > 50) {
-					const embed = JSON.parse(event.content) as NostrEvent;
-					return new NDKEvent(ark.ndk, embed);
+					const embed = JSON.parse(event.content) as Event;
+					return embed;
 				}
 				const id = event.tags.find((el) => el[0] === "e")[1];
-				return await ark.getEventById(id);
+				return await ark.get_event(id);
 			} catch {
 				throw new Error("Failed to get repost event");
 			}

packages/ark/src/components/note/primitives/text.tsx

@@ -1,11 +1,11 @@
+import { Event } from "@lume/types";
 import { cn } from "@lume/utils";
-import { NDKEvent } from "@nostr-dev-kit/ndk";
 import { Note } from "..";
 
 export function TextNote({
 	event,
 	className,
-}: { event: NDKEvent; className?: string }) {
+}: { event: Event; className?: string }) {
 	return (
 		<Note.Provider event={event}>
 			<Note.Root

packages/ark/src/components/note/primitives/thread.tsx

@@ -21,7 +21,7 @@ export function ThreadNote({ eventId }: { eventId: string }) {
 								<div className="inline-flex items-center gap-2 text-sm text-neutral-600 dark:text-neutral-400">
 									<User.Time time={data.created_at} />
 									<span>·</span>
-									<User.NIP05 pubkey={data.pubkey} />
+									<User.NIP05 />
 								</div>
 							</div>
 						</User.Root>

packages/ark/src/components/note/provider.tsx

@@ -1,12 +1,12 @@
-import { NDKEvent } from "@nostr-dev-kit/ndk";
+import { Event } from "@lume/types";
 import { ReactNode, createContext, useContext } from "react";
 
-const EventContext = createContext<NDKEvent>(null);
+const EventContext = createContext<Event>(null);
 
 export function NoteProvider({
 	event,
 	children,
-}: { event: NDKEvent; children: ReactNode }) {
+}: { event: Event; children: ReactNode }) {
 	return (
 		<EventContext.Provider value={event}>{children}</EventContext.Provider>
 	);

packages/ark/src/components/note/thread.tsx

@@ -20,7 +20,6 @@ export function NoteThread({
 	});
 
 	const { t } = useTranslation();
-	const { addColumn } = useColumnContext();
 
 	if (!thread) return null;
 
@@ -42,13 +41,6 @@ export function NoteThread({
 					</Link>
 					<button
 						type="button"
-						onClick={async () =>
-							await addColumn({
-								kind: COL_TYPES.thread,
-								title: "Thread",
-								content: thread?.rootEventId || thread?.replyEventId,
-							})
-						}
 						className="inline-flex items-center justify-center rounded-md text-neutral-600 dark:text-neutral-400 size-6 bg-neutral-200 dark:bg-neutral-800 hover:bg-neutral-300 dark:hover:bg-neutral-700"
 					>
 						<PinIcon className="size-4" />

packages/ark/src/components/note/user.tsx

@@ -36,10 +36,7 @@ export function NoteUser({
 							<div className="flex flex-col gap-2">
 								<div>
 									<User.Name className="font-semibold leading-tight" />
-									<User.NIP05
-										pubkey={event.pubkey}
-										className="text-neutral-600 dark:text-neutral-400"
-									/>
+									<User.NIP05 className="text-neutral-600 dark:text-neutral-400" />
 								</div>
 								<User.About className="line-clamp-3" />
 								<Link

packages/ark/src/components/user/about.tsx

@@ -4,7 +4,7 @@ import { useUserContext } from "./provider";
 export function UserAbout({ className }: { className?: string }) {
 	const user = useUserContext();
 
-	if (!user) {
+	if (!user.profile) {
 		return (
 			<div className="flex flex-col gap-1">
 				<div

packages/ark/src/components/user/avatar.tsx

@@ -18,7 +18,7 @@ export function UserAvatar({ className }: { className?: string }) {
 		[user],
 	);
 
-	if (!user) {
+	if (!user.profile) {
 		return (
 			<div className="shrink-0">
 				<div

packages/ark/src/components/user/name.tsx

@@ -4,7 +4,7 @@ import { useUserContext } from "./provider";
 export function UserName({ className }: { className?: string }) {
 	const user = useUserContext();
 
-	if (!user) {
+	if (!user.profile) {
 		return (
 			<div
 				className={cn(

packages/ark/src/components/user/nip05.tsx

@@ -16,7 +16,7 @@ export function UserNip05({ className }: { className?: string }) {
 		enabled: !!user,
 	});
 
-	if (!user) {
+	if (!user.profile) {
 		return (
 			<div
 				className={cn(

packages/ark/src/provider.tsx

@@ -1,4 +1,4 @@
-import { PropsWithChildren, createContext, useMemo } from "react";
+import { PropsWithChildren, createContext, useEffect, useMemo } from "react";
 import { Ark } from "./ark";
 
 export const ArkContext = createContext<Ark>(undefined);

packages/lume-column-timeline/src/home.tsx

@@ -1,5 +1,6 @@
 import { RepostNote, TextNote, useArk } from "@lume/ark";
 import { ArrowRightCircleIcon, LoaderIcon, SearchIcon } from "@lume/icons";
+import { Event, Kind } from "@lume/types";
 import { EmptyFeed } from "@lume/ui";
 import { FETCH_LIMIT } from "@lume/utils";
 import { NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
@@ -30,18 +31,7 @@ export function HomeRoute({ colKey }: { colKey: string }) {
 				signal: AbortSignal;
 				pageParam: number;
 			}) => {
-				if (!ark.account.contacts.length) return [];
-
-				const events = await ark.getInfiniteEvents({
-					filter: {
-						kinds: [NDKKind.Text, NDKKind.Repost],
-						authors: ark.account.contacts,
-					},
-					limit: FETCH_LIMIT,
-					pageParam,
-					signal,
-				});
-
+				const events = await ark.get_text_events(FETCH_LIMIT);
 				return events;
 			},
 			getNextPageParam: (lastPage) => {
@@ -54,11 +44,11 @@ export function HomeRoute({ colKey }: { colKey: string }) {
 			refetchOnMount: false,
 		});
 
-	const renderItem = (event: NDKEvent) => {
+	const renderItem = (event: Event) => {
 		switch (event.kind) {
-			case NDKKind.Text:
+			case Kind.Text:
 				return <TextNote key={event.id} event={event} className="mt-3" />;
-			case NDKKind.Repost:
+			case Kind.Repost:
 				return <RepostNote key={event.id} event={event} className="mt-3" />;
 			default:
 				return <TextNote key={event.id} event={event} className="mt-3" />;
@@ -81,6 +71,7 @@ export function HomeRoute({ colKey }: { colKey: string }) {
 		};
 	}, []);
 
+	/*
 	if (!ark.account.contacts.length) {
 		return (
 			<div className="px-3 mt-3">
@@ -95,6 +86,7 @@ export function HomeRoute({ colKey }: { colKey: string }) {
 			</div>
 		);
 	}
+	*/
 
 	return (
 		<div className="w-full h-full">

packages/lume-column-timeline/src/index.tsx

@@ -1,17 +1,15 @@
-import { Column, useArk } from "@lume/ark";
+import { Column } from "@lume/ark";
 import { IColumn } from "@lume/types";
 import { EventRoute, SuggestRoute, UserRoute } from "@lume/ui";
-import { NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
-import { useQueryClient } from "@tanstack/react-query";
-import { useRef } from "react";
 import { HomeRoute } from "./home";
 
 export function Timeline({ column }: { column: IColumn }) {
 	const colKey = `timeline-${column.id}`;
-	const ark = useArk();
-	const queryClient = useQueryClient();
-	const since = useRef(Math.floor(Date.now() / 1000));
+	// const ark = useArk();
+	// const queryClient = useQueryClient();
+	// const since = useRef(Math.floor(Date.now() / 1000));
 
+	/*
 	const refresh = async (events: NDKEvent[]) => {
 		const uniqEvents = new Set(events);
 		await queryClient.setQueryData(
@@ -22,11 +20,12 @@ export function Timeline({ column }: { column: IColumn }) {
 			}),
 		);
 	};
+	*/
 
 	return (
 		<Column.Root>
-			<Column.Header id={column.id} queryKey={[colKey]} title="Timeline" />
-			{ark.account.contacts.length ? (
+			{/*<Column.Header id={column.id} queryKey={[colKey]} title="Timeline" />*/}
+			{/*ark.account.contacts.length ? (
 				<Column.Live
 					filter={{
 						kinds: [NDKKind.Text, NDKKind.Repost],
@@ -35,15 +34,17 @@ export function Timeline({ column }: { column: IColumn }) {
 					}}
 					onClick={refresh}
 				/>
-			) : null}
+				) : null*/}
 			<Column.Content>
 				<Column.Route path="/" element={<HomeRoute colKey={colKey} />} />
-				<Column.Route path="/events/:id" element={<EventRoute />} />
-				<Column.Route path="/users/:id" element={<UserRoute />} />
-				<Column.Route
-					path="/suggest"
-					element={<SuggestRoute queryKey={[colKey]} />}
-				/>
+				{/*
+					<Column.Route path="/events/:id" element={<EventRoute />} />
+					<Column.Route path="/users/:id" element={<UserRoute />} />
+					<Column.Route
+						path="/suggest"
+						element={<SuggestRoute queryKey={[colKey]} />}
+					/>
+				*/}
 			</Column.Content>
 		</Column.Root>
 	);

packages/types/index.d.ts

@@ -41,9 +41,10 @@ export interface Metadata {
 }
 
 export interface CurrentAccount {
-	npub: string;
-	contacts: string[];
-	interests: Interests;
+	pubkey: string;
+	npub?: string;
+	contacts?: string[];
+	interests?: Interests;
 }
 
 export interface Interests {

packages/ui/src/account/active.tsx

@@ -29,7 +29,7 @@ export function ActiveAccount() {
 				<div className="relative">
 					<Avatar.Root>
 						<Avatar.Image
-							src={user?.picture || user?.image}
+							src={user?.picture}
 							alt={ark.account.pubkey}
 							loading="lazy"
 							decoding="async"

packages/ui/src/editor/form.tsx

@@ -4,6 +4,7 @@ import { useStorage } from "@lume/storage";
 import { NDKCacheUserProfile } from "@lume/types";
 import { COL_TYPES, cn, editorValueAtom } from "@lume/utils";
 import { NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
+import { invoke } from "@tauri-apps/api/core";
 import { useAtom } from "jotai";
 import { useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -187,8 +188,6 @@ const Element = (props) => {
 };
 
 export function EditorForm() {
-	const ark = useArk();
-	const storage = useStorage();
 	const ref = useRef<HTMLDivElement | null>();
 
 	const [editorValue, setEditorValue] = useAtom(editorValueAtom);
@@ -202,7 +201,6 @@ export function EditorForm() {
 	);
 
 	const { t } = useTranslation();
-	const { addColumn } = useColumnContext();
 
 	const filters = contacts
 		?.filter((c) => c?.name?.toLowerCase().startsWith(search.toLowerCase()))
@@ -242,32 +240,24 @@ export function EditorForm() {
 		try {
 			setLoading(true);
 
-			const event = new NDKEvent(ark.ndk);
-			event.kind = NDKKind.Text;
-			event.content = serialize(editor.children);
-
-			const publish = await event.publish();
+			const content = serialize(editor.children);
+			const publish = await invoke("publish", { content });
 
 			if (publish) {
+				console.log(publish);
 				toast.success(t("editor.successMessage"));
 
-				// add current post as column thread
-				addColumn({
-					kind: COL_TYPES.thread,
-					content: event.id,
-					title: "Thread",
-				});
-
-				setLoading(false);
-
 				return reset();
 			}
+
+			setLoading(false);
 		} catch (e) {
 			setLoading(false);
 			toast.error(String(e));
 		}
 	};
 
+	/*
 	useEffect(() => {
 		async function loadContacts() {
 			const res = await storage.getAllCacheUsers();
@@ -276,6 +266,7 @@ export function EditorForm() {
 
 		loadContacts();
 	}, []);
+	*/
 
 	useEffect(() => {
 		if (target && filters.length > 0) {

packages/ui/src/search/dialog.tsx

@@ -1,4 +1,4 @@
-import { Note, User, useArk, useColumnContext } from "@lume/ark";
+import { Note, User, useArk } from "@lume/ark";
 import { LoaderIcon, SearchIcon } from "@lume/icons";
 import { COL_TYPES, searchAtom } from "@lume/utils";
 import { type NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
@@ -18,7 +18,6 @@ export function SearchDialog() {
 	const [value] = useDebounce(search, 1200);
 
 	const { t } = useTranslation();
-	const { vlistRef, columns, addColumn } = useColumnContext();
 
 	const searchEvents = async () => {
 		if (!value.length) return;