wip: refactor
This commit is contained in:
@@ -58,40 +58,28 @@ export function ImportStep3Screen() {
|
||||
</h1>
|
||||
</div>
|
||||
<div className="w-full rounded-xl bg-white/10 p-4">
|
||||
{status === 'loading' ? (
|
||||
<div className="w-full">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="h-11 w-11 animate-pulse rounded-lg bg-white/10" />
|
||||
<div>
|
||||
<div className="mb-1 h-4 w-16 animate-pulse rounded bg-white/10" />
|
||||
<div className="h-3 w-36 animate-pulse rounded bg-white/10" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex flex-col gap-3">
|
||||
<User pubkey={db.account.pubkey} />
|
||||
<button
|
||||
type="button"
|
||||
className="inline-flex h-11 w-full items-center justify-between gap-2 rounded-lg bg-fuchsia-500 px-6 font-medium leading-none text-white hover:bg-fuchsia-600 focus:outline-none"
|
||||
onClick={() => submit()}
|
||||
>
|
||||
{loading ? (
|
||||
<>
|
||||
<span className="w-5" />
|
||||
<span>It might take a bit, please patient...</span>
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-white" />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<span className="w-5" />
|
||||
<span>Continue</span>
|
||||
<ArrowRightCircleIcon className="h-5 w-5" />
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex flex-col gap-3">
|
||||
<User pubkey={db.account.pubkey} />
|
||||
<button
|
||||
type="button"
|
||||
className="inline-flex h-11 w-full items-center justify-between gap-2 rounded-lg bg-fuchsia-500 px-6 font-medium leading-none text-white hover:bg-fuchsia-600 focus:outline-none"
|
||||
onClick={() => submit()}
|
||||
>
|
||||
{loading ? (
|
||||
<>
|
||||
<span className="w-5" />
|
||||
<span>It might take a bit, please patient...</span>
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-white" />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<span className="w-5" />
|
||||
<span>Continue</span>
|
||||
<ArrowRightCircleIcon className="h-5 w-5" />
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -5,15 +5,12 @@ import { useState } from 'react';
|
||||
import { Resolver, useForm } from 'react-hook-form';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
|
||||
import { removePrivkey } from '@libs/storage';
|
||||
import { useStorage } from '@libs/storage/provider';
|
||||
|
||||
import { EyeOffIcon, EyeOnIcon, LoaderIcon } from '@shared/icons';
|
||||
|
||||
import { useStronghold } from '@stores/stronghold';
|
||||
|
||||
import { useAccount } from '@utils/hooks/useAccount';
|
||||
|
||||
type FormValues = {
|
||||
password: string;
|
||||
};
|
||||
@@ -73,7 +70,7 @@ export function MigrateScreen() {
|
||||
// add privkey to state
|
||||
setPrivkey(db.account.privkey);
|
||||
// remove privkey in db
|
||||
await removePrivkey();
|
||||
await db.removePrivkey();
|
||||
// clear cache
|
||||
await queryClient.invalidateQueries(['account']);
|
||||
// redirect to home
|
||||
|
||||
@@ -4,9 +4,11 @@ import { useState } from 'react';
|
||||
import { Resolver, useForm } from 'react-hook-form';
|
||||
import { Link, useNavigate } from 'react-router-dom';
|
||||
|
||||
import { User } from '@app/auth/components/user';
|
||||
|
||||
import { useStorage } from '@libs/storage/provider';
|
||||
|
||||
import { EyeOffIcon, EyeOnIcon, LoaderIcon } from '@shared/icons';
|
||||
import { ArrowRightCircleIcon, EyeOffIcon, EyeOnIcon, LoaderIcon } from '@shared/icons';
|
||||
|
||||
import { useStronghold } from '@stores/stronghold';
|
||||
|
||||
@@ -36,7 +38,6 @@ export function UnlockScreen() {
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
|
||||
const { db } = useStorage();
|
||||
|
||||
const {
|
||||
register,
|
||||
setError,
|
||||
@@ -79,13 +80,17 @@ export function UnlockScreen() {
|
||||
<div className="mb-6 text-center">
|
||||
<h1 className="text-2xl font-semibold text-white">Enter password to unlock</h1>
|
||||
</div>
|
||||
<div className="mb-4 w-full rounded-xl bg-white/5 p-4">
|
||||
<User pubkey={db.account.pubkey} />
|
||||
</div>
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="mb-0 flex flex-col gap-3">
|
||||
<div className="flex flex-col gap-1">
|
||||
<div className="relative">
|
||||
<input
|
||||
{...register('password', { required: true })}
|
||||
type={showPassword ? 'text' : 'password'}
|
||||
className="relative h-12 w-full rounded-lg bg-white/10 py-1 text-center text-white !outline-none placeholder:text-white/10"
|
||||
placeholder="Password"
|
||||
className="relative h-12 w-full rounded-lg bg-white/10 py-1 text-center text-white !outline-none placeholder:text-white/50"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
@@ -107,12 +112,20 @@ export function UnlockScreen() {
|
||||
<button
|
||||
type="submit"
|
||||
disabled={!isDirty || !isValid}
|
||||
className="inline-flex h-12 w-full items-center justify-center rounded-md bg-fuchsia-500 font-medium text-white hover:bg-fuchsia-600"
|
||||
className="inline-flex h-11 w-full items-center justify-between gap-2 rounded-lg bg-fuchsia-500 px-6 font-medium leading-none text-white hover:bg-fuchsia-600 focus:outline-none"
|
||||
>
|
||||
{loading ? (
|
||||
<LoaderIcon className="h-4 w-4 animate-spin text-white" />
|
||||
<>
|
||||
<span className="w-5" />
|
||||
<span>Decryting...</span>
|
||||
<LoaderIcon className="h-5 w-5" />
|
||||
</>
|
||||
) : (
|
||||
'Continue →'
|
||||
<>
|
||||
<span className="w-5" />
|
||||
<span>Continue</span>
|
||||
<ArrowRightCircleIcon className="h-5 w-5" />
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
<Link
|
||||
|
||||
Reference in New Issue
Block a user