ref(getting-started-docs): Remove no longer used hook & component (#52791)

static/app/components/onboarding/docWithProductSelection.tsx

@@ -1,141 +0,0 @@
-import {Fragment, useCallback, useMemo, useState} from 'react';
-import styled from '@emotion/styled';
-import {motion} from 'framer-motion';
-import {Location} from 'history';
-
-import {Alert} from 'sentry/components/alert';
-import HookOrDefault from 'sentry/components/hookOrDefault';
-import LoadingError from 'sentry/components/loadingError';
-import LoadingIndicator from 'sentry/components/loadingIndicator';
-import {DocumentationWrapper} from 'sentry/components/onboarding/documentationWrapper';
-import {MissingExampleWarning} from 'sentry/components/onboarding/missingExampleWarning';
-import {ProductSolution} from 'sentry/components/onboarding/productSelection';
-import {PlatformKey} from 'sentry/data/platformCategories';
-import platforms from 'sentry/data/platforms';
-import {t} from 'sentry/locale';
-import {Project} from 'sentry/types';
-import {OnboardingPlatformDoc} from 'sentry/types/onboarding';
-import {trackAnalytics} from 'sentry/utils/analytics';
-import getDynamicText from 'sentry/utils/getDynamicText';
-import {useApiQuery} from 'sentry/utils/queryClient';
-import useOrganization from 'sentry/utils/useOrganization';
-import SetupIntroduction from 'sentry/views/onboarding/components/setupIntroduction';
-import {SetupDocsLoader} from 'sentry/views/onboarding/setupDocsLoader';
-
-const ProductSelectionAvailabilityHook = HookOrDefault({
-  hookName: 'component:product-selection-availability',
-});
-
-export function DocWithProductSelection({
-  location,
-  newOrg,
-  currentPlatform,
-  project,
-}: {
-  currentPlatform: PlatformKey;
-  location: Location;
-  project: Project;
-  newOrg?: boolean;
-}) {
-  const organization = useOrganization();
-  const [showLoaderDocs, setShowLoaderDocs] = useState(currentPlatform === 'javascript');
-
-  const loadPlatform = useMemo(() => {
-    const products = location.query.product ?? [];
-    return products.includes(ProductSolution.PERFORMANCE_MONITORING) &&
-      products.includes(ProductSolution.SESSION_REPLAY)
-      ? `${currentPlatform}-with-error-monitoring-performance-and-replay`
-      : products.includes(ProductSolution.PERFORMANCE_MONITORING)
-      ? `${currentPlatform}-with-error-monitoring-and-performance`
-      : products.includes(ProductSolution.SESSION_REPLAY)
-      ? `${currentPlatform}-with-error-monitoring-and-replay`
-      : `${currentPlatform}-with-error-monitoring`;
-  }, [location.query.product, currentPlatform]);
-
-  const {data, isLoading, isError, refetch} = useApiQuery<OnboardingPlatformDoc>(
-    [`/projects/${organization.slug}/${project?.slug}/docs/${loadPlatform}/`],
-    {
-      staleTime: Infinity,
-      enabled: !!project?.slug && !!organization.slug && !!loadPlatform,
-    }
-  );
-
-  const platformName = platforms.find(p => p.id === currentPlatform)?.name ?? '';
-
-  const closeLoaderDocs = useCallback(() => {
-    setShowLoaderDocs(false);
-
-    if (!project?.id) {
-      return;
-    }
-
-    trackAnalytics('onboarding.js_loader_npm_docs_shown', {
-      organization,
-      platform: currentPlatform,
-      project_id: project?.id,
-    });
-  }, [organization, currentPlatform, project?.id]);
-
-  if (showLoaderDocs) {
-    return (
-      <SetupDocsLoader
-        organization={organization}
-        project={project}
-        location={location}
-        platform={currentPlatform}
-        close={closeLoaderDocs}
-        showDocsWithProductSelection
-      />
-    );
-  }
-
-  return (
-    <Fragment>
-      {newOrg && (
-        <SetupIntroduction
-          stepHeaderText={t('Configure %s SDK', platformName)}
-          platform={currentPlatform}
-        />
-      )}
-      <ProductSelectionAvailabilityHook organization={organization} />
-      {isLoading ? (
-        <LoadingIndicator />
-      ) : isError ? (
-        <LoadingError
-          message={t('Failed to load documentation for the %s platform.', platformName)}
-          onRetry={refetch}
-        />
-      ) : (
-        getDynamicText({
-          value: (
-            <DocsWrapper>
-              <DocumentationWrapper
-                dangerouslySetInnerHTML={{__html: data?.html ?? ''}}
-              />
-              <MissingExampleWarning
-                platform={currentPlatform}
-                platformDocs={{
-                  html: data?.html ?? '',
-                  link: data?.link ?? '',
-                }}
-              />
-            </DocsWrapper>
-          ),
-          fixed: (
-            <Alert type="warning">
-              Platform documentation is not rendered in for tests in CI
-            </Alert>
-          ),
-        })
-      )}
-    </Fragment>
-  );
-}
-
-const DocsWrapper = styled(motion.div)``;
-
-DocsWrapper.defaultProps = {
-  initial: {opacity: 0, y: 40},
-  animate: {opacity: 1, y: 0},
-  exit: {opacity: 0},
-};

static/app/types/hooks.tsx

@@ -1,5 +1,4 @@
 import type {Route, RouteComponentProps, RouteContextInterface} from 'react-router';
-import {Location} from 'history';
 
 import type {ChildrenRenderFn} from 'sentry/components/acl/feature';
 import type {Guide} from 'sentry/components/assistant/types';
@@ -8,7 +7,6 @@ import {ProductSelectionProps} from 'sentry/components/onboarding/productSelecti
 import type DateRange from 'sentry/components/organizations/timeRangeSelector/dateRange';
 import type SelectorItems from 'sentry/components/organizations/timeRangeSelector/selectorItems';
 import type SidebarItem from 'sentry/components/sidebar/sidebarItem';
-import {Platform} from 'sentry/data/platformCategories';
 import {SVGIconProps} from 'sentry/icons/svgIcon';
 import type {Group} from 'sentry/types';
 import {UseExperiment} from 'sentry/utils/useExperiment';
@@ -117,13 +115,6 @@ type ProductSelectionAvailabilityProps = Pick<
   organization: Organization;
 };
 
