ref(js): Remove most deprecatedAsyncView usages

static/app/views/acceptOrganizationInvite/index.tsx

@@ -4,15 +4,16 @@ import styled from '@emotion/styled';
 import {logout} from 'sentry/actionCreators/account';
 import {Alert} from 'sentry/components/alert';
 import {Button, LinkButton} from 'sentry/components/button';
+import DeprecatedAsyncComponent from 'sentry/components/deprecatedAsyncComponent';
 import ExternalLink from 'sentry/components/links/externalLink';
 import Link from 'sentry/components/links/link';
 import NarrowLayout from 'sentry/components/narrowLayout';
+import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
 import {t, tct} from 'sentry/locale';
 import ConfigStore from 'sentry/stores/configStore';
 import {space} from 'sentry/styles/space';
 import type {RouteComponentProps} from 'sentry/types/legacyReactRouter';
 import {browserHistory} from 'sentry/utils/browserHistory';
-import DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView';
 import SettingsPageHeader from 'sentry/views/settings/components/settingsPageHeader';
 
 type InviteDetails = {
@@ -27,13 +28,13 @@ type InviteDetails = {
 
 type Props = RouteComponentProps<{memberId: string; token: string; orgId?: string}, {}>;
 
-type State = DeprecatedAsyncView['state'] & {
+type State = DeprecatedAsyncComponent['state'] & {
   acceptError: boolean | undefined;
   accepting: boolean | undefined;
   inviteDetails: InviteDetails;
 };
 
-class AcceptOrganizationInvite extends DeprecatedAsyncView<Props, State> {
+class AcceptOrganizationInvite extends DeprecatedAsyncComponent<Props, State> {
   disableErrorReport = false;
 
   get orgSlug(): string | null {
@@ -48,18 +49,14 @@ class AcceptOrganizationInvite extends DeprecatedAsyncView<Props, State> {
     return null;
   }
 
-  getEndpoints(): ReturnType<DeprecatedAsyncView['getEndpoints']> {
+  getEndpoints(): ReturnType<DeprecatedAsyncComponent['getEndpoints']> {
     const {memberId, token} = this.props.params;
     if (this.orgSlug) {
       return [['inviteDetails', `/accept-invite/${this.orgSlug}/${memberId}/${token}/`]];
     }
     return [['inviteDetails', `/accept-invite/${memberId}/${token}/`]];
   }
 
-  getTitle() {
-    return t('Accept Organization Invite');
-  }
-
   handleLogout = (e: React.MouseEvent) => {
     e.preventDefault();
     logout(this.api);
@@ -287,6 +284,7 @@ class AcceptOrganizationInvite extends DeprecatedAsyncView<Props, State> {
 
     return (
       <NarrowLayout>
+        <SentryDocumentTitle title={t('Accept Organization Invite')} />
         <SettingsPageHeader title={t('Accept organization invite')} />
         {acceptError && (
           <Alert type="error">

static/app/views/acceptProjectTransfer/index.tsx

@@ -1,13 +1,14 @@
 import {addErrorMessage} from 'sentry/actionCreators/indicator';
+import DeprecatedAsyncComponent from 'sentry/components/deprecatedAsyncComponent';
 import SelectField from 'sentry/components/forms/fields/selectField';
 import Form from 'sentry/components/forms/form';
 import NarrowLayout from 'sentry/components/narrowLayout';
+import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
 import {t, tct} from 'sentry/locale';
 import ConfigStore from 'sentry/stores/configStore';
 import type {RouteComponentProps} from 'sentry/types/legacyReactRouter';
 import type {Organization} from 'sentry/types/organization';
 import type {Project} from 'sentry/types/project';
-import DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView';
 import SettingsPageHeader from 'sentry/views/settings/components/settingsPageHeader';
 
 type Props = RouteComponentProps<{}, {}>;
@@ -19,9 +20,9 @@ type TransferDetails = {
 
 type State = {
   transferDetails: TransferDetails | null;
-} & DeprecatedAsyncView['state'];
+} & DeprecatedAsyncComponent['state'];
 
-class AcceptProjectTransfer extends DeprecatedAsyncView<Props, State> {
+class AcceptProjectTransfer extends DeprecatedAsyncComponent<Props, State> {
   disableErrorReport = false;
 
   get regionHost(): string | undefined {
@@ -37,7 +38,7 @@ class AcceptProjectTransfer extends DeprecatedAsyncView<Props, State> {
     return host;
   }
 
-  getEndpoints(): ReturnType<DeprecatedAsyncView['getEndpoints']> {
+  getEndpoints(): ReturnType<DeprecatedAsyncComponent['getEndpoints']> {
     const query = this.props.location.query;
     const host = this.regionHost;
     return [['transferDetails', '/accept-transfer/', {query, host}]];
@@ -101,6 +102,7 @@ class AcceptProjectTransfer extends DeprecatedAsyncView<Props, State> {
 
     return (
       <NarrowLayout>
+        <SentryDocumentTitle title={t('Accept Project Transfer')} />
         <SettingsPageHeader title={t('Approve Transfer Project Request')} />
         <p>
           {tct(

static/app/views/admin/installWizard/index.tsx

@@ -4,17 +4,17 @@ import styled from '@emotion/styled';
 import sentryPattern from 'sentry-images/pattern/sentry-pattern.png';
 
 import {Alert} from 'sentry/components/alert';
+import DeprecatedAsyncComponent from 'sentry/components/deprecatedAsyncComponent';
 import ApiForm from 'sentry/components/forms/apiForm';
 import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
 import {t} from 'sentry/locale';
 import ConfigStore from 'sentry/stores/configStore';
 import {space} from 'sentry/styles/space';
-import DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView';
 
 import type {Field} from '../options';
 import {getForm, getOptionDefault, getOptionField} from '../options';
 
-export type InstallWizardProps = DeprecatedAsyncView['props'] & {
+export type InstallWizardProps = DeprecatedAsyncComponent['props'] & {
   onConfigured: () => void;
 };
 
@@ -26,15 +26,15 @@ export type InstallWizardOptions = Record<
   }
 >;
 
-type State = DeprecatedAsyncView['state'] & {
+type State = DeprecatedAsyncComponent['state'] & {
   data: null | InstallWizardOptions;
 };
 
-export default class InstallWizard extends DeprecatedAsyncView<
+export default class InstallWizard extends DeprecatedAsyncComponent<
   InstallWizardProps,
   State
 > {
-  getEndpoints(): ReturnType<DeprecatedAsyncView['getEndpoints']> {
+  getEndpoints(): ReturnType<DeprecatedAsyncComponent['getEndpoints']> {
     return [['data', '/internal/options/?query=is:required']];
   }
 
@@ -95,14 +95,10 @@ export default class InstallWizard extends DeprecatedAsyncView<
     return data;
   }
 
-  getTitle() {
-    return t('Setup Sentry');
-  }
-
   render() {
     const version = ConfigStore.get('version');
     return (
-      <SentryDocumentTitle noSuffix title={this.getTitle()}>
+      <SentryDocumentTitle noSuffix title={t('Setup Sentry')}>
         <Wrapper>
           <Pattern />
           <SetupWizard>

static/app/views/alerts/rules/issue/index.tsx

@@ -22,6 +22,7 @@ import AlertLink from 'sentry/components/alertLink';
 import {Button} from 'sentry/components/button';
 import Checkbox from 'sentry/components/checkbox';
 import Confirm from 'sentry/components/confirm';
+import DeprecatedAsyncComponent from 'sentry/components/deprecatedAsyncComponent';
 import ErrorBoundary from 'sentry/components/errorBoundary';
 import SelectControl from 'sentry/components/forms/controls/selectControl';
 import FieldGroup from 'sentry/components/forms/fieldGroup';
@@ -39,6 +40,7 @@ import ListItem from 'sentry/components/list/listItem';
 import LoadingMask from 'sentry/components/loadingMask';
 import Panel from 'sentry/components/panels/panel';
 import PanelBody from 'sentry/components/panels/panelBody';
+import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
 import TeamSelector from 'sentry/components/teamSelector';
 import {ALL_ENVIRONMENTS_KEY} from 'sentry/constants';
 import {IconChevron, IconNot} from 'sentry/icons';
@@ -65,7 +67,6 @@ import {browserHistory} from 'sentry/utils/browserHistory';
 import {getDisplayName} from 'sentry/utils/environment';
 import {isActiveSuperuser} from 'sentry/utils/isActiveSuperuser';
 import recreateRoute from 'sentry/utils/recreateRoute';
-import routeTitleGen from 'sentry/utils/routeTitle';
 import normalizeUrl from 'sentry/utils/url/normalizeUrl';
 import withOrganization from 'sentry/utils/withOrganization';
 import withProjects from 'sentry/utils/withProjects';
@@ -78,7 +79,6 @@ import {
   CHANGE_ALERT_CONDITION_IDS,
   CHANGE_ALERT_PLACEHOLDERS_LABELS,
 } from 'sentry/views/alerts/utils/constants';
-import DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView';
 import PermissionAlert from 'sentry/views/settings/project/permissionAlert';
 
 import {getProjectOptions} from '../utils';
@@ -148,7 +148,7 @@ type Props = {
   onChangeTitle?: (data: string) => void;
 } & RouteComponentProps<RouteParams, {}>;
 
-type State = DeprecatedAsyncView['state'] & {
+type State = DeprecatedAsyncComponent['state'] & {
   configs: IssueAlertConfiguration | null;
   detailedError: null | {
     [key: string]: string[];
@@ -172,7 +172,7 @@ function isSavedAlertRule(rule: State['rule']): rule is IssueAlertRule {
  */
 const isExactDuplicateExp = /duplicate of '(.*)'/;
 
-class IssueRuleEditor extends DeprecatedAsyncView<Props, State> {
+class IssueRuleEditor extends DeprecatedAsyncComponent<Props, State> {
   pollingTimeout: number | undefined = undefined;
   trackIncompatibleAnalytics = false;
   trackNoisyWarningViewed = false;
@@ -225,19 +225,6 @@ class IssueRuleEditor extends DeprecatedAsyncView<Props, State> {
     );
   }
 
-  getTitle() {
-    const {organization} = this.props;
-    const {rule, project} = this.state;
-    const ruleName = rule?.name;
-
-    return routeTitleGen(
-      ruleName ? t('Alert - %s', ruleName) : t('New Alert Rule'),
-      organization.slug,
-      false,
-      project?.slug
-    );
-  }
-
   getDefaultState() {
     const {userTeamIds, project} = this.props;
     const defaultState = {
@@ -259,7 +246,7 @@ class IssueRuleEditor extends DeprecatedAsyncView<Props, State> {
     return defaultState;
   }
 
-  getEndpoints(): ReturnType<DeprecatedAsyncView['getEndpoints']> {
+  getEndpoints(): ReturnType<DeprecatedAsyncComponent['getEndpoints']> {
     const {
       location: {query},
       params: {ruleId},
@@ -1190,6 +1177,11 @@ class IssueRuleEditor extends DeprecatedAsyncView<Props, State> {
     // a different key when we have fetched the rule so that form inputs are filled in
     return (
       <Main fullWidth>
+        <SentryDocumentTitle
+          title={rule ? t('Alert — %s', rule.name) : t('New Alert Rule')}
+          orgSlug={organization.slug}
+          projectSlug={project.slug}
+        />
         <PermissionAlert access={['alerts:write']} project={project} />
         <StyledForm
           key={isSavedAlertRule(rule) ? rule.id : undefined}

static/app/views/alerts/rules/issue/ticketRuleModal.tsx

@@ -1,6 +1,7 @@
 import styled from '@emotion/styled';
 
 import {addSuccessMessage} from 'sentry/actionCreators/indicator';
+import type DeprecatedAsyncComponent from 'sentry/components/deprecatedAsyncComponent';
 import type {ExternalIssueFormErrors} from 'sentry/components/externalIssues/abstractExternalIssueForm';
 import AbstractExternalIssueForm from 'sentry/components/externalIssues/abstractExternalIssueForm';
 import type {FormProps} from 'sentry/components/forms/form';
@@ -11,7 +12,6 @@ import type {IssueAlertRuleAction} from 'sentry/types/alerts';
 import type {Choices} from 'sentry/types/core';
 import type {IssueConfigField} from 'sentry/types/integrations';
 import type {Organization} from 'sentry/types/organization';
-import type DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView';
 
 const IGNORED_FIELDS = ['Sprint'];
 
@@ -51,7 +51,7 @@ class TicketRuleModal extends AbstractExternalIssueForm<Props, State> {
     };
   }
 
-  getEndpoints(): ReturnType<DeprecatedAsyncView['getEndpoints']> {
+  getEndpoints(): ReturnType<DeprecatedAsyncComponent['getEndpoints']> {
     const {instance} = this.props;
     const query = (instance.dynamic_form_fields || [])
       .filter(field => field.updatesForm)

static/app/views/integrationOrganizationLink/index.tsx

@@ -5,12 +5,14 @@ import {urlEncode} from '@sentry/utils';
 import {addErrorMessage} from 'sentry/actionCreators/indicator';
 import {Alert} from 'sentry/components/alert';
 import {Button} from 'sentry/components/button';
+import DeprecatedAsyncComponent from 'sentry/components/deprecatedAsyncComponent';
 import SelectControl from 'sentry/components/forms/controls/selectControl';
 import FieldGroup from 'sentry/components/forms/fieldGroup';
 import IdBadge from 'sentry/components/idBadge';
 import ExternalLink from 'sentry/components/links/externalLink';
 import LoadingIndicator from 'sentry/components/loadingIndicator';
 import NarrowLayout from 'sentry/components/narrowLayout';
+import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
 import {t, tct} from 'sentry/locale';
 import ConfigStore from 'sentry/stores/configStore';
 import type {Integration, IntegrationProvider} from 'sentry/types/integrations';
@@ -24,14 +26,13 @@ import {
 } from 'sentry/utils/integrationUtil';
 import {singleLineRenderer} from 'sentry/utils/marked';
 import normalizeUrl from 'sentry/utils/url/normalizeUrl';
-import DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView';
 import {DisabledNotice} from 'sentry/views/settings/organizationIntegrations/abstractIntegrationDetailedView';
 import AddIntegration from 'sentry/views/settings/organizationIntegrations/addIntegration';
 
 // installationId present for Github flow
 type Props = RouteComponentProps<{integrationSlug: string; installationId?: string}, {}>;
 
-type State = DeprecatedAsyncView['state'] & {
+type State = DeprecatedAsyncComponent['state'] & {
   installationData?: GitHubIntegrationInstallation;
   installationDataLoading?: boolean;
   organization?: Organization;
@@ -50,20 +51,16 @@ interface GitHubIntegrationInstallation {
   };
 }
 
-export default class IntegrationOrganizationLink extends DeprecatedAsyncView<
+export default class IntegrationOrganizationLink extends DeprecatedAsyncComponent<
   Props,
   State
 > {
   disableErrorReport = false;
 
-  getEndpoints(): ReturnType<DeprecatedAsyncView['getEndpoints']> {
+  getEndpoints(): ReturnType<DeprecatedAsyncComponent['getEndpoints']> {
     return [['organizations', '/organizations/?include_feature_flags=1']];
   }
 
-  getTitle() {
-    return t('Choose Installation Organization');
-  }
-
   trackIntegrationAnalytics = (
     eventName: IntegrationAnalyticsKey,
     startSession?: boolean
@@ -380,6 +377,7 @@ export default class IntegrationOrganizationLink extends DeprecatedAsyncView<
 
     return (
       <NarrowLayout>
+        <SentryDocumentTitle title={t('Choose Installation Organization')} />
         <h3>{t('Finish integration installation')}</h3>
         {this.renderCallout()}
         <p>

static/app/views/releases/detail/overview/index.tsx

@@ -9,6 +9,7 @@ import Feature from 'sentry/components/acl/feature';
 import SessionsRequest from 'sentry/components/charts/sessionsRequest';
 import type {DateTimeObject} from 'sentry/components/charts/utils';
 import {DateTime} from 'sentry/components/dateTime';
+import DeprecatedAsyncComponent from 'sentry/components/deprecatedAsyncComponent';
 import PerformanceCardTable from 'sentry/components/discover/performanceCardTable';
 import type {DropdownOption} from 'sentry/components/discover/transactionsList';
 import TransactionsList from 'sentry/components/discover/transactionsList';
@@ -35,7 +36,6 @@ import {formatVersion} from 'sentry/utils/versions/formatVersion';
 import withApi from 'sentry/utils/withApi';
 import withOrganization from 'sentry/utils/withOrganization';
 import withPageFilters from 'sentry/utils/withPageFilters';
-import DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView';
 import {
   DisplayModes,
   transactionSummaryRouteWithQuery,
@@ -84,7 +84,7 @@ type Props = RouteComponentProps<RouteParams, {}> & {
   selection: PageFilters;
 };
 
-class ReleaseOverview extends DeprecatedAsyncView<Props> {
+class ReleaseOverview extends DeprecatedAsyncComponent<Props> {
   getTitle() {
     const {params, organization} = this.props;
     return routeTitleGen(