ref(ts): Remove usage of `TestStubs.Team` (#61247)

This one was pretty straight-forward. You can check the commit history
to find the spec changes I had to make, there are just a few.

- Bulk replace usage
- Add correct imports
- Add `DetailedTeam` type
- Convert team IDs to strings
- Rename gross type import
- Convert team to integer when mocking EventView

fixtures/js-stubs/team.tsx

@@ -1,6 +1,6 @@
 import {uuid4} from '@sentry/utils';
 
-import type {Team as TeamType} from 'sentry/types';
+import type {DetailedTeam as TeamType} from 'sentry/types';
 
 export function Team(params: Partial<TeamType> = {}): TeamType {
   return {
@@ -17,6 +17,7 @@ export function Team(params: Partial<TeamType> = {}): TeamType {
       'idp:provisioned': false,
     },
     externalTeams: [],
+    projects: [],
     hasAccess: false,
     isPending: false,
     ...params,

static/app/actionCreators/onboardingTasks.spec.tsx

@@ -1,4 +1,5 @@
 import {Organization} from 'sentry-fixture/organization';
+import {Team} from 'sentry-fixture/team';
 
 import {updateOnboardingTask} from 'sentry/actionCreators/onboardingTasks';
 import ConfigStore from 'sentry/stores/configStore';
@@ -14,7 +15,7 @@ describe('actionCreators/onboardingTasks', function () {
   describe('updateOnboardingTask', function () {
     it('Adds the task to the organization when task does not exists', async function () {
       const detailedOrg = Organization({
-        teams: [TestStubs.Team()],
+        teams: [Team()],
         projects: [TestStubs.Project()],
       });
 
@@ -42,7 +43,7 @@ describe('actionCreators/onboardingTasks', function () {
 
     it('Updates existing onboarding task', async function () {
       const detailedOrg = Organization({
-        teams: [TestStubs.Team()],
+        teams: [Team()],
         projects: [TestStubs.Project()],
         onboardingTasks: [{task: OnboardingTaskKey.FIRST_EVENT, status: 'skipped'}],
       });
@@ -73,7 +74,7 @@ describe('actionCreators/onboardingTasks', function () {
 
     it('Does not make API request without api object', async function () {
       const detailedOrg = Organization({
-        teams: [TestStubs.Team()],
+        teams: [Team()],
         projects: [TestStubs.Project()],
       });
 

static/app/actionCreators/organization.spec.tsx

@@ -1,4 +1,5 @@
 import {Organization} from 'sentry-fixture/organization';
+import {Team} from 'sentry-fixture/team';
 
 import {fetchOrganizationDetails} from 'sentry/actionCreators/organization';
 import * as OrganizationsActionCreator from 'sentry/actionCreators/organizations';
@@ -10,7 +11,7 @@ import TeamStore from 'sentry/stores/teamStore';
 describe('OrganizationActionCreator', function () {
   const org = Organization();
 
-  const teams = [TestStubs.Team()];
+  const teams = [Team()];
   const projects = [TestStubs.Project()];
 
   const api = new MockApiClient();

static/app/components/acl/access.spec.tsx

@@ -1,4 +1,5 @@
 import {Organization} from 'sentry-fixture/organization';
+import {Team} from 'sentry-fixture/team';
 
 import {render, screen} from 'sentry-test/reactTestingLibrary';
 
@@ -46,7 +47,7 @@ describe('Access', function () {
       const org = Organization({access: []});
       const nextRouterContext = TestStubs.routerContext([{organization: org}]);
 
-      const team1 = TestStubs.Team({access: []});
+      const team1 = Team({access: []});
       render(
         <Access access={['team:admin']} team={team1}>
           {childrenMock}
@@ -61,7 +62,7 @@ describe('Access', function () {
         })
       );
 
-      const team2 = TestStubs.Team({
+      const team2 = Team({
         access: ['team:read', 'team:write', 'team:admin'],
       });
       render(

static/app/components/assigneeSelector.spec.tsx

@@ -1,3 +1,5 @@
+import {Team} from 'sentry-fixture/team';
+
 import {act, render, screen, userEvent, waitFor} from 'sentry-test/reactTestingLibrary';
 
 import {openInviteMembersModal} from 'sentry/actionCreators/modal';
@@ -46,7 +48,7 @@ describe('AssigneeSelector', () => {
       team_slug: 'cool-team2',
     });
 
-    TEAM_1 = TestStubs.Team({
+    TEAM_1 = Team({
       id: '3',
       name: 'COOL TEAM',
       slug: 'cool-team',

static/app/components/avatar/avatarList.spec.tsx

@@ -1,3 +1,5 @@
+import {Team} from 'sentry-fixture/team';
+
 import {render, screen} from 'sentry-test/reactTestingLibrary';
 
 import AvatarList from 'sentry/components/avatar/avatarList';
@@ -14,7 +16,7 @@ function renderComponent({
 
 describe('AvatarList', () => {
   const user = TestStubs.User();
-  const team = TestStubs.Team();
+  const team = Team();
 
   it('renders with user letter avatars', () => {
     const users = [

static/app/components/avatar/index.spec.tsx

@@ -1,5 +1,6 @@
 import {Organization} from 'sentry-fixture/organization';
 import {SentryApp} from 'sentry-fixture/sentryApp';
+import {Team} from 'sentry-fixture/team';
 
 import {render, screen} from 'sentry-test/reactTestingLibrary';
 
@@ -134,7 +135,7 @@ describe('Avatar', function () {
     });
 
     it('can display a team Avatar', function () {
-      const team = TestStubs.Team({slug: 'test-team_test'});
+      const team = Team({slug: 'test-team_test'});
 
       render(<AvatarComponent team={team} />);
 

static/app/components/group/assignedTo.spec.tsx

@@ -2,6 +2,7 @@ import {Commit} from 'sentry-fixture/commit';
 import {CommitAuthor} from 'sentry-fixture/commitAuthor';
 import {Event as EventFixture} from 'sentry-fixture/event';
 import {Organization} from 'sentry-fixture/organization';
+import {Team} from 'sentry-fixture/team';
 
 import {render, screen, userEvent, waitFor} from 'sentry-test/reactTestingLibrary';
 
@@ -15,14 +16,14 @@ import type {
   Group,
   Organization as TOrganization,
   Project,
-  Team,
+  Team as TeamType,
   User,
 } from 'sentry/types';
 
 describe('Group > AssignedTo', () => {
   let USER_1!: User;
   let USER_2!: User;
-  let TEAM_1!: Team;
+  let TEAM_1!: TeamType;
   let PROJECT_1!: Project;
   let GROUP_1!: Group;
   let event!: Event;
@@ -42,7 +43,7 @@ describe('Group > AssignedTo', () => {
       email: 'johnsmith@example.com',
     });
 
-    TEAM_1 = TestStubs.Team({
+    TEAM_1 = Team({
       id: '3',
       name: 'COOL TEAM',
       slug: 'cool-team',

static/app/components/idBadge/index.spec.tsx

@@ -1,4 +1,5 @@
 import {Organization} from 'sentry-fixture/organization';
+import {Team} from 'sentry-fixture/team';
 
 import {render, screen} from 'sentry-test/reactTestingLibrary';
 
@@ -13,7 +14,7 @@ describe('IdBadge', function () {
   });
 
   it('renders the correct component when `team` property is passed', function () {
-    render(<IdBadge team={TestStubs.Team()} />);
+    render(<IdBadge team={Team()} />);
     expect(screen.getByTestId('badge-styled-avatar')).toHaveTextContent('TS');
     expect(screen.getByTestId('badge-display-name')).toHaveTextContent('#team-slug');
   });

static/app/components/idBadge/teamBadge/index.spec.tsx

@@ -1,3 +1,5 @@
+import {Team} from 'sentry-fixture/team';
+
 import {act, render, screen} from 'sentry-test/reactTestingLibrary';
 
 import {TeamBadge} from 'sentry/components/idBadge/teamBadge';
@@ -9,13 +11,13 @@ describe('TeamBadge', function () {
   });
 
   it('renders with Avatar and team name', function () {
-    render(<TeamBadge team={TestStubs.Team()} />);
+    render(<TeamBadge team={Team()} />);
     expect(screen.getByTestId('badge-styled-avatar')).toBeInTheDocument();
     expect(screen.getByText(/#team-slug/)).toBeInTheDocument();
   });
 
   it('listens for avatar changes from TeamStore', async function () {
-    const team = TestStubs.Team();
+    const team = Team();
     render(<TeamBadge team={team} />);
 
     act(() => {
@@ -29,9 +31,9 @@ describe('TeamBadge', function () {
   });
 
   it('updates state from props', async function () {
-    const team = TestStubs.Team();
+    const team = Team();
     const {rerender} = render(<TeamBadge team={team} />);
-    rerender(<TeamBadge team={TestStubs.Team({slug: 'new-team-slug'})} />);
+    rerender(<TeamBadge team={Team({slug: 'new-team-slug'})} />);
     expect(await screen.findByText(/#new-team-slug/)).toBeInTheDocument();
   });
 });