Skip to content

Commit d0be8ad

Browse files
chore: bump fuselage package (#37699)
1 parent 5d32f73 commit d0be8ad

File tree

23 files changed

+94
-89
lines changed

23 files changed

+94
-89
lines changed

apps/meteor/client/components/RoomAutoComplete/RoomAutoComplete.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ const RoomAutoComplete = ({ value, onChange, scope = 'regular', renderRoomIcon,
7171
renderSelected={({ selected: { value, label } }) => (
7272
<>
7373
<Box margin='none' mi={2}>
74-
<RoomAvatar size={AVATAR_SIZE} room={{ type: label?.type || 'c', _id: value, ...label }} />
74+
<RoomAvatar size={AVATAR_SIZE} room={{ ...label, type: label?.type || 'c', _id: value }} />
7575
</Box>
7676
<Box margin='none' mi={2}>
7777
{label?.name}

apps/meteor/client/components/RoomAutoCompleteMultiple/RoomAutoCompleteMultiple.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ const RoomAutoCompleteMultiple = ({ value, onChange, ...props }: RoomAutoComplet
5252
multiple
5353
renderSelected={({ selected: { value, label }, onRemove, ...props }): ReactElement => (
5454
<Chip {...props} key={value} value={value} onClick={onRemove}>
55-
<RoomAvatar size='x20' room={{ type: label?.type || 'c', _id: value, ...label }} />
55+
<RoomAvatar size='x20' room={{ ...label, type: label?.type || 'c', _id: value }} />
5656
<Box is='span' margin='none' mis={4}>
5757
{label?.name}
5858
</Box>
@@ -63,7 +63,7 @@ const RoomAutoCompleteMultiple = ({ value, onChange, ...props }: RoomAutoComplet
6363
key={value}
6464
{...props}
6565
label={label.name}
66-
avatar={<RoomAvatar size='x20' room={{ type: label?.type || 'c', _id: value, ...label }} />}
66+
avatar={<RoomAvatar size='x20' room={{ ...label, type: label?.type || 'c', _id: value }} />}
6767
/>
6868
)}
6969
options={options}

apps/meteor/client/components/UserAndRoomAutoCompleteMultiple/UserAndRoomAutoCompleteMultiple.tsx

Lines changed: 39 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,27 @@
1-
import { isDirectMessageRoom } from '@rocket.chat/core-typings';
1+
import { type RoomType, isDirectMessageRoom } from '@rocket.chat/core-typings';
22
import { AutoComplete, Box, Option, OptionAvatar, OptionContent, Chip } from '@rocket.chat/fuselage';
33
import { useDebouncedValue } from '@rocket.chat/fuselage-hooks';
44
import { escapeRegExp } from '@rocket.chat/string-helpers';
5-
import { RoomAvatar, UserAvatar } from '@rocket.chat/ui-avatar';
5+
import { RoomAvatar } from '@rocket.chat/ui-avatar';
66
import { useUser, useUserSubscriptions } from '@rocket.chat/ui-contexts';
7-
import type { ComponentProps } from 'react';
7+
import type { ComponentProps, ReactElement } from 'react';
88
import { memo, useMemo, useState } from 'react';
99

1010
import { roomCoordinator } from '../../lib/rooms/roomCoordinator';
1111
import { Rooms } from '../../stores';
1212

13-
type UserAndRoomAutoCompleteMultipleProps = Omit<ComponentProps<typeof AutoComplete>, 'filter'> & { limit?: number };
13+
type UserAndRoomAutoCompleteMultipleProps = Omit<ComponentProps<typeof AutoComplete>, 'filter'> & {
14+
limit?: number;
15+
};
16+
17+
type OptionType = {
18+
value: string;
19+
label: {
20+
name: string | undefined;
21+
avatarETag: string | undefined;
22+
type: RoomType;
23+
};
24+
}[];
1425

1526
const UserAndRoomAutoCompleteMultiple = ({ value, onChange, limit, ...props }: UserAndRoomAutoCompleteMultipleProps) => {
1627
const user = useUser();
@@ -35,33 +46,31 @@ const UserAndRoomAutoCompleteMultiple = ({ value, onChange, limit, ...props }: U
3546
),
3647
);
3748

38-
const options = useMemo(() => {
39-
if (!user) {
40-
return [];
41-
}
42-
43-
return rooms.reduce<Exclude<UserAndRoomAutoCompleteMultipleProps['options'], undefined>>((acc, room) => {
44-
if (acc.length === limit) return acc;
49+
const options = useMemo(
50+
() =>
51+
rooms.reduce<OptionType>((acc, room) => {
52+
if (acc.length === limit) return acc;
4553

46-
if (isDirectMessageRoom(room) && (room.blocked || room.blocker)) {
47-
return acc;
48-
}
54+
if (isDirectMessageRoom(room) && (room.blocked || room.blocker)) {
55+
return acc;
56+
}
4957

50-
if (roomCoordinator.readOnly(Rooms.state.get(room.rid), user)) return acc;
58+
if (roomCoordinator.readOnly(Rooms.state.get(room.rid), user)) return acc;
5159

52-
return [
53-
...acc,
54-
{
55-
value: room.rid,
56-
label: {
57-
name: room.fname || room.name,
58-
avatarETag: room.avatarETag,
59-
type: room.t,
60+
return [
61+
...acc,
62+
{
63+
value: room.rid,
64+
label: {
65+
name: room.fname || room.name,
66+
avatarETag: room.avatarETag,
67+
type: room.t,
68+
},
6069
},
61-
},
62-
];
63-
}, []);
64-
}, [limit, rooms, user]);
70+
];
71+
}, []),
72+
[limit, rooms, user],
73+
);
6574

6675
return (
6776
<AutoComplete
@@ -71,13 +80,9 @@ const UserAndRoomAutoCompleteMultiple = ({ value, onChange, limit, ...props }: U
7180
filter={filter}
7281
setFilter={setFilter}
7382
multiple
74-
renderSelected={({ selected: { value, label }, onRemove, ...props }) => (
83+
renderSelected={({ selected: { value, label }, onRemove, ...props }): ReactElement => (
7584
<Chip {...props} height='x20' value={value} onClick={onRemove} mie={4}>
76-
{label.t === 'd' ? (
77-
<UserAvatar size='x20' username={value} />
78-
) : (
79-
<RoomAvatar size='x20' room={{ type: label?.type, _id: value, ...label }} />
80-
)}
85+
<RoomAvatar size='x20' room={{ ...label, _id: value }} />
8186
<Box is='span' margin='none' mis={4}>
8287
{label.name}
8388
</Box>
@@ -86,11 +91,7 @@ const UserAndRoomAutoCompleteMultiple = ({ value, onChange, limit, ...props }: U
8691
renderItem={({ value, label, ...props }) => (
8792
<Option key={value} {...props}>
8893
<OptionAvatar>
89-
{label.t === 'd' ? (
90-
<UserAvatar size='x20' username={value} />
91-
) : (
92-
<RoomAvatar size='x20' room={{ type: label?.type, _id: value, ...label }} />
93-
)}
94+
<RoomAvatar size='x20' room={{ ...label, _id: value }} />
9495
</OptionAvatar>
9596
<OptionContent>{label.name}</OptionContent>
9697
</Option>

apps/meteor/client/components/UserAutoCompleteMultiple/UserAutoCompleteMultipleFederated.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import type { OptionType } from '@rocket.chat/fuselage';
21
import { MultiSelectFiltered } from '@rocket.chat/fuselage';
32
import { useDebouncedValue } from '@rocket.chat/fuselage-hooks';
43
import { useEndpoint } from '@rocket.chat/ui-contexts';
@@ -94,7 +93,7 @@ const UserAutoCompleteMultipleFederated = ({
9493
);
9594

9695
return (
97-
<OptionsContext.Provider value={{ options: options as unknown as OptionType[] }}>
96+
<OptionsContext.Provider value={{ options }}>
9897
<MultiSelectFiltered
9998
{...props}
10099
data-qa-type='user-auto-complete-input'

apps/meteor/client/components/UserAutoCompleteMultiple/UserAutoCompleteMultipleOption.tsx

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,17 @@
1-
import type { IUser } from '@rocket.chat/core-typings';
21
import { Option, OptionDescription } from '@rocket.chat/fuselage';
32
import { UserAvatar } from '@rocket.chat/ui-avatar';
4-
import type { ReactElement } from 'react';
3+
4+
import type { UserLabel } from './UserAutoCompleteMultipleOptions';
55

66
type UserAutoCompleteMultipleOptionProps = {
7-
label: {
8-
_federated?: boolean;
9-
} & Pick<IUser, 'username' | 'name'>;
7+
label: UserLabel;
8+
value: string | number;
9+
selected?: boolean;
10+
focus?: boolean;
11+
role?: string;
1012
};
1113

12-
const UserAutoCompleteMultipleOption = ({ label, ...props }: UserAutoCompleteMultipleOptionProps): ReactElement => {
14+
const UserAutoCompleteMultipleOption = ({ label, ...props }: UserAutoCompleteMultipleOptionProps) => {
1315
const { name, username, _federated } = label;
1416

1517
return (
@@ -20,13 +22,10 @@ const UserAutoCompleteMultipleOption = ({ label, ...props }: UserAutoCompleteMul
2022
icon={_federated ? 'globe' : undefined}
2123
key={username}
2224
label={
23-
(
24-
<>
25-
{name || username} {!_federated && <OptionDescription>({username})</OptionDescription>}
26-
</>
27-
) as any
25+
<>
26+
{name || username} {!_federated && <OptionDescription>({username})</OptionDescription>}
27+
</>
2828
}
29-
children={undefined}
3029
/>
3130
);
3231
};

apps/meteor/client/components/UserAutoCompleteMultiple/UserAutoCompleteMultipleOptions.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,14 @@ import UserAutoCompleteMultipleOption from './UserAutoCompleteMultipleOption';
99
// The select requires a forwarded ref component in the renderOptions property
1010
// but we also need to pass internal state to this renderer, as well as the props that also come from the Select.
1111

12+
export type UserLabel = {
13+
_federated?: boolean;
14+
username: string;
15+
name?: string;
16+
};
17+
1218
type OptionsContextValue = {
13-
options: OptionType[];
19+
options: OptionType<string, UserLabel>[];
1420
};
1521

1622
export const OptionsContext = createContext<OptionsContextValue>({

apps/meteor/client/views/omnichannel/components/AutoCompleteDepartmentMultiple.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ const AutoCompleteDepartmentMultiple = ({
6666
flexShrink={0}
6767
flexGrow={0}
6868
placeholder={t('Select_an_option')}
69-
renderItem={({ label, value, ref: _ref, ...props }) => {
69+
renderItem={({ label, value, ...props }) => {
7070
if (withCheckbox) {
7171
return (
7272
<CheckOption

apps/meteor/client/views/omnichannel/components/AutoCompleteMonitors.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ const AutoCompleteMonitors = ({ value = [], onBlur, onChange, ...props }: AutoCo
3131
endReached={() => fetchNextPage()}
3232
onBlur={onBlur}
3333
onChange={onChange}
34-
renderItem={({ label, value, ref: _ref, ...props }) => (
34+
renderItem={({ label, value, ...props }) => (
3535
<CheckOption {...props} label={label} selected={value ? selectedValues.has(value) : false} />
3636
)}
3737
/>

apps/meteor/client/views/teams/contextualBar/channels/AddExistingModal/RoomsAvailableForTeamsAutoComplete.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ const RoomsAvailableForTeamsAutoComplete = ({ value, onChange, ...props }: Rooms
4747
setFilter={setFilter}
4848
renderSelected={({ selected: { value, label }, onRemove }) => (
4949
<Chip key={value} height='x20' value={value} onClick={onRemove} mb={2} mie={4}>
50-
<RoomAvatar size='x20' room={{ type: label?.type || 'c', _id: value, ...label }} />
50+
<RoomAvatar size='x20' room={{ ...label, type: label?.type || 'c', _id: value }} />
5151
<Box is='span' margin='none' mis={4}>
5252
{label.name}
5353
</Box>

apps/meteor/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@
100100
"@rocket.chat/federation-matrix": "workspace:^",
101101
"@rocket.chat/federation-sdk": "0.3.2",
102102
"@rocket.chat/freeswitch": "workspace:^",
103-
"@rocket.chat/fuselage": "~0.68.1",
103+
"@rocket.chat/fuselage": "^0.69.0",
104104
"@rocket.chat/fuselage-forms": "~0.1.1",
105105
"@rocket.chat/fuselage-hooks": "~0.38.1",
106106
"@rocket.chat/fuselage-toastbar": "~0.35.1",

0 commit comments

Comments
 (0)