message: Convert BungieAlerts to hooks
diff: import { t } from 'app/i18next-t';
  -import React from 'react';
  +import React, { useState } from 'react';
  import { getGlobalAlerts, GlobalAlert } from '../bungie-api/bungie-core-api';
  import './BungieAlerts.scss';
  import { deepEqual } from 'fast-equals';
  import ExternalLink from '../dim-ui/ExternalLink';
  -import { timer, from, empty, Subscription } from 'rxjs';
  +import { timer, from, empty } from 'rxjs';
  import {
  switchMap,
  startWith,
  @@ -12,6 +12,7 @@ import {
  shareReplay,
  catchError
  } from 'rxjs/operators';
  +import { useSubscription } from 'app/utils/hooks';
  export const alerts$ = timer(0, 10 * 60 * 1000).pipe(
  // Fetch global alerts, but swallow errors
  @@ -22,32 +23,12 @@ export const alerts$ = timer(0, 10 * 60 * 1000).pipe(
  shareReplay()
  );
  -interface State {
  - alerts: GlobalAlert[];
  -}
  -
  /**
  * Displays maintenance alerts from Bungie.net.
  */
  -// TODO: How to mark that they've been "seen"?
  -export default class BungieAlerts extends React.Component<{}, State> {
  - private subscription: Subscription;
  -
  - constructor(props) {
  - super(props);
  - this.state = { alerts: [] };
  - }
  -
  - componentDidMount() {
  - this.subscription = alerts$.subscribe((alerts) => this.setState({ alerts }));
  - }
  -
  - componentWillUnmount() {
  - this.subscription.unsubscribe();
  - }
  -
  - render() {
  - const { alerts } = this.state;
  +export default function BungieAlerts() {
  + const [alerts, setAlerts] = useState<GlobalAlert[]>([]);
  + useSubscription(() => alerts$.subscribe(setAlerts));
  return (
  <div className="bungie-alerts">
  @@ -64,4 +45,3 @@ export default class BungieAlerts extends React.Component<{}, State> {
  </div>
  );
  }
  -}
  