immich/web/src/lib/components/assets/broken-asset.svelte
Min Idzelis c62fc155c8
feat: show thumbhash behind load error, if possible (#17554)
* feat: show thumbhash behind load error, if possible

* forgot this
2025-04-11 17:01:51 -05:00

25 lines
791 B
Svelte

<script lang="ts">
import Icon from '$lib/components/elements/icon.svelte';
import { mdiImageBrokenVariant } from '@mdi/js';
import { t } from 'svelte-i18n';
interface Props {
class?: string;
hideMessage?: boolean;
width?: string | undefined;
height?: string | undefined;
}
let { class: className = '', hideMessage = false, width = undefined, height = undefined }: Props = $props();
</script>
<div
class="flex flex-col overflow-hidden max-h-full max-w-full justify-center items-center bg-gray-100/40 dark:bg-gray-700/40 dark:text-gray-100 p-4 {className}"
style:width
style:height
>
<Icon path={mdiImageBrokenVariant} size="7em" class="max-w-full" />
{#if !hideMessage}
<span class="text-center">{$t('error_loading_image')}</span>
{/if}
</div>