Fix several issues around team join (#6863)

* Fix several issues around team join

* Open in modal and fix channel list

* Add joining states and fix issues

* i18n-extract

* add specific message for group related failures on joining teams

* Address feedback

* Address feedback

* Use error from server response

app/utils/errors.ts

@@ -0,0 +1,11 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+export function isServerError(obj: unknown): obj is {server_error_id: string; message?: string} {
+    return (
+        typeof obj === 'object' &&
+        obj !== null &&
+        'server_error_id' in obj &&
+        typeof obj.server_error_id === 'string'
+    );
+}

app/utils/navigation/index.ts

@@ -5,7 +5,8 @@ import {IntlShape} from 'react-intl';
 import {Alert} from 'react-native';
 import {Navigation, Options} from 'react-native-navigation';
 
-import {Screens} from '@constants';
+import {Screens, ServerErrors} from '@constants';
+import {isServerError} from '@utils/errors';
 
 export const appearanceControlledScreens = new Set([
     Screens.ONBOARDING,
@@ -72,3 +73,23 @@ export function alertChannelArchived(displayName: string, intl: IntlShape) {
         }],
     );
 }
+
+export function alertTeamAddError(error: unknown, intl: IntlShape) {
+    let errMsg = intl.formatMessage({id: 'join_team.error.message', defaultMessage: 'There has been an error joining the team.'});
+
+    if (isServerError(error)) {
+        if (error.server_error_id === ServerErrors.TEAM_MEMBERSHIP_DENIAL_ERROR_ID) {
+            errMsg = intl.formatMessage({
+                id: 'join_team.error.group_error',
+                defaultMessage: 'You need to be a member of a linked group to join this team.',
+            });
+        } else if (error.message) {
+            errMsg = error.message;
+        }
+    }
+
+    Alert.alert(
+        intl.formatMessage({id: 'join_team.error.title', defaultMessage: 'Error joining a team'}),
+        errMsg,
+    );
+}

app/utils/team_list/index.ts

@@ -4,7 +4,7 @@
 import {ScaledSize} from 'react-native';
 import {EdgeInsets} from 'react-native-safe-area-context';
 
-import {ITEM_HEIGHT} from '@components/team_sidebar/add_team/team_list_item/team_list_item';
+import {ITEM_HEIGHT} from '@components/team_list/team_list_item/team_list_item';
 import {PADDING_TOP_MOBILE} from '@screens/bottom_sheet';
 import {TITLE_HEIGHT, TITLE_SEPARATOR_MARGIN} from '@screens/bottom_sheet/content';
 import {bottomSheetSnapPoint} from '@utils/helpers';