playback-device-server/www/src/views/auth-layer-view.jsx

46 lines
1.2 KiB
JavaScript

import { createSignal, onMount } from "solid-js";
import Spinner from "../modules/spinner";
import MainView from "./main-view";
import LoginView from "./login-view";
import UserService from "../services/user-service";
const REQUESTING = "requesting";
const LOGGED_IN = "logged-in";
const LOGGED_OUT = "logged-out";
function AuthLayerView() {
const [status, setStatus] = createSignal(REQUESTING);
onMount(async () => {
let info = null;
try {
info = await UserService.getUserInfo();
} catch (error) {}
if (!info) {
setStatus(LOGGED_OUT);
} else {
setStatus(LOGGED_IN);
}
});
return (
<>
<Show when={status() === REQUESTING}>
<div
class="d-flex align-items-center justify-content-center"
style="width: 100vw; height: 100vh;"
>
<Spinner style="width: 10em; height: 10em;" type={Spinner.GROW} />
</div>
</Show>
<Show when={status() === LOGGED_OUT}>
<LoginView onLogin={(info) => setStatus(LOGGED_IN)} />
</Show>
<Show when={status() === LOGGED_IN}>
<MainView onLogout={() => setStatus(LOGGED_OUT)} />
</Show>
</>
);
}
export default AuthLayerView;