chore(ts): Use UPPER_CASE for SidebarPanelKey (#50357)

static/app/components/globalSdkUpdateAlert.tsx

@@ -43,7 +43,7 @@ function InnerGlobalSdkUpdateAlert(
   }, [api, organization]);
 
   const handleReviewUpdatesClick = useCallback(() => {
-    SidebarPanelStore.activatePanel(SidebarPanelKey.Broadcasts);
+    SidebarPanelStore.activatePanel(SidebarPanelKey.BROADCASTS);
     trackAnalytics('sdk_updates.clicked', {organization});
   }, [organization]);
 

static/app/components/modals/demoEndModal.tsx

@@ -93,7 +93,7 @@ export default function DemoEndingModal({tour, closeModal, CloseButton, orgSlug}
 
   const handleMoreTours = () => {
     closeModal?.();
-    SidebarPanelStore.togglePanel(SidebarPanelKey.OnboardingWizard);
+    SidebarPanelStore.togglePanel(SidebarPanelKey.ONBOARDING_WIZARD);
     trackAnalytics('growth.end_modal_more_tours', {
       organization: null,
     });

static/app/components/performanceOnboarding/sidebar.spec.tsx

@@ -256,7 +256,7 @@ describe('Sidebar > Performance Onboarding Checklist', function () {
     });
 
     act(() => {
-      SidebarPanelStore.activatePanel(SidebarPanelKey.PerformanceOnboarding);
+      SidebarPanelStore.activatePanel(SidebarPanelKey.PERFORMANCE_ONBOARDING);
     });
 
     expect(

static/app/components/performanceOnboarding/sidebar.tsx

@@ -29,7 +29,7 @@ import {filterProjects, generateDocKeys, isPlatformSupported} from './utils';
 
 function PerformanceOnboardingSidebar(props: CommonSidebarProps) {
   const {currentPanel, collapsed, hidePanel, orientation} = props;
-  const isActive = currentPanel === SidebarPanelKey.PerformanceOnboarding;
+  const isActive = currentPanel === SidebarPanelKey.PERFORMANCE_ONBOARDING;
   const organization = useOrganization();
   const hasProjectAccess = organization.access.includes('project:read');
 

static/app/components/profiling/ProfilingOnboarding/profilingOnboardingSidebar.tsx

@@ -33,7 +33,7 @@ import {makeDocKeyMap, splitProjectsByProfilingSupport} from './util';
 
 export function ProfilingOnboardingSidebar(props: CommonSidebarProps) {
   const {currentPanel, collapsed, hidePanel, orientation} = props;
-  const isActive = currentPanel === SidebarPanelKey.ProfilingOnboarding;
+  const isActive = currentPanel === SidebarPanelKey.PROFILING_ONBOARDING;
   const organization = useOrganization();
   const hasProjectAccess = organization.access.includes('project:read');
 

static/app/components/replaysOnboarding/sidebar.tsx

@@ -31,7 +31,7 @@ function ReplaysOnboardingSidebar(props: CommonSidebarProps) {
   const {currentPanel, collapsed, hidePanel, orientation} = props;
   const organization = useOrganization();
 
-  const isActive = currentPanel === SidebarPanelKey.ReplaysOnboarding;
+  const isActive = currentPanel === SidebarPanelKey.REPLAYS_ONBOARDING;
   const hasProjectAccess = organization.access.includes('project:read');
 
   const {

static/app/components/replaysOnboarding/useCurrentProjectState.tsx

@@ -14,7 +14,7 @@ function useCurrentProjectState({currentPanel}: {currentPanel: '' | SidebarPanel
   const {projects, initiallyLoaded: projectsLoaded} = useProjects();
   const {selection, isReady} = useLegacyStore(PageFiltersStore);
 
-  const isActive = currentPanel === SidebarPanelKey.ReplaysOnboarding;
+  const isActive = currentPanel === SidebarPanelKey.REPLAYS_ONBOARDING;
 
   // Projects where we have the onboarding instructions ready:
   const projectsWithOnboarding = useMemo(

static/app/components/sidebar/broadcasts.tsx

@@ -125,7 +125,7 @@ class Broadcasts extends Component<Props, State> {
             data-test-id="sidebar-broadcasts"
             orientation={orientation}
             collapsed={collapsed}
-            active={currentPanel === SidebarPanelKey.Broadcasts}
+            active={currentPanel === SidebarPanelKey.BROADCASTS}
             badge={unseenPosts.length}
             icon={<IconBroadcast size="md" />}
             label={t("What's new")}
@@ -133,7 +133,7 @@ class Broadcasts extends Component<Props, State> {
             id="broadcasts"
           />
 
-          {currentPanel === SidebarPanelKey.Broadcasts && (
+          {currentPanel === SidebarPanelKey.BROADCASTS && (
             <SidebarPanel
               data-test-id="sidebar-broadcasts-panel"
               orientation={orientation}

static/app/components/sidebar/index.tsx

@@ -100,7 +100,7 @@ function useOpenOnboardingSidebar(organization?: Organization) {
 
   useEffect(() => {
     if (openOnboardingSidebar) {
-      activatePanel(SidebarPanelKey.OnboardingWizard);
+      activatePanel(SidebarPanelKey.ONBOARDING_WIZARD);
     }
   }, [openOnboardingSidebar]);
 }
@@ -423,19 +423,19 @@ function Sidebar({location, organization}: Props) {
         <SidebarSectionGroup>
           <PerformanceOnboardingSidebar
             currentPanel={activePanel}
-            onShowPanel={() => togglePanel(SidebarPanelKey.PerformanceOnboarding)}
+            onShowPanel={() => togglePanel(SidebarPanelKey.PERFORMANCE_ONBOARDING)}
             hidePanel={hidePanel}
             {...sidebarItemProps}
           />
           <ReplaysOnboardingSidebar
             currentPanel={activePanel}
-            onShowPanel={() => togglePanel(SidebarPanelKey.ReplaysOnboarding)}
+            onShowPanel={() => togglePanel(SidebarPanelKey.REPLAYS_ONBOARDING)}
             hidePanel={hidePanel}
             {...sidebarItemProps}
           />
           <ProfilingOnboardingSidebar
             currentPanel={activePanel}
-            onShowPanel={() => togglePanel(SidebarPanelKey.ReplaysOnboarding)}
+            onShowPanel={() => togglePanel(SidebarPanelKey.REPLAYS_ONBOARDING)}
             hidePanel={hidePanel}
             {...sidebarItemProps}
           />
@@ -443,7 +443,7 @@ function Sidebar({location, organization}: Props) {
             <OnboardingStatus
               org={organization}
               currentPanel={activePanel}
-              onShowPanel={() => togglePanel(SidebarPanelKey.OnboardingWizard)}
+              onShowPanel={() => togglePanel(SidebarPanelKey.ONBOARDING_WIZARD)}
               hidePanel={hidePanel}
               {...sidebarItemProps}
             />
@@ -467,7 +467,7 @@ function Sidebar({location, organization}: Props) {
               orientation={orientation}
               collapsed={collapsed}
               currentPanel={activePanel}
-              onShowPanel={() => togglePanel(SidebarPanelKey.Broadcasts)}
+              onShowPanel={() => togglePanel(SidebarPanelKey.BROADCASTS)}
               hidePanel={hidePanel}
               organization={organization}
             />
@@ -475,7 +475,7 @@ function Sidebar({location, organization}: Props) {
               orientation={orientation}
               collapsed={collapsed}
               currentPanel={activePanel}
-              onShowPanel={() => togglePanel(SidebarPanelKey.ServiceIncidents)}
+              onShowPanel={() => togglePanel(SidebarPanelKey.SERVICE_INCIDENTS)}
               hidePanel={hidePanel}
             />
           </SidebarSection>

static/app/components/sidebar/onboardingStatus.tsx

@@ -69,7 +69,7 @@ function OnboardingStatus({
       !task.completionSeen
   );
 
-  const isActive = currentPanel === SidebarPanelKey.OnboardingWizard;
+  const isActive = currentPanel === SidebarPanelKey.ONBOARDING_WIZARD;
 
   if (doneTasks.length >= allDisplayedTasks.length && !isActive) {
     return null;