Show the profile hover card for users in a user column by a1rwulf · Pull Request #3026 · nextcloud/tables

a1rwulf · 2026-09-23T20:01:14Z

Wraps user bubbles in a hover/focus popover that renders the profile hover card from @nextcloud/vue, so the profile of a referenced user can be viewed without leaving the table. Clicking the cell still starts editing. Groups and teams are unchanged.

🖼️ Screenshots

🏁 Checklist

⛑️ Tests (unit and/or integration) are included or not needed
🔙 Backport requests are created or not needed: /backport to stableX.X
📅 Milestone is set
🌸 PR title is meaningful (if it should be in the changelog: is it meaningful to users?)

🤖 AI (if applicable)

The content of this PR was partly or fully generated using AI

Out of scope

While testing the implementation I found that the hover dialog could be improved when a user profile has multiple emails.
See the screenshot, it is impossible to know which icon is which mailto action.
You need to hover it and check the mailto action in the left bottom of the browser window.
However that should be it's own improvment PR if wanted.

enjeck

I need to think about this. We once had this popover, but it was removed for some reason I don't remember. Not sure if that reason is still valid

a1rwulf · 2026-09-28T08:59:48Z

I need to think about this. We once had this popover, but it was removed for some reason I don't remember. Not sure if that reason is still valid

If there was a reason to not have it, what about a setting in the dialog where you chose the datatype, so one can enable it while it's disabled by default?

a1rwulf · 2026-10-07T19:56:57Z

Is there anything I can do to get this rolling?

github-actions · 2026-10-08T07:47:12Z

Hello there,
Thank you so much for taking the time and effort to create a pull request to our Nextcloud project.

We hope that the review process is going smooth and is helpful for you. We want to ensure your pull request is reviewed to your satisfaction. If you have a moment, our community management team would very much appreciate your feedback on your experience with this PR review process.

Your feedback is valuable to us as we continuously strive to improve our community developer experience. Please take a moment to complete our short survey by clicking on the following link: https://cloud.nextcloud.com/apps/forms/s/i9Ago4EQRZ7TWxjfmeEpPkf6

Thank you for contributing to Nextcloud and we hope to hear from you soon!

(If you believe you should not receive this message, you can add yourself to the blocklist.)

samin-z · 2026-10-08T07:49:18Z

Is there anything I can do to get this rolling?

@a1rwulf i'll absolutely have more updates in regard to this pr today.

samin-z · 2026-10-09T12:03:38Z

@enjeck
i believe you mean this pr as this functionality was removed as part of it
#1254

enjeck · 2026-10-12T06:33:05Z

@enjeck i believe you mean this pr as this functionality was removed as part of it #1254

Yes, that was it, thank you! Seems like there's nothing stopping this PR then, lemme see...

enjeck

this approach seems too complicated. What's stopping us from just using the component like I mentioned at #1254 (comment) ?

a1rwulf · 2026-10-12T07:24:46Z

this approach seems too complicated. What's stopping us from just using the component like I mentioned at #1254 (comment) ?

Thanks for the review.
Your suggested approach is indeed more straight forward.
Can you have a look at the updated implementation?
Thanks.

enjeck · 2026-10-12T07:43:38Z

this approach seems too complicated. What's stopping us from just using the component like I mentioned at #1254 (comment) ?

Thanks for the review. Your suggested approach is indeed more straight forward. Can you have a look at the updated implementation? Thanks.

please show screenshot of what it looks like

enjeck · 2026-10-12T07:44:15Z

we don't need too many changes btw. Including the tests, not necessary

a1rwulf · 2026-10-12T08:46:37Z

a1rwulf · 2026-10-12T09:34:45Z

Ok reducing to the bare minimum brings up a bunch of questions that need to be answered.
My initial approach rendered the avatar and the name inside a bubble (so it matches how groups are rendered) and imho a user would expect hovering the bubble will bring up the profile dialog.

However changing to the Avatar and not applying custom styling results in this:

If I apply style so it matches the bubble, you still need to hover the avatar icon to get the profile dialog, hovering the name does nothing.
If we want the whole bubble to bring the dialog, we need to go back to my initial approach and place the popover over the whole bubble.

Can you let me know which approach you prefer?

a1rwulf · 2026-10-14T12:11:15Z

@enjeck can you let me know which way you prefer?

