liz/PluralKit
liz/PluralKit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(dashboard): list freeze when editing sorted-by field

Browse Source 
also fixes the wrong cards remaining open after resorting the list
This commit is contained in:
Jake Fulmine 2022-09-27 20:53:18 +02:00
parent 05aecf730a
commit 3bae5344b6
3 changed files with 10 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dashboard/src/lib/CardsHeader.svelte
View File

@ -49,7 +49,7 @@
</div>
<span bind:this={nameElement} style="vertical-align: middle;">{@html htmlName} ({item.id})</span>
</div>
<div>
<div style="margin-left: auto;">
{#if item && (item.avatar_url || item.icon)}
<img tabindex={0} on:keydown|stopPropagation={(event) => {if (event.key === "Enter") {avatarOpen = true}}} on:click|stopPropagation={toggleAvatarModal} class="rounded-circle avatar" src={icon_url_resized} alt={altText} />
{:else}

17
dashboard/src/lib/list/CardsList.svelte
View File

@ -64,13 +64,14 @@
}
}
let isOpenArray = [];
let isOpen = {};
function toggleCard(index: number) {
if (isOpenArray[index] === true) {
isOpenArray[index] = false;
function toggleCard(index: string) {
isOpen[index] = isOpen[index] || {};
if (isOpen[index] === true) {
isOpen[index] = false;
} else {
isOpenArray[index] = true;
isOpen[index] = true;
}
}
@ -109,10 +110,10 @@
{#if !openByDefault && (settings && settings.accessibility ? (!settings.accessibility.expandedcards && !settings.accessibility.pagelinks) : true)}
<div class="mb-3">
{#each list as item, index (item.id + index)}
{#each list as item, index (item.uuid)}
<Card>
<h2 class="accordion-header">
<button class="w-100 accordion-button collapsed card-header" id={`${itemType}-card-${indexStart + index}`} on:click={() => toggleCard(indexStart + index)} on:keydown={(e) => skipToNextItem(e, indexStart + index)}>
<button class="w-100 accordion-button collapsed card-header" id={`${itemType}-card-${indexStart + index}`} on:click={() => toggleCard(item.uuid)} on:keydown={(e) => skipToNextItem(e, indexStart + index)}>
<CardsHeader {item} {sortBy} {searchBy}>
<div slot="icon" style="cursor: pointer;" id={`${itemType}-copy-${item.id}-${indexStart + index}`} on:click|stopPropagation={() => copyShortLink(indexStart + index, item.id)} on:keydown={(e) => copyShortLink(indexStart + index, item.id, e)} tabindex={0} >
{#if isPublic || item.privacy.visibility === "public"}
@ -129,7 +130,7 @@
<Tooltip placement="top" target={`${itemType}-copy-${item.id}-${indexStart + index}`}>{copiedArray[indexStart + index] ? "Copied!" : "Copy public link"}</Tooltip>
</button>
</h2>
<Collapse isOpen={isOpenArray[indexStart + index]}>
<Collapse isOpen={isOpen[item.uuid]}>
<CardBody>
{#if itemType === "member"}
<MemberBody on:update on:deletion bind:isPublic groups={groups} member={item} />

9
dashboard/src/lib/list/List.svelte
View File

@ -86,14 +86,6 @@
}
}
/* function updateList(event: any) {
list = list.map(member => member.id !== event.detail.id ? member : event.detail);
} */
/* function updateGroups(event: any) {
groups = event.detail;
} */
function updateDelete(event: any) {
if (itemType === "member") {
members = members.filter(m => m.id !== event.detail);
@ -105,7 +97,6 @@
}
function update(event: any) {
console.log(event.detail);
if (itemType === "member") {
members = members.map(m => m.id === event.detail.id ? m = event.detail : m);
list = members;