chore: minor fixes and updates

apps/desktop/src/routes/auth/create.tsx

@@ -147,6 +147,10 @@ export function CreateAccountScreen() {
 
 		ark.updateNostrSigner({ signer: remoteSigner });
 
+		// remove default nsecbunker profile and contact list
+		await ark.createEvent({ kind: NDKKind.Metadata, content: "", tags: [] });
+		await ark.createEvent({ kind: NDKKind.Contacts, content: "", tags: [] });
+
 		setOnboarding(true);
 		setIsLoading(false);
 
@@ -163,8 +167,8 @@ export function CreateAccountScreen() {
 						Let's get you set up on Nostr.
 					</h1>
 					<p className="text-lg font-medium leading-snug text-neutral-600 dark:text-neutral-500">
-						With an account on Nostr, you'll be able to use with any client that
-						you want.
+						With an account on Nostr, you'll be able to travel across all nostr
+						clients, all your data are synced.
 					</p>
 				</div>
 				{!services ? (
@@ -260,13 +264,22 @@ export function CreateAccountScreen() {
 									</span>
 								</div>
 							</div>
-							<button
-								type="button"
-								onClick={generateNostrKeys}
-								className="inline-flex items-center justify-center w-full h-12 text-lg font-medium text-neutral-50 rounded-xl bg-neutral-950 hover:bg-neutral-900"
-							>
-								Generate Nostr keys
-							</button>
+							<div>
+								<button
+									type="button"
+									onClick={generateNostrKeys}
+									className="mb-2 inline-flex items-center justify-center w-full h-12 text-lg font-medium text-neutral-50 rounded-xl bg-neutral-950 hover:bg-neutral-900"
+								>
+									Generate Nostr Keys
+								</button>
+								<p className="text-sm text-center text-neutral-500">
+									If you are using this option, please make sure keep your keys
+									in safe place. You{" "}
+									<span className="text-red-600">cannot recover</span> if it
+									lost, all your data will be{" "}
+									<span className="text-red-600">lost forever.</span>
+								</p>
+							</div>
 						</div>
 					</div>
 				)}

apps/desktop/src/routes/auth/onboarding.tsx

@@ -1,15 +1,19 @@
 import { useStorage } from "@lume/ark";
-import { InfoIcon } from "@lume/icons";
+import { InfoIcon, LoaderIcon } from "@lume/icons";
+import { delay } from "@lume/utils";
 import * as Switch from "@radix-ui/react-switch";
 import {
 	isPermissionGranted,
 	requestPermission,
 } from "@tauri-apps/plugin-notification";
 import { useEffect, useState } from "react";
-import { Link } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 
 export function OnboardingScreen() {
 	const storage = useStorage();
+	const navigate = useNavigate();
+
+	const [loading, setLoading] = useState(false);
 	const [settings, setSettings] = useState({
 		autoupdate: false,
 		notification: false,
@@ -27,6 +31,12 @@ export function OnboardingScreen() {
 		setSettings((prev) => ({ ...prev, notification: !settings.notification }));
 	};
 
+	const completeAuth = async () => {
+		setLoading(true);
+		await delay(1200);
+		navigate("/");
+	};
+
 	useEffect(() => {
 		async function loadSettings() {
 			const permissionGranted = await isPermissionGranted();
@@ -100,12 +110,17 @@ export function OnboardingScreen() {
 							"Settings" screen. Be sure to visit it later.
 						</p>
 					</div>
-					<Link
-						to="/"
+					<button
+						type="button"
+						onClick={completeAuth}
 						className="inline-flex items-center justify-center w-full h-12 text-lg font-medium text-white bg-blue-500 rounded-xl hover:bg-blue-600 disabled:opacity-50"
 					>
-						Continue
-					</Link>
+						{loading ? (
+							<LoaderIcon className="size-5 animate-spin" />
+						) : (
+							"Continue"
+						)}
+					</button>
 				</div>
 			</div>
 		</div>

apps/desktop/src/routes/users/index.tsx

@@ -77,13 +77,13 @@ export function UserScreen() {
 								type="button"
 								onClick={() => fetchNextPage()}
 								disabled={!hasNextPage || isFetchingNextPage}
-								className="inline-flex h-10 w-max items-center justify-center gap-2 rounded-full bg-blue-500 px-6 font-medium text-white hover:bg-blue-600 focus:outline-none"
+								className="inline-flex items-center justify-center w-full h-12 gap-2 font-medium bg-neutral-100 hover:bg-neutral-200 dark:bg-neutral-900 dark:hover:bg-neutral-800 rounded-xl focus:outline-none"
 							>
 								{isFetchingNextPage ? (
-									<LoaderIcon className="h-4 w-4 animate-spin" />
+									<LoaderIcon className="size-5 animate-spin" />
 								) : (
 									<>
-										<ArrowRightCircleIcon className="h-5 w-5" />
+										<ArrowRightCircleIcon className="size-5" />
 										Load more
 									</>
 								)}