feat: improve onboarding

packages/ark/src/ark.ts

@@ -145,7 +145,7 @@ export class Ark {
 				cacheUsage: NDKSubscriptionCacheUsage.CACHE_FIRST,
 			});
 
-			if (!profile) throw new Error("user not found");
+			if (!profile) return null;
 			return profile;
 		} catch {
 			throw new Error("user not found");

packages/ui/src/onboarding/interest.tsx

@@ -57,8 +57,8 @@ export function OnboardingInterestScreen() {
 			<div className="w-full flex-1 min-h-0 flex flex-col justify-between">
 				<div className="flex-1 min-h-0 overflow-y-auto px-8 py-8">
 					<div className="flex flex-col gap-8">
-						{TOPICS.map((topic, index) => (
-							<div key={topic.title + index} className="flex flex-col gap-4">
+						{TOPICS.map((topic) => (
+							<div key={topic.title} className="flex flex-col gap-4">
 								<div className="w-full flex items-center justify-between">
 									<div className="inline-flex items-center gap-2.5">
 										<img
@@ -79,6 +79,7 @@ export function OnboardingInterestScreen() {
 								<div className="flex flex-wrap items-center gap-3">
 									{topic.content.map((hashtag) => (
 										<button
+											key={hashtag}
 											type="button"
 											onClick={() => toggleHashtag(hashtag)}
 											className={cn(

packages/ui/src/onboarding/profile.tsx

@@ -35,19 +35,17 @@ export function OnboardingProfileScreen() {
 				navigate("/interests");
 			}
 
-			const oldProfile = await ark.getUserProfile();
-
-			const profile: NDKUserProfile = {
+			const prevProfile = await ark.getUserProfile();
+			const newProfile: NDKUserProfile = {
 				...data,
-				lud16: "", // temporary remove lud16
-				nip05: oldProfile?.nip05 || "",
+				nip05: prevProfile?.nip05 || "",
 				bio: data.about,
 				image: picture,
 				picture: picture,
 			};
 
 			const publish = await ark.createEvent({
-				content: JSON.stringify(profile),
+				content: JSON.stringify(newProfile),
 				kind: NDKKind.Metadata,
 				tags: [],
 			});
@@ -57,7 +55,7 @@ export function OnboardingProfileScreen() {
 				await storage.clearProfileCache(ark.account.pubkey);
 				await queryClient.setQueryData(
 					["user", ark.account.pubkey],
-					() => profile,
+					() => newProfile,
 				);
 
 				setLoading(false);

packages/ui/src/routes/suggest.tsx

@@ -114,11 +114,11 @@ export function SuggestRoute({ queryKey }: { queryKey: string[] }) {
 					</div>
 					<div className="flex flex-col divide-y divide-neutral-100 dark:divide-neutral-900">
 						{isLoading ? (
-							<div className="flex h-full w-full items-center justify-center">
+							<div className="flex h-44 w-full items-center justify-center">
 								<LoaderIcon className="size-4 animate-spin" />
 							</div>
 						) : isError ? (
-							<div className="flex h-full w-full items-center justify-center">
+							<div className="flex h-44 w-full items-center justify-center">
 								Error. Cannot get trending users
 							</div>
 						) : (
@@ -171,9 +171,9 @@ export function SuggestRoute({ queryKey }: { queryKey: string[] }) {
 							type="button"
 							onClick={submit}
 							disabled={loading}
-							className="inline-flex items-center justify-center gap-2 px-6 font-medium text-white transform bg-blue-500 rounded-full active:translate-y-1 w-36 h-11 hover:bg-blue-600 focus:outline-none disabled:cursor-not-allowed"
+							className="inline-flex items-center justify-center gap-2 px-6 font-medium shadow-xl shadow-neutral-500/50 text-white transform bg-blue-500 rounded-full active:translate-y-1 w-36 h-11 hover:bg-blue-600 focus:outline-none disabled:cursor-not-allowed"
 						>
-							Save
+							Save & Go Back
 						</button>
 					</div>
 				</div>