KevinMidboe/immich
1
0
Fork 0
mirror of https://github.com/KevinMidboe/immich.git synced 2026-01-18 23:27:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Implemented status box on the side bar (#201)

Browse Source
This commit is contained in:
Alex
2022-06-05 05:15:39 -05:00
committed by GitHub
parent ab6909bfbd
commit b9f38162d5
6 changed files with 125 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
web/src/routes/__layout.svelte
View File

@@ -7,25 +7,11 @@
<script lang="ts">
import '../app.css';
import { fly, slide, blur } from 'svelte/transition';
import { quintOut } from 'svelte/easing';
import { getRequest } from '$lib/api';
import { onDestroy } from 'svelte';
import { blur } from 'svelte/transition';
import DownloadPanel from '$lib/components/asset-viewer/download-panel.svelte';
import { serverEndpoint } from '$lib/constants';
export let url: string;
let endpoint = serverEndpoint;
let isServerOk = true;
const pingServerInterval = setInterval(async () => {
const response = await getRequest('server-info/ping', '');
if (response.res === 'pong') isServerOk = true;
else isServerOk = false;
}, 10000);
onDestroy(() => clearInterval(pingServerInterval));
</script>
<main>
@@ -36,19 +22,3 @@
</div>
{/key}
</main>
<footer
class="text-sm fixed bottom-0 h-8 flex place-items-center place-content-center bg-gray-50 w-screen font-mono gap-8 px-4 font-medium"
>
<p class="">
Server URL <span class="text-immich-primary font-bold">{endpoint}</span>
</p>
<p class="">
Server Status
{#if isServerOk}
<span class="text-immich-primary font-bold">OK</span>
{:else}
<span class="text-red-500 font-bold">OFFLINE</span>
{/if}
</p>
</footer>

7
web/src/routes/admin/index.svelte
View File

@@ -34,6 +34,7 @@
import UserManagement from '$lib/components/admin/user-management.svelte';
import FullScreenModal from '$lib/components/shared/full-screen-modal.svelte';
import CreateUserForm from '$lib/components/forms/create-user-form.svelte';
import StatusBox from '../../lib/components/shared/status-box.svelte';
let selectedAction: AdminSideBarSelection;
@@ -74,7 +75,7 @@
{/if}
<section class="grid grid-cols-[250px_auto] relative pt-[72px] h-screen">
<section id="admin-sidebar" class="pt-8 pr-6">
<section id="admin-sidebar" class="pt-8 pr-6 flex flex-col justify-between">
<SideBarButton
title="User"
logo={AccountMultipleOutline}
@@ -82,6 +83,10 @@
isSelected={selectedAction === AdminSideBarSelection.USER_MANAGEMENT}
on:selected={onButtonClicked}
/>
<div class="mb-6">
<StatusBox />
</div>
</section>
<section class="overflow-y-auto relative">
<div id="setting-title" class="pt-10 fixed w-full z-50 bg-immich-bg">

9
web/src/routes/photos/index.svelte
View File

@@ -39,6 +39,7 @@
import type { ImmichAsset } from '../../lib/models/immich-asset';
import AssetViewer from '../../lib/components/asset-viewer/asset-viewer.svelte';
import DownloadPanel from '../../lib/components/asset-viewer/download-panel.svelte';
import StatusBox from '../../lib/components/shared/status-box.svelte';
export let user: ImmichUser;
let selectedAction: AppSideBarSelection;
@@ -91,7 +92,7 @@
<section class="grid grid-cols-[250px_auto] relative pt-[72px] h-screen">
<!-- Sidebar -->
<section id="admin-sidebar" class="flex flex-col gap-4 pt-8 pr-6">
<section id="admin-sidebar" class="flex flex-col justify-between gap-4 pt-8 pr-6">
<SideBarButton
title="Photos"
logo={ImageOutline}
@@ -99,6 +100,12 @@
isSelected={selectedAction === AppSideBarSelection.PHOTOS}
on:selected={onButtonClicked}
/>
<!-- Status Box -->
<div class="mb-6">
<StatusBox />
</div>
</section>
<!-- Main Section -->