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.
109 lines
3.8 KiB
109 lines
3.8 KiB
<script lang="ts">
|
|
import { Router, Link, Route } from "svelte-routing";
|
|
import { onMount } from "svelte";
|
|
|
|
import authStore from "./stores/auth";
|
|
import Boi from "./components/Boi.svelte";
|
|
import { signOut } from "./clients/amplify";
|
|
|
|
import FrontPage from "./pages/FrontPage.svelte";
|
|
import ProjectPage from "./pages/ProjectPage.svelte";
|
|
import LogsPage from "./pages/LogsPage.svelte";
|
|
import GroupPage from "./pages/GroupPage.svelte";
|
|
import GoalPage from "./pages/GoalPage.svelte";
|
|
import QlPage from "./pages/QLPage.svelte";
|
|
|
|
import GroupForm from "./forms/GroupForm.svelte";
|
|
import GoalForm from "./forms/GoalForm.svelte";
|
|
import LogForm from "./forms/LogForm.svelte";
|
|
import ProjectForm from "./forms/ProjectForm.svelte";
|
|
import ProjectGroupForm from "./forms/ProjectGroupForm.svelte";
|
|
import ItemForm from "./forms/ItemForm.svelte";
|
|
import TaskForm from "./forms/TaskForm.svelte";
|
|
import TaskLinkForm from "./forms/TaskLinkForm.svelte";
|
|
import LoginForm from "./forms/LoginForm.svelte";
|
|
|
|
import ModalRoute from "./components/ModalRoute.svelte";
|
|
import FocusHandler from "./components/FocusHandler.svelte";
|
|
import Menu from "./components/Menu.svelte";
|
|
import markStale from "./stores/markStale";
|
|
|
|
async function logout() {
|
|
await signOut();
|
|
await authStore.check();
|
|
markStale("*");
|
|
}
|
|
|
|
onMount(() => {
|
|
authStore.check()
|
|
});
|
|
</script>
|
|
|
|
{#if $authStore.checked}
|
|
{#if $authStore.loggedIn}
|
|
<FocusHandler />
|
|
<Router>
|
|
<Menu />
|
|
<main>
|
|
<Route path="/" component={FrontPage} />
|
|
<Route path="/goals/" component={GoalPage} />
|
|
<Route path="/projects/" component={ProjectPage} />
|
|
<Route path="/questlog/:gid/:pid" let:params >
|
|
<QlPage groupId={params.gid} projectId={params.pid} />
|
|
</Route>
|
|
<Route path="/questlog/:gid" let:params >
|
|
<QlPage groupId={params.gid} />
|
|
</Route>
|
|
<Route path="/questlog/" component={QlPage} />
|
|
<Route path="/logs/" component={LogsPage} />
|
|
<Route path="/items/" component={GroupPage} />
|
|
|
|
<footer>
|
|
<Boi compact tiny on:click={logout}>Sign out</Boi>
|
|
</footer>
|
|
</main>
|
|
</Router>
|
|
<ModalRoute name="log.add"> <LogForm creation /></ModalRoute>
|
|
<ModalRoute name="log.edit"> <LogForm /></ModalRoute>
|
|
<ModalRoute name="log.delete"> <LogForm deletion /></ModalRoute>
|
|
<ModalRoute name="task.add"> <TaskForm creation /></ModalRoute>
|
|
<ModalRoute name="task.edit"> <TaskForm /></ModalRoute>
|
|
<ModalRoute name="task.delete"> <TaskForm deletion /></ModalRoute>
|
|
<ModalRoute name="project.add"> <ProjectForm creation /></ModalRoute>
|
|
<ModalRoute name="project.edit"> <ProjectForm /></ModalRoute>
|
|
<ModalRoute name="project.delete"> <ProjectForm deletion /></ModalRoute>
|
|
<ModalRoute name="projectgroup.add"> <ProjectGroupForm creation /></ModalRoute>
|
|
<ModalRoute name="projectgroup.edit"> <ProjectGroupForm /></ModalRoute>
|
|
<ModalRoute name="projectgroup.delete"> <ProjectGroupForm deletion /></ModalRoute>
|
|
<ModalRoute name="item.add"> <ItemForm creation /></ModalRoute>
|
|
<ModalRoute name="item.edit"> <ItemForm /></ModalRoute>
|
|
<ModalRoute name="item.delete"> <ItemForm deletion /></ModalRoute>
|
|
<ModalRoute name="group.add"> <GroupForm creation /></ModalRoute>
|
|
<ModalRoute name="group.edit"> <GroupForm /></ModalRoute>
|
|
<ModalRoute name="group.delete"> <GroupForm deletion /></ModalRoute>
|
|
<ModalRoute name="goal.add"> <GoalForm creation /></ModalRoute>
|
|
<ModalRoute name="goal.edit"> <GoalForm /></ModalRoute>
|
|
<ModalRoute name="goal.delete"> <GoalForm deletion /></ModalRoute>
|
|
<ModalRoute name="tasklink.add"> <TaskLinkForm creation /></ModalRoute>
|
|
<ModalRoute name="tasklink.delete"> <TaskLinkForm deletion /></ModalRoute>
|
|
{:else}
|
|
<LoginForm />
|
|
{/if}
|
|
{/if}
|
|
|
|
<style>
|
|
main {
|
|
text-align: left;
|
|
max-width: 99.5%;
|
|
margin: 1em auto;
|
|
}
|
|
|
|
footer {
|
|
text-align: left;
|
|
width: 920px;
|
|
max-width: 99.5%;
|
|
margin: 1em auto;
|
|
padding-bottom: 4em;
|
|
text-align: center;
|
|
}
|
|
</style>
|