helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(web): tree data structure for folder and tag views (#18980)

Browse source 
* refactor folder view

inline link

* improved tree collapsing

* handle tags

* linting

* formatting

* simplify

* .from is faster

* simplify

* add key
This commit is contained in:
Mert 2025-06-09 11:02:16 -04:00 • committed by GitHub
parent ac0e94c003
commit 74f79cae69
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 249 additions and 191 deletions
Download patch file Download diff file Expand all files Collapse all files

23
web/src/lib/components/shared-components/tree/tree-items.svelte
View file

@ -1,28 +1,21 @@
<script lang="ts">
import Tree from '$lib/components/shared-components/tree/tree.svelte';
import { normalizeTreePath, type RecursiveObject } from '$lib/utils/tree-utils';
import { type TreeNode } from '$lib/utils/tree-utils';
interface Props {
items: RecursiveObject;
parent?: string;
active?: string;
tree: TreeNode;
active: string;
icons: { default: string; active: string };
getLink: (path: string) => string;
getColor?: (path: string) => string | undefined;
}
let { items, parent = '', active = '', icons, getLink, getColor = () => undefined }: Props = $props();
let { tree, active, icons, getLink }: Props = $props();
</script>
<ul class="list-none ms-2">
<!-- eslint-disable-next-line svelte/require-each-key -->
{#each Object.entries(items).sort() as [path, tree]}
{@const value = normalizeTreePath(`${parent}/${path}`)}
{@const key = value + getColor(value)}
{#key key}
<li>
<Tree {parent} value={path} {tree} {icons} {active} {getLink} {getColor} />
</li>
{/key}
{#each tree.children as node (node.color ? node.path + node.color : node.path)}
<li>
<Tree {node} {icons} {active} {getLink} />
</li>
{/each}
</ul>