samuelandert.eth/auth.andert.me
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactored composer component interface to one single $me store

Browse Source
This commit is contained in:
Samuel Andert
2023-08-07 11:54:27 +02:00
parent 1a8bb64ff2
commit d36a94badc
5 changed files with 35 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/lib/components/refactor/ComposerForm.svelte
View File

@ -5,7 +5,6 @@
import { writable } from 'svelte/store';
import { RangeSlider, SlideToggle } from '@skeletonlabs/skeleton';
export let data;
export let me;
const initialFormData = {
@ -33,9 +32,9 @@
$: {
// Send events to the state machine based on the validation status
if (!($errors.name || $errors.email || $errors.about || $errors.age || $errors.favoriteFood)) {
me.do.machine.send('VALIDATE');
$me.do.machine.send('VALIDATE');
} else {
me.do.machine.send('INVALIDATE');
$me.do.machine.send('INVALIDATE');
}
}
@ -71,7 +70,7 @@
</script>
<div class="w-full p-6 border-2 border-red-500">
My state is: {$data.state}
My state is: {$me.state}
{#if $successMessage}
<aside class="w-full max-w-md p-4 alert variant-ghost" id="message-container">
<div class="alert-message">
@ -154,7 +153,7 @@
<button
type="submit"
class="w-full px-4 py-2 mt-4 text-white bg-blue-500 rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500"
disabled={$data.state === 'notValidated'}
disabled={$me.state === 'notValidated'}
>
Submit
</button>