ref(js): useLegacyStore for config in App (#29136)

static/app/views/app/index.tsx

@@ -20,9 +20,7 @@ import HookStore from 'app/stores/hookStore';
 import OrganizationsStore from 'app/stores/organizationsStore';
 import OrganizationStore from 'app/stores/organizationStore';
 import {useLegacyStore} from 'app/stores/useLegacyStore';
-import {Config} from 'app/types';
 import useApi from 'app/utils/useApi';
-import withConfig from 'app/utils/withConfig';
 
 import SystemAlerts from './systemAlerts';
 
@@ -32,7 +30,6 @@ const GlobalNotifications = HookOrDefault({
 });
 
 type Props = {
-  config: Config;
   children: React.ReactNode;
 };
 
@@ -42,8 +39,9 @@ const NewsletterConsent = lazy(() => import('app/views/newsletterConsent'));
 /**
  * App is the root level container for all uathenticated routes.
  */
-function App({config, children}: Props) {
+function App({children}: Props) {
   const api = useApi();
+  const config = useLegacyStore(ConfigStore);
   const {organization} = useLegacyStore(OrganizationStore);
 
   // Command palette global-shortcut
@@ -174,7 +172,7 @@ function App({config, children}: Props) {
   );
 }
 
-export default withConfig(App);
+export default App;
 
 const MainContainer = styled('div')`
   display: flex;

tests/js/spec/components/modals/sudoModal.spec.jsx

@@ -1,10 +1,15 @@
+import {act} from 'react-dom/test-utils';
+
 import {mountWithTheme} from 'sentry-test/enzyme';
 
 import {Client} from 'app/api';
 import ConfigStore from 'app/stores/configStore';
 import App from 'app/views/app';
 
 describe('Sudo Modal', function () {
+  const setHaspasswordAuth = hasPasswordAuth =>
+    act(() => ConfigStore.set('user', {...ConfigStore.get('user'), hasPasswordAuth}));
+
   beforeEach(function () {
     Client.clearMockResponses();
     Client.addMockResponse({
@@ -39,10 +44,8 @@ describe('Sudo Modal', function () {
   });
 
   it('can delete an org with sudo flow', async function () {
-    ConfigStore.set('user', {
-      ...ConfigStore.get('user'),
-      hasPasswordAuth: true,
-    });
+    setHaspasswordAuth(true);
+
     const wrapper = mountWithTheme(
       <App>{<div>placeholder content</div>}</App>,
       TestStubs.routerContext()
@@ -126,10 +129,8 @@ describe('Sudo Modal', function () {
   });
 
   it('shows button to redirect if user does not have password auth', async function () {
-    ConfigStore.set('user', {
-      ...ConfigStore.get('user'),
-      hasPasswordAuth: false,
-    });
+    setHaspasswordAuth(false);
+
     const wrapper = mountWithTheme(
       <App>{<div>placeholder content</div>}</App>,
       TestStubs.routerContext()