mirror of
https://github.com/emailerfacu-spec/minix-front.git
synced 2026-04-19 16:07:32 -03:00
Feat: Añadido alert en caso de fallo
This commit is contained in:
@@ -1,9 +1,38 @@
|
|||||||
<script>
|
<script lang="ts">
|
||||||
import SignupForm from '@/components/signup-form.svelte';
|
import SignupForm from '@/components/signup-form.svelte';
|
||||||
|
|
||||||
|
import AlertCircleIcon from "@lucide/svelte/icons/alert-circle";
|
||||||
|
import * as Alert from '@/components/ui/alert';
|
||||||
|
import { fade } from 'svelte/transition';
|
||||||
|
|
||||||
|
let showAlert: boolean = $state(false);
|
||||||
|
|
||||||
|
$effect(()=>{
|
||||||
|
resetAlert();
|
||||||
|
});
|
||||||
|
|
||||||
|
async function resetAlert (){
|
||||||
|
if (showAlert == true){
|
||||||
|
await new Promise(res => setTimeout(res, 2000));
|
||||||
|
showAlert=false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="flex min-h-fit w-full items-center justify-center p-6 md:p-10">
|
<div class="flex min-h-fit w-full items-center justify-center p-6 md:p-10">
|
||||||
<div class="w-full max-w-sm">
|
<div class="w-full max-w-sm">
|
||||||
<SignupForm />
|
<SignupForm bind:showAlert={showAlert} />
|
||||||
|
{#if showAlert}
|
||||||
|
<div class="mt-2" transition:fade>
|
||||||
|
<Alert.Root variant="destructive">
|
||||||
|
<AlertCircleIcon />
|
||||||
|
<Alert.Title>No se pudo crear la cuenta</Alert.Title>
|
||||||
|
<Alert.Description>
|
||||||
|
Intente nuevamente.
|
||||||
|
</Alert.Description>
|
||||||
|
</Alert.Root>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user