diff options
| -rw-r--r-- | frontend/src/lib/Utils.ts | 2 | ||||
| -rw-r--r-- | frontend/src/lib/pills/TagPill.svelte | 3 |
2 files changed, 3 insertions, 2 deletions
diff --git a/frontend/src/lib/Utils.ts b/frontend/src/lib/Utils.ts index c0e5b6c..df7dad8 100644 --- a/frontend/src/lib/Utils.ts +++ b/frontend/src/lib/Utils.ts @@ -93,7 +93,7 @@ export function formatListSize(word: string, size: number) { return `${size} ${pluralize(word, size)}`; } -export function joinText(items: string[], separator = ', ') { +export function joinText(items: (string | undefined | null)[], separator = ', ') { return items.filter((i) => i).join(separator); } diff --git a/frontend/src/lib/pills/TagPill.svelte b/frontend/src/lib/pills/TagPill.svelte index c97c722..bbd3c55 100644 --- a/frontend/src/lib/pills/TagPill.svelte +++ b/frontend/src/lib/pills/TagPill.svelte @@ -1,5 +1,6 @@ <script lang="ts"> import type { ComicTag } from '$gql/graphql'; + import { joinText } from '$lib/Utils'; import Pill from './Pill.svelte'; interface Props extends Pick<ComicTag, 'name' | 'description'> { @@ -9,7 +10,7 @@ let { name, description, highlight = false }: Props = $props(); let [namespace, tag] = name.split(':'); - let tooltip = [name, description].filter((v) => v).join('\n\n'); + let tooltip = joinText([name, description], '\n\n'); </script> <Pill {highlight} name={tag} style={namespace} {tooltip}></Pill> |