diff --git a/src/lib/components/channel/Messages/Message/ProfilePreview.svelte b/src/lib/components/channel/Messages/Message/ProfilePreview.svelte
index 2fe8ff3a58..3e688ae770 100644
--- a/src/lib/components/channel/Messages/Message/ProfilePreview.svelte
+++ b/src/lib/components/channel/Messages/Message/ProfilePreview.svelte
@@ -19,6 +19,7 @@
 
 	export let user: { id?: string | null; name?: string | null } | null = null;
 
+	export let className = '';
 	export let align = 'center';
 	export let side = 'right';
 	export let sideOffset = 8;
@@ -46,7 +47,7 @@
 {#if user?.id && $sessionUser}
 	<LinkPreview.Root openDelay={0} closeDelay={200} bind:open={openPreview}>
 		<LinkPreview.Trigger
-			class="flex shrink-0 items-center cursor-pointer no-underline! font-normal!"
+			class="flex shrink-0 items-center cursor-pointer no-underline! font-normal! {className}"
 		>
 			{#snippet child({ props })}
 				<button
diff --git a/src/lib/components/workspace/common/AccessControl.svelte b/src/lib/components/workspace/common/AccessControl.svelte
index 28b011c861..e95b7b056f 100644
--- a/src/lib/components/workspace/common/AccessControl.svelte
+++ b/src/lib/components/workspace/common/AccessControl.svelte
@@ -17,6 +17,7 @@
 	import Plus from '$lib/components/icons/Plus.svelte';
 	import AddAccessModal from './AddAccessModal.svelte';
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
+	import ProfilePreview from '$lib/components/channel/Messages/Message/ProfilePreview.svelte';
 	import Switch from '$lib/components/common/Switch.svelte';
 
 	type AccessGrant = {
@@ -647,16 +648,14 @@
 						class="flex items-center gap-2 justify-between text-sm w-full transition border-b border-gray-50/50 dark:border-gray-850/50 pb-1.5 last:border-0"
 					>
 						<div class="flex items-center gap-2 min-w-0 flex-1">
-							<img
-								class="rounded-full size-5 object-cover"
-								src={`${WEBUI_API_BASE_URL}/users/${user.id}/profile/image`}
-								alt={user.name ?? user.id}
-							/>
-							<div class="min-w-0 flex-1">
-								<Tooltip content={user.email} placement="top-start">
-									<div class="truncate text-sm">{user.name ?? user.id}</div>
-								</Tooltip>
-							</div>
+							<ProfilePreview {user} className="min-w-0 max-w-full">
+								<img
+									class="rounded-full size-5 object-cover shrink-0"
+									src={`${WEBUI_API_BASE_URL}/users/${user.id}/profile/image`}
+									alt=""
+								/>
+								<span class="ml-2 truncate text-sm">{user.name ?? user.id}</span>
+							</ProfilePreview>
 						</div>
 
 						<div class="flex justify-end items-center gap-1.5 shrink-0">
diff --git a/src/lib/components/workspace/common/MemberSelector.svelte b/src/lib/components/workspace/common/MemberSelector.svelte
index 85c3697d6b..1e796c234e 100644
--- a/src/lib/components/workspace/common/MemberSelector.svelte
+++ b/src/lib/components/workspace/common/MemberSelector.svelte
@@ -289,31 +289,27 @@
 
 							<div>
 								{#each filteredUsers as user (user.id)}
-									<button
+									<div
 										class=" dark:border-gray-850 text-xs flex items-center justify-between w-full"
-										type="button"
-										on:click={() => {
-											if ((userIds ?? []).includes(user.id)) {
-												userIds = userIds.filter((id) => id !== user.id);
-												delete selectedUsers[user.id];
-											} else {
-												userIds = [...userIds, user.id];
-												selectedUsers[user.id] = user;
-											}
-										}}
 									>
-										<div class="px-3 py-1.5 font-normal text-gray-900 dark:text-white flex-1">
+										<div
+											class="px-3 py-1.5 font-normal text-gray-900 dark:text-white flex-1 min-w-0"
+										>
 											<div class="flex items-center gap-2">
-												<ProfilePreview {user} side="right" align="center" sideOffset={6}>
+												<ProfilePreview
+													{user}
+													className="min-w-0 max-w-full"
+													side="right"
+													align="center"
+													sideOffset={6}
+												>
 													<img
 														class="rounded-2xl w-6 h-6 object-cover flex-shrink-0"
 														src={`${WEBUI_API_BASE_URL}/users/${user.id}/profile/image`}
-														alt="user"
+														alt=""
 													/>
+													<span class="ml-2 font-normal truncate">{user.name}</span>
 												</ProfilePreview>
-												<Tooltip content={user.email} placement="top-start">
-													<div class="font-normal truncate">{user.name}</div>
-												</Tooltip>
 
 												{#if user?.is_active}
 													<div>
@@ -332,11 +328,21 @@
 										<div class="px-3 py-1">
 											<div class=" translate-y-0.5">
 												<Checkbox
+													ariaLabel={user.name || user.email || user.id}
+													on:change={() => {
+														if ((userIds ?? []).includes(user.id)) {
+															userIds = userIds.filter((id) => id !== user.id);
+															delete selectedUsers[user.id];
+														} else {
+															userIds = [...userIds, user.id];
+															selectedUsers[user.id] = user;
+														}
+													}}
 													state={(userIds ?? []).includes(user.id) ? 'checked' : 'unchecked'}
 												/>
 											</div>
 										</div>
-									</button>
+									</div>
 								{/each}
 							</div>
 						{/if}
diff --git a/src/lib/components/workspace/common/VersionMenuItem.svelte b/src/lib/components/workspace/common/VersionMenuItem.svelte
index ef4c1be199..b95e44d00f 100644
--- a/src/lib/components/workspace/common/VersionMenuItem.svelte
+++ b/src/lib/components/workspace/common/VersionMenuItem.svelte
@@ -5,6 +5,7 @@
 	import { user } from '$lib/stores';
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
 	import ProfileImage from '$lib/components/chat/Messages/ProfileImage.svelte';
+	import ProfilePreview from '$lib/components/channel/Messages/Message/ProfilePreview.svelte';
 	import Check from '$lib/components/icons/Check.svelte';
 	import GarbageBin from '$lib/components/icons/GarbageBin.svelte';
 	import EllipsisHorizontal from '$lib/components/icons/EllipsisHorizontal.svelte';
@@ -37,23 +38,25 @@
 <div
 	class="group flex h-[1.6875rem] w-full items-center rounded-xl hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
 >
+	<div class="ml-2 mr-2 flex shrink-0">
+		<ProfilePreview user={{ id: authorId, name: author }}>
+			<ProfileImage
+				src={authorId ? `/api/v1/users/${authorId}/profile/image` : '/user.png'}
+				className="size-4 shrink-0 rounded-full!"
+			/>
+		</ProfilePreview>
+	</div>
 	<button
 		type="button"
 		role="menuitemradio"
 		aria-label={status || message}
 		aria-checked={selected}
-		class="flex h-full min-w-0 flex-1 items-center gap-2 rounded-xl px-2 text-left"
+		class="flex h-full min-w-0 flex-1 items-center gap-2 rounded-xl pr-2 text-left"
 		title={entry
 			? `${entry.id}${date ? ` · ${date.toLocaleString($i18n.language)}` : ''}`
 			: undefined}
 		on:click={onSelect}
 	>
-		<Tooltip as="span" className="flex shrink-0" content={author} allowHTML={false}>
-			<ProfileImage
-				src={authorId ? `/api/v1/users/${authorId}/profile/image` : '/user.png'}
-				className="size-4 shrink-0 rounded-full!"
-			/>
-		</Tooltip>
 		<Tooltip as="span" className="block min-w-0 flex-1" content={message} allowHTML={false}>
 			<span class="block truncate text-xs">{message}</span>
 		</Tooltip>