Use a modern React context for identity in the app (#30098)

app/javascript/mastodon/containers/mastodon.jsx

@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 
 import { Helmet } from 'react-helmet';
@@ -14,6 +13,7 @@ import { connectUserStream } from 'mastodon/actions/streaming';
 import ErrorBoundary from 'mastodon/components/error_boundary';
 import { Router } from 'mastodon/components/router';
 import UI from 'mastodon/features/ui';
+import { IdentityContext, createIdentityContext } from 'mastodon/identity_context';
 import initialState, { title as siteTitle } from 'mastodon/initial_state';
 import { IntlProvider } from 'mastodon/locales';
 import { store } from 'mastodon/store';
@@ -28,33 +28,9 @@ if (initialState.meta.me) {
   store.dispatch(fetchCustomEmojis());
 }
 
-const createIdentityContext = state => ({
-  signedIn: !!state.meta.me,
-  accountId: state.meta.me,
-  disabledAccountId: state.meta.disabled_account_id,
-  accessToken: state.meta.access_token,
-  permissions: state.role ? state.role.permissions : 0,
-});
-
 export default class Mastodon extends PureComponent {
-
-  static childContextTypes = {
-    identity: PropTypes.shape({
-      signedIn: PropTypes.bool.isRequired,
-      accountId: PropTypes.string,
-      disabledAccountId: PropTypes.string,
-      accessToken: PropTypes.string,
-    }).isRequired,
-  };
-
   identity = createIdentityContext(initialState);
 
-  getChildContext() {
-    return {
-      identity: this.identity,
-    };
-  }
-
   componentDidMount() {
     if (this.identity.signedIn) {
       this.disconnect = store.dispatch(connectUserStream());
@@ -74,19 +50,21 @@ export default class Mastodon extends PureComponent {
 
   render () {
     return (
-      <IntlProvider>
-        <ReduxProvider store={store}>
-          <ErrorBoundary>
-            <Router>
-              <ScrollContext shouldUpdateScroll={this.shouldUpdateScroll}>
-                <Route path='/' component={UI} />
-              </ScrollContext>
-            </Router>
+      <IdentityContext.Provider value={this.identity}>
+        <IntlProvider>
+          <ReduxProvider store={store}>
+            <ErrorBoundary>
+              <Router>
+                <ScrollContext shouldUpdateScroll={this.shouldUpdateScroll}>
+                  <Route path='/' component={UI} />
+                </ScrollContext>
+              </Router>
 
-            <Helmet defaultTitle={title} titleTemplate={`%s - ${title}`} />
-          </ErrorBoundary>
-        </ReduxProvider>
-      </IntlProvider>
+              <Helmet defaultTitle={title} titleTemplate={`%s - ${title}`} />
+            </ErrorBoundary>
+          </ReduxProvider>
+        </IntlProvider>
+      </IdentityContext.Provider>
     );
   }