polish

src/app/auth/create/step-1.tsx

@@ -63,7 +63,7 @@ export function CreateStep1Screen() {
     }
   };
 
-  const submit = () => {
+  const submit = async () => {
     setLoading(true);
 
     // update state
@@ -72,7 +72,7 @@ export function CreateStep1Screen() {
     setPubkey(pubkey);
 
     // save to database
-    db.createAccount(npub, pubkey);
+    await db.createAccount(npub, pubkey);
 
     // redirect to next step
     navigate('/auth/create/step-2', { replace: true });

src/app/auth/create/step-2.tsx

@@ -104,7 +104,8 @@ export function CreateStep2Screen() {
               <input
                 {...register('password', { required: true })}
                 type={passwordInput}
-                className="relative h-12 w-full rounded-lg border-t border-white/10 bg-white/20 px-3.5 py-1 text-center tracking-widest text-white !outline-none backdrop-blur-xl placeholder:text-white/70"
+                placeholder="Enter password"
+                className="relative h-12 w-full rounded-lg border-t border-white/10 bg-white/20 px-3.5 py-1 text-center tracking-widest text-white !outline-none backdrop-blur-xl placeholder:tracking-normal placeholder:text-white/70"
               />
               <button
                 type="button"

src/app/auth/create/step-3.tsx

@@ -3,6 +3,8 @@ import { useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
 
+import { useStorage } from '@libs/storage/provider';
+
 import { AvatarUploader } from '@shared/avatarUploader';
 import { BannerUploader } from '@shared/bannerUploader';
 import { LoaderIcon } from '@shared/icons';
@@ -10,6 +12,7 @@ import { ArrowRightCircleIcon } from '@shared/icons/arrowRightCircle';
 import { Image } from '@shared/image';
 
 import { useOnboarding } from '@stores/onboarding';
+import { WidgetKinds } from '@stores/widgets';
 
 import { useNostr } from '@utils/hooks/useNostr';
 
@@ -21,6 +24,7 @@ export function CreateStep3Screen() {
   const [picture, setPicture] = useState('https://void.cat/d/5VKmKyuHyxrNMf9bWSVPih');
   const [banner, setBanner] = useState('');
 
+  const { db } = useStorage();
   const { publish } = useNostr();
   const {
     register,
@@ -45,6 +49,9 @@ export function CreateStep3Screen() {
         tags: [],
       });
 
+      // create default widget
+      await db.createWidget(WidgetKinds.other.learnNostr, 'Learn Nostr', '');
+
       if (event) {
         navigate('/auth/onboarding', { replace: true });
       }

src/app/auth/import/step-1.tsx

@@ -65,7 +65,7 @@ export function ImportStep1Screen() {
         setPubkey(pubkey);
 
         // add account to local database
-        db.createAccount(npub, pubkey);
+        await db.createAccount(npub, pubkey);
 
         // redirect to step 2 with delay 1.2s
         setTimeout(() => navigate('/auth/import/step-2', { replace: true }), 1200);

src/app/auth/import/step-2.tsx

@@ -104,7 +104,8 @@ export function ImportStep2Screen() {
               <input
                 {...register('password', { required: true })}
                 type={passwordInput}
-                className="relative h-12 w-full rounded-lg border-t border-white/10 bg-white/20 px-3.5 py-1 text-center tracking-widest text-white !outline-none backdrop-blur-xl placeholder:text-white/70"
+                placeholder="Enter password"
+                className="relative h-12 w-full rounded-lg border-t border-white/10 bg-white/20 px-3.5 py-1 text-center tracking-widest text-white !outline-none backdrop-blur-xl placeholder:tracking-normal placeholder:text-white/70"
               />
               <button
                 type="button"

src/app/auth/import/step-3.tsx

@@ -8,6 +8,7 @@ import { useStorage } from '@libs/storage/provider';
 import { ArrowRightCircleIcon, LoaderIcon } from '@shared/icons';
 
 import { useOnboarding } from '@stores/onboarding';
+import { WidgetKinds } from '@stores/widgets';
 
 import { useNostr } from '@utils/hooks/useNostr';
 
@@ -29,6 +30,9 @@ export function ImportStep3Screen() {
       const user = await fetchUserData();
       const data = await prefetchEvents();
 
+      // create default widget
+      await db.createWidget(WidgetKinds.other.learnNostr, 'Learn Nostr', '');
+
       // redirect to next step
       if (user.status === 'ok' && data.status === 'ok') {
         navigate('/auth/onboarding/step-2', { replace: true });