dashbaord: dev mode pulse

This commit is contained in:
Ben Allfree 2024-12-04 03:27:57 -08:00
parent ea113a9cfe
commit 148e7bb954
2 changed files with 60 additions and 21 deletions

View File

@ -0,0 +1,5 @@
---
'@pockethost/dashboard': patch
---
Add dev mode pulse

View File

@ -51,17 +51,29 @@
</svelte:head> </svelte:head>
{#if isReady} {#if isReady}
<div class="flex flex-row items-center justify-between mb-6 gap-4 pl-4 sm:pl-6 lg:pl-8 pr-2"> <div
class="flex flex-row items-center justify-between mb-6 gap-4 pl-4 sm:pl-6 lg:pl-8 pr-2"
>
<div> <div>
<div class="flex items-center gap-2">
<h2 <h2
class="text-4xl md:text-left text-base-content font-bold mb-3 break-words" class="text-4xl md:text-left text-base-content font-bold mb-3 break-words"
> >
{$instance.subdomain} {$instance.subdomain}
</h2> </h2>
</div>
<span class="text-gray-400"> <span class="text-gray-400">
Version {$instance.version} - <span class="capitalize">{$instance.status}</span> Version {$instance.version} -
<span class="capitalize">{$instance.status}</span>
</span> </span>
{#if $instance.dev}
<a
href={`/instances/${$instance.id}/dev`}
class="text-warning animate-pulse border-warning border-2 p-1 rounded"
>
Dev Mode Active (SLOW)
</a>
{/if}
</div> </div>
<div> <div>
@ -89,9 +101,9 @@
<a href={`/instances/${id}`} class={activeClass(id)}>Overview</a> <a href={`/instances/${id}`} class={activeClass(id)}>Overview</a>
</li> </li>
<li> <li>
<a <a href={`/instances/${id}/secrets`} class={activeClass(`secrets`)}
href={`/instances/${id}/secrets`} >Secrets</a
class={activeClass(`secrets`)}>Secrets</a> >
</li> </li>
<li> <li>
<a href={`/instances/${id}/logs`} class={activeClass(`logs`)}>Logs</a> <a href={`/instances/${id}/logs`} class={activeClass(`logs`)}>Logs</a>
@ -123,14 +135,36 @@
<Fa icon={faTriangleExclamation} class="text-error inline" /> <Fa icon={faTriangleExclamation} class="text-error inline" />
</div> </div>
<ul class="menu text-base-content"> <ul class="menu text-base-content">
<li><a href={`/instances/${id}/version`} class={activeClass(`version`)}>Change Version</a></li>
<li><a href={`/instances/${id}/domain`} class={activeClass(`domain`)}>Custom Domain</a></li>
<li><a href={`/instances/${id}/admin-sync`} class={activeClass(`admin-sync`)}>Admin Sync</a></li>
<li><a href={`/instances/${id}/dev`} class={activeClass(`dev`)}>Dev Mode</a></li>
<li><a href={`/instances/${id}/rename`} class={activeClass(`rename`)}>Rename</a></li>
<li> <li>
<a href={`/instances/${id}/delete`} class={`text-error ${activeClass(`delete`)}`} <a href={`/instances/${id}/version`} class={activeClass(`version`)}
>Delete</a >Change Version</a
>
</li>
<li>
<a href={`/instances/${id}/domain`} class={activeClass(`domain`)}
>Custom Domain</a
>
</li>
<li>
<a
href={`/instances/${id}/admin-sync`}
class={activeClass(`admin-sync`)}>Admin Sync</a
>
</li>
<li>
<a href={`/instances/${id}/dev`} class={activeClass(`dev`)}
>Dev Mode</a
>
</li>
<li>
<a href={`/instances/${id}/rename`} class={activeClass(`rename`)}
>Rename</a
>
</li>
<li>
<a
href={`/instances/${id}/delete`}
class={`text-error ${activeClass(`delete`)}`}>Delete</a
> >
</li> </li>
</ul> </ul>