ref(js): useOrganization in organizationGeneralSettings (#63411)

static/app/views/settings/organizationGeneralSettings/index.spec.tsx

@@ -72,13 +72,9 @@ describe('OrganizationGeneralSettings', function () {
       features: ['codecov-integration'],
       codecovAccess: false,
     });
-    render(
-      <OrganizationGeneralSettings
-        {...defaultProps}
-        organization={organizationWithCodecovFeature}
-      />,
-      {organization: organizationWithCodecovFeature}
-    );
+    render(<OrganizationGeneralSettings {...defaultProps} />, {
+      organization: organizationWithCodecovFeature,
+    });
     const mock = MockApiClient.addMockResponse({
       url: ENDPOINT,
       method: 'PUT',
@@ -132,7 +128,7 @@ describe('OrganizationGeneralSettings', function () {
       body: {...org, slug: 'acme', links: {organizationUrl: 'https://acme.sentry.io'}},
     });
 
-    render(<OrganizationGeneralSettings {...defaultProps} organization={org} />);
+    render(<OrganizationGeneralSettings {...defaultProps} />, {organization: org});
 
     const input = screen.getByRole('textbox', {name: /slug/i});
 
@@ -159,7 +155,7 @@ describe('OrganizationGeneralSettings', function () {
   it('disables the entire form if user does not have write access', function () {
     const readOnlyOrg = OrganizationFixture({access: ['org:read']});
 
-    render(<OrganizationGeneralSettings {...defaultProps} organization={readOnlyOrg} />, {
+    render(<OrganizationGeneralSettings {...defaultProps} />, {
       organization: readOnlyOrg,
     });
 
@@ -181,14 +177,11 @@ describe('OrganizationGeneralSettings', function () {
   });
 
   it('does not have remove organization button without org:admin permission', function () {
-    render(
-      <OrganizationGeneralSettings
-        {...defaultProps}
-        organization={OrganizationFixture({
-          access: ['org:write'],
-        })}
-      />
-    );
+    render(<OrganizationGeneralSettings {...defaultProps} />, {
+      organization: OrganizationFixture({
+        access: ['org:write'],
+      }),
+    });
 
     expect(
       screen.queryByRole('button', {name: /remove organization/i})
@@ -198,12 +191,9 @@ describe('OrganizationGeneralSettings', function () {
   it('can remove organization when org admin', async function () {
     act(() => ProjectsStore.loadInitialData([ProjectFixture({slug: 'project'})]));
 
-    render(
-      <OrganizationGeneralSettings
-        {...defaultProps}
-        organization={OrganizationFixture({access: ['org:admin']})}
-      />
-    );
+    render(<OrganizationGeneralSettings {...defaultProps} />, {
+      organization: OrganizationFixture({access: ['org:admin']}),
+    });
     renderGlobalModal();
 
     const mock = MockApiClient.addMockResponse({

static/app/views/settings/organizationGeneralSettings/index.tsx

@@ -19,7 +19,7 @@ import {t, tct} from 'sentry/locale';
 import {Organization, Project} from 'sentry/types';
 import {trackAnalytics} from 'sentry/utils/analytics';
 import useApi from 'sentry/utils/useApi';
-import withOrganization from 'sentry/utils/withOrganization';
+import useOrganization from 'sentry/utils/useOrganization';
 import withProjects from 'sentry/utils/withProjects';
 import SettingsPageHeader from 'sentry/views/settings/components/settingsPageHeader';
 import TextBlock from 'sentry/views/settings/components/text/textBlock';
@@ -29,15 +29,12 @@ import {OrganizationRegionAction} from 'sentry/views/settings/organizationGenera
 import OrganizationSettingsForm from './organizationSettingsForm';
 
 type Props = {
-  organization: Organization;
   projects: Project[];
 } & RouteComponentProps<{}, {}>;
 
-function OrganizationGeneralSettings(props: Props) {
+function OrganizationGeneralSettings({projects}: Props) {
   const api = useApi();
-
-  const {organization, projects} = props;
-  const access = new Set(organization.access);
+  const organization = useOrganization();
 
   const removeConfirmMessage = (
     <Fragment>
@@ -120,7 +117,7 @@ function OrganizationGeneralSettings(props: Props) {
 
         <OrganizationSettingsForm initialData={organization} onSave={handleSaveForm} />
 
-        {access.has('org:admin') && !organization.isDefault && (
+        {organization.access.includes('org:admin') && !organization.isDefault && (
           <Panel>
             <PanelHeader>{t('Remove Organization')}</PanelHeader>
             <FieldGroup
@@ -147,4 +144,4 @@ function OrganizationGeneralSettings(props: Props) {
   );
 }
 
-export default withProjects(withOrganization(OrganizationGeneralSettings));
+export default withProjects(OrganizationGeneralSettings);