Docker/planka
Docker/planka
1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-08-10 07:55:27 +02:00
Code Issues Releases Activity

fix: #617 members list display logic for boards with more than 5 members

Browse source
This commit is contained in:
James Dominguez 2024-03-19 14:16:21 -07:00
parent b4e01d7256
commit 41a2577696
2 changed files with 17 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

10
client/src/components/Memberships/Memberships.jsx
View file

@ -32,10 +32,15 @@ const Memberships = React.memo(
const AddPopup = usePopup(AddStep);
const ActionsPopup = usePopup(ActionsStep);
// Number of display slots available for showing user icons
const userDisplaySlots = 5;
const shownUsers = items.slice(0, userDisplaySlots);
const remainingUsers = items.slice(userDisplaySlots);
return (
<>
<span className={styles.users}>
{items.map((item) => (
{shownUsers.map((item) => (
<span key={item.id} className={styles.user}>
<ActionsPopup
membership={item}
@ -63,6 +68,9 @@ const Memberships = React.memo(
</span>
))}
</span>
{remainingUsers && (
<span className={styles.moreUsersIndicator}>+ {remainingUsers.length} other Members</span>
)}
{canEdit && (
<AddPopup
users={allUsers}

9
client/src/components/Memberships/Memberships.module.scss
View file

@ -25,6 +25,13 @@
.users {
display: inline-block;
vertical-align: top;
vertical-align: middle;
}
.moreUsersIndicator {
margin-right: 15px;
margin-left: 8px;
color: white;
font-size: 12px;
}
}