Render like in the last screenshot, so it's clear only hovering the Avatar brings up the dialog
Render a pill, but still only hovering the Avatar brings up the dialog
Render a pill, hovering works over whole pill (would need the old more complicated implementation)

enjeck · 2026-10-18T16:36:45Z

2. Render a pill, but still only hovering the Avatar brings up the dialog

i like option 2

enjeck · 2026-10-18T16:39:54Z

+						class="usergroup-user"
+						:class="{ 'usergroup-user--current': isCurrentUser(item) }"
+						:style="{ height: `${entrySize}px` }">
+						<span class="usergroup-user__avatar" data-cy="usergroupUserAvatar" @click.stop>


Could you stop the click only when it hits an avatar with a menu? For example, call a method that checks event.target.closest() before calling event.stopPropagation().

enjeck · 2026-10-18T16:51:09Z

+							<NcAvatar :user="item.id"
+								:display-name="item.displayName ?? item.id"


lets disable the menu when the table is shown through a public token.

enjeck · 2026-10-18T16:54:12Z

+	&--current {
+		background-color: var(--color-primary-element-light);
+	}


The old bubble marked the current user with primary. It would be nice to keep that

enjeck · 2026-10-18T16:54:51Z

we don't need the tests

I removed the tests.

a1rwulf · 2026-10-18T18:56:29Z

Render a pill, but still only hovering the Avatar brings up the dialog

i like option 2

I have implemented it like this.
Regarding public tables I had to add a fix that crashed on my own tests.
If needed I could split this out.

enjeck

failing tests are related. Pls fix

Renders users in a user column with NcAvatar and its built-in menu next to the display name, so the profile of a referenced user can be viewed without leaving the table. A click on an avatar with a menu opens the menu instead of starting inline editing, the current user is highlighted as before, and the menu is disabled on public shares. Groups and teams keep the user bubble. Assisted-by: ClaudeCode:claude-fable-5-1 Signed-off-by: Wolfgang Haupt <wolfgang@seadev-studios.com>

a1rwulf requested review from blizzz and enjeck as code owners September 23, 2026 20:01

enjeck reviewed Sep 28, 2026

View reviewed changes

samin-z self-requested a review September 29, 2026 08:50

github-actions Bot added the feedback-requested label Oct 8, 2026

enjeck reviewed Oct 12, 2026

View reviewed changes

a1rwulf force-pushed the feat_usergroup-profile-hover-card branch from 2ad9fd0 to 8db20c2 Compare October 12, 2026 07:21

a1rwulf mentioned this pull request Oct 12, 2026

fix(columns): persist the show user status setting of user columns #3084

Merged

1 of 5 tasks

enjeck reviewed Oct 18, 2026

View reviewed changes

a1rwulf force-pushed the feat_usergroup-profile-hover-card branch from 8db20c2 to ad695ac Compare October 18, 2026 18:51

enjeck reviewed Oct 25, 2026

View reviewed changes

a1rwulf force-pushed the feat_usergroup-profile-hover-card branch from ad695ac to c6328b1 Compare October 25, 2026 15:53

		<NcAvatar :user="item.id"
		:display-name="item.displayName ?? item.id"

Conversation

a1rwulf commented Sep 23, 2026

🖼️ Screenshots

🏁 Checklist

🤖 AI (if applicable)

Out of scope

Uh oh!

enjeck left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

a1rwulf commented Sep 28, 2026

Uh oh!

a1rwulf commented Oct 7, 2026

Uh oh!

github-actions Bot commented Oct 8, 2026

Uh oh!

samin-z commented Oct 8, 2026

Uh oh!

samin-z commented Oct 9, 2026

Uh oh!

enjeck commented Oct 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

enjeck left a comment

Choose a reason for hiding this comment

Uh oh!

a1rwulf commented Oct 12, 2026

Uh oh!

enjeck commented Oct 12, 2026

Uh oh!

enjeck commented Oct 12, 2026

Uh oh!

a1rwulf commented Oct 12, 2026

Uh oh!

a1rwulf commented Oct 12, 2026

Uh oh!

a1rwulf commented Oct 14, 2026

Uh oh!

enjeck commented Oct 18, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

a1rwulf commented Oct 18, 2026

Uh oh!

enjeck left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

enjeck left a comment •

edited

Loading

enjeck commented Oct 12, 2026 •

edited

Loading