-type SetUpSdkDocProps = {
-  location: Location;
-  organization: Organization;
-  platform: Platform;
-  project: Project;
-};
-
 type FirstPartyIntegrationAlertProps = {
   integrations: Integration[];
   hideCTA?: boolean;
@@ -183,7 +174,6 @@ export type ComponentHooks = {
   'component:replay-onboarding-alert': () => React.ComponentType<ReplayOnboardingAlertProps>;
   'component:replay-onboarding-cta': () => React.ComponentType<ReplayOnboardingCTAProps>;
   'component:sentry-logo': () => React.ComponentType<SentryLogoProps>;
-  'component:set-up-sdk-doc': () => React.ComponentType<SetUpSdkDocProps>;
   'component:superuser-access-category': React.ComponentType<any>;
 };
 

static/app/views/projectInstall/platform.spec.tsx

@@ -2,15 +2,22 @@ import {initializeOrg} from 'sentry-test/initializeOrg';
 import {render, screen, waitFor} from 'sentry-test/reactTestingLibrary';
 
 import ProjectsStore from 'sentry/stores/projectsStore';
+import {Project} from 'sentry/types';
 import {ProjectInstallPlatform} from 'sentry/views/projectInstall/platform';
 
-function mockProjectApiResponses(projects) {
+function mockProjectApiResponses(projects: Project[]) {
   MockApiClient.addMockResponse({
     method: 'GET',
     url: '/organizations/org-slug/projects/',
     body: projects,
   });
 
+  MockApiClient.addMockResponse({
+    method: 'GET',
+    url: '/projects/org-slug/project-slug/docs/other/',
+    body: {},
+  });
+
   MockApiClient.addMockResponse({
     method: 'GET',
     url: '/projects/org-slug/project-slug/rules/',

static/app/views/projectInstall/platform.tsx

@@ -15,7 +15,6 @@ import ExternalLink from 'sentry/components/links/externalLink';
 import LoadingError from 'sentry/components/loadingError';
 import LoadingIndicator from 'sentry/components/loadingIndicator';
 import {DocumentationWrapper} from 'sentry/components/onboarding/documentationWrapper';
-import {DocWithProductSelection} from 'sentry/components/onboarding/docWithProductSelection';
 import {Footer} from 'sentry/components/onboarding/footer';
 import {
   migratedDocs,
@@ -46,11 +45,6 @@ import {normalizeUrl} from 'sentry/utils/withDomainRequired';
 import {SetupDocsLoader} from 'sentry/views/onboarding/setupDocsLoader';
 import {GettingStartedWithProjectContext} from 'sentry/views/projects/gettingStartedWithProjectContext';
 
-// in this case, the default is rendered inside the hook
-const SetUpSdkDocHook = HookOrDefault({
-  hookName: 'component:set-up-sdk-doc',
-});
-
 const ProductUnavailableCTAHook = HookOrDefault({
   hookName: 'component:product-unavailable-cta',
 });
@@ -403,28 +397,11 @@ export function ProjectInstallPlatform({location, params, route, router}: Props)
           activeProductSelection={products}
         />
       ) : (
-        <Fragment>
-          {isSelfHosted ? (
-            <SetUpGeneralSdkDoc
-              organization={organization}
-              projectSlug={project.slug}
-              platform={platform}
-            />
-          ) : showDocsWithProductSelection ? (
-            <DocWithProductSelection
-              project={project}
-              location={location}
-              currentPlatform={platform.key}
-            />
-          ) : (
-            <SetUpSdkDocHook
-              organization={organization}
-              project={project}
-              location={location}
-              platform={platform}
-            />
-          )}
-        </Fragment>
+        <SetUpGeneralSdkDoc
+          organization={organization}
+          projectSlug={project.slug}
+          platform={platform}
+        />
       )}
       <div>
         {isGettingStarted && showPerformancePrompt && (