refactor(web): byte unit utils (#10332)

refactor byte unit utils
This commit is contained in:
Daniel Dietzler 2024-06-14 19:27:46 +02:00 committed by GitHub
parent b4b654b53f
commit c896fe393f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 99 additions and 87 deletions

View file

@ -1,7 +1,7 @@
<script lang="ts">
import Icon from '$lib/components/elements/icon.svelte';
import { locale } from '$lib/stores/preferences.store';
import { asByteUnitString, getBytesWithUnit } from '$lib/utils/byte-units';
import { getByteUnitString, getBytesWithUnit } from '$lib/utils/byte-units';
import type { ServerStatsResponseDto } from '@immich/sdk';
import { mdiCameraIris, mdiChartPie, mdiPlayCircle } from '@mdi/js';
import StatsCard from './stats-card.svelte';
@ -102,9 +102,9 @@
<td class="w-1/4 text-ellipsis px-2 text-sm">{user.photos.toLocaleString($locale)}</td>
<td class="w-1/4 text-ellipsis px-2 text-sm">{user.videos.toLocaleString($locale)}</td>
<td class="w-1/4 text-ellipsis px-2 text-sm">
{asByteUnitString(user.usage, $locale, 0)}
{getByteUnitString(user.usage, $locale, 0)}
{#if user.quotaSizeInBytes}
/ {asByteUnitString(user.quotaSizeInBytes, $locale, 0)}
/ {getByteUnitString(user.quotaSizeInBytes, $locale, 0)}
{/if}
<span class="text-immich-primary dark:text-immich-dark-primary">
{#if user.quotaSizeInBytes}

View file

@ -1,10 +1,11 @@
<script lang="ts">
import Icon from '$lib/components/elements/icon.svelte';
import { ByteUnit } from '$lib/utils/byte-units';
export let icon: string;
export let title: string;
export let value: number;
export let unit: string | undefined = undefined;
export let unit: ByteUnit | undefined = undefined;
$: zeros = () => {
const maxLength = 13;
@ -26,7 +27,7 @@
class="text-immich-primary dark:text-immich-dark-primary">{value}</span
>
{#if unit}
<span class="absolute -top-5 right-2 text-base font-light text-gray-400">{unit}</span>
<span class="absolute -top-5 right-2 text-base font-light text-gray-400">{ByteUnit[unit]}</span>
{/if}
</div>
</div>