feat: display user email below name in multi-member-select dropdown

- Added email field to user items mapping
- Updated renderMultiSelectOption to show email in smaller, dimmed text
- Email only displays for user type options, not groups
This commit is contained in:
Philipinho
2025-07-09 22:28:14 -07:00
parent 29388636bf
commit f5cf13f1da
2 changed files with 5 additions and 1 deletions

View File

@ -26,6 +26,9 @@ const renderMultiSelectOption: MultiSelectProps["renderOption"] = ({
{option["type"] === "group" && <IconGroupCircle />} {option["type"] === "group" && <IconGroupCircle />}
<div> <div>
<Text size="sm" lineClamp={1}>{option.label}</Text> <Text size="sm" lineClamp={1}>{option.label}</Text>
{option["type"] === "user" && option["email"] && (
<Text size="xs" c="dimmed" lineClamp={1}>{option["email"]}</Text>
)}
</div> </div>
</Group> </Group>
); );
@ -47,6 +50,7 @@ export function MultiMemberSelect({ onChange }: MultiMemberSelectProps) {
const userItems = suggestion?.users.map((user: IUser) => ({ const userItems = suggestion?.users.map((user: IUser) => ({
value: `user-${user.id}`, value: `user-${user.id}`,
label: user.name, label: user.name,
email: user.email,
avatarUrl: user.avatarUrl, avatarUrl: user.avatarUrl,
type: "user", type: "user",
})); }));

View File

@ -140,7 +140,7 @@ export class SearchService {
if (suggestion.includeUsers) { if (suggestion.includeUsers) {
users = await this.db users = await this.db
.selectFrom('users') .selectFrom('users')
.select(['id', 'name', 'avatarUrl']) .select(['id', 'name', 'email', 'avatarUrl'])
.where((eb) => eb(sql`LOWER(users.name)`, 'like', `%${query}%`)) .where((eb) => eb(sql`LOWER(users.name)`, 'like', `%${query}%`))
.where('workspaceId', '=', workspaceId) .where('workspaceId', '=', workspaceId)
.where('deletedAt', 'is', null) .where('deletedAt', 'is', null)