feat: improve some functions

src-tauri/src/commands/account.rs

@@ -45,6 +45,15 @@ pub async fn get_metadata(id: String, state: State<'_, Nostr>) -> Result<String,
 	}
 }
 
+#[tauri::command]
+#[specta::specta]
+pub fn delete_account(id: String) -> Result<(), String> {
+	let keyring = Entry::new("coop", &id).map_err(|e| e.to_string())?;
+	let _ = keyring.delete_credential();
+
+	Ok(())
+}
+
 #[tauri::command]
 #[specta::specta]
 pub async fn create_account(
@@ -258,7 +267,7 @@ pub async fn login(
 				.get_events_from(
 					urls.clone(),
 					vec![Filter::new().kind(Kind::TextNote).limit(0)],
-					None,
+					Some(Duration::from_secs(5)),
 				)
 				.await;
 

src-tauri/src/main.rs

@@ -19,17 +19,13 @@ pub struct Nostr {
 }
 
 // TODO: Allow user config bootstrap relays.
-pub const BOOTSTRAP_RELAYS: [&str; 4] = [
+pub const BOOTSTRAP_RELAYS: [&str; 2] = ["wss://relay.damus.io/", "wss://relay.nostr.net/"];
-	"wss://relay.damus.io/",
-	"wss://relay.nostr.net/",
-	"wss://relay.0xchat.com/",
-	"wss://auth.nostr1.com/",
-];
 
 fn main() {
 	let invoke_handler = {
 		let builder = tauri_specta::ts::builder().commands(tauri_specta::collect_commands![
 			login,
+			delete_account,
 			create_account,
 			import_key,
 			connect_account,

src/commands.ts

@@ -12,6 +12,14 @@ try {
     else return { status: "error", error: e  as any };
 }
 },
+async deleteAccount(id: string) : Promise<Result<null, string>> {
+try {
+    return { status: "ok", data: await TAURI_INVOKE("delete_account", { id }) };
+} catch (e) {
+    if(e instanceof Error) throw e;
+    else return { status: "error", error: e  as any };
+}
+},
 async createAccount(name: string, picture: string | null) : Promise<Result<string, string>> {
 try {
     return { status: "ok", data: await TAURI_INVOKE("create_account", { name, picture }) };

src/routes/$account.chats.$id.lazy.tsx

@@ -2,7 +2,8 @@ import { commands } from "@/commands";
 import { cn, getReceivers, groupEventByDate, time } from "@/commons";
 import { Spinner } from "@/components/spinner";
 import { User } from "@/components/user";
-import { ArrowUp } from "@phosphor-icons/react";
+import { CoopIcon } from "@/icons/coop";
+import { ArrowUp, Paperclip } from "@phosphor-icons/react";
 import * as ScrollArea from "@radix-ui/react-scroll-area";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { createLazyFileRoute } from "@tanstack/react-router";
@@ -233,6 +234,9 @@ function List() {
 							-1.5;
 					}}
 				>
+					<div className="h-20 flex items-center justify-center">
+						<CoopIcon className="size-10 text-neutral-200 dark:text-neutral-800" />
+					</div>
 					{isLoading ? (
 						<>
 							<div className="flex items-center gap-3 my-1.5 px-3">
@@ -313,12 +317,12 @@ function Form() {
 			) : (
 				<div className="flex-1 flex items-center gap-2">
 					<div className="inline-flex gap-1">
-						{/*<div
+						<div
 							title="Attach media"
 							className="size-9 inline-flex items-center justify-center hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-full"
 						>
 							<Paperclip className="size-5" />
-						</div>*/}
+						</div>
 					</div>
 					<input
 						placeholder="Message..."

src/routes/$account.chats.lazy.tsx

@@ -158,7 +158,7 @@ function ChatList() {
 			className="relative overflow-hidden flex-1 w-full"
 		>
 			<ScrollArea.Viewport className="relative h-full px-1.5">
-				{isLoading || !isSync ? (
+				{isLoading ? (
 					<>
 						{[...Array(5).keys()].map((i) => (
 							<div
@@ -210,25 +210,7 @@ function ChatList() {
 					))
 				)}
 			</ScrollArea.Viewport>
-			{!isSync ? (
+			{!isSync && !data ? <SyncPopup progress={progress} /> : null}
-				<div className="absolute bottom-0 w-full p-4">
-					<div className="flex flex-col items-center gap-1.5">
-						<Progress.Root
-							className="relative overflow-hidden bg-black/20 dark:bg-white/20 rounded-full w-full h-1"
-							style={{
-								transform: "translateZ(0)",
-							}}
-							value={progress}
-						>
-							<Progress.Indicator
-								className="bg-blue-500 size-full transition-transform duration-[660ms] ease-[cubic-bezier(0.65, 0, 0.35, 1)]"
-								style={{ transform: `translateX(-${100 - progress}%)` }}
-							/>
-						</Progress.Root>
-						<span className="text-center text-xs">Syncing message...</span>
-					</div>
-				</div>
-			) : null}
 			<ScrollArea.Scrollbar
 				className="flex select-none touch-none p-0.5 duration-[160ms] ease-out data-[orientation=vertical]:w-2"
 				orientation="vertical"
@@ -240,6 +222,28 @@ function ChatList() {
 	);
 }
 
+function SyncPopup({ progress }: { progress: number }) {
+	return (
+		<div className="absolute bottom-0 w-full p-4">
+			<div className="relative flex flex-col items-center gap-1.5">
+				<Progress.Root
+					className="relative overflow-hidden bg-black/20 dark:bg-white/20 rounded-full w-full h-1"
+					style={{
+						transform: "translateZ(0)",
+					}}
+					value={progress}
+				>
+					<Progress.Indicator
+						className="bg-blue-500 size-full transition-transform duration-[660ms] ease-[cubic-bezier(0.65, 0, 0.35, 1)]"
+						style={{ transform: `translateX(-${100 - progress}%)` }}
+					/>
+				</Progress.Root>
+				<span className="text-center text-xs">Syncing message...</span>
+			</div>
+		</div>
+	);
+}
+
 function Compose() {
 	const [isOpen, setIsOpen] = useState(false);
 	const [target, setTarget] = useState("");

src/routes/index.lazy.tsx

@@ -3,9 +3,9 @@ import { npub } from "@/commons";
 import { Frame } from "@/components/frame";
 import { Spinner } from "@/components/spinner";
 import { User } from "@/components/user";
-import { Plus } from "@phosphor-icons/react";
+import { Plus, X } from "@phosphor-icons/react";
 import { Link, createLazyFileRoute } from "@tanstack/react-router";
-import { useMemo, useState, useTransition } from "react";
+import { useEffect, useMemo, useState, useTransition } from "react";
 
 export const Route = createLazyFileRoute("/")({
 	component: Screen,
@@ -25,9 +25,18 @@ function Screen() {
 		[],
 	);
 
+	const [accounts, setAccounts] = useState([]);
 	const [value, setValue] = useState("");
 	const [isPending, startTransition] = useTransition();
 
+	const deleteAccount = async (npub: string) => {
+		const res = await commands.deleteAccount(npub);
+
+		if (res.status === "ok") {
+			setAccounts((prev) => prev.filter((item) => item !== npub));
+		}
+	};
+
 	const loginWith = async (npub: string) => {
 		setValue(npub);
 		startTransition(async () => {
@@ -51,6 +60,10 @@ function Screen() {
 		});
 	};
 
+	useEffect(() => {
+		setAccounts(context.accounts);
+	}, [context.accounts]);
+
 	return (
 		<div
 			data-tauri-drag-region
@@ -67,12 +80,12 @@ function Screen() {
 					className="flex flex-col w-full divide-y divide-neutral-100 dark:divide-white/5 rounded-xl overflow-hidden"
 					shadow
 				>
-					{context.accounts.map((account) => (
+					{accounts.map((account) => (
 						<div
 							key={account}
 							onClick={() => loginWith(account)}
 							onKeyDown={() => loginWith(account)}
-							className="flex items-center justify-between hover:bg-black/5 dark:hover:bg-white/5"
+							className="group flex items-center justify-between hover:bg-black/5 dark:hover:bg-white/5"
 						>
 							<User.Provider pubkey={account}>
 								<User.Root className="flex items-center gap-2.5 p-3">
@@ -86,7 +99,17 @@ function Screen() {
 								</User.Root>
 							</User.Provider>
 							<div className="inline-flex items-center justify-center size-10">
-								{value === account && isPending ? <Spinner /> : null}
+								{value === account && isPending ? (
+									<Spinner />
+								) : (
+									<button
+										type="button"
+										onClick={() => deleteAccount(account)}
+										className="size-10 hidden group-hover:flex items-center justify-center text-neutral-600 dark:text-neutral-400"
+									>
+										<X className="size-4" />
+									</button>
+								)}
 							</div>
 						</div>
 					))}