fix(front/checkbox): change value to boolean and use handleInput

src/assets/views/utils/Field.svelte

@@ -8,7 +8,7 @@
 
     export let type: string;
     export let name: string;
-    type FieldValue = string | number | Record<string, FieldValue>;
+    type FieldValue = string | number | boolean | Record<string, FieldValue>;
     export let value: FieldValue | undefined = undefined;
     export let initialValue: FieldValue | undefined = undefined;
     export let placeholder: string | undefined = undefined;
@@ -58,18 +58,23 @@
     }
 
     function handleInput() {
-        // in here, you can switch on type and implement
-        // whatever behaviour you need
-        value = type.match(/^(number|range)$/)
-            ? +this.value
-            : this.value;
-
-        if (this.type === 'file') {
-            handleFileInput();
-        }
-
-        if (this.type === 'datetime-local') {
-            value = dateToIsoString(new Date(this.value));
+        switch (this.type) {
+            case 'number':
+            case 'range':
+                value = +this.value;
+                break;
+            case 'file':
+                handleFileInput();
+                break;
+            case 'datetime-local':
+                value = dateToIsoString(new Date(this.value));
+                break;
+            case 'checkbox':
+                value = !!this.checked;
+                break;
+            default:
+                value = this.value;
+                break;
         }
     }
 
@@ -423,7 +428,8 @@
                               on:focusout={() => focused = false}></textarea>
                 </div>
             {:else if type === 'checkbox'}
-                <input {type} {name} id={fieldId} checked={value === 'on'} {...$$restProps} bind:this={input}>
+                <input {type} {name} id={fieldId} checked={!!value} {...$$restProps} bind:this={input}
+                       on:change={handleInput}>
             {:else if type === 'datetime-local'}
                 <input {type} bind:this={input} on:input={handleInput} value={initialDatetimeLocalValue}>
                 <input type="hidden" {name} {value}>