thibaud-lclr/api-client
1
0
Fork 0
Code Packages Activity Actions

feat(common): display user roles in member stack tooltips (#5793)

Browse source
This commit is contained in:
Leonic 2026-01-23 16:14:10 +01:00 committed by GitHub
parent fb09afbd71
commit dcc36d2a35
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 8 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
packages/hoppscotch-common/src/components/teams/MemberStack.vue
View file

@ -8,7 +8,7 @@
<HoppSmartPicture
v-tippy="{ theme: 'tooltip' }"
:name="member.user.uid"
:title="getUserName(member as TeamMember)"
:title="getUserWithRole(member as TeamMember)"
class="ring-2 ring-primary group-hover:-translate-y-1 transition-transform"
@click="handleClick()"
/>
@ -51,6 +51,12 @@ const getUserName = (member: TeamMember): string =>
member.user.email ||
t("profile.default_hopp_displayname")
const getUserWithRole = (member: TeamMember): string => {
const name = getUserName(member)
const role = member.role
return `${name} (${role})`
}
const maxMembersSoftLimit = 3
const maxMembersHardLimit = 6
@ -66,7 +72,7 @@ const remainingSlicedMembers = computed(
props.teamMembers
.slice(maxMembersSoftLimit)
.slice(0, maxMembersHardLimit)
.map((member) => getUserName(member as TeamMember))
.map((member) => getUserWithRole(member as TeamMember))
.join(`,<br>`) +
(props.teamMembers.length - (maxMembersSoftLimit + maxMembersHardLimit) > 0
? `,<br>${t("team.more_members", {