[MM-57722] Convert ./components/admin_console/team_channel_settings/group/group_list.tsx from Class Component to Function Component (#26721)

* [MM-57722] Convert `./components/admin_console/team_channel_settings/group/group_list.tsx` from Class Component to Function Component

* :refactor: improve code structure
This commit is contained in:
Syed Ali Abbas Zaidi 2024-04-24 13:11:40 +05:00 committed by GitHub
parent af8bcc4c6d
commit 8ba157f284
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 28 additions and 28 deletions

View File

@ -58,7 +58,7 @@ exports[`admin_console/team_channel_settings/channel/ChannelGroups should match
}
}
>
<Connect(GroupList)
<Connect(Component)
channel={
Object {
"group_constrained": false,

View File

@ -34,12 +34,9 @@ exports[`admin_console/team_channel_settings/group/GroupList should match snapsh
noPadding={false}
onGroupRemoved={[MockFunction]}
onPageChangedCallback={[MockFunction]}
removeGroup={[MockFunction]}
renderRow={[Function]}
setNewGroupRole={[MockFunction]}
total={1}
totalGroups={0}
type="team"
/>
`;
@ -512,11 +509,8 @@ exports[`admin_console/team_channel_settings/group/GroupList should match snapsh
noPadding={false}
onGroupRemoved={[MockFunction]}
onPageChangedCallback={[MockFunction]}
removeGroup={[MockFunction]}
renderRow={[Function]}
setNewGroupRole={[MockFunction]}
total={30}
totalGroups={0}
type="team"
/>
`;

View File

@ -38,7 +38,7 @@ describe('admin_console/team_channel_settings/group/GroupList', () => {
type='team'
setNewGroupRole={jest.fn()}
/>);
wrapper.setState({loading: false});
expect(wrapper).toMatchSnapshot();
});
@ -71,7 +71,7 @@ describe('admin_console/team_channel_settings/group/GroupList', () => {
removeGroup={jest.fn()}
setNewGroupRole={jest.fn()}
/>);
wrapper.setState({loading: false});
expect(wrapper).toMatchSnapshot();
});
});

View File

@ -1,7 +1,7 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import React, {memo, useCallback} from 'react';
import {FormattedMessage} from 'react-intl';
import type {Group} from '@mattermost/types/groups';
@ -42,27 +42,33 @@ const Header = () => {
type Props = OwnProps & PropsFromRedux;
export default class GroupList extends React.PureComponent<Props> {
renderRow = (item: Partial<Group>) => {
const GroupList = ({
removeGroup,
setNewGroupRole,
type,
isDisabled,
...restProps
}: Props) => {
const renderRow = useCallback((item: Partial<Group>) => {
return (
<GroupRow
key={item.id}
group={item}
removeGroup={this.props.removeGroup}
setNewGroupRole={this.props.setNewGroupRole}
type={this.props.type}
isDisabled={this.props.isDisabled}
removeGroup={removeGroup}
setNewGroupRole={setNewGroupRole}
type={type}
isDisabled={isDisabled}
/>
);
};
}, [isDisabled, removeGroup, setNewGroupRole, type]);
render(): JSX.Element {
return (
<AbstractList
header={<Header/>}
renderRow={this.renderRow}
{...this.props}
renderRow={renderRow}
{...restProps}
/>
);
}
}
};
export default memo(GroupList);

View File

@ -77,7 +77,7 @@ exports[`admin_console/team_channel_settings/team/TeamGroups should match snapsh
}
}
>
<Connect(GroupList)
<Connect(Component)
groups={
Array [
Object {