Skip to content

Fix artifact title in listing (use title/artifact/name priority) #241 #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
shoaibkhan-sde wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Fix artifact title in listing (use title/artifact/name priority) #241 #3

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
013e4fa
Fix artifact title in listing (use title/artifact/name priority) #241
shoaibkhan-sde Dec 1, 2025
78a18cb
Remove debug console.log before merge
shoaibkhan-sde Dec 1, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 19 additions & 9 deletions src/lib/components/file-list.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,36 @@
<script lang="ts">
import { FolderOpenOutline, FileOutline } from 'flowbite-svelte-icons';
import { Listgroup } from 'flowbite-svelte';
import { FolderOpenOutline, FileOutline } from 'flowbite-svelte-icons';
import { Listgroup } from 'flowbite-svelte';

export let collection: any[];
export let files = true;
let iconType = files ? FileOutline : FolderOpenOutline;
export let collection: any[];
export let files = true;
let iconType = files ? FileOutline : FolderOpenOutline;

// Debug: Print the first artifact to inspect fields (title, artifact, name, etc.)
console.log("Artifact sample:", collection?.[0]);
</script>

<ul>
<div class="item-list">
<div class="mb-6 grid gap-2 md:grid-cols-1">
<div class="item-list-item">

<!-- MAIN LIST -->
<Listgroup items={collection.map((c) => c.name)} let:index>
<a href={collection[index]._links?.self?.href ?? '.'}>
<li class="flex items-center gap-2" style="min-height: 28px;">

<svelte:component this={iconType} class="h-4 w-4" />
{collection[index].name}


<svelte:component this={iconType} class="h-4 w-4" />

<!-- FIX: Used title → artifact → name (in this priority) -->
{collection[index].title
?? collection[index].artifact
?? collection[index].name}
Comment on lines 14 to +25
Copy link

@coderabbitai coderabbitai bot Dec 1, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

🧩 Analysis chain

🏁 Script executed:

cd /tmp && find . -name "*.svelte" -type f 2>/dev/null | head -20

Repository: dbpedia/databus-moss-frontend

Length of output: 202

🏁 Script executed:

git ls-files | grep -E "\.(svelte|js|ts)$" | head -20

Repository: dbpedia/databus-moss-frontend

Length of output: 202

🏁 Script executed:

rg -n -C3 -g '*.svelte' '<Listgroup' | head -100

Repository: dbpedia/databus-moss-frontend

Length of output: 202

🌐 Web query:

Flowbite Svelte Listgroup component items prop let:index

💡 Result:

Yes — Listgroup exposes each item (and its index) to the default slot when you pass items. Use a svelte:fragment (or let: on the slot) to access let:item and let:index. Example:

<script> import { Listgroup } from "flowbite-svelte"; const items = ["Profile","Settings","Messages","Download"]; </script>
#{index} — {item}

(If you need links/buttons, the docs show the same items prop behaviour and item objects with name/href/current/attrs, etc.). [1][2]

Sources:
[1] Flowbite Svelte — List Group docs.
[2] Flowbite Svelte (next) — List Group docs.

🌐 Web query:

nullish coalescing empty string JavaScript behavior

💡 Result:

Short answer: The nullish coalescing operator (??) treats only null and undefined as “nullish.” An empty string ("") is not nullish, so "" ?? "default" returns "" (not "default"). [1][2]

Example:

  • "" ?? "fallback" // returns "".
  • "" || "fallback" // returns "fallback" (because || treats all falsy values the same). [1]

References: MDN documentation on ?? and a practical guide explaining the difference vs ||. [1][2]

Empty string handling may bypass fallback logic.

The nullish coalescing operator (??) only checks for null and undefined, not empty strings. If title or artifact can be empty strings, they will be displayed instead of falling back to the next option. If empty strings should be treated as missing, consider using the logical OR operator (||) instead, or add explicit empty string checks.

The Listgroup items mapping pattern is valid—the code passes collection.map((c) => c.name) to the items prop while using let:index to access the original collection objects for display, which works correctly with Flowbite Svelte's Listgroup component.

🤖 Prompt for AI Agents 
In src/lib/components/file-list.svelte around lines 19 to 28, the displayed
label uses nullish coalescing (??) so empty strings in title or artifact will be
treated as valid values and bypass fallback; update the logic to treat empty
strings as missing by replacing the chain with a check that treats falsy/empty
string as absent (for example use logical OR (||) between title, artifact, and
name, or an explicit ternary/trim check like title && title.trim() ? title :
artifact && artifact.trim() ? artifact : name) so empty strings fall back to the
next field.


</li>
</a>
</Listgroup>

</div>
</div>
</div>
Expand Down