92 lines
3.3 KiB
Svelte
92 lines
3.3 KiB
Svelte
|
<script lang="ts">
|
||
|
|
import {changeStateFunction, error_banner, info_banner, rpc, session, show_working, state, StateE, token, workingWrapperO} from './store';
|
||
|
|
import {Banner, Navbar, Spinner} from 'flowbite-svelte';
|
||
|
|
import {FileStorage} from 'carbon-icons-svelte';
|
||
|
|
import LinkButton from './components/LinkButton.svelte';
|
||
|
|
import Login from './pages/Login.svelte';
|
||
|
|
import Signup from './pages/Signup.svelte';
|
||
|
|
import ResetPassword from './pages/ResetPassword.svelte';
|
||
|
|
import Profile from './pages/Profile.svelte';
|
||
|
|
import TfaSetup from './pages/TfaSetup.svelte';
|
||
|
|
import Admin from './pages/Admin.svelte';
|
||
|
|
import View from './pages/View.svelte';
|
||
|
|
|
||
|
|
const s = session.s;
|
||
|
|
|
||
|
|
function homeClick() {
|
||
|
|
if ($token == null)
|
||
|
|
$state.s = StateE.LOGIN;
|
||
|
|
else
|
||
|
|
$state = { s: StateE.VIEW, view_node: 0 };
|
||
|
|
}
|
||
|
|
|
||
|
|
async function leaveSudo() {
|
||
|
|
await workingWrapperO(() => rpc.Admin_unsudo($token ?? ''));
|
||
|
|
await session.update($token);
|
||
|
|
state.set({s: StateE.ADMIN, view_node: 0});
|
||
|
|
}
|
||
|
|
|
||
|
|
function logout() {
|
||
|
|
rpc.Auth_logout($token ?? '');
|
||
|
|
token.set(null);
|
||
|
|
}
|
||
|
|
|
||
|
|
homeClick();
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<main class="h-screen w-screen p-4 flex flex-col">
|
||
|
|
{#if $error_banner.length > 0}
|
||
|
|
<Banner dismissable position="absolute" divClass="z-10 flex justify-between p-4 !bg-red-50" on:close={() => error_banner.set('')}>
|
||
|
|
{$error_banner}
|
||
|
|
</Banner>
|
||
|
|
{/if}
|
||
|
|
{#if $info_banner.length > 0}
|
||
|
|
<Banner dismissable position="absolute" on:close={() => info_banner.set('')}>
|
||
|
|
{$info_banner}
|
||
|
|
</Banner>
|
||
|
|
{/if}
|
||
|
|
{#if $show_working}
|
||
|
|
<Banner position="absolute" dismissable={false}><Spinner size="5" class="mr-2" />Working</Banner>
|
||
|
|
{/if}
|
||
|
|
<Navbar class="flex-grow-0">
|
||
|
|
<button on:click={homeClick} id="home-button" class="flex items-center">
|
||
|
|
<FileStorage width="1.5em" height="1.5em"/>
|
||
|
|
<span id="navbar-text">MFileserver</span>
|
||
|
|
</button>
|
||
|
|
|
||
|
|
{#if $token != null}
|
||
|
|
<div class="flex md:order-2">
|
||
|
|
{#if $s?.sudo} <LinkButton on:click={leaveSudo}>Leave sudo</LinkButton> {/if}
|
||
|
|
{#if $s?.admin} <LinkButton on:click={changeStateFunction(StateE.ADMIN)}>Admin</LinkButton> {/if}
|
||
|
|
<LinkButton on:click={changeStateFunction(StateE.VIEW, 0)}>Files</LinkButton>
|
||
|
|
<LinkButton on:click={changeStateFunction(StateE.PROFILE)}>Profile</LinkButton>
|
||
|
|
<LinkButton on:click={logout}>Logout</LinkButton>
|
||
|
|
</div>
|
||
|
|
{/if}
|
||
|
|
</Navbar>
|
||
|
|
<span class="grid justify-items-center mt-10">
|
||
|
|
{#if $state.s === StateE.LOGIN } <Login/>
|
||
|
|
{:else if $state.s === StateE.SIGNUP} <Signup/>
|
||
|
|
{:else if $state.s === StateE.RESET_PASSWORD} <ResetPassword/>
|
||
|
|
{:else if $state.s === StateE.PROFILE} <Profile/>
|
||
|
|
{:else if $state.s === StateE.TFA_SETUP} <TfaSetup/>
|
||
|
|
{:else if $state.s === StateE.ADMIN} <Admin/>
|
||
|
|
{:else if $state.s === StateE.VIEW} <View/>
|
||
|
|
{:else} <span>You are in state {$state.s}, which should not be possible, please report this.</span>
|
||
|
|
{/if}
|
||
|
|
</span>
|
||
|
|
</main>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
#navbar-text {
|
||
|
|
margin-left: 0.5em;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
|
||
|
|
#home-button {
|
||
|
|
background: none;
|
||
|
|
border: none;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
</style>
|