fix(ui): Fix projects page for superusers with no projects (#24666)

src/sentry/static/sentry/app/components/noProjectMessage.tsx

@@ -16,11 +16,18 @@ type Props = {
   organization: LightWeightOrganization | Organization;
   projects?: Project[];
   loadingProjects?: boolean;
+  superuserNeedsToBeProjectMember?: boolean;
 };
 
 export default class NoProjectMessage extends React.Component<Props> {
   render() {
-    const {children, organization, projects, loadingProjects} = this.props;
+    const {
+      children,
+      organization,
+      projects,
+      loadingProjects,
+      superuserNeedsToBeProjectMember,
+    } = this.props;
     const orgId = organization.slug;
     const canCreateProject = organization.access.includes('project:write');
     const canJoinTeam = organization.access.includes('team:read');
@@ -32,9 +39,10 @@ export default class NoProjectMessage extends React.Component<Props> {
       const {isSuperuser} = ConfigStore.get('user');
 
       orgHasProjects = organization.projects.length > 0;
-      hasProjectAccess = isSuperuser
-        ? organization.projects.some(p => p.hasAccess)
-        : organization.projects.some(p => p.isMember && p.hasAccess);
+      hasProjectAccess =
+        isSuperuser && !superuserNeedsToBeProjectMember
+          ? organization.projects.some(p => p.hasAccess)
+          : organization.projects.some(p => p.isMember && p.hasAccess);
     } else {
       hasProjectAccess = projects ? projects.length > 0 : false;
       orgHasProjects = hasProjectAccess;

src/sentry/static/sentry/app/views/projectsDashboard/index.tsx

@@ -66,7 +66,11 @@ class Dashboard extends React.Component<Props> {
 
     if (showEmptyMessage) {
       return (
-        <NoProjectMessage organization={organization} projects={projects}>
+        <NoProjectMessage
+          organization={organization}
+          projects={projects}
+          superuserNeedsToBeProjectMember
+        >
           {null}
         </NoProjectMessage>
       );

tests/js/spec/views/projectsDashboard/noProjectMessage.spec.jsx

@@ -3,6 +3,7 @@ import React from 'react';
 import {mountWithTheme} from 'sentry-test/enzyme';
 
 import NoProjectMessage from 'app/components/noProjectMessage';
+import ConfigStore from 'app/stores/configStore';
 
 describe('NoProjectMessage', function () {
   const org = TestStubs.Organization();
@@ -88,4 +89,21 @@ describe('NoProjectMessage', function () {
     // ensure loading projects causes children to render
     expect(wrapper.find('div')).toHaveLength(1);
   });
+
+  it('shows empty message to superusers that are not members', function () {
+    ConfigStore.config.user = {isSuperuser: true};
+    const wrapper = mountWithTheme(
+      <NoProjectMessage
+        organization={{
+          ...org,
+          projects: [TestStubs.Project({hasAccess: true, isMember: false})],
+        }}
+        superuserNeedsToBeProjectMember
+      >
+        {null}
+      </NoProjectMessage>,
+      TestStubs.routerContext()
+    );
+    expect(wrapper.find('HelpMessage')).toHaveLength(1);
+  });
 });