mirror of
https://github.com/emailerfacu-spec/minix-front.git
synced 2026-04-01 13:10:44 -03:00
72 lines
2.0 KiB
Svelte
72 lines
2.0 KiB
Svelte
<script lang="ts">
|
|
import * as Alert from '@/components/ui/alert';
|
|
import LoginForm from '@/components/ui/login-form/login-form.svelte';
|
|
import AlertCircleIcon from '@lucide/svelte/icons/alert-circle';
|
|
import { fade, fly } from 'svelte/transition';
|
|
import Info from '@lucide/svelte/icons/info';
|
|
import Card from '@/components/ui/card/card.svelte';
|
|
import CardContent from '@/components/ui/card/card-content.svelte';
|
|
import FireBaseButton from '@/components/FireBaseButton.svelte';
|
|
|
|
let { data } = $props();
|
|
|
|
let showAlert: boolean = $state(false);
|
|
|
|
let message = $state(data.message);
|
|
|
|
$effect(() => {
|
|
resetAlert();
|
|
if (data.message) {
|
|
history.replaceState(history.state, '', '/login');
|
|
setTimeout(() => {
|
|
message = '';
|
|
}, 7000);
|
|
}
|
|
});
|
|
|
|
async function resetAlert() {
|
|
if (showAlert == true) {
|
|
await new Promise((res) => setTimeout(res, 2000));
|
|
showAlert = false;
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<div class="flex min-h-fit w-full items-center justify-center p-6 md:p-10">
|
|
<div class="w-full max-w-sm">
|
|
{#if message}
|
|
<div class="mb-2" transition:fly>
|
|
<Alert.Root>
|
|
<Info />
|
|
<Alert.Title>Info</Alert.Title>
|
|
<Alert.Description>Ingrese las credenciales de la cuenta recien creada</Alert.Description>
|
|
</Alert.Root>
|
|
</div>
|
|
{/if}
|
|
<LoginForm bind:showAlert id="1" />
|
|
|
|
<Card class="mt-2">
|
|
<CardContent>
|
|
<FireBaseButton mode="login" />
|
|
</CardContent>
|
|
</Card>
|
|
{#if showAlert}
|
|
<div class="mt-2" transition:fade>
|
|
<Alert.Root variant="destructive">
|
|
<AlertCircleIcon />
|
|
<Alert.Title>No se pudo iniciar sesion</Alert.Title>
|
|
<Alert.Description>Revise su usuario o contraseña</Alert.Description>
|
|
</Alert.Root>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
|
|
<svelte:head>
|
|
<meta property="og:title" content="Mini-x" />
|
|
<meta property="og:description" content={`Inicia Sesion`} />
|
|
<meta property="og:image" content="https://minix-front.vercel.app/x.png" />
|
|
<meta property="og:url" content="https://minix-front.vercel.app/" />
|
|
<meta property="og:type" content="website" />
|
|
</svelte:head>
|