add support for project inactivity, added new checkbox component.

svelte-ui/src/forms/LogAddForm.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import stuffLogClient from "../clients/stufflog";
+import Checkbox from "../components/Checkbox.svelte";
   import Modal from "../components/Modal.svelte";
   import goalStore, { fpGoalStore } from "../stores/goal";
 import logStore from "../stores/logs";
@@ -54,8 +55,7 @@ import logStore from "../stores/logs";
     <input name="loggedTime" type="datetime-local" bind:value={loggedTime} />
     <label for="description">Description</label>
     <textarea name="description" bind:value={description} />
-    <input id="markInactive" type="checkbox" bind:checked={markInactive} />
-    <label for="markInactive">Complete Task</label>
+    <Checkbox bind:checked={markInactive} label="Mark task inactive/completed." />
 
     <hr />
 

svelte-ui/src/forms/ProjectEditForm.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import stuffLogClient from "../clients/stufflog";
+import Checkbox from "../components/Checkbox.svelte";
   import IconSelect from "../components/IconSelect.svelte";
   import Modal from "../components/Modal.svelte";
   import type { IconName } from "../external/icons";
@@ -14,6 +15,7 @@
   const project = md.project;
 
   let endTime = project.endTime ? formatFormTime(project.endTime) : "";
+  let active = project.active;
   let name = project.name;
   let description = project.description;
   let icon = project.icon as IconName;
@@ -21,11 +23,10 @@
 
   function onSubmit() {
     stuffLogClient.updateProject(project.id, {
-      active: true,
       endTime: ( endTime == "" ) ? null : new Date(endTime),
       clearEndTime: ( endTime == "" ),
 
-      name, description, icon,
+      name, active, description, icon,
     }).then(() => {
       projectStore.markStale();
       fpProjectStore.markStale();
@@ -52,6 +53,7 @@
     <IconSelect bind:value={icon} />
     <label for="endTime">Deadline (Optional)</label>
     <input name="endTime" type="datetime-local" bind:value={endTime} />
+    <Checkbox bind:checked={active} label="Project is active/incomplete." />
 
     <hr />
 

svelte-ui/src/forms/TaskDeleteForm.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import stuffLogClient from "../clients/stufflog";
+import Checkbox from "../components/Checkbox.svelte";
   import Modal from "../components/Modal.svelte";
   import goalStore, { fpGoalStore } from "../stores/goal";
   import modalStore from "../stores/modal";
@@ -15,7 +16,7 @@
   let name = task.name;
   let description = task.description;
   let itemAmount = task.itemAmount;
-  let active = task.active;
+  let completed = !task.active;
   let endTime = task.endTime ? formatFormTime(task.endTime) : "";
   let error = null;
 
@@ -50,8 +51,7 @@
     <input disabled name="itemAmount" type="number" value={itemAmount} />
     <label for="endTime">Deadline (Optional)</label>
     <input disabled name="endTime" type="datetime-local" value={endTime} />
-    <input id="active" type="checkbox" checked={active} />
-    <label for="active">Task is active/incomplete</label>
+    <Checkbox disabled bind:checked={completed} label="Task is completed." />
 
     <hr />
 

svelte-ui/src/forms/TaskEditForm.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import stuffLogClient from "../clients/stufflog";
+import Checkbox from "../components/Checkbox.svelte";
   import Modal from "../components/Modal.svelte";
   import goalStore, { fpGoalStore } from "../stores/goal";
   import modalStore from "../stores/modal";
@@ -15,7 +16,7 @@
   let name = task.name;
   let description = task.description;
   let itemAmount = task.itemAmount;
-  let active = task.active;
+  let completed = !task.active;
   let endTime = task.endTime ? formatFormTime(task.endTime) : "";
   let error = null;
 
@@ -23,8 +24,9 @@
     stuffLogClient.updateTask(task.id, {
       endTime: (endTime == "") ? null : new Date(endTime),
       clearEndTime: endTime == "",
+      active: !completed,
 
-      name, description, itemAmount, active,
+      name, description, itemAmount,
     }).then(() => {
       projectStore.markStale();
       fpProjectStore.markStale();
@@ -53,8 +55,7 @@
     <input name="itemAmount" type="number" bind:value={itemAmount} />
     <label for="endTime">Deadline (Optional)</label>
     <input name="endTime" type="datetime-local" bind:value={endTime} />
-    <input id="active" type="checkbox" bind:checked={active} />
-    <label for="active">Task is active/incomplete</label>
+    <Checkbox bind:checked={completed} label="Task is completed." />
 
     <hr />