fix(team): disable team leader setting when external auth sync is enabled [EE-3579] (#7852)

app/portainer/react/components/index.ts

@@ -147,6 +147,7 @@ export const componentsModule = angular
       'name',
       'placeholder',
       'teams',
+      'disabled',
     ])
   )
   .component(

app/portainer/views/users/users.html

@@ -118,9 +118,20 @@
                 data-cy="'user-teamSelect'"
                 on-change="(onChangeTeamIds)"
                 input-id="'teams-selector'"
+                disabled="teamSync"
               ></teams-selector>
             </div>
           </div>
+          <div class="form-group" ng-if="teamSync">
+            <div class="col-sm-12">
+              <span class="small">
+                <p class="small text-muted vertical-center">
+                  <pr-icon icon="'alert-circle'" feather="true" class-name="'icon-warning =vertical-center'"></pr-icon>
+                  The team leader feature is disabled as external authentication is currently enabled with team sync.
+                </p>
+              </span>
+            </div>
+          </div>
           <!-- !teams -->
           <div class="form-group" ng-if="isAdmin && !formValues.Administrator && formValues.Teams.length === 0">
             <div class="col-sm-12">

app/portainer/views/users/usersController.js

@@ -131,6 +131,7 @@ angular.module('portainer.app').controller('UsersController', [
           $scope.teams = _.orderBy(data.teams, 'Name', 'asc');
           $scope.AuthenticationMethod = data.settings.AuthenticationMethod;
           $scope.requiredPasswordLength = data.settings.RequiredPasswordLength;
+          $scope.teamSync = data.settings.TeamSync;
         })
         .catch(function error(err) {
           Notifications.error('Failure', err, 'Unable to retrieve users and teams');