mirror of
https://github.com/immich-app/immich.git
synced 2025-06-23 15:30:51 -04:00
50 lines
1.6 KiB
Svelte
50 lines
1.6 KiB
Svelte
<script lang="ts">
|
|
import ServerAboutModal from '$lib/components/shared-components/server-about-modal.svelte';
|
|
import { websocketStore } from '$lib/stores/websocket';
|
|
import { requestServerInfo } from '$lib/utils/auth';
|
|
import { onMount } from 'svelte';
|
|
import { t } from 'svelte-i18n';
|
|
import { getAboutInfo, type ServerAboutResponseDto } from '@immich/sdk';
|
|
|
|
const { serverVersion, connected } = websocketStore;
|
|
|
|
let isOpen = false;
|
|
|
|
$: version = $serverVersion ? `v${$serverVersion.major}.${$serverVersion.minor}.${$serverVersion.patch}` : null;
|
|
|
|
let aboutInfo: ServerAboutResponseDto;
|
|
|
|
onMount(async () => {
|
|
await requestServerInfo();
|
|
aboutInfo = await getAboutInfo();
|
|
});
|
|
</script>
|
|
|
|
{#if isOpen}
|
|
<ServerAboutModal onClose={() => (isOpen = false)} info={aboutInfo} />
|
|
{/if}
|
|
|
|
<div
|
|
class="text-sm hidden group-hover:sm:flex md:flex pl-5 pr-1 place-items-center place-content-center justify-between"
|
|
>
|
|
{#if $connected}
|
|
<div class="flex gap-2 place-items-center place-content-center">
|
|
<div class="w-[7px] h-[7px] bg-green-500 rounded-full" />
|
|
<p class="dark:text-immich-gray">{$t('server_online')}</p>
|
|
</div>
|
|
{:else}
|
|
<div class="flex gap-2 place-items-center place-content-center">
|
|
<div class="w-[7px] h-[7px] bg-red-500 rounded-full" />
|
|
<p class="text-red-500">{$t('server_offline')}</p>
|
|
</div>
|
|
{/if}
|
|
|
|
<div class="flex justify-between justify-items-center">
|
|
{#if $connected && version}
|
|
<button type="button" on:click={() => (isOpen = true)} class="dark:text-immich-gray">{version}</button>
|
|
{:else}
|
|
<p class="text-red-500">{$t('unknown')}</p>
|
|
{/if}
|
|
</div>
|
|
</div>
|