Browse Source

fix(project-creation): don't show create team to team admins (#50081)

There's a create team button in project creation flow for org owners,
not that we're enabling creation for team admins who don't have access
to team creation it doesn't make sense to show them the button either.

before:
![Screenshot 2023-05-31 at 10 41 22
AM](https://github.com/getsentry/sentry/assets/132939361/857b893c-903f-43a7-98a3-728bed6aaadd)

after:
![Screenshot 2023-05-31 at 10 40 28
AM](https://github.com/getsentry/sentry/assets/132939361/09c98812-59b6-4e3d-8dbd-23e3f2b45e9a)
Athena Moghaddam 1 year ago
parent
commit
401c90dbe5

+ 21 - 0
static/app/views/projectInstall/createProject.spec.tsx

@@ -189,6 +189,27 @@ describe('CreateProject', function () {
     await userEvent.click(screen.getByRole('button', {name: 'Close Modal'}));
   });
 
+  it('should not show create team button to team-admin with no org access', function () {
+    const {organization} = initializeOrg({
+      organization: {
+        access: ['project:read'],
+      },
+    });
+    renderFrameworkModalMockRequests({organization, teamSlug: 'team-two'});
+
+    OrganizationStore.onUpdate(organization);
+    TeamStore.loadUserTeams([
+      TestStubs.Team({id: 2, slug: 'team-two', access: ['team:admin']}),
+    ]);
+    render(<CreateProject />, {
+      context: TestStubs.routerContext([{organization}]),
+      organization,
+    });
+
+    const createTeamButton = screen.queryByRole('button', {name: 'Create a team'});
+    expect(createTeamButton).not.toBeInTheDocument();
+  });
+
   it('should only allow teams which the user is a team-admin', async function () {
     const organization = TestStubs.Organization();
     renderFrameworkModalMockRequests({organization, teamSlug: 'team-two'});

+ 17 - 15
static/app/views/projectInstall/createProject.tsx

@@ -220,8 +220,8 @@ function CreateProject() {
   const {shouldCreateCustomRule, conditions} = alertRuleConfig || {};
   const {canCreateProject} = useProjectCreationAccess({organization, teams: accessTeams});
 
-  const isOrgMemberWithNoAccess =
-    accessTeams.length === 0 && !organization.access.includes('project:admin');
+  const canCreateTeam = organization.access.includes('project:admin');
+  const isOrgMemberWithNoAccess = accessTeams.length === 0 && !canCreateTeam;
 
   const canSubmitForm =
     !inFlight &&
@@ -270,19 +270,21 @@ function CreateProject() {
                 onChange={choice => setTeam(choice.value)}
                 teamFilter={(tm: Team) => tm.access.includes('team:admin')}
               />
-              <Button
-                borderless
-                data-test-id="create-team"
-                icon={<IconAdd isCircled />}
-                onClick={() =>
-                  openCreateTeamModal({
-                    organization,
-                    onClose: ({slug}) => setTeam(slug),
-                  })
-                }
-                title={t('Create a team')}
-                aria-label={t('Create a team')}
-              />
+              {canCreateTeam && (
+                <Button
+                  borderless
+                  data-test-id="create-team"
+                  icon={<IconAdd isCircled />}
+                  onClick={() =>
+                    openCreateTeamModal({
+                      organization,
+                      onClose: ({slug}) => setTeam(slug),
+                    })
+                  }
+                  title={t('Create a team')}
+                  aria-label={t('Create a team')}
+                />
+              )}
             </TeamSelectInput>
           </div>
         )}