mirror of
https://github.com/emailerfacu-spec/minix-front.git
synced 2026-04-04 13:40:43 -03:00
88 lines
2.5 KiB
Svelte
88 lines
2.5 KiB
Svelte
<script lang="ts">
|
|
import Button, { buttonVariants } from './ui/button/button.svelte';
|
|
import { Dialog } from './ui/dialog';
|
|
import DialogTrigger from './ui/dialog/dialog-trigger.svelte';
|
|
import DialogContent from './ui/dialog/dialog-content.svelte';
|
|
import DialogHeader from './ui/dialog/dialog-header.svelte';
|
|
import DialogTitle from './ui/dialog/dialog-title.svelte';
|
|
import type { UserResponseDto } from '../../types';
|
|
import Input from './ui/input/input.svelte';
|
|
import Field from './ui/field/field.svelte';
|
|
import FieldLabel from './ui/field/field-label.svelte';
|
|
import Textarea from './ui/textarea/textarea.svelte';
|
|
import FieldGroup from './ui/field/field-group.svelte';
|
|
import { updateUsuario } from '@/hooks/updateUsuario';
|
|
import DialogFooter from './ui/dialog/dialog-footer.svelte';
|
|
import Spinner from './ui/spinner/spinner.svelte';
|
|
import { invalidate, invalidateAll } from '$app/navigation';
|
|
import { page } from '$app/state';
|
|
|
|
let { data = $bindable(), children } = $props();
|
|
|
|
let usuario: UserResponseDto = $state({
|
|
id: data.id,
|
|
username: data.username,
|
|
displayName: data.displayName,
|
|
bio: data.bio,
|
|
profileImageUrl: data.profileImageUrl
|
|
});
|
|
|
|
let cargando = $state(false);
|
|
let open = $state(false);
|
|
|
|
async function onsubmit(e: SubmitEvent | null) {
|
|
if (e != null) e.preventDefault();
|
|
cargando = true;
|
|
await updateUsuario({
|
|
id: usuario.id,
|
|
profileImage: false,
|
|
bio: usuario.bio,
|
|
displayName: usuario.displayName,
|
|
profileImageUrl: usuario.profileImageUrl
|
|
});
|
|
cargando = false;
|
|
open = false;
|
|
await invalidateAll();
|
|
// await invalidate(page.url);
|
|
// await invalidate('perfil:general');
|
|
}
|
|
|
|
function onkeydown(e: KeyboardEvent) {
|
|
if (e.ctrlKey && e.key === 'Enter') {
|
|
onsubmit(null);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<Dialog bind:open>
|
|
<DialogTrigger>
|
|
{@render children?.()}
|
|
</DialogTrigger>
|
|
<DialogContent>
|
|
<form {onsubmit}>
|
|
<DialogHeader>
|
|
<DialogTitle>
|
|
<h1 class="text-2xl font-bold">Modificar Usuario</h1>
|
|
</DialogTitle>
|
|
</DialogHeader>
|
|
<FieldGroup {onkeydown}>
|
|
<Field>
|
|
<FieldLabel>Nombre</FieldLabel>
|
|
<Input id="displayName" type="text" bind:value={usuario.displayName} required />
|
|
</Field>
|
|
<Field>
|
|
<FieldLabel>bio</FieldLabel>
|
|
<Textarea id="bio" bind:value={usuario.bio}></Textarea>
|
|
</Field>
|
|
</FieldGroup>
|
|
<Button type="submit" class="mt-2">
|
|
{#if cargando}
|
|
<Spinner />
|
|
{:else}
|
|
Modificar
|
|
{/if}
|
|
</Button>
|
|
</form>
|
|
</DialogContent>
|
|
</Dialog>
|