From c2417efc3321f6f867f36061c01c9583cb67e92f Mon Sep 17 00:00:00 2001
From: Ben Cooke <benkcooke@gmail.com>
Date: Mon, 12 Jun 2023 11:42:30 -0400
Subject: [PATCH] [MM-52618] Adding generic error to handle network issues when
 fetching groups (#23495)

* adding generic error to handle network issues
---------
Co-authored-by: Mattermost Build <build@mattermost.com>
---
 .../groups_list/groups_list.tsx               | 33 ++++++++++++++-----
 webapp/channels/src/i18n/en.json              |  1 +
 2 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/webapp/channels/src/components/admin_console/group_settings/groups_list/groups_list.tsx b/webapp/channels/src/components/admin_console/group_settings/groups_list/groups_list.tsx
index b309efa433..9c99c2e861 100644
--- a/webapp/channels/src/components/admin_console/group_settings/groups_list/groups_list.tsx
+++ b/webapp/channels/src/components/admin_console/group_settings/groups_list/groups_list.tsx
@@ -48,6 +48,7 @@ type FilterSearchMap = {
 type State = {
     checked?: any;
     loading: boolean;
+    fetchError: boolean;
     page: number;
     showFilters: boolean;
     searchString: string;
@@ -75,6 +76,7 @@ export default class GroupsList extends React.PureComponent<Props, State> {
         super(props);
         this.state = {
             checked: {},
+            fetchError: false,
             loading: true,
             page: 0,
             showFilters: false,
@@ -91,9 +93,7 @@ export default class GroupsList extends React.PureComponent<Props, State> {
     };
 
     public componentDidMount() {
-        this.props.actions.getLdapGroups(this.state.page, LDAP_GROUPS_PAGE_SIZE).then(() => {
-            this.setState({loading: false});
-        });
+        this.props.actions.getLdapGroups(this.state.page, LDAP_GROUPS_PAGE_SIZE).then(this.handleGetGroupsResponse);
     }
 
     public async previousPage(e: any): Promise<void> {
@@ -232,6 +232,16 @@ export default class GroupsList extends React.PureComponent<Props, State> {
                 </div>
             );
         }
+        if (this.state.fetchError) {
+            return (
+                <div className='groups-list-empty'>
+                    <FormattedMessage
+                        id='admin.group_settings.groups_list.groups_list_error'
+                        defaultMessage='Failed to retrieve LDAP groups. Please check your logs for details.'
+                    />
+                </div>
+            );
+        }
         if (this.props.groups.length === 0) {
             return (
                 <div className='groups-list-empty'>
@@ -294,9 +304,7 @@ export default class GroupsList extends React.PureComponent<Props, State> {
         newState.showFilters = false;
         this.setState(newState);
 
-        this.props.actions.getLdapGroups(page, LDAP_GROUPS_PAGE_SIZE, opts).then(() => {
-            this.setState({loading: false});
-        });
+        this.props.actions.getLdapGroups(page, LDAP_GROUPS_PAGE_SIZE, opts).then(this.handleGetGroupsResponse);
     }
 
     public handleGroupSearchKeyUp(e: any) {
@@ -434,9 +442,16 @@ export default class GroupsList extends React.PureComponent<Props, State> {
             filterIsUnlinked: false,
         };
         this.setState(newState as any);
-        this.props.actions.getLdapGroups(this.state.page, LDAP_GROUPS_PAGE_SIZE, {q: ''}).then(() => {
-            this.setState({loading: false});
-        });
+        this.props.actions.getLdapGroups(this.state.page, LDAP_GROUPS_PAGE_SIZE, {q: ''}).then(this.handleGetGroupsResponse);
+    };
+
+    handleGetGroupsResponse = (response: any) => {
+        if (response?.error) {
+            this.setState({fetchError: true});
+        } else {
+            this.setState({fetchError: false});
+        }
+        this.setState({loading: false});
     };
 
     public render(): JSX.Element {
diff --git a/webapp/channels/src/i18n/en.json b/webapp/channels/src/i18n/en.json
index 92f9bd870c..20a598488f 100644
--- a/webapp/channels/src/i18n/en.json
+++ b/webapp/channels/src/i18n/en.json
@@ -1104,6 +1104,7 @@
   "admin.group_settings.group_row.not_linked": "Not Linked",
   "admin.group_settings.group_row.unlink_failed": "Unlink failed",
   "admin.group_settings.group_row.unlinking": "Unlinking",
+  "admin.group_settings.groups_list.groups_list_error": "Failed to retrieve LDAP groups. Please check your logs for details.",
   "admin.group_settings.groups_list.link_selected": "Link Selected Groups",
   "admin.group_settings.groups_list.mappingHeader": "Mattermost Linking",
   "admin.group_settings.groups_list.nameHeader": "Name",