You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
57 lines
1.6 KiB
57 lines
1.6 KiB
<script lang="ts">
|
|
import Boi from "../components/Boi.svelte";
|
|
import Checkbox from "../components/Checkbox.svelte";
|
|
import ProjectEntry from "../components/ProjectEntry.svelte";
|
|
import RefreshSelection from "../components/RefreshSelection.svelte";
|
|
import TableOfContent from "../components/TableOfContent.svelte";
|
|
import type { ModalData } from "../stores/modal";
|
|
import projectStore from "../stores/project";
|
|
|
|
const mdProjectAdd: ModalData = {name: "project.add", groupId: null};
|
|
let showInactive = ($projectStore.filter.active === null);
|
|
|
|
$: {
|
|
if (showInactive && $projectStore.filter.active === true) {
|
|
projectStore.markStale();
|
|
}
|
|
if (!showInactive && $projectStore.filter.active == null) {
|
|
projectStore.markStale();
|
|
}
|
|
}
|
|
|
|
$: {
|
|
if ($projectStore.stale && !$projectStore.loading) {
|
|
projectStore.load({
|
|
active: showInactive ? null : true,
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<div class="page">
|
|
<div class="options">
|
|
<Checkbox centered bind:checked={showInactive} label="Show completed tasks and projects." />
|
|
</div>
|
|
<TableOfContent hideInactive={!showInactive} projects={$projectStore.projects} />
|
|
{#each $projectStore.projects as project (project.id)}
|
|
<ProjectEntry hideInactive={!showInactive} showAllOptions project={project} />
|
|
{/each}
|
|
<Boi open={mdProjectAdd}>Add Project</Boi>
|
|
</div>
|
|
<RefreshSelection />
|
|
|
|
<style>
|
|
div.page {
|
|
display: block;
|
|
margin: auto;
|
|
max-width: 100%;
|
|
width: 640px;
|
|
margin-top: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
div.options {
|
|
display: flex;
|
|
margin: 1em auto;
|
|
}
|
|
</style>
|