Refactor AppUpgrade view to simplify UI logic

135 files changed, 743 insertions, 596 deletions

diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/AppUpgradeView.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/AppUpgradeView.tsx
index 29e509ca38..c25bbe2a3a 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/AppUpgradeView.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/AppUpgradeView.tsx
@@ -1,30 +1,10 @@
 import styled from 'styled-components';
 
-import { Flex } from '../../../lib/components';
 import { Animate } from '../../../lib/components/animate';
 import { useHistory } from '../../../lib/history';
 import { BackAction } from '../../KeyboardNavigation';
 import { Layout } from '../../Layout';
-import {
-  CancelButton,
-  DownloadProgress,
-  InstallButton,
-  ManualDownloadButton,
-  ReportProblemButton,
-  RetryUpgradeButton,
-  UpgradeButton,
-  UpgradeDetails,
-  UpgradeLabel,
-} from './components';
-import {
-  usePresent,
-  useShowCancelButton,
-  useShowInstallButton,
-  useShowManualDownloadButton,
-  useShowReportProblemButton,
-  useShowRetryUpgradeButton,
-  useShowUpgradeButton,
-} from './hooks';
+import { Footer, UpgradeDetails } from './components';
 
 const StyledFooter = styled.div`
   // TODO: Use color from Colors
@@ -36,35 +16,15 @@ const StyledFooter = styled.div`
 
 export const AppUpgradeView = () => {
   const { pop } = useHistory();
-  const present = usePresent();
-  const showCancelButton = useShowCancelButton();
-  const showInstallButton = useShowInstallButton();
-  const showManualDownloadButton = useShowManualDownloadButton();
-  const showReportProblemButton = useShowReportProblemButton();
-  const showRetryUpgradeButton = useShowRetryUpgradeButton();
-  const showUpgradeButton = useShowUpgradeButton();
 
   return (
     <BackAction action={pop}>
       <Layout>
         <UpgradeDetails />
         <StyledFooter>
-          <Flex $padding="large" $flexDirection="column">
-            <Animate animations={[{ type: 'wipe', direction: 'vertical' }]} present={present}>
-              <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
-                <UpgradeLabel />
-                <DownloadProgress />
-              </Flex>
-            </Animate>
-            <Flex $gap="medium" $flexDirection="column">
-              {showReportProblemButton && <ReportProblemButton />}
-              {showManualDownloadButton && <ManualDownloadButton />}
-              {showRetryUpgradeButton && <RetryUpgradeButton />}
-              {showUpgradeButton && <UpgradeButton />}
-              {showInstallButton && <InstallButton />}
-              {showCancelButton && <CancelButton />}
-            </Flex>
-          </Flex>
+          <Animate animations={[{ type: 'wipe', direction: 'vertical' }]} present>
+            <Footer />
+          </Animate>
         </StyledFooter>
       </Layout>
     </BackAction>
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/CancelButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/CancelButton.tsx
deleted file mode 100644
index b04e84ccbf..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/CancelButton.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { messages } from '../../../../../../shared/gettext';
-import { useAppContext } from '../../../../../context';
-import { Button } from '../../../../../lib/components';
-import { useDisabled } from './hooks';
-
-export function CancelButton() {
-  const disabled = useDisabled();
-  const { appUpgradeAbort } = useAppContext();
-
-  return (
-    <Button disabled={disabled} onClick={appUpgradeAbort}>
-      <Button.Text>
-        {
-          // TRANSLATORS: Button text to cancel the download of an update
-          messages.pgettext('app-upgrade-view', 'Cancel')
-        }
-      </Button.Text>
-    </Button>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/hooks/useDisabled.ts
deleted file mode 100644
index e6d8ccd1b5..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/hooks/useDisabled.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { useAppUpgradeEventType } from '../../../../../../hooks';
-
-export const useDisabled = () => {
-  const appUpgradeEventType = useAppUpgradeEventType();
-
-  switch (appUpgradeEventType) {
-    case 'APP_UPGRADE_STATUS_DOWNLOAD_INITIATED':
-    case 'APP_UPGRADE_STATUS_DOWNLOAD_PROGRESS':
-    case 'APP_UPGRADE_STATUS_DOWNLOAD_STARTED':
-      return false;
-    default:
-      return true;
-  }
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/index.ts
deleted file mode 100644
index 886c5b0107..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './CancelButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/connection-blocked-label/ConnectionBlockedLabel.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/connection-blocked-label/ConnectionBlockedLabel.tsx
new file mode 100644
index 0000000000..ce8ce10951
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/connection-blocked-label/ConnectionBlockedLabel.tsx
@@ -0,0 +1,20 @@
+import { messages } from '../../../../../../shared/gettext';
+import { Flex, LabelTiny } from '../../../../../lib/components';
+import { Dot } from '../../../../../lib/components/dot';
+
+export function ConnectionBlockedLabel() {
+  return (
+    <Flex $gap="small" $alignItems="baseline">
+      <Dot size="small" variant="error" />
+      <LabelTiny>
+        {
+          // TRANSLATORS: Label displayed when an error occurred due to the connection being blocked
+          messages.pgettext(
+            'app-upgrade-view',
+            'Connection blocked. Try changing server or other settings',
+          )
+        }
+      </LabelTiny>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/connection-blocked-label/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/connection-blocked-label/index.ts
new file mode 100644
index 0000000000..8363d2451f
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/connection-blocked-label/index.ts
@@ -0,0 +1 @@
+export * from './ConnectionBlockedLabel';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/DownloadProgress.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/DownloadProgress.tsx
index 9b6d3cef45..0bc31459c4 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/DownloadProgress.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/DownloadProgress.tsx
@@ -3,9 +3,9 @@ import { Progress } from '../../../../../lib/components/progress';
 import { useDisabled, useMessage } from './hooks';
 
 export function DownloadProgress() {
+  const disabled = useDisabled();
   const message = useMessage();
   const value = useAppUpgradeDownloadProgressValue();
-  const disabled = useDisabled();
 
   return (
     <Progress value={value} disabled={disabled}>
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useDisabled.ts
index 2f692ad9cd..66a057f615 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useDisabled.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useDisabled.ts
@@ -2,12 +2,12 @@ import { useAppUpgradeEventType, useHasAppUpgradeError } from '../../../../../..
 import { useConnectionIsBlocked } from '../../../../../../redux/hooks';
 
 export const useDisabled = () => {
+  const { isBlocked } = useConnectionIsBlocked();
   const appUpgradeEventType = useAppUpgradeEventType();
   const hasAppUpgradeError = useHasAppUpgradeError();
-  const { isBlocked } = useConnectionIsBlocked();
-  if (hasAppUpgradeError || isBlocked || appUpgradeEventType === 'APP_UPGRADE_STATUS_ABORTED') {
-    return true;
-  }
 
-  return false;
+  const disabled =
+    hasAppUpgradeError || isBlocked || appUpgradeEventType === 'APP_UPGRADE_STATUS_ABORTED';
+
+  return disabled;
 };
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageError.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageError.ts
index 8a0ef09ecb..d0db00e46b 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageError.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageError.ts
@@ -6,8 +6,8 @@ export const useGetMessageError = () => {
 
   const getMessageError = () => {
     if (
+      error === 'INSTALLER_FAILED' ||
       error === 'START_INSTALLER_FAILED' ||
-      error === 'START_INSTALLER_AUTOMATIC_FAILED' ||
       error === 'VERIFICATION_FAILED'
     ) {
       // TRANSLATORS: Status text displayed below a progress bar when the download of an update is complete
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageTimeLeft.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageTimeLeft.ts
index 81a36a42d9..7de6524d5e 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageTimeLeft.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/hooks/useGetMessageTimeLeft.ts
@@ -27,7 +27,7 @@ export const useGetMessageTimeLeft = () => {
           );
         }
 
-        if (timeLeft > 5) {
+        if (timeLeft > 3) {
           return sprintf(
             // TRANSLATORS: Status text displayed below a progress bar when the update is being downloaded
             // TRANSLATORS: Available placeholders:
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/useMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/useMessage.ts
index eef8230447..4a88ced67a 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/useMessage.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/download-progress/hooks/useMessage/useMessage.ts
@@ -1,5 +1,9 @@
 import { messages } from '../../../../../../../../shared/gettext';
-import { useAppUpgradeEventType, useHasAppUpgradeError } from '../../../../../../../hooks';
+import {
+  useAppUpgradeEventType,
+  useHasAppUpgradeError,
+  useHasAppUpgradeVerifiedInstallerPath,
+} from '../../../../../../../hooks';
 import { useConnectionIsBlocked } from '../../../../../../../redux/hooks';
 import { useGetMessageError, useGetMessageTimeLeft } from './hooks';
 
@@ -9,6 +13,11 @@ export const useMessage = () => {
   const getMessageError = useGetMessageError();
   const getMessageTimeLeft = useGetMessageTimeLeft();
   const hasAppUpgradeError = useHasAppUpgradeError();
+  const hasAppUpgradeVerifiedInstallerPath = useHasAppUpgradeVerifiedInstallerPath();
+
+  if (hasAppUpgradeVerifiedInstallerPath) {
+    return messages.pgettext('app-upgrade-view', 'Download complete!');
+  }
 
   if (isBlocked || appUpgradeEventType === 'APP_UPGRADE_STATUS_ABORTED') {
     // TRANSLATORS: Status text displayed below a progress bar when the download of an update has been paused
@@ -26,9 +35,11 @@ export const useMessage = () => {
       return messages.pgettext('app-upgrade-view', 'Starting download...');
     case 'APP_UPGRADE_STATUS_DOWNLOAD_PROGRESS':
       return getMessageTimeLeft();
+    case 'APP_UPGRADE_STATUS_AUTOMATIC_STARTING_INSTALLER':
     case 'APP_UPGRADE_STATUS_EXITED_INSTALLER':
+    case 'APP_UPGRADE_STATUS_MANUAL_START_INSTALLER':
+    case 'APP_UPGRADE_STATUS_MANUAL_STARTING_INSTALLER':
     case 'APP_UPGRADE_STATUS_STARTED_INSTALLER':
-    case 'APP_UPGRADE_STATUS_STARTING_INSTALLER':
     case 'APP_UPGRADE_STATUS_VERIFIED_INSTALLER':
     case 'APP_UPGRADE_STATUS_VERIFYING_INSTALLER':
       // TRANSLATORS: Status text displayed below a progress bar when the download of an update is complete
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/Footer.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/Footer.tsx
new file mode 100644
index 0000000000..fc27698407
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/Footer.tsx
@@ -0,0 +1,30 @@
+import {
+  DownloadFooter,
+  ErrorFooter,
+  InitialFooter,
+  LaunchFooter,
+  PauseFooter,
+  VerifyFooter,
+} from './components';
+import { useStep } from './hooks';
+
+export function Footer() {
+  const step = useStep();
+
+  switch (step) {
+    case 'download':
+      return <DownloadFooter />;
+    case 'error':
+      return <ErrorFooter />;
+    case 'initial':
+      return <InitialFooter />;
+    case 'launch':
+      return <LaunchFooter />;
+    case 'pause':
+      return <PauseFooter />;
+    case 'verify':
+      return <VerifyFooter />;
+    default:
+      return step satisfies never;
+  }
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/DownloadFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/DownloadFooter.tsx
new file mode 100644
index 0000000000..213110d2a0
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/DownloadFooter.tsx
@@ -0,0 +1,22 @@
+import { Flex } from '../../../../../../../lib/components';
+import { ConnectionBlockedLabel } from '../../../connection-blocked-label';
+import { DownloadProgress } from '../../../download-progress';
+import { DownloadLabel, PauseDownloadButton, ResumeDownloadButton } from './components';
+import { useShowConnectionBlockedLabel, useShowResumeDownloadButton } from './hooks';
+
+export function DownloadFooter() {
+  const showConnectionBlockedLabel = useShowConnectionBlockedLabel();
+  const showResumeDownloadButton = useShowResumeDownloadButton();
+
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        {showConnectionBlockedLabel ? <ConnectionBlockedLabel /> : <DownloadLabel />}
+        <DownloadProgress />
+      </Flex>
+      <Flex $flexDirection="column">
+        {showResumeDownloadButton ? <ResumeDownloadButton /> : <PauseDownloadButton />}
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/DownloadProgress.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/DownloadLabel.tsx
index 1a5a67541f..7bdc5a18bc 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/DownloadProgress.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/DownloadLabel.tsx
@@ -1,7 +1,7 @@
-import { LabelTiny } from '../../../../../../../lib/components';
+import { LabelTiny } from '../../../../../../../../../lib/components';
 import { useMessage } from './hooks';
 
-export function DownloadProgress() {
+export function DownloadLabel() {
   const message = useMessage();
 
   return <LabelTiny>{message}</LabelTiny>;
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/index.ts
new file mode 100644
index 0000000000..5f0470ee5b
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/index.ts
@@ -0,0 +1,2 @@
+export * from './useGetDownloadProgressMessage';
+export * from './useMessage';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/useGetDownloadProgressMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/useGetDownloadProgressMessage.ts
new file mode 100644
index 0000000000..17c98f849b
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/useGetDownloadProgressMessage.ts
@@ -0,0 +1,28 @@
+import { useCallback } from 'react';
+import { sprintf } from 'sprintf-js';
+
+import { messages } from '../../../../../../../../../../../shared/gettext';
+import { useAppUpgradeEvent } from '../../../../../../../../../../redux/hooks';
+
+export const useGetDownloadProgressMessage = () => {
+  const { event } = useAppUpgradeEvent();
+
+  const getDownloadProgressMessage = useCallback(() => {
+    if (event?.type === 'APP_UPGRADE_STATUS_DOWNLOAD_PROGRESS') {
+      const { server } = event;
+
+      return sprintf(
+        // TRANSLATORS: Label displayed above a progress bar informing the user which server
+        // TRANSLATORS: the update is downloading from
+        messages.pgettext('app-upgrade-view', 'Downloading from: %(server)s'),
+        {
+          server,
+        },
+      );
+    }
+
+    return null;
+  }, [event]);
+
+  return getDownloadProgressMessage;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/useMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/useMessage.ts
new file mode 100644
index 0000000000..db66bc7179
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/hooks/useMessage.ts
@@ -0,0 +1,19 @@
+import { messages } from '../../../../../../../../../../../shared/gettext';
+import { useAppUpgradeEventType } from '../../../../../../../../../../hooks';
+import { useGetDownloadProgressMessage } from './useGetDownloadProgressMessage';
+
+export const useMessage = () => {
+  const eventType = useAppUpgradeEventType();
+  const getDownloadProgressMessage = useGetDownloadProgressMessage();
+
+  switch (eventType) {
+    case 'APP_UPGRADE_STATUS_DOWNLOAD_INITIATED':
+    case 'APP_UPGRADE_STATUS_DOWNLOAD_STARTED':
+      // TRANSLATORS: Label displayed above a progress bar when a download is in progress
+      return messages.pgettext('app-upgrade-view', 'Downloading...');
+    case 'APP_UPGRADE_STATUS_DOWNLOAD_PROGRESS':
+      return getDownloadProgressMessage();
+    default:
+      return null;
+  }
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/index.ts
new file mode 100644
index 0000000000..3349460ac0
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/download-label/index.ts
@@ -0,0 +1 @@
+export * from './DownloadLabel';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/index.ts
new file mode 100644
index 0000000000..554101504a
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/index.ts
@@ -0,0 +1,3 @@
+export * from './download-label';
+export * from './pause-download-button';
+export * from './resume-download-button';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/pause-download-button/PauseDownloadButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/pause-download-button/PauseDownloadButton.tsx
new file mode 100644
index 0000000000..fd664b9879
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/pause-download-button/PauseDownloadButton.tsx
@@ -0,0 +1,13 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { PauseButton } from '../../../../../pause-button';
+
+export function PauseDownloadButton() {
+  return (
+    <PauseButton>
+      {
+        // TRANSLATORS: Button text to pause the download of an update
+        messages.pgettext('app-upgrade-view', 'Pause')
+      }
+    </PauseButton>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/pause-download-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/pause-download-button/index.ts
new file mode 100644
index 0000000000..251db80243
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/pause-download-button/index.ts
@@ -0,0 +1 @@
+export * from './PauseDownloadButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/resume-download-button/ResumeDownloadButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/resume-download-button/ResumeDownloadButton.tsx
new file mode 100644
index 0000000000..2fbf5f9d8b
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/resume-download-button/ResumeDownloadButton.tsx
@@ -0,0 +1,16 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { useConnectionIsBlocked } from '../../../../../../../../../redux/hooks';
+import { ResumeButton } from '../../../../../resume-button';
+
+export function ResumeDownloadButton() {
+  const { isBlocked } = useConnectionIsBlocked();
+
+  return (
+    <ResumeButton disabled={isBlocked}>
+      {
+        // TRANSLATORS: Button text to resume updating
+        messages.pgettext('app-upgrade-view', 'Resume')
+      }
+    </ResumeButton>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/resume-download-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/resume-download-button/index.ts
new file mode 100644
index 0000000000..6526c66726
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/components/resume-download-button/index.ts
@@ -0,0 +1 @@
+export * from './ResumeDownloadButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/index.ts
new file mode 100644
index 0000000000..b22696f48d
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/index.ts
@@ -0,0 +1,2 @@
+export * from './useShowResumeDownloadButton';
+export * from './useShowConnectionBlockedLabel';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/useShowConnectionBlockedLabel.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/useShowConnectionBlockedLabel.ts
new file mode 100644
index 0000000000..fc2ebff1a1
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/useShowConnectionBlockedLabel.ts
@@ -0,0 +1,9 @@
+import { useConnectionIsBlocked } from '../../../../../../../../redux/hooks';
+
+export const useShowConnectionBlockedLabel = () => {
+  const { isBlocked } = useConnectionIsBlocked();
+
+  const showConnectionBlocked = isBlocked;
+
+  return showConnectionBlocked;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/useShowResumeDownloadButton.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/useShowResumeDownloadButton.ts
new file mode 100644
index 0000000000..54718cc684
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/hooks/useShowResumeDownloadButton.ts
@@ -0,0 +1,11 @@
+import { useAppUpgradeEventType } from '../../../../../../../../hooks';
+import { useConnectionIsBlocked } from '../../../../../../../../redux/hooks';
+
+export const useShowResumeDownloadButton = () => {
+  const { isBlocked } = useConnectionIsBlocked();
+  const eventType = useAppUpgradeEventType();
+
+  const showResumeDownloadButton = eventType === 'APP_UPGRADE_STATUS_ABORTED' || isBlocked;
+
+  return showResumeDownloadButton;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/index.ts
new file mode 100644
index 0000000000..90939788f8
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/download-footer/index.ts
@@ -0,0 +1 @@
+export * from './DownloadFooter';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/ErrorFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/ErrorFooter.tsx
new file mode 100644
index 0000000000..7625cf4590
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/ErrorFooter.tsx
@@ -0,0 +1,30 @@
+import { Flex, Icon, LabelTiny } from '../../../../../../../lib/components';
+import { Colors } from '../../../../../../../lib/foundations';
+import { DownloadProgress } from '../../../download-progress';
+import { ManualDownloadButton, ReportProblemButton, RetryButton } from './components';
+import { useMessage, useShowManualDownloadButton } from './hooks';
+
+export function ErrorFooter() {
+  const message = useMessage();
+  const showManualDownloadButton = useShowManualDownloadButton();
+
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        <Flex $gap="tiny" $flexDirection="row">
+          <div>
+            <Icon size="small" icon="alert-circle" color={Colors.red} />
+          </div>
+          <Flex $flexDirection="column">
+            <LabelTiny>{message}</LabelTiny>
+          </Flex>
+        </Flex>
+        <DownloadProgress />
+      </Flex>
+      <Flex $gap="medium" $flexDirection="column">
+        <ReportProblemButton />
+        {showManualDownloadButton ? <ManualDownloadButton /> : <RetryButton />}
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/index.ts
new file mode 100644
index 0000000000..ad0a2b6c88
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/index.ts
@@ -0,0 +1,3 @@
+export * from './manual-download-button';
+export * from './report-problem-button';
+export * from './retry-button';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/ManualDownloadButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/ManualDownloadButton.tsx
index e130670446..0ea85159c8 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/ManualDownloadButton.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/ManualDownloadButton.tsx
@@ -1,15 +1,13 @@
-import { messages } from '../../../../../../shared/gettext';
-import { Button, Icon } from '../../../../../lib/components';
-import { useDisabled, useHandleClick } from './hooks';
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { Button } from '../../../../../../../../../lib/components';
+import { useHandleClick } from './hooks';
 
 export function ManualDownloadButton() {
-  const disabled = useDisabled();
   const handleClick = useHandleClick();
 
   return (
     <Button
       aria-description={messages.pgettext('accessibility', 'Opens externally')}
-      disabled={disabled}
       onClick={handleClick}>
       <Button.Text>
         {
@@ -17,7 +15,7 @@ export function ManualDownloadButton() {
           messages.pgettext('app-upgrade-view', 'Manual download')
         }
       </Button.Text>
-      <Icon icon="external" />
+      <Button.Icon icon="external" />
     </Button>
   );
 }
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/hooks/index.ts
index f0418cde6c..ea402d648a 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/hooks/index.ts
@@ -1,2 +1 @@
-export * from './useDisabled';
 export * from './useHandleClick';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/hooks/useHandleClick.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/hooks/useHandleClick.ts
new file mode 100644
index 0000000000..8fd9d4e27e
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/hooks/useHandleClick.ts
@@ -0,0 +1,18 @@
+import { useCallback } from 'react';
+
+import { getDownloadUrl } from '../../../../../../../../../../../shared/version';
+import { useAppContext } from '../../../../../../../../../../context';
+import { useVersionSuggestedIsBeta } from '../../../../../../../../../../redux/hooks';
+
+export const useHandleClick = () => {
+  const { suggestedIsBeta } = useVersionSuggestedIsBeta();
+  const { openUrl } = useAppContext();
+
+  const downloadUrl = getDownloadUrl(suggestedIsBeta);
+
+  const handleClick = useCallback(async () => {
+    await openUrl(downloadUrl);
+  }, [downloadUrl, openUrl]);
+
+  return handleClick;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/index.ts
index 11338008b7..11338008b7 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/manual-download-button/index.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/report-problem-button/ReportProblemButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/report-problem-button/ReportProblemButton.tsx
index eb4ee505ea..dcc7daf905 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/report-problem-button/ReportProblemButton.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/report-problem-button/ReportProblemButton.tsx
@@ -1,6 +1,6 @@
-import { messages } from '../../../../../../shared/gettext';
-import { usePushProblemReport } from '../../../../../history/hooks';
-import { Button } from '../../../../../lib/components';
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { usePushProblemReport } from '../../../../../../../../../history/hooks';
+import { Button } from '../../../../../../../../../lib/components';
 
 export function ReportProblemButton() {
   const pushProblemReport = usePushProblemReport({
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/report-problem-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/report-problem-button/index.ts
index 808f304f69..808f304f69 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/report-problem-button/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/report-problem-button/index.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/RetryButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/RetryButton.tsx
new file mode 100644
index 0000000000..1362742e3c
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/RetryButton.tsx
@@ -0,0 +1,18 @@
+import { useAppUpgradeError } from '../../../../../../../../../redux/hooks';
+import { RetryLaunchInstallerButton, RetryUpgradeButton } from './components';
+
+export function RetryButton() {
+  const { error } = useAppUpgradeError();
+
+  switch (error) {
+    case 'INSTALLER_FAILED':
+    case 'START_INSTALLER_FAILED':
+      return <RetryLaunchInstallerButton />;
+    case 'DOWNLOAD_FAILED':
+    case 'GENERAL_ERROR':
+    case 'VERIFICATION_FAILED':
+      return <RetryUpgradeButton />;
+    default:
+      return null;
+  }
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/index.ts
new file mode 100644
index 0000000000..c44ee15a58
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/index.ts
@@ -0,0 +1,2 @@
+export * from './retry-launch-installer-button';
+export * from './retry-upgrade-button';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/RetryLaunchInstallerButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/RetryLaunchInstallerButton.tsx
new file mode 100644
index 0000000000..13e236b52a
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/RetryLaunchInstallerButton.tsx
@@ -0,0 +1,16 @@
+import { messages } from '../../../../../../../../../../../../shared/gettext';
+import { LaunchInstallerButton } from '../../../../../../../launch-installer-button';
+import { useDisabled } from './hooks';
+
+export function RetryLaunchInstallerButton() {
+  const disabled = useDisabled();
+
+  return (
+    <LaunchInstallerButton disabled={disabled}>
+      {
+        // TRANSLATORS: Button text to try again
+        messages.pgettext('app-upgrade-view', 'Retry')
+      }
+    </LaunchInstallerButton>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/hooks/index.ts
index 73e963a519..73e963a519 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/cancel-button/hooks/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/hooks/index.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/hooks/useDisabled.ts
new file mode 100644
index 0000000000..8b31f7f3b2
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/hooks/useDisabled.ts
@@ -0,0 +1,9 @@
+import { useAppUpgradeEventType } from '../../../../../../../../../../../../hooks';
+
+export const useDisabled = () => {
+  const appUpgradeEventType = useAppUpgradeEventType();
+
+  const disabled = appUpgradeEventType === 'APP_UPGRADE_STATUS_MANUAL_STARTING_INSTALLER';
+
+  return disabled;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/index.ts
new file mode 100644
index 0000000000..21a96c63bc
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-launch-installer-button/index.ts
@@ -0,0 +1 @@
+export * from './RetryLaunchInstallerButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/RetryUpgradeButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/RetryUpgradeButton.tsx
new file mode 100644
index 0000000000..a609fd94e6
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/RetryUpgradeButton.tsx
@@ -0,0 +1,8 @@
+import { UpgradeButton } from '../../../../../../../upgrade-button';
+import { useMessage } from './hooks';
+
+export function RetryUpgradeButton() {
+  const message = useMessage();
+
+  return <UpgradeButton>{message}</UpgradeButton>;
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/hooks/index.ts
index 107ba71afc..107ba71afc 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/hooks/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/hooks/index.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/hooks/useMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/hooks/useMessage.ts
new file mode 100644
index 0000000000..faefc8ab79
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/hooks/useMessage.ts
@@ -0,0 +1,14 @@
+import { messages } from '../../../../../../../../../../../../../shared/gettext';
+import { useAppUpgradeError } from '../../../../../../../../../../../../redux/hooks';
+
+export const useMessage = () => {
+  const { error } = useAppUpgradeError();
+
+  if (error === 'DOWNLOAD_FAILED') {
+    // TRANSLATORS: Button text to try download again
+    return messages.pgettext('app-upgrade-view', 'Retry download');
+  }
+
+  // TRANSLATORS: Button text to try again
+  return messages.pgettext('app-upgrade-view', 'Retry');
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/index.ts
index 4aebbc2d17..4aebbc2d17 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/components/retry-upgrade-button/index.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/index.ts
new file mode 100644
index 0000000000..ab7c597651
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/components/retry-button/index.ts
@@ -0,0 +1 @@
+export * from './RetryButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/hooks/index.ts
new file mode 100644
index 0000000000..f0f15b2542
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/hooks/index.ts
@@ -0,0 +1,2 @@
+export * from './useMessage';
+export * from './useShowManualDownloadButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/hooks/useMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/hooks/useMessage.ts
index 597edc9db3..9adaabfab8 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/hooks/useMessage.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/hooks/useMessage.ts
@@ -27,13 +27,12 @@ export const useMessage = () => {
         'app-upgrade-view',
         'Installer encountered an error. Try again. If this problem persists, please contact support.',
       );
-    case 'START_INSTALLER_AUTOMATIC_FAILED':
     case 'START_INSTALLER_FAILED':
       // TRANSLATORS: Label displayed when an error occurred due to the installer failing to start
       // TRANSLATORS: and the suggested resolution is to download the update again.
       return messages.pgettext(
         'app-upgrade-view',
-        'Could not start the update installer, try downloading it again. If this problem persists, please contact support.',
+        'Could not start the update installer. Try again. If this problem persists, please contact support.',
       );
     case 'VERIFICATION_FAILED':
       // TRANSLATORS: Label displayed when an error occurred due to the installer failed verification
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowManualDownloadButton.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/hooks/useShowManualDownloadButton.ts
index 11c29837fd..2cbf54e48e 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowManualDownloadButton.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/hooks/useShowManualDownloadButton.ts
@@ -1,4 +1,4 @@
-import { useErrorCountExceeded } from './useErrorCountExceeded';
+import { useErrorCountExceeded } from '../../../../../hooks';
 
 export const useShowManualDownloadButton = () => {
   const errorCountExceeded = useErrorCountExceeded();
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/index.ts
new file mode 100644
index 0000000000..a91203d9e2
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/error-footer/index.ts
@@ -0,0 +1 @@
+export * from './ErrorFooter';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/index.ts
new file mode 100644
index 0000000000..bb40d3f2fa
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/index.ts
@@ -0,0 +1,6 @@
+export * from './download-footer';
+export * from './error-footer';
+export * from './initial-footer';
+export * from './launch-footer';
+export * from './pause-footer';
+export * from './verify-footer';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/InitialFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/InitialFooter.tsx
new file mode 100644
index 0000000000..5860dc5d7f
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/InitialFooter.tsx
@@ -0,0 +1,17 @@
+import { ConnectionBlocked, InstallerReady, StartUpgrade } from './components';
+import { useShowConnectionBlocked, useShowInstallerReady } from './hooks';
+
+export function InitialFooter() {
+  const showConnectionBlocked = useShowConnectionBlocked();
+  const showInstallerReady = useShowInstallerReady();
+
+  if (showInstallerReady) {
+    return <InstallerReady />;
+  }
+
+  if (showConnectionBlocked) {
+    return <ConnectionBlocked />;
+  }
+
+  return <StartUpgrade />;
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/connection-blocked/ConnectionBlocked.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/connection-blocked/ConnectionBlocked.tsx
new file mode 100644
index 0000000000..aefc17fbe7
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/connection-blocked/ConnectionBlocked.tsx
@@ -0,0 +1,24 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { Flex } from '../../../../../../../../../lib/components';
+import { ConnectionBlockedLabel } from '../../../../../connection-blocked-label';
+import { DownloadProgress } from '../../../../../download-progress';
+import { LaunchInstallerButton } from '../../../../../launch-installer-button';
+
+export function ConnectionBlocked() {
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        <ConnectionBlockedLabel />
+        <DownloadProgress />
+      </Flex>
+      <Flex $flexDirection="column">
+        <LaunchInstallerButton disabled>
+          {
+            // TRANSLATORS: Button text to install an update
+            messages.pgettext('app-upgrade-view', 'Install update')
+          }
+        </LaunchInstallerButton>
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/connection-blocked/index.ts
index c24311f6b3..c24311f6b3 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/connection-blocked/index.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/index.ts
new file mode 100644
index 0000000000..32f6ebddb2
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/index.ts
@@ -0,0 +1,3 @@
+export * from './connection-blocked';
+export * from './installer-ready';
+export * from './start-upgrade';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/InstallerReady.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/InstallerReady.tsx
new file mode 100644
index 0000000000..4ea07c816e
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/InstallerReady.tsx
@@ -0,0 +1,32 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { Flex, Icon, LabelTiny } from '../../../../../../../../../lib/components';
+import { Colors } from '../../../../../../../../../lib/foundations';
+import { DownloadProgress } from '../../../../../download-progress';
+import { LaunchInstallerButton } from '../../../../../launch-installer-button';
+
+export function InstallerReady() {
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        <Flex $gap="tiny" $alignItems="center">
+          <Icon icon="checkmark" color={Colors.green} size="small" />
+          <LabelTiny>
+            {
+              // TRANSLATORS: Label displayed above a progress bar when the update is verified successfully
+              messages.pgettext('app-upgrade-view', 'Verification successful!')
+            }
+          </LabelTiny>
+        </Flex>
+        <DownloadProgress />
+      </Flex>
+      <Flex $flexDirection="column">
+        <LaunchInstallerButton>
+          {
+            // TRANSLATORS: Button text to install an update
+            messages.pgettext('app-upgrade-view', 'Install update')
+          }
+        </LaunchInstallerButton>
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/installer-ready/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/index.ts
index ab9fed2358..ab9fed2358 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/installer-ready/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/installer-ready/index.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/start-upgrade/StartUpgrade.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/start-upgrade/StartUpgrade.tsx
new file mode 100644
index 0000000000..cf6f6562af
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/start-upgrade/StartUpgrade.tsx
@@ -0,0 +1,18 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { Flex } from '../../../../../../../../../lib/components';
+import { UpgradeButton } from '../../../../../upgrade-button';
+
+export function StartUpgrade() {
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $flexDirection="column">
+        <UpgradeButton>
+          {
+            // TRANSLATORS: Button text to download and install an update
+            messages.pgettext('app-upgrade-view', 'Download & install')
+          }
+        </UpgradeButton>
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/start-upgrade/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/start-upgrade/index.ts
new file mode 100644
index 0000000000..a68d15c4fa
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/components/start-upgrade/index.ts
@@ -0,0 +1 @@
+export * from './StartUpgrade';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/index.ts
new file mode 100644
index 0000000000..6e318620d7
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/index.ts
@@ -0,0 +1,2 @@
+export * from './useShowConnectionBlocked';
+export * from './useShowInstallerReady';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/useShowConnectionBlocked.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/useShowConnectionBlocked.ts
new file mode 100644
index 0000000000..8384c9cd9a
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/useShowConnectionBlocked.ts
@@ -0,0 +1,9 @@
+import { useConnectionIsBlocked } from '../../../../../../../../redux/hooks';
+
+export const useShowConnectionBlocked = () => {
+  const { isBlocked } = useConnectionIsBlocked();
+
+  const showConnectionBlocked = isBlocked;
+
+  return showConnectionBlocked;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/useShowInstallerReady.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/useShowInstallerReady.ts
new file mode 100644
index 0000000000..fce1837766
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/hooks/useShowInstallerReady.ts
@@ -0,0 +1,9 @@
+import { useHasAppUpgradeVerifiedInstallerPath } from '../../../../../../../../hooks';
+
+export const useShowInstallerReady = () => {
+  const hasAppUpgradeVerifiedInstallerPath = useHasAppUpgradeVerifiedInstallerPath();
+
+  const showInstallerReady = hasAppUpgradeVerifiedInstallerPath;
+
+  return showInstallerReady;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/index.ts
new file mode 100644
index 0000000000..a116a490b3
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/initial-footer/index.ts
@@ -0,0 +1 @@
+export * from './InitialFooter';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/LaunchFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/LaunchFooter.tsx
new file mode 100644
index 0000000000..c14fbfea12
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/LaunchFooter.tsx
@@ -0,0 +1,31 @@
+import { messages } from '../../../../../../../../shared/gettext';
+import { Flex, Icon, LabelTiny } from '../../../../../../../lib/components';
+import { Colors } from '../../../../../../../lib/foundations';
+import { DownloadProgress } from '../../../download-progress';
+import { LaunchInstallerButton } from '../../../launch-installer-button';
+import { useDisabled, useMessage } from './hooks';
+
+export function LaunchFooter() {
+  const disabled = useDisabled();
+  const message = useMessage();
+
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        <Flex $gap="tiny" $alignItems="center">
+          <Icon icon="checkmark" color={Colors.green} size="small" />
+          <LabelTiny>
+            {
+              // TRANSLATORS: Label displayed above a progress bar when the update is verified successfully
+              messages.pgettext('app-upgrade-view', 'Verification successful!')
+            }
+          </LabelTiny>
+        </Flex>
+        <DownloadProgress />
+      </Flex>
+      <Flex $flexDirection="column">
+        <LaunchInstallerButton disabled={disabled}>{message}</LaunchInstallerButton>
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/index.ts
index 73e963a519..081bb03213 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/hooks/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/index.ts
@@ -1 +1,2 @@
 export * from './useDisabled';
+export * from './useMessage';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/useDisabled.ts
new file mode 100644
index 0000000000..cca25cfe08
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/useDisabled.ts
@@ -0,0 +1,12 @@
+import { useAppUpgradeEventType } from '../../../../../../../../hooks';
+
+export const useDisabled = () => {
+  const eventType = useAppUpgradeEventType();
+
+  const disabled =
+    eventType === 'APP_UPGRADE_STATUS_AUTOMATIC_STARTING_INSTALLER' ||
+    eventType === 'APP_UPGRADE_STATUS_MANUAL_STARTING_INSTALLER' ||
+    eventType === 'APP_UPGRADE_STATUS_STARTED_INSTALLER';
+
+  return disabled;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/useMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/useMessage.ts
new file mode 100644
index 0000000000..ce07d0c1bf
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/hooks/useMessage.ts
@@ -0,0 +1,14 @@
+import { messages } from '../../../../../../../../../shared/gettext';
+import { useDisabled } from './useDisabled';
+
+export const useMessage = () => {
+  const disabled = useDisabled();
+
+  if (disabled) {
+    // TRANSLATORS: Button text to when starting the installer for an update
+    return messages.pgettext('app-upgrade-view', 'Starting installer...');
+  }
+
+  // TRANSLATORS: Button text to install an update
+  return messages.pgettext('app-upgrade-view', 'Install update');
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/index.ts
new file mode 100644
index 0000000000..2316de43eb
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/launch-footer/index.ts
@@ -0,0 +1 @@
+export * from './LaunchFooter';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/PauseFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/PauseFooter.tsx
new file mode 100644
index 0000000000..d55dea497f
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/PauseFooter.tsx
@@ -0,0 +1,12 @@
+import { ConnectionBlocked, ResumeUpgrade } from './components';
+import { useShowConnectionBlocked } from './hooks';
+
+export function PauseFooter() {
+  const showConnectionBlocked = useShowConnectionBlocked();
+
+  if (showConnectionBlocked) {
+    return <ConnectionBlocked />;
+  }
+
+  return <ResumeUpgrade />;
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/connection-blocked/ConnectionBlocked.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/connection-blocked/ConnectionBlocked.tsx
new file mode 100644
index 0000000000..96909c2a15
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/connection-blocked/ConnectionBlocked.tsx
@@ -0,0 +1,24 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { Flex } from '../../../../../../../../../lib/components';
+import { ConnectionBlockedLabel } from '../../../../../connection-blocked-label';
+import { DownloadProgress } from '../../../../../download-progress';
+import { ResumeButton } from '../../../../../resume-button';
+
+export function ConnectionBlocked() {
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        <ConnectionBlockedLabel />
+        <DownloadProgress />
+      </Flex>
+      <Flex $flexDirection="column">
+        <ResumeButton disabled>
+          {
+            // TRANSLATORS: Button text to resume updating
+            messages.pgettext('app-upgrade-view', 'Resume')
+          }
+        </ResumeButton>
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/connection-blocked/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/connection-blocked/index.ts
new file mode 100644
index 0000000000..c24311f6b3
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/connection-blocked/index.ts
@@ -0,0 +1 @@
+export * from './ConnectionBlocked';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/index.ts
new file mode 100644
index 0000000000..32d7f6aa0b
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/index.ts
@@ -0,0 +1,2 @@
+export * from './connection-blocked';
+export * from './resume-upgrade';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/resume-upgrade/ResumeUpgrade.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/resume-upgrade/ResumeUpgrade.tsx
new file mode 100644
index 0000000000..8f2fc26879
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/resume-upgrade/ResumeUpgrade.tsx
@@ -0,0 +1,28 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { Flex, LabelTiny } from '../../../../../../../../../lib/components';
+import { DownloadProgress } from '../../../../../download-progress';
+import { ResumeButton } from '../../../../../resume-button';
+
+export function ResumeUpgrade() {
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        <LabelTiny>
+          {
+            // TRANSLATORS: Label displayed above a progress bar when the update is verified successfully
+            messages.pgettext('app-upgrade-view', 'Download paused')
+          }
+        </LabelTiny>
+        <DownloadProgress />
+      </Flex>
+      <Flex $flexDirection="column">
+        <ResumeButton>
+          {
+            // TRANSLATORS: Button text to resume updating
+            messages.pgettext('app-upgrade-view', 'Resume')
+          }
+        </ResumeButton>
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/resume-upgrade/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/resume-upgrade/index.ts
new file mode 100644
index 0000000000..66ce331576
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/components/resume-upgrade/index.ts
@@ -0,0 +1 @@
+export * from './ResumeUpgrade';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/index.ts
new file mode 100644
index 0000000000..6e318620d7
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/index.ts
@@ -0,0 +1,2 @@
+export * from './useShowConnectionBlocked';
+export * from './useShowInstallerReady';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/useShowConnectionBlocked.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/useShowConnectionBlocked.ts
new file mode 100644
index 0000000000..8384c9cd9a
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/useShowConnectionBlocked.ts
@@ -0,0 +1,9 @@
+import { useConnectionIsBlocked } from '../../../../../../../../redux/hooks';
+
+export const useShowConnectionBlocked = () => {
+  const { isBlocked } = useConnectionIsBlocked();
+
+  const showConnectionBlocked = isBlocked;
+
+  return showConnectionBlocked;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/useShowInstallerReady.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/useShowInstallerReady.ts
new file mode 100644
index 0000000000..fce1837766
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/hooks/useShowInstallerReady.ts
@@ -0,0 +1,9 @@
+import { useHasAppUpgradeVerifiedInstallerPath } from '../../../../../../../../hooks';
+
+export const useShowInstallerReady = () => {
+  const hasAppUpgradeVerifiedInstallerPath = useHasAppUpgradeVerifiedInstallerPath();
+
+  const showInstallerReady = hasAppUpgradeVerifiedInstallerPath;
+
+  return showInstallerReady;
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/index.ts
new file mode 100644
index 0000000000..d44a21614c
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/pause-footer/index.ts
@@ -0,0 +1 @@
+export * from './PauseFooter';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/VerifyFooter.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/VerifyFooter.tsx
new file mode 100644
index 0000000000..a44548e642
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/VerifyFooter.tsx
@@ -0,0 +1,31 @@
+import { messages } from '../../../../../../../../shared/gettext';
+import { Flex, LabelTiny, Spinner } from '../../../../../../../lib/components';
+import { DownloadProgress } from '../../../download-progress';
+import { PauseButton } from '../../../pause-button';
+
+export function VerifyFooter() {
+  return (
+    <Flex $padding="large" $flexDirection="column">
+      <Flex $gap="medium" $flexDirection="column" $margin={{ bottom: 'medium' }}>
+        <Flex $gap="tiny" $alignItems="center">
+          <Spinner size="small" />
+          <LabelTiny>
+            {
+              // TRANSLATORS: Label displayed above a progress bar when the update is being verified
+              messages.pgettext('app-upgrade-view', 'Verifying installer...')
+            }
+          </LabelTiny>
+        </Flex>
+        <DownloadProgress />
+      </Flex>
+      <Flex $flexDirection="column">
+        <PauseButton disabled>
+          {
+            // TRANSLATORS: Button text to pause the download of an update
+            messages.pgettext('app-upgrade-view', 'Pause')
+          }
+        </PauseButton>
+      </Flex>
+    </Flex>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/index.ts
new file mode 100644
index 0000000000..4dc62c15da
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/index.ts
@@ -0,0 +1 @@
+export * from './pause-button';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/pause-button/PauseButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/pause-button/PauseButton.tsx
new file mode 100644
index 0000000000..7b029a7368
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/pause-button/PauseButton.tsx
@@ -0,0 +1,18 @@
+import { messages } from '../../../../../../../../../../shared/gettext';
+import { useAppContext } from '../../../../../../../../../context';
+import { Button } from '../../../../../../../../../lib/components';
+
+export function PauseButton() {
+  const { appUpgradeAbort } = useAppContext();
+
+  return (
+    <Button disabled onClick={appUpgradeAbort}>
+      <Button.Text>
+        {
+          // TRANSLATORS: Button text to pause the download of an update
+          messages.pgettext('app-upgrade-view', 'Pause')
+        }
+      </Button.Text>
+    </Button>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/pause-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/pause-button/index.ts
new file mode 100644
index 0000000000..dccc1184a8
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/components/pause-button/index.ts
@@ -0,0 +1 @@
+export * from './PauseButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/index.ts
new file mode 100644
index 0000000000..9a0b44ab0c
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/components/verify-footer/index.ts
@@ -0,0 +1 @@
+export * from './VerifyFooter';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/hooks/index.ts
new file mode 100644
index 0000000000..4d2feba819
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/hooks/index.ts
@@ -0,0 +1 @@
+export * from './useStep';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/hooks/useStep.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/hooks/useStep.ts
new file mode 100644
index 0000000000..df62d598ee
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/hooks/useStep.ts
@@ -0,0 +1,14 @@
+import { AppUpgradeStep } from '../../../../../../../shared/app-upgrade';
+import { useAppUpgradeEventType, useHasAppUpgradeError } from '../../../../../../hooks';
+import { convertEventTypeToStep } from '../../../../../../redux/app-upgrade/helpers';
+
+export const useStep = (): AppUpgradeStep => {
+  const eventType = useAppUpgradeEventType();
+  const hasAppUpgradeError = useHasAppUpgradeError();
+
+  if (hasAppUpgradeError) {
+    return 'error';
+  }
+
+  return convertEventTypeToStep(eventType);
+};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/index.ts
new file mode 100644
index 0000000000..ddcc5a9cd1
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/footer/index.ts
@@ -0,0 +1 @@
+export * from './Footer';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/index.ts
index 993e7ce8ce..f90ad28315 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/index.ts
@@ -1,9 +1,8 @@
-export * from './cancel-button';
+export * from './connection-blocked-label';
 export * from './download-progress';
-export * from './install-button';
-export * from './manual-download-button';
-export * from './report-problem-button';
-export * from './retry-upgrade-button';
+export * from './footer';
+export * from './launch-installer-button';
+export * from './pause-button';
+export * from './resume-button';
 export * from './upgrade-button';
 export * from './upgrade-details';
-export * from './upgrade-label';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/hooks/useDisabled.ts
deleted file mode 100644
index 455421be39..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/hooks/useDisabled.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { useAppUpgradeEventType } from '../../../../../../hooks';
-
-export const useDisabled = () => {
-  const appUpgradeEventType = useAppUpgradeEventType();
-
-  const disabled =
-    appUpgradeEventType === 'APP_UPGRADE_STATUS_STARTING_INSTALLER' ||
-    appUpgradeEventType === 'APP_UPGRADE_STATUS_STARTED_INSTALLER';
-
-  return disabled;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/index.ts
deleted file mode 100644
index 5e616d2943..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './InstallButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/InstallButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/launch-installer-button/LaunchInstallerButton.tsx
index 151eb183bc..b27be2327d 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/install-button/InstallButton.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/launch-installer-button/LaunchInstallerButton.tsx
@@ -1,19 +1,21 @@
 import { messages } from '../../../../../../shared/gettext';
 import { useAppContext } from '../../../../../context';
 import { Button } from '../../../../../lib/components';
-import { useDisabled } from './hooks';
 
-export function InstallButton() {
+export type LaunchInstallerButtonProps = {
+  children?: React.ReactNode;
+  disabled?: boolean;
+};
+
+export function LaunchInstallerButton({ children, disabled }: LaunchInstallerButtonProps) {
   const { appUpgradeInstallerStart } = useAppContext();
-  const disabled = useDisabled();
 
   return (
     <Button disabled={disabled} onClick={appUpgradeInstallerStart}>
       <Button.Text>
-        {
+        {children ||
           // TRANSLATORS: Button text to install an update
-          messages.pgettext('app-upgrade-view', 'Install update')
-        }
+          messages.pgettext('app-upgrade-view', 'Install update')}
       </Button.Text>
     </Button>
   );
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/launch-installer-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/launch-installer-button/index.ts
new file mode 100644
index 0000000000..3b631732be
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/launch-installer-button/index.ts
@@ -0,0 +1 @@
+export * from './LaunchInstallerButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/useDisabled.ts
deleted file mode 100644
index e41c5b12ff..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/useDisabled.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { useConnectionIsBlocked } from '../../../../../../redux/hooks';
-
-export const useDisabled = () => {
-  const { isBlocked } = useConnectionIsBlocked();
-
-  const disabled = isBlocked;
-
-  return disabled;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/useHandleClick.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/useHandleClick.ts
deleted file mode 100644
index 2f844c7bee..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/manual-download-button/hooks/useHandleClick.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { useCallback } from 'react';
-
-import { getDownloadUrl } from '../../../../../../../shared/version';
-import { useAppContext } from '../../../../../../context';
-import { useVersionSuggestedIsBeta } from '../../../../../../redux/hooks';
-
-export const useHandleClick = () => {
-  const { suggestedIsBeta } = useVersionSuggestedIsBeta();
-  const { openUrl } = useAppContext();
-
-  const handleClick = useCallback(async () => {
-    await openUrl(getDownloadUrl(suggestedIsBeta));
-  }, [openUrl, suggestedIsBeta]);
-
-  return handleClick;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/pause-button/PauseButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/pause-button/PauseButton.tsx
new file mode 100644
index 0000000000..37c820ca3e
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/pause-button/PauseButton.tsx
@@ -0,0 +1,17 @@
+import { useAppContext } from '../../../../../context';
+import { Button } from '../../../../../lib/components';
+
+export type PauseButtonProps = {
+  children?: React.ReactNode;
+  disabled?: boolean;
+};
+
+export function PauseButton({ children, disabled }: PauseButtonProps) {
+  const { appUpgradeAbort } = useAppContext();
+
+  return (
+    <Button disabled={disabled} onClick={appUpgradeAbort}>
+      <Button.Text>{children}</Button.Text>
+    </Button>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/pause-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/pause-button/index.ts
new file mode 100644
index 0000000000..dccc1184a8
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/pause-button/index.ts
@@ -0,0 +1 @@
+export * from './PauseButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/resume-button/ResumeButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/resume-button/ResumeButton.tsx
new file mode 100644
index 0000000000..cf367d80b6
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/resume-button/ResumeButton.tsx
@@ -0,0 +1,17 @@
+import { useAppContext } from '../../../../../context';
+import { Button } from '../../../../../lib/components';
+
+export type ResumeButtonProps = {
+  children?: React.ReactNode;
+  disabled?: boolean;
+};
+
+export function ResumeButton({ children, disabled }: ResumeButtonProps) {
+  const { appUpgrade } = useAppContext();
+
+  return (
+    <Button disabled={disabled} onClick={appUpgrade}>
+      <Button.Text>{children}</Button.Text>
+    </Button>
+  );
+}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/resume-button/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/resume-button/index.ts
new file mode 100644
index 0000000000..9167f9ef68
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/resume-button/index.ts
@@ -0,0 +1 @@
+export * from './ResumeButton';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/RetryUpgradeButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/RetryUpgradeButton.tsx
deleted file mode 100644
index 4062d1ee6b..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/RetryUpgradeButton.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { messages } from '../../../../../../shared/gettext';
-import { useAppContext } from '../../../../../context';
-import { Button } from '../../../../../lib/components';
-import { useDisabled } from './hooks';
-
-export function RetryUpgradeButton() {
-  const { appUpgrade } = useAppContext();
-  const disabled = useDisabled();
-
-  return (
-    <Button disabled={disabled} onClick={appUpgrade}>
-      <Button.Text>
-        {
-          // TRANSLATORS: Button text to retry updating
-          messages.pgettext('app-upgrade-view', 'Retry')
-        }
-      </Button.Text>
-    </Button>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/hooks/index.ts
deleted file mode 100644
index 73e963a519..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/hooks/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './useDisabled';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/hooks/useDisabled.ts
deleted file mode 100644
index e41c5b12ff..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/retry-upgrade-button/hooks/useDisabled.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { useConnectionIsBlocked } from '../../../../../../redux/hooks';
-
-export const useDisabled = () => {
-  const { isBlocked } = useConnectionIsBlocked();
-
-  const disabled = isBlocked;
-
-  return disabled;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/UpgradeButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/UpgradeButton.tsx
index dc5e8eb441..625332b858 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/UpgradeButton.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/UpgradeButton.tsx
@@ -1,20 +1,17 @@
-import { messages } from '../../../../../../shared/gettext';
 import { useAppContext } from '../../../../../context';
 import { Button } from '../../../../../lib/components';
-import { useDisabled } from './hooks';
 
-export function UpgradeButton() {
+export type UpgradeButtonProps = {
+  children?: React.ReactNode;
+  disabled?: boolean;
+};
+
+export function UpgradeButton({ children, disabled }: UpgradeButtonProps) {
   const { appUpgrade } = useAppContext();
-  const disabled = useDisabled();
 
   return (
     <Button disabled={disabled} onClick={appUpgrade}>
-      <Button.Text>
-        {
-          // TRANSLATORS: Button text to download and install an update
-          messages.pgettext('app-upgrade-view', 'Download & install')
-        }
-      </Button.Text>
+      <Button.Text>{children}</Button.Text>
     </Button>
   );
 }
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/hooks/index.ts
deleted file mode 100644
index 73e963a519..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/hooks/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './useDisabled';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/hooks/useDisabled.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/hooks/useDisabled.ts
deleted file mode 100644
index e41c5b12ff..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-button/hooks/useDisabled.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { useConnectionIsBlocked } from '../../../../../../redux/hooks';
-
-export const useDisabled = () => {
-  const { isBlocked } = useConnectionIsBlocked();
-
-  const disabled = isBlocked;
-
-  return disabled;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/UpgradeDetails.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/UpgradeDetails.tsx
index 00cc856c6c..cac6f59b9c 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/UpgradeDetails.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/UpgradeDetails.tsx
@@ -6,12 +6,11 @@ import { SettingsContainer } from '../../../../Layout';
 import { NavigationContainer } from '../../../../NavigationContainer';
 import { NavigationScrollbars } from '../../../../NavigationScrollbars';
 import { NoChangelogUpdates } from './components';
-import { useChangelog, useShowChangelogList, useShowNoChangelogUpdates, useTitle } from './hooks';
+import { useChangelog, useShowChangelogList, useTitle } from './hooks';
 
 export function UpgradeDetails() {
   const changelog = useChangelog();
   const showChangelogList = useShowChangelogList();
-  const showNoChangelogUpdates = useShowNoChangelogUpdates();
   const title = useTitle();
 
   return (
@@ -38,8 +37,11 @@ export function UpgradeDetails() {
                 <TitleLarge as="h2">{title}</TitleLarge>
               </Container>
               <Container size="3" $flexDirection="column">
-                {showChangelogList && <ChangelogList changelog={changelog} />}
-                {showNoChangelogUpdates && <NoChangelogUpdates />}
+                {showChangelogList ? (
+                  <ChangelogList changelog={changelog} />
+                ) : (
+                  <NoChangelogUpdates />
+                )}
               </Container>
             </Flex>
           </Flex>
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/index.ts
index 91bafea1fb..41cfba9f0a 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/index.ts
@@ -1,5 +1,3 @@
 export * from './useChangelog';
-export * from './useHasChangelog';
 export * from './useShowChangelogList';
-export * from './useShowNoChangelogUpdates';
 export * from './useTitle';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useHasChangelog.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useHasChangelog.ts
deleted file mode 100644
index b1e232122a..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useHasChangelog.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { useChangelog } from './useChangelog';
-
-export const useHasChangelog = () => {
-  const changelog = useChangelog();
-
-  const hasChangeLog = changelog.length > 0;
-
-  return hasChangeLog;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useShowChangelogList.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useShowChangelogList.ts
index 10aa854c15..d71289c21d 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useShowChangelogList.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useShowChangelogList.ts
@@ -1,9 +1,9 @@
-import { useHasChangelog } from './useHasChangelog';
+import { useChangelog } from './useChangelog';
 
 export const useShowChangelogList = () => {
-  const hasChangelog = useHasChangelog();
+  const changeLog = useChangelog();
 
-  const showChangelogList = hasChangelog;
+  const showChangelogList = changeLog.length > 0;
 
   return showChangelogList;
 };
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useShowNoChangelogUpdates.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useShowNoChangelogUpdates.ts
deleted file mode 100644
index cc30f5c5ac..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-details/hooks/useShowNoChangelogUpdates.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { useHasChangelog } from './useHasChangelog';
-
-export const useShowNoChangelogUpdates = () => {
-  const hasChangelog = useHasChangelog();
-
-  const showNoChangelogUpdates = !hasChangelog;
-
-  return showNoChangelogUpdates;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/UpgradeLabel.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/UpgradeLabel.tsx
deleted file mode 100644
index 28ceed22a8..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/UpgradeLabel.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import {
-  useAppUpgradeEventType,
-  useHasAppUpgradeError,
-  useShouldAppUpgradeInstallManually,
-} from '../../../../../hooks';
-import { useConnectionIsBlocked } from '../../../../../redux/hooks';
-import {
-  ConnectionBlocked,
-  DownloadProgress,
-  DownloadStarted,
-  InstallerReady,
-  StartingInstaller,
-  UpgradeError,
-  VerifyingInstaller,
-} from './components';
-
-export function UpgradeLabel() {
-  const { isBlocked } = useConnectionIsBlocked();
-  const appUpgradeEventType = useAppUpgradeEventType();
-  const hasAppUpgradeError = useHasAppUpgradeError();
-  const shouldAppUpgradeInstallManually = useShouldAppUpgradeInstallManually();
-
-  if (shouldAppUpgradeInstallManually) {
-    return <InstallerReady />;
-  }
-
-  if (isBlocked) {
-    return <ConnectionBlocked />;
-  }
-
-  if (hasAppUpgradeError) {
-    return <UpgradeError />;
-  }
-
-  switch (appUpgradeEventType) {
-    case 'APP_UPGRADE_STATUS_DOWNLOAD_INITIATED':
-    case 'APP_UPGRADE_STATUS_DOWNLOAD_STARTED':
-      return <DownloadStarted />;
-    case 'APP_UPGRADE_STATUS_DOWNLOAD_PROGRESS':
-      return <DownloadProgress />;
-    case 'APP_UPGRADE_STATUS_VERIFYING_INSTALLER':
-      return <VerifyingInstaller />;
-    case 'APP_UPGRADE_STATUS_STARTED_INSTALLER':
-    case 'APP_UPGRADE_STATUS_STARTING_INSTALLER':
-    case 'APP_UPGRADE_STATUS_VERIFIED_INSTALLER':
-      return <StartingInstaller />;
-    default:
-      return null;
-  }
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/ConnectionBlocked.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/ConnectionBlocked.tsx
deleted file mode 100644
index 4eb3f03afa..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/ConnectionBlocked.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import { Flex, LabelTiny } from '../../../../../../../lib/components';
-import { Dot } from '../../../../../../../lib/components/dot';
-import { useMessage } from './hooks';
-
-export function ConnectionBlocked() {
-  const message = useMessage();
-
-  return (
-    <Flex $gap="small" $alignItems="baseline">
-      <Dot size="small" variant="error" />
-      <LabelTiny>{message}</LabelTiny>
-    </Flex>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/hooks/useMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/hooks/useMessage.ts
deleted file mode 100644
index 60c619ff6d..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/connection-blocked/hooks/useMessage.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { messages } from '../../../../../../../../../shared/gettext';
-import { useConnectionIsBlocked } from '../../../../../../../../redux/hooks';
-
-export const useMessage = () => {
-  const { isBlocked } = useConnectionIsBlocked();
-
-  if (isBlocked) {
-    // TRANSLATORS: Label displayed when an error occurred due to the connection being blocked
-    return messages.pgettext(
-      'app-upgrade-view',
-      'Connection blocked. Try changing server or other settings',
-    );
-  }
-
-  return null;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/hooks/index.ts
deleted file mode 100644
index 107ba71afc..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/hooks/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './useMessage';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/hooks/useMessage.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/hooks/useMessage.ts
deleted file mode 100644
index 9da81085d8..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/hooks/useMessage.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import { sprintf } from 'sprintf-js';
-
-import { messages } from '../../../../../../../../../shared/gettext';
-import { useAppUpgradeEvent } from '../../../../../../../../redux/hooks';
-
-export const useMessage = () => {
-  const { event } = useAppUpgradeEvent();
-
-  if (event?.type === 'APP_UPGRADE_STATUS_DOWNLOAD_PROGRESS') {
-    const { server } = event;
-
-    return sprintf(
-      // TRANSLATORS: Label displayed above a progress bar informing the user which server
-      // TRANSLATORS: the update is downloading from
-      messages.pgettext('app-upgrade-view', 'Downloading from: %(server)s'),
-      {
-        server,
-      },
-    );
-  }
-
-  return null;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/index.ts
deleted file mode 100644
index 213bb26f82..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-progress/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './DownloadProgress';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-started/DownloadStarted.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-started/DownloadStarted.tsx
deleted file mode 100644
index 4fbe251f0f..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-started/DownloadStarted.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { messages } from '../../../../../../../../shared/gettext';
-import { LabelTiny } from '../../../../../../../lib/components';
-
-export function DownloadStarted() {
-  return (
-    <LabelTiny>
-      {
-        // TRANSLATORS: Label displayed above a progress bar when a download is in progress
-        messages.pgettext('app-upgrade-view', 'Downloading...')
-      }
-    </LabelTiny>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-started/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-started/index.ts
deleted file mode 100644
index ed30650883..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/download-started/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './DownloadStarted';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/index.ts
deleted file mode 100644
index e10fc7e8ae..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export * from './connection-blocked';
-export * from './download-progress';
-export * from './download-started';
-export * from './installer-ready';
-export * from './starting-installer';
-export * from './upgrade-error';
-export * from './verifying-installer';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/installer-ready/InstallerReady.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/installer-ready/InstallerReady.tsx
deleted file mode 100644
index 928148bdfa..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/installer-ready/InstallerReady.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { messages } from '../../../../../../../../shared/gettext';
-import { Flex, Icon, LabelTiny } from '../../../../../../../lib/components';
-import { Colors } from '../../../../../../../lib/foundations';
-
-export function InstallerReady() {
-  return (
-    <Flex $gap="tiny" $alignItems="center">
-      <Icon icon="checkmark" color={Colors.green} size="small" />
-      <LabelTiny>
-        {
-          // TRANSLATORS: Label displayed above a progress bar when the update is ready to be installed
-          messages.pgettext('app-upgrade-view', 'Verification successful! Ready to install.')
-        }
-      </LabelTiny>
-    </Flex>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/starting-installer/StartingInstaller.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/starting-installer/StartingInstaller.tsx
deleted file mode 100644
index 201fbe055e..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/starting-installer/StartingInstaller.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { messages } from '../../../../../../../../shared/gettext';
-import { Flex, Icon, LabelTiny } from '../../../../../../../lib/components';
-import { Colors } from '../../../../../../../lib/foundations';
-
-export function StartingInstaller() {
-  return (
-    <Flex $gap="tiny" $alignItems="center">
-      <Icon icon="checkmark" color={Colors.green} size="small" />
-      <LabelTiny>
-        {
-          // TRANSLATORS: Label displayed above a progress bar when the update is ready to be installed
-          messages.pgettext('app-upgrade-view', 'Verification successful! Starting installer...')
-        }
-      </LabelTiny>
-    </Flex>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/starting-installer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/starting-installer/index.ts
deleted file mode 100644
index f324d568b0..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/starting-installer/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './StartingInstaller';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/UpgradeError.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/UpgradeError.tsx
deleted file mode 100644
index 08aa409580..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/UpgradeError.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { Flex, Icon, LabelTiny } from '../../../../../../../lib/components';
-import { Colors } from '../../../../../../../lib/foundations';
-import { useMessage } from './hooks';
-
-export function UpgradeError() {
-  const message = useMessage();
-
-  return (
-    <Flex $gap="tiny" $flexDirection="row">
-      <div>
-        <Icon size="small" icon="alert-circle" color={Colors.red} />
-      </div>
-      <Flex $flexDirection="column">
-        <LabelTiny>{message}</LabelTiny>
-      </Flex>
-    </Flex>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/hooks/index.ts
deleted file mode 100644
index 107ba71afc..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/hooks/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './useMessage';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/index.ts
deleted file mode 100644
index 91d0d9f595..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/upgrade-error/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './UpgradeError';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/verifying-installer/VerifyingInstaller.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/verifying-installer/VerifyingInstaller.tsx
deleted file mode 100644
index bcf2015372..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/verifying-installer/VerifyingInstaller.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { messages } from '../../../../../../../../shared/gettext';
-import { Flex, LabelTiny, Spinner } from '../../../../../../../lib/components';
-
-export function VerifyingInstaller() {
-  return (
-    <Flex $gap="tiny" $alignItems="center">
-      <Spinner size="small" />
-      <LabelTiny>
-        {
-          // TRANSLATORS: Label displayed above a progress bar when the update is being verified
-          messages.pgettext('app-upgrade-view', 'Verifying installer...')
-        }
-      </LabelTiny>
-    </Flex>
-  );
-}
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/verifying-installer/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/verifying-installer/index.ts
deleted file mode 100644
index 29fba8f5bb..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/components/verifying-installer/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './VerifyingInstaller';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/index.ts
deleted file mode 100644
index fa5638908e..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/components/upgrade-label/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './UpgradeLabel';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/index.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/index.ts
index 44a2f96a21..edb9a49686 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/index.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/index.ts
@@ -1,10 +1 @@
 export * from './useErrorCountExceeded';
-export * from './usePresent';
-export * from './useShowCancelButton';
-export * from './useShowDownloadProgress';
-export * from './useShowInstallButton';
-export * from './useShowManualDownloadButton';
-export * from './useShowReportProblemButton';
-export * from './useShowRetryUpgradeButton';
-export * from './useShowUpgradeButton';
-export * from './useShowUpgradeLabel';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/usePresent.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/usePresent.ts
deleted file mode 100644
index 40cb594078..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/usePresent.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { useShowDownloadProgress } from './useShowDownloadProgress';
-import { useShowUpgradeLabel } from './useShowUpgradeLabel';
-
-export const usePresent = () => {
-  const showUpgradeLabel = useShowUpgradeLabel();
-  const showDownloadProgress = useShowDownloadProgress();
-
-  const present = showUpgradeLabel || showDownloadProgress;
-
-  return present;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowCancelButton.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowCancelButton.ts
deleted file mode 100644
index 0bbde3dfdf..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowCancelButton.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { useIsAppUpgradePreparing } from '../../../../hooks';
-
-export const useShowCancelButton = () => {
-  const isAppUpgradePreparing = useIsAppUpgradePreparing();
-
-  const showCancelButton = isAppUpgradePreparing;
-
-  return showCancelButton;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowDownloadProgress.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowDownloadProgress.ts
deleted file mode 100644
index 37de7fa9aa..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowDownloadProgress.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import {
-  useHasAppUpgradeError,
-  useHasAppUpgradeInitiated,
-  useShouldAppUpgradeInstallManually,
-} from '../../../../hooks';
-import { useAppUpgradeError } from '../../../../redux/hooks';
-
-export const useShowDownloadProgress = () => {
-  const { error } = useAppUpgradeError();
-  const hasAppUpgradeInitiated = useHasAppUpgradeInitiated();
-  const hasAppUpgradeError = useHasAppUpgradeError();
-  const shouldUpgradeInstallManually = useShouldAppUpgradeInstallManually();
-
-  if (shouldUpgradeInstallManually) return true;
-
-  if (hasAppUpgradeError) {
-    if (
-      error === 'START_INSTALLER_AUTOMATIC_FAILED' ||
-      error === 'START_INSTALLER_FAILED' ||
-      error === 'VERIFICATION_FAILED'
-    ) {
-      return true;
-    }
-
-    return false;
-  }
-
-  const showDownloadProgress = hasAppUpgradeInitiated;
-
-  return showDownloadProgress;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowInstallButton.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowInstallButton.ts
deleted file mode 100644
index eedb50bb33..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowInstallButton.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import {
-  useAppUpgradeEventType,
-  useHasAppUpgradeError,
-  useShouldAppUpgradeInstallManually,
-} from '../../../../hooks';
-import { useAppUpgradeError } from '../../../../redux/hooks';
-import { useErrorCountExceeded } from './useErrorCountExceeded';
-
-export const useShowInstallButton = () => {
-  const { error } = useAppUpgradeError();
-  const hasAppUpgradeError = useHasAppUpgradeError();
-  const appUpgradeEventType = useAppUpgradeEventType();
-  const errorCountExceeded = useErrorCountExceeded();
-  const shouldAppUpgradeInstallManually = useShouldAppUpgradeInstallManually();
-
-  if (!errorCountExceeded) {
-    if (!hasAppUpgradeError || error === 'START_INSTALLER_AUTOMATIC_FAILED') {
-      const showInstallButton =
-        shouldAppUpgradeInstallManually ||
-        appUpgradeEventType === 'APP_UPGRADE_STATUS_STARTING_INSTALLER' ||
-        appUpgradeEventType === 'APP_UPGRADE_STATUS_STARTED_INSTALLER';
-
-      return showInstallButton;
-    }
-  }
-
-  return false;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowReportProblemButton.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowReportProblemButton.ts
deleted file mode 100644
index 062f0a8436..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowReportProblemButton.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { useAppUpgradeError } from '../../../../redux/hooks';
-
-export const useShowReportProblemButton = () => {
-  const { error } = useAppUpgradeError();
-
-  switch (error) {
-    case 'DOWNLOAD_FAILED':
-    case 'GENERAL_ERROR':
-    case 'INSTALLER_FAILED':
-    case 'START_INSTALLER_FAILED':
-    case 'VERIFICATION_FAILED':
-      return true;
-    default:
-      return false;
-  }
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowRetryUpgradeButton.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowRetryUpgradeButton.ts
deleted file mode 100644
index e663e37b71..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowRetryUpgradeButton.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { useAppUpgradeError } from '../../../../redux/hooks';
-import { useErrorCountExceeded } from './useErrorCountExceeded';
-
-export const useShowRetryUpgradeButton = () => {
-  const { error } = useAppUpgradeError();
-  const errorCountExceeded = useErrorCountExceeded();
-
-  if (!errorCountExceeded) {
-    switch (error) {
-      case 'DOWNLOAD_FAILED':
-      case 'GENERAL_ERROR':
-      case 'INSTALLER_FAILED':
-      case 'START_INSTALLER_FAILED':
-      case 'VERIFICATION_FAILED':
-        return true;
-      default:
-        break;
-    }
-  }
-
-  return false;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowUpgradeButton.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowUpgradeButton.ts
deleted file mode 100644
index e592658f65..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowUpgradeButton.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import {
-  useAppUpgradeEventType,
-  useHasAppUpgradeError,
-  useHasAppUpgradeInitiated,
-  useShouldAppUpgradeInstallManually,
-} from '../../../../hooks';
-
-export const useShowUpgradeButton = () => {
-  const appUpgradeEventType = useAppUpgradeEventType();
-  const hasAppUpgradeError = useHasAppUpgradeError();
-  const hasAppUpgradeInitiated = useHasAppUpgradeInitiated();
-  const shouldAppUpgradeInstallManually = useShouldAppUpgradeInstallManually();
-
-  if (!hasAppUpgradeError && !shouldAppUpgradeInstallManually) {
-    // If we don't have an event type yet it is because the user has not attempted
-    // an upgrade yet.
-    if (!hasAppUpgradeInitiated || appUpgradeEventType === 'APP_UPGRADE_STATUS_ABORTED') {
-      return true;
-    }
-  }
-
-  return false;
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowUpgradeLabel.ts b/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowUpgradeLabel.ts
deleted file mode 100644
index 6ed418ff00..0000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/components/views/app-upgrade/hooks/useShowUpgradeLabel.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import {
-  useHasAppUpgradeError,
-  useIsAppUpgradePending,
-  useShouldAppUpgradeInstallManually,
-} from '../../../../hooks';
-import { useConnectionIsBlocked } from '../../../../redux/hooks';
-
-export const useShowUpgradeLabel = () => {
-  const { isBlocked } = useConnectionIsBlocked();
-  const hasAppUpgradeError = useHasAppUpgradeError();
-  const isAppUpgradePending = useIsAppUpgradePending();
-  const shouldAppUpgradeInstallManually = useShouldAppUpgradeInstallManually();
-
-  const showUpgradeLabel =
-    isBlocked || hasAppUpgradeError || isAppUpgradePending || shouldAppUpgradeInstallManually;
-
-  return showUpgradeLabel;
-};