public/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-11-24 11:20:40 +09:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: help modal (#18145)

Browse Source
This commit is contained in:
Daniel Dietzler
2025-05-07 23:31:38 +02:00
committed by GitHub
parent a6e5e4f625
commit 09ced9a171
2 changed files with 13 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

133
web/src/lib/modals/HelpAndFeedbackModal.svelte Normal file
View File

@@ -0,0 +1,133 @@
<script lang="ts">
import { discordPath, discordViewBox } from '$lib/assets/svg-paths';
import Icon from '$lib/components/elements/icon.svelte';
import { type ServerAboutResponseDto } from '@immich/sdk';
import { Modal, ModalBody } from '@immich/ui';
import { mdiBugOutline, mdiFaceAgent, mdiGit, mdiGithub, mdiInformationOutline } from '@mdi/js';
import { t } from 'svelte-i18n';
interface Props {
onClose: () => void;
info: ServerAboutResponseDto;
}
let { onClose, info }: Props = $props();
</script>
<Modal title={$t('support_and_feedback')} {onClose} size="small">
<ModalBody>
<p>{$t('official_immich_resources')}</p>
<div class="flex flex-col sm:grid sm:grid-cols-2 gap-2 mt-5">
<div>
<a href="https://{info.version}.archive.immich.app/docs/overview/introduction" target="_blank" rel="noreferrer">
<Icon path={mdiInformationOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="documentation-label"
>
{$t('documentation')}
</p>
</a>
</div>
<div>
<a href="https://github.com/immich-app/immich/" target="_blank" rel="noreferrer">
<Icon path={mdiGithub} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
>
{$t('source')}
</p>
</a>
</div>
<div>
<a href="https://discord.immich.app" target="_blank" rel="noreferrer">
<Icon path={discordPath} viewBox={discordViewBox} class="inline-block" size="1.5em" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
>
{$t('discord')}
</p>
</a>
</div>
<div>
<a href="https://github.com/immich-app/immich/issues/new/choose" target="_blank" rel="noreferrer">
<Icon path={mdiBugOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
>
{$t('bugs_and_feature_requests')}
</p>
</a>
</div>
</div>
{#if info.thirdPartyBugFeatureUrl || info.thirdPartySourceUrl || info.thirdPartyDocumentationUrl || info.thirdPartySupportUrl}
<p class="mt-5">{$t('third_party_resources')}</p>
<p class="text-sm mt-1">
{$t('support_third_party_description')}
</p>
<div class="flex flex-col sm:grid sm:grid-cols-2 gap-2 mt-5">
{#if info.thirdPartyDocumentationUrl}
<div>
<a href={info.thirdPartyDocumentationUrl} target="_blank" rel="noreferrer">
<Icon path={mdiInformationOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="documentation-label"
>
{$t('documentation')}
</p>
</a>
</div>
{/if}
{#if info.thirdPartySourceUrl}
<div>
<a href={info.thirdPartySourceUrl} target="_blank" rel="noreferrer">
<Icon path={mdiGit} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
>
{$t('source')}
</p>
</a>
</div>
{/if}
{#if info.thirdPartySupportUrl}
<div>
<a href={info.thirdPartySupportUrl} target="_blank" rel="noreferrer">
<Icon path={mdiFaceAgent} class="inline-block" size="1.5em" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
>
{$t('support')}
</p>
</a>
</div>
{/if}
{#if info.thirdPartyBugFeatureUrl}
<div>
<a href={info.thirdPartyBugFeatureUrl} target="_blank" rel="noreferrer">
<Icon path={mdiBugOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
>
{$t('bugs_and_feature_requests')}
</p>
</a>
</div>
{/if}
</div>
{/if}
</ModalBody>
</Modal>