From 2c9bee1da3484bba4bbbca2aae4b728ff5c8afaa Mon Sep 17 00:00:00 2001
From: comfydesigner <alextov@comfy.org>
Date: Tue, 7 Jul 2026 15:05:50 -0700
Subject: [PATCH] style: letter avatars for members, drop row hover, round
 partner rows

Use letter-initial avatars in the Members table (matching pending
invites) and drop the unused photo/UserAvatar path. Remove the hover
highlight on member and pending-invite rows. Give partner-node rows a
4px radius by painting the hover/selected background on the cells with
rounded end caps (table rows can't render border-radius directly).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 .../dialogs/settings/MemberTableRow.vue       | 23 ++++++++++++-------
 .../dialogs/settings/MembersPanelContent.vue  |  5 ----
 .../settings/PartnerNodesPanelContent.vue     |  2 +-
 .../dialogs/settings/PendingInviteRow.vue     |  5 +++-
 4 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/src/platform/workspace/components/dialogs/settings/MemberTableRow.vue b/src/platform/workspace/components/dialogs/settings/MemberTableRow.vue
index 4711c69b6c..c330a50b31 100644
--- a/src/platform/workspace/components/dialogs/settings/MemberTableRow.vue
+++ b/src/platform/workspace/components/dialogs/settings/MemberTableRow.vue
@@ -1,12 +1,17 @@
 <template>
-  <TableRow :data-testid="`member-row-${member.id}`" class="group">
+  <TableRow
+    :data-testid="`member-row-${member.id}`"
+    class="group hover:bg-transparent"
+  >
     <TableCell>
       <div class="flex items-center gap-3">
-        <UserAvatar
-          class="size-8"
-          :photo-url="isCurrentUser ? photoUrl : undefined"
-          :pt:icon:class="{ 'text-xl!': !isCurrentUser || !photoUrl }"
-        />
+        <span
+          class="flex size-8 shrink-0 items-center justify-center rounded-full bg-secondary-background"
+        >
+          <span class="text-sm font-bold text-base-foreground">
+            {{ initial }}
+          </span>
+        </span>
         <div class="flex min-w-0 flex-1 flex-col gap-1">
           <span class="text-sm text-base-foreground">
             {{ member.name }}
@@ -57,7 +62,6 @@ import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import DropdownMenu from '@/components/common/DropdownMenu.vue'
-import UserAvatar from '@/components/common/UserAvatar.vue'
 import Button from '@/components/ui/button/Button.vue'
 import TableCell from '@/components/ui/table/TableCell.vue'
 import TableRow from '@/components/ui/table/TableRow.vue'
@@ -74,7 +78,6 @@ const {
 } = defineProps<{
   member: WorkspaceMember
   isCurrentUser: boolean
-  photoUrl?: string
   canManageMembers?: boolean
   isOriginalOwner?: boolean
   menuItems?: MenuItem[]
@@ -82,6 +85,10 @@ const {
 
 const { t } = useI18n()
 
+const initial = computed(() =>
+  (member.name || member.email).charAt(0).toUpperCase()
+)
+
 // The creator and the current user can't be managed from their own row.
 const showMenu = computed(
   () => canManageMembers && !isCurrentUser && !isOriginalOwner
diff --git a/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue b/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue
index 7cc527588c..6ee8156ed1 100644
--- a/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue
+++ b/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue
@@ -113,7 +113,6 @@
             v-if="isPersonalWorkspace"
             :member="personalWorkspaceMember"
             :is-current-user="true"
-            :photo-url="userPhotoUrl ?? undefined"
           />
           <template v-else>
             <MemberTableRow
@@ -121,9 +120,6 @@
               :key="member.id"
               :member="member"
               :is-current-user="isCurrentUser(member)"
-              :photo-url="
-                isCurrentUser(member) ? (userPhotoUrl ?? undefined) : undefined
-              "
               :can-manage-members="permissions.canManageMembers"
               :is-original-owner="isOriginalOwner(member)"
               :menu-items="memberMenus.get(member.id)"
@@ -257,7 +253,6 @@ const {
   pendingInvites,
   permissions,
   uiConfig,
-  userPhotoUrl,
   showOutOfCreditsBanner,
   creditResetDate,
   dismissOutOfCreditsBanner,
diff --git a/src/platform/workspace/components/dialogs/settings/PartnerNodesPanelContent.vue b/src/platform/workspace/components/dialogs/settings/PartnerNodesPanelContent.vue
index d04448296c..8f4cdd9ae8 100644
--- a/src/platform/workspace/components/dialogs/settings/PartnerNodesPanelContent.vue
+++ b/src/platform/workspace/components/dialogs/settings/PartnerNodesPanelContent.vue
@@ -57,7 +57,7 @@
             v-for="node in filteredNodes"
             :key="node.id"
             :data-state="selectedIds.has(node.id) ? 'selected' : undefined"
-            class="group cursor-pointer"
+            class="group cursor-pointer hover:bg-transparent data-[state=selected]:bg-transparent [&:hover>td]:bg-secondary-background/50 [&>td]:transition-colors [&>td:first-child]:rounded-l [&>td:last-child]:rounded-r [&[data-state=selected]>td]:bg-secondary-background/50"
             @click="toggleSelection(node.id)"
           >
             <TableCell>
diff --git a/src/platform/workspace/components/dialogs/settings/PendingInviteRow.vue b/src/platform/workspace/components/dialogs/settings/PendingInviteRow.vue
index 92aa8bbd2c..09444a964f 100644
--- a/src/platform/workspace/components/dialogs/settings/PendingInviteRow.vue
+++ b/src/platform/workspace/components/dialogs/settings/PendingInviteRow.vue
@@ -1,5 +1,8 @@
 <template>
-  <TableRow :data-testid="`invite-row-${invite.id}`" class="group">
+  <TableRow
+    :data-testid="`invite-row-${invite.id}`"
+    class="group hover:bg-transparent"
+  >
     <TableCell>
       <div class="flex items-center gap-3">
         <span