ref(js): Remove withOrganization from InvoiceDetails (#87652)

Author: evanpurkhiser

static/gsApp/views/invoiceDetails/index.spec.tsx

@@ -77,9 +77,7 @@ describe('InvoiceDetails', function () {
       method: 'GET',
       body: basicInvoice,
     });
-    render(
-      <InvoiceDetails {...routerProps} params={params} organization={organization} />
-    );
+    render(<InvoiceDetails {...routerProps} params={params} />);
     await waitFor(() => expect(mockapi).toHaveBeenCalled());
 
     expect(await screen.findByText('Sentry')).toBeInTheDocument();
@@ -97,13 +95,7 @@ describe('InvoiceDetails', function () {
       body: creditInvoice,
     });
     const creditParams = {invoiceGuid: creditInvoice.id};
-    render(
-      <InvoiceDetails
-        {...routerProps}
-        params={creditParams}
-        organization={organization}
-      />
-    );
+    render(<InvoiceDetails {...routerProps} params={creditParams} />);
     await waitFor(() => expect(mockapi).toHaveBeenCalled());
 
     expect(await screen.findByText('Sentry')).toBeInTheDocument();
@@ -194,16 +186,9 @@ describe('InvoiceDetails', function () {
     });
 
     renderGlobalModal();
-    render(
-      <InvoiceDetails
-        {...routerProps}
-        params={pastDueParams}
-        organization={organization}
-      />,
-      {
-        router,
-      }
-    );
+    render(<InvoiceDetails {...routerProps} params={pastDueParams} />, {
+      router,
+    });
 
     await waitFor(() => expect(mockapiInvoice).toHaveBeenCalled());
     await waitFor(() => expect(mockapiPayments).toHaveBeenCalled());

static/gsApp/views/invoiceDetails/index.tsx

@@ -10,9 +10,8 @@ import {IconSentry} from 'sentry/icons';
 import {t, tct} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
 import type {RouteComponentProps} from 'sentry/types/legacyReactRouter';
-import type {Organization} from 'sentry/types/organization';
 import {keepPreviousData, useApiQuery} from 'sentry/utils/queryClient';
-import withOrganization from 'sentry/utils/withOrganization';
+import useOrganization from 'sentry/utils/useOrganization';
 import SettingsPageHeader from 'sentry/views/settings/components/settingsPageHeader';
 
 import type {BillingDetails, Invoice} from 'getsentry/types';
@@ -23,11 +22,10 @@ import {displayPriceWithCents} from '../amCheckout/utils';
 
 import InvoiceDetailsActions from './actions';
 
-type Props = RouteComponentProps<{invoiceGuid: string}, unknown> & {
-  organization: Organization;
-};
+interface Props extends RouteComponentProps<{invoiceGuid: string}, unknown> {}
 
-function InvoiceDetails({organization, params}: Props) {
+function InvoiceDetails({params}: Props) {
+  const organization = useOrganization();
   const {
     data: billingDetails,
     isPending: isBillingDetailsLoading,
@@ -241,7 +239,7 @@ function InvoiceDetailsContents({billingDetails, invoice}: ContentsProps) {
   );
 }
 
-export default withOrganization(InvoiceDetails);
+export default InvoiceDetails;
 
 const SenderName = styled('h3')`
   display: flex;