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> </div>
<span bind:this={nameElement} style="vertical-align: middle;">{@html htmlName} ({item.id})</span> <span bind:this={nameElement} style="vertical-align: middle;">{@html htmlName} ({item.id})</span>
</div> </div>
<div> <div style="margin-left: auto;">
{#if item && (item.avatar_url || item.icon)} {#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} /> <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} {:else}

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

@ -64,13 +64,14 @@
} }
} }
let isOpenArray = []; let isOpen = {};
function toggleCard(index: number) { function toggleCard(index: string) {
if (isOpenArray[index] === true) { isOpen[index] = isOpen[index] || {};
isOpenArray[index] = false; if (isOpen[index] === true) {
isOpen[index] = false;
} else { } else {
isOpenArray[index] = true; isOpen[index] = true;
} }
} }
@ -109,10 +110,10 @@
{#if !openByDefault && (settings && settings.accessibility ? (!settings.accessibility.expandedcards && !settings.accessibility.pagelinks) : true)} {#if !openByDefault && (settings && settings.accessibility ? (!settings.accessibility.expandedcards && !settings.accessibility.pagelinks) : true)}
<div class="mb-3"> <div class="mb-3">
{#each list as item, index (item.id + index)} {#each list as item, index (item.uuid)}
<Card> <Card>
<h2 class="accordion-header"> <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}> <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} > <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"} {#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> <Tooltip placement="top" target={`${itemType}-copy-${item.id}-${indexStart + index}`}>{copiedArray[indexStart + index] ? "Copied!" : "Copy public link"}</Tooltip>
</button> </button>
</h2> </h2>
<Collapse isOpen={isOpenArray[indexStart + index]}> <Collapse isOpen={isOpen[item.uuid]}>
<CardBody> <CardBody>
{#if itemType === "member"} {#if itemType === "member"}
<MemberBody on:update on:deletion bind:isPublic groups={groups} member={item} /> <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) { function updateDelete(event: any) {
if (itemType === "member") { if (itemType === "member") {
members = members.filter(m => m.id !== event.detail); members = members.filter(m => m.id !== event.detail);
@ -105,7 +97,6 @@
} }
function update(event: any) { function update(event: any) {
console.log(event.detail);
if (itemType === "member") { if (itemType === "member") {
members = members.map(m => m.id === event.detail.id ? m = event.detail : m); members = members.map(m => m.id === event.detail.id ? m = event.detail : m);
list = members; list = members;