removed the dev bar

Signed-off-by: Ronni Skansing <rskansing@gmail.com>
This commit is contained in:
Ronni Skansing
2025-11-27 01:53:47 +01:00
parent f18d8cd430
commit 163f86bbf7
2 changed files with 1 additions and 130 deletions
@@ -1,128 +0,0 @@
<script>
import { onMount } from 'svelte';
import { fade } from 'svelte/transition';
import { addToast } from '$lib/store/toast';
import { AppStateService } from '$lib/service/appState';
// servies
const appState = AppStateService.instance;
// local state
let state = {};
let visible = false;
onMount(() => {
appState.subscribe((s) => {
state = s;
});
// on unmount
return () => {};
});
const triggerToast = (type) => {
addToast('Test toast with message.', type);
};
</script>
{#if import.meta.env.DEV}
<div>
<div>
<button
class="fixed border-2 border-slate-500 dark:border-slate-400 bg-white dark:bg-gray-700 w-8 h-8 left-2 pb-1 bottom-4 text-white rounded-full hover:right-3 hover:bottom-3 hover:w-10 hover:h-10 transition-all"
on:click={() => (visible = !visible)}
>
{#if visible}
🎣
{:else}
🎣
{/if}
</button>
</div>
{#if visible}
<div
transition:fade={{ duration: 100 }}
class="absolute right-0 h-auto bg-black dark:bg-gray-900 text-white p-4 z-40 border border-gray-600 dark:border-gray-500"
>
<h1 class="text-xl m-4">Developer Panel</h1>
<h2 class="text-lg font-bold m-4">Links</h2>
<ul class="m-4">
<li>
<a
href="http://localhost:8101"
target="_blank"
class="text-blue-400 hover:text-blue-300 underline">Database</a
>
</li>
<li>
<a
href="http://localhost:8102"
target="_blank"
class="text-blue-400 hover:text-blue-300 underline">Mailbox</a
>
</li>
<li>
<a
href="http://localhost:8103"
target="_blank"
class="text-blue-400 hover:text-blue-300 underline">Container logs</a
>
</li>
<li>
<a
href="http://localhost:8104"
target="_blank"
class="text-blue-400 hover:text-blue-300 underline">Container stats</a
>
</li>
</ul>
<h2 class="text-lg font-bold m-4">Toast</h2>
<ul class="m-4">
<li>
<button
on:click={() => triggerToast('Success')}
class="text-green-400 hover:text-green-300 underline">Trigger toast - Success</button
>
</li>
<li>
<button
on:click={() => triggerToast('Info')}
class="text-blue-400 hover:text-blue-300 underline">Trigger toast - Info</button
>
</li>
<li>
<button
on:click={() => triggerToast('Warning')}
class="text-yellow-400 hover:text-yellow-300 underline"
>Trigger toast - Warning</button
>
</li>
<li>
<button
on:click={() => triggerToast('Error')}
class="text-red-400 hover:text-red-300 underline">Trigger toast - Error</button
>
</li>
</ul>
<div class="pt-4">
<h2 class="text-lg font-bold">Global State</h2>
<table class="border-2 border-gray-400 dark:border-gray-500">
{#each Object.entries(state) as [key, value]}
<tr class="flex flex-col border-2 border-white dark:border-gray-600">
<td class="p-4 font-bold border-1 border-white dark:border-gray-600">{key}</td>
<td class="p-4 border-1 border-white dark:border-gray-600 w-full">
{#if typeof value === 'object'}
<pre class="whitespace-pre-wrap">{JSON.stringify(value, null, 2)}</pre>
{:else}
<p>
{value}
</p>
{/if}
</td>
</tr>
{/each}
</table>
</div>
</div>
{/if}
</div>
{/if}
+1 -2
View File
@@ -3,7 +3,7 @@
import { onMount, tick } from 'svelte';
import { page } from '$app/stores';
import { beforeNavigate, goto } from '$app/navigation';
import DeveloperPanel from '$lib/components/DeveloperPanel.svelte';
import { Session } from '$lib/service/session';
import { AppStateService } from '$lib/service/appState';
import { UserService } from '$lib/service/user';
@@ -237,7 +237,6 @@
<div class="flex flex-col min-w-[768px]">
<!-- global components -->
<DeveloperPanel />
<Loader />
<Toast />
<ChangeCompanyModal bind:visible={isChangeCompanyModalVisible} />