stufflog/svelte-ui/src/App.svelte

<script>
	import { Router, Route } from "svelte-routing";

	import LogPage from "./routes/LogPage";
	import ActivitiesPage from "./routes/ActivitiesPage";
	import ItemPage from "./routes/ItemPage";

	import LoginModal from "./modals/LoginModal";
	import CreateActivityModal from "./modals/CreateActivityModal";
	import CreatePeriodModal from "./modals/CreatePeriodModal";
	import AddPeriodGoalModal from "./modals/AddPeriodGoalModal"
	import AddPeriodLogModal from "./modals/AddPeriodLogModal"
	import AddSubActivityModal from "./modals/AddSubActivityModal";
	import EditPeriodModal from "./modals/EditPeriodModal";
	import DeletePeriodModal from "./modals/DeletePeriodModal";
	import EditActivityModal from "./modals/EditActivityModal";
	import EditSubActivityModal from "./modals/EditSubActivityModal";
	import RemoveSubActivityModal from "./modals/RemoveSubActivityModal";
	import RemovePeriodGoalModal from "./modals/RemovePeriodGoalModal";
	import RemovePeriodLogModal from "./modals/RemovePeriodLogModal";
	import InfoPeriodLogModal from "./modals/InfoPeriodLogModal";
	import DeleteActivityModal from "./modals/DeleteActivityModal";

	import Modal from "./hooks/Modal";

	import Menu from "./components/Menu";
	import MenuItem from "./components/MenuItem";
	
	import LoginCheck from "./LoginCheck";

	import auth from "./stores/auth";
</script>

<Menu>
	<MenuItem href="/">Stufflog</MenuItem>
	<MenuItem href="/activities/">Activities</MenuItem>
	<MenuItem href="/items/">Items</MenuItem>

	<div slot="right">
		{#if ($auth.checked && $auth.user !== null)}
			<MenuItem on:click={() => auth.logout()}>Logout [{$auth.user.name}]</MenuItem>
		{/if}
	</div>
</Menu>

<Router>
	<Route path="/" component={LogPage} />
	<Route path="/activities/" component={ActivitiesPage} />
	<Route path="/items/" component={ItemPage} />
</Router>

<Modal name="login" component={LoginModal} />
<Modal name="period.create" component={CreatePeriodModal} />
<Modal name="period.edit" component={EditPeriodModal} />
<Modal name="period.delete" component={DeletePeriodModal} />
<Modal name="activity.create" component={CreateActivityModal} />
<Modal name="activity.edit" component={EditActivityModal} />
<Modal name="activity.delete" component={DeleteActivityModal} />
<Modal name="subactivity.add" component={AddSubActivityModal} />
<Modal name="subactivity.edit" component={EditSubActivityModal} />
<Modal name="subactivity.remove" component={RemoveSubActivityModal} />
<Modal name="periodgoal.add" component={AddPeriodGoalModal} />
<Modal name="periodgoal.remove" component={RemovePeriodGoalModal} />
<Modal name="periodlog.add" component={AddPeriodLogModal} />
<Modal name="periodlog.remove" component={RemovePeriodLogModal} />
<Modal name="periodlog.info" component={InfoPeriodLogModal} />

<LoginCheck />