Skip to content

GitLab

Commit e2447dd0 authored by Timothy J. Baek's avatar Timothy J. Baek
Browse files

refac: better layout loading

parent 2feba8af
Hide whitespace changes
Inline Side-by-side
Showing with 108 additions and 108 deletions
src/routes/(app)/+layout.svelte
View file @ e2447dd0
...@@ -176,128 +176,128 @@ ...@@ -176,128 +176,128 @@
}); });
</script> </script>
{#if loaded} <div class=" hidden lg:flex fixed bottom-0 right-0 px-3 py-3 z-10">
<div class=" hidden lg:flex fixed bottom-0 right-0 px-3 py-3 z-10"> <Tooltip content="Help" placement="left">
<Tooltip content="Help" placement="left"> <button
<button id="show-shortcuts-button"
id="show-shortcuts-button" bind:this={showShortcutsButtonElement}
bind:this={showShortcutsButtonElement} class="text-gray-600 dark:text-gray-300 bg-gray-300/20 w-6 h-6 flex items-center justify-center text-xs rounded-full"
class="text-gray-600 dark:text-gray-300 bg-gray-300/20 w-6 h-6 flex items-center justify-center text-xs rounded-full" on:click={() => {
on:click={() => { showShortcuts = !showShortcuts;
showShortcuts = !showShortcuts; }}
}} >
> ?
? </button>
</button> </Tooltip>
</Tooltip> </div>
</div>
<ShortcutsModal bind:show={showShortcuts} />
<ShortcutsModal bind:show={showShortcuts} />
<div class="app relative">
<div class="app relative"> <div
{#if !['user', 'admin'].includes($user.role)} class=" text-gray-700 dark:text-gray-100 bg-white dark:bg-gray-900 min-h-screen overflow-auto flex flex-row"
<div class="fixed w-full h-full flex z-50"> >
<div {#if loaded}
class="absolute w-full h-full backdrop-blur-md bg-white/20 dark:bg-gray-900/50 flex justify-center" {#if !['user', 'admin'].includes($user.role)}
> <div class="fixed w-full h-full flex z-50">
<div class="m-auto pb-44 flex flex-col justify-center"> <div
<div class="max-w-md"> class="absolute w-full h-full backdrop-blur-md bg-white/20 dark:bg-gray-900/50 flex justify-center"
<div class="text-center dark:text-white text-2xl font-medium z-50"> >
Account Activation Pending<br /> Contact Admin for WebUI Access <div class="m-auto pb-44 flex flex-col justify-center">
</div> <div class="max-w-md">
<div class="text-center dark:text-white text-2xl font-medium z-50">
<div class=" mt-4 text-center text-sm dark:text-gray-200 w-full"> Account Activation Pending<br /> Contact Admin for WebUI Access
Your account status is currently pending activation. To access the WebUI, please </div>
reach out to the administrator. Admins can manage user statuses from the Admin
Panel. <div class=" mt-4 text-center text-sm dark:text-gray-200 w-full">
</div> Your account status is currently pending activation. To access the WebUI, please
reach out to the administrator. Admins can manage user statuses from the Admin
<div class=" mt-6 mx-auto relative group w-fit"> Panel.
<button </div>
class="relative z-20 flex px-5 py-2 rounded-full bg-white border border-gray-100 dark:border-none hover:bg-gray-100 transition font-medium text-sm"
on:click={async () => { <div class=" mt-6 mx-auto relative group w-fit">
location.href = '/'; <button
}} class="relative z-20 flex px-5 py-2 rounded-full bg-white border border-gray-100 dark:border-none hover:bg-gray-100 text-gray-700 transition font-medium text-sm"
> on:click={async () => {
{$i18n.t('Check Again')} location.href = '/';
</button> }}
>
<button {$i18n.t('Check Again')}
class="text-xs text-center w-full mt-2 text-gray-400 underline" </button>
on:click={async () => {
localStorage.removeItem('token'); <button
location.href = '/auth'; class="text-xs text-center w-full mt-2 text-gray-400 underline"
}}>{$i18n.t('Sign Out')}</button on:click={async () => {
> localStorage.removeItem('token');
location.href = '/auth';
}}>{$i18n.t('Sign Out')}</button
>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> {:else if localDBChats.length > 0}
{:else if localDBChats.length > 0} <div class="fixed w-full h-full flex z-50">
<div class="fixed w-full h-full flex z-50"> <div
<div class="absolute w-full h-full backdrop-blur-md bg-white/20 dark:bg-gray-900/50 flex justify-center"
class="absolute w-full h-full backdrop-blur-md bg-white/20 dark:bg-gray-900/50 flex justify-center" >
> <div class="m-auto pb-44 flex flex-col justify-center">
<div class="m-auto pb-44 flex flex-col justify-center"> <div class="max-w-md">
<div class="max-w-md"> <div class="text-center dark:text-white text-2xl font-medium z-50">
<div class="text-center dark:text-white text-2xl font-medium z-50"> Important Update<br /> Action Required for Chat Log Storage
Important Update<br /> Action Required for Chat Log Storage </div>
</div>
<div class=" mt-4 text-center text-sm dark:text-gray-200 w-full">
<div class=" mt-4 text-center text-sm dark:text-gray-200 w-full"> {$i18n.t(
{$i18n.t( "Saving chat logs directly to your browser's storage is no longer supported. Please take a moment to download and delete your chat logs by clicking the button below. Don't worry, you can easily re-import your chat logs to the backend through"
"Saving chat logs directly to your browser's storage is no longer supported. Please take a moment to download and delete your chat logs by clicking the button below. Don't worry, you can easily re-import your chat logs to the backend through" )}
)} <span class="font-semibold dark:text-white"
<span class="font-semibold dark:text-white" >{$i18n.t('Settings')} > {$i18n.t('Chats')} > {$i18n.t('Import Chats')}</span
>{$i18n.t('Settings')} > {$i18n.t('Chats')} > {$i18n.t('Import Chats')}</span >. {$i18n.t(
>. {$i18n.t( 'This ensures that your valuable conversations are securely saved to your backend database. Thank you!'
'This ensures that your valuable conversations are securely saved to your backend database. Thank you!' )}
)} </div>
</div>
<div class=" mt-6 mx-auto relative group w-fit">
<div class=" mt-6 mx-auto relative group w-fit"> <button
<button class="relative z-20 flex px-5 py-2 rounded-full bg-white border border-gray-100 dark:border-none hover:bg-gray-100 transition font-medium text-sm"
class="relative z-20 flex px-5 py-2 rounded-full bg-white border border-gray-100 dark:border-none hover:bg-gray-100 transition font-medium text-sm" on:click={async () => {
on:click={async () => { let blob = new Blob([JSON.stringify(localDBChats)], {
let blob = new Blob([JSON.stringify(localDBChats)], { type: 'application/json'
type: 'application/json' });
}); saveAs(blob, `chat-export-${Date.now()}.json`);
saveAs(blob, `chat-export-${Date.now()}.json`);
const tx = DB.transaction('chats', 'readwrite');
const tx = DB.transaction('chats', 'readwrite'); await Promise.all([tx.store.clear(), tx.done]);
await Promise.all([tx.store.clear(), tx.done]); await deleteDB('Chats');
await deleteDB('Chats');
localDBChats = [];
localDBChats = []; }}
}} >
> Download & Delete
Download & Delete </button>
</button>
<button
<button class="text-xs text-center w-full mt-2 text-gray-400 underline"
class="text-xs text-center w-full mt-2 text-gray-400 underline" on:click={async () => {
on:click={async () => { localDBChats = [];
localDBChats = []; }}>{$i18n.t('Close')}</button
}}>{$i18n.t('Close')}</button >
> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> {/if}
{/if}
<div
class=" text-gray-700 dark:text-gray-100 bg-white dark:bg-gray-900 min-h-screen overflow-auto flex flex-row"
>
<Sidebar /> <Sidebar />
<SettingsModal bind:show={$showSettings} /> <SettingsModal bind:show={$showSettings} />
<ChangelogModal bind:show={$showChangelog} /> <ChangelogModal bind:show={$showChangelog} />
<slot /> <slot />
</div> {/if}
</div> </div>
{/if} </div>
<style> <style>
.loading { .loading {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment