Remove unnecessary mounted state from Home component (#13202)

The `mounted` state was used to derive state from props before the
first render of the Home component. Instead this state is now derived
in the constructor, which is also run before the first render. This
should behave exactly the same, except now we don't need the `mounted`
state or the `deriveStateFromProps` function anymore.

The call to `closeCurrentWindow` that was made in `componentDidUpdate`
has been moved to the constructor as well. There is no need to delay
that call, and this saves us from having to compare current with
previous state in that lifecycle function.

ui/pages/home/home.component.js

@@ -97,11 +97,44 @@ export default class Home extends PureComponent {
   };
 
   state = {
-    // eslint-disable-next-line react/no-unused-state
-    mounted: false,
     canShowBlockageNotification: true,
+    closing: false,
+    redirecting: false,
   };
 
+  constructor(props) {
+    super(props);
+
+    const {
+      firstPermissionsRequestId,
+      haveSwapsQuotes,
+      isNotification,
+      isSigningQRHardwareTransaction,
+      showAwaitingSwapScreen,
+      suggestedAssets = [],
+      swapsFetchParams,
+      totalUnapprovedCount,
+      unconfirmedTransactionsCount,
+    } = this.props;
+
+    if (
+      isNotification &&
+      totalUnapprovedCount === 0 &&
+      !isSigningQRHardwareTransaction
+    ) {
+      this.state.closing = true;
+      global.platform.closeCurrentWindow();
+    } else if (
+      firstPermissionsRequestId ||
+      unconfirmedTransactionsCount > 0 ||
+      suggestedAssets.length > 0 ||
+      (!isNotification &&
+        (showAwaitingSwapScreen || haveSwapsQuotes || swapsFetchParams))
+    ) {
+      this.state.redirecting = true;
+    }
+  }
+
   checkStatusAndNavigate() {
     const {
       firstPermissionsRequestId,
@@ -140,46 +173,10 @@ export default class Home extends PureComponent {
   }
 
   componentDidMount() {
-    // eslint-disable-next-line react/no-unused-state
-    this.setState({ mounted: true });
     this.checkStatusAndNavigate();
   }
 
-  static getDerivedStateFromProps(
-    {
-      firstPermissionsRequestId,
-      isNotification,
-      suggestedAssets,
-      totalUnapprovedCount,
-      unconfirmedTransactionsCount,
-      haveSwapsQuotes,
-      showAwaitingSwapScreen,
-      swapsFetchParams,
-      isSigningQRHardwareTransaction,
-    },
-    { mounted },
-  ) {
-    if (!mounted) {
-      if (
-        isNotification &&
-        totalUnapprovedCount === 0 &&
-        !isSigningQRHardwareTransaction
-      ) {
-        return { closing: true };
-      } else if (
-        firstPermissionsRequestId ||
-        unconfirmedTransactionsCount > 0 ||
-        suggestedAssets.length > 0 ||
-        (!isNotification &&
-          (showAwaitingSwapScreen || haveSwapsQuotes || swapsFetchParams))
-      ) {
-        return { redirecting: true };
-      }
-    }
-    return null;
-  }
-
-  componentDidUpdate(_, prevState) {
+  componentDidUpdate() {
     const {
       setupThreeBox,
       showRestorePrompt,
@@ -188,10 +185,6 @@ export default class Home extends PureComponent {
       isNotification,
     } = this.props;
 
-    if (!prevState.closing && this.state.closing) {
-      global.platform.closeCurrentWindow();
-    }
-
     isNotification && this.checkStatusAndNavigate();
 
     if (threeBoxSynced && showRestorePrompt && threeBoxLastUpdated === null) {