fix(notifications): Pass `collapse` and `expand` to the serializer (#27564)

Co-authored-by: getsantry[bot] <66042841+getsantry[bot]@users.noreply.github.com>

src/sentry/api/endpoints/team_details.py

@@ -7,6 +7,7 @@ from rest_framework.response import Response
 from sentry.api.bases.team import TeamEndpoint
 from sentry.api.decorators import sudo_required
 from sentry.api.serializers import serialize
+from sentry.api.serializers.models.team import TeamSerializer as ModelTeamSerializer
 from sentry.models import AuditLogEntryEvent, Team, TeamStatus
 from sentry.tasks.deletion import delete_team
 
@@ -55,7 +56,9 @@ class TeamDetailsEndpoint(TeamEndpoint):
         else:
             expand.append("organization")
 
-        return Response(serialize(team, request.user, collapse=collapse, expand=expand))
+        return Response(
+            serialize(team, request.user, ModelTeamSerializer(collapse=collapse, expand=expand))
+        )
 
     def put(self, request, team):
         """

static/app/views/settings/organizationTeams/teamNotifications.tsx

@@ -67,14 +67,14 @@ class TeamNotificationSettings extends AsyncView<Props, State> {
       );
     }
 
-    const externalTeams = teamDetails.externalTeams.filter(externalTeam =>
+    const externalTeams = (teamDetails.externalTeams || []).filter(externalTeam =>
       NOTIFICATION_PROVIDERS.includes(externalTeam.provider)
     );
 
     if (!externalTeams.length) {
       return (
         <EmptyMessage>
-          <div>{t('No External Teams have been linked yet.')}</div>
+          <div>{t('No teams have been linked yet.')}</div>
           <NotDisabledSubText>
             {tct('Head over to Slack and type [code] to get started. [link].', {
               code: <code>/sentry link team</code>,

tests/js/spec/views/team/teamNotificationSettings.spec.jsx

@@ -0,0 +1,105 @@
+import {mountWithTheme} from 'sentry-test/enzyme';
+import {initializeOrg} from 'sentry-test/initializeOrg';
+
+import TeamNotificationSettings from 'app/views/settings/organizationTeams/teamNotifications';
+
+const EXTERNAL_NAME = 'marcos';
+const EXAMPLE_EXTERNAL_TEAM = {
+  externalName: EXTERNAL_NAME,
+  id: '1',
+  integrationId: '1',
+  provider: 'slack',
+};
+const EXAMPLE_INTEGRATION = {
+  id: '1',
+  provider: {
+    key: 'slack',
+  },
+};
+
+describe('TeamNotificationSettings', () => {
+  let team;
+
+  beforeEach(() => {
+    MockApiClient.clearMockResponses();
+    team = TestStubs.Team();
+  });
+
+  it('should render empty message when there are no integrations', () => {
+    const {organization, routerContext} = initializeOrg();
+
+    MockApiClient.addMockResponse({
+      url: `/teams/${organization.slug}/${team.slug}/`,
+      body: {
+        externalTeams: [EXAMPLE_EXTERNAL_TEAM],
+      },
+    });
+
+    MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/integrations/`,
+      body: [],
+    });
+
+    const wrapper = mountWithTheme(
+      <TeamNotificationSettings team={team} organization={organization} />,
+      routerContext
+    );
+
+    const emptyMessage = wrapper.find('Panel div[data-test-id="empty-message"]');
+    expect(emptyMessage).toHaveLength(1);
+    expect(emptyMessage.text()).toBe(
+      'No Notification Integrations have been installed yet.'
+    );
+  });
+
+  it('should render empty message when there are no externalTeams', () => {
+    const {organization, routerContext} = initializeOrg();
+
+    MockApiClient.addMockResponse({
+      url: `/teams/${organization.slug}/${team.slug}/`,
+      body: {
+        externalTeams: [],
+      },
+    });
+
+    MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/integrations/`,
+      body: [EXAMPLE_INTEGRATION],
+    });
+
+    const wrapper = mountWithTheme(
+      <TeamNotificationSettings team={team} organization={organization} />,
+      routerContext
+    );
+
+    const emptyMessage = wrapper.find('Panel div[data-test-id="empty-message"]');
+    expect(emptyMessage).toHaveLength(1);
+    expect(emptyMessage.find('div div div').first().text()).toBe(
+      'No teams have been linked yet.'
+    );
+  });
+
+  it('should render each externalTeam', () => {
+    const {organization, routerContext} = initializeOrg();
+
+    MockApiClient.addMockResponse({
+      url: `/teams/${organization.slug}/${team.slug}/`,
+      body: {
+        externalTeams: [EXAMPLE_EXTERNAL_TEAM],
+      },
+    });
+
+    MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/integrations/`,
+      body: [EXAMPLE_INTEGRATION],
+    });
+
+    const wrapper = mountWithTheme(
+      <TeamNotificationSettings team={team} organization={organization} />,
+      routerContext
+    );
+    const input = wrapper.find('Panel').last().find('input');
+    expect(input.prop('disabled')).toBe(true);
+    expect(input.prop('value')).toBe(EXTERNAL_NAME);
+  });
+});