diff --git a/components/ui/Popups/ErrorNetwork/ErrorNetwork.html b/components/ui/Popups/ErrorNetwork/ErrorNetwork.html
new file mode 100644
index 0000000000..b8b81605b6
--- /dev/null
+++ b/components/ui/Popups/ErrorNetwork/ErrorNetwork.html
@@ -0,0 +1,21 @@
+<div class="error-network-container">
+  <div class="modal-body">
+    <div class="custom-modal-content">
+      <img src="~/assets/svg/mascot/sad_curious.svg" class="mascot" />
+      <TypographyTitle :text="$t('popups.error_network.title')" class="title" />
+      <TypographyText
+        :text="$t('popups.error_network.subtitle')"
+        :size="6"
+        class="subtitle"
+      />
+      <InteractablesButton type="primary" class="action" :action="tryAgain">
+        <refresh-cw-icon size="1.5x" />
+        <TypographyText
+          :text="$t('popups.error_network.action')"
+          :size="6"
+          class="text"
+        />
+      </InteractablesButton>
+    </div>
+  </div>
+</div>
diff --git a/components/ui/Popups/ErrorNetwork/ErrorNetwork.less b/components/ui/Popups/ErrorNetwork/ErrorNetwork.less
new file mode 100644
index 0000000000..9c15a9743e
--- /dev/null
+++ b/components/ui/Popups/ErrorNetwork/ErrorNetwork.less
@@ -0,0 +1,45 @@
+.error-network-container {
+  &:extend(.modal-gradient);
+  padding: 1rem;
+
+  .modal-body {
+    .custom-modal-content {
+      padding: 0 1rem;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      .title {
+        font-size: 1.9rem;
+        color: @secondary-text;
+        margin-top: 2rem;
+        text-align: center;
+      }
+
+      .subtitle {
+        color: @secondary-text;
+        margin-top: 0.5rem;
+      }
+
+      .mascot {
+        width: 15rem;
+        height: 15rem;
+      }
+
+      .action {
+        width: 100%;
+
+        .text {
+          margin: 0 0.5rem;
+        }
+      }
+    }
+  }
+}
+
+@media only screen and (min-width: @mobile-breakpoint) {
+  .error-network-container {
+    max-width: 550px;
+  }
+}
diff --git a/components/ui/Popups/ErrorNetwork/ErrorNetwork.vue b/components/ui/Popups/ErrorNetwork/ErrorNetwork.vue
new file mode 100644
index 0000000000..d92dcdaf12
--- /dev/null
+++ b/components/ui/Popups/ErrorNetwork/ErrorNetwork.vue
@@ -0,0 +1,56 @@
+<template src="./ErrorNetwork.html" />
+
+<script>
+import Vue from 'vue'
+import { mapState } from 'vuex'
+import { throttle } from 'lodash'
+
+import { RefreshCwIcon } from 'satellite-lucide-icons'
+
+import { Config } from '~/config'
+
+/**
+ * @component Error
+ * @description Component that takes an error message to display including source and extra details.
+ * setTimeout prop is a bool that if true will auto close the modal after 5 seconds
+ * @example
+ */
+export default Vue.extend({
+  name: 'ErrorNetwork',
+  components: {
+    RefreshCwIcon,
+  },
+  watch: {
+    $route(to, from) {
+      if (to !== from) {
+        this.closeNetworkErrorPopup()
+      }
+    },
+  },
+  methods: {
+    /**
+     * @method toggleNetworkErrorPopup
+     * @description
+     * @example
+     */
+    closeNetworkErrorPopup() {
+      this.$store.commit('ui/toggleErrorNetworkModal', {
+        state: false,
+        action: null,
+      })
+    },
+    /**
+     * @method tryAgain
+     * @description
+     * @example
+     */
+    tryAgain: throttle(function () {
+      this.$store.state.ui.modals.errorNetwork.action()
+      this.closeNetworkErrorPopup()
+    }, Config.modal.errorNetworkActionThrottle),
+  },
+})
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="less" src="./ErrorNetwork.less"></style>
diff --git a/config.ts b/config.ts
index cff650d39b..678314fa3d 100644
--- a/config.ts
+++ b/config.ts
@@ -170,4 +170,7 @@ export const Config = {
     android: 10836, // lowest android value, some phones can handle more
     electron: 11180, // including for completeness sake
   },
+  modal: {
+    errorNetworkActionThrottle: 1000,
+  },
 }
diff --git a/layouts/default.vue b/layouts/default.vue
index 868433b384..540d666406 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,5 +1,8 @@
 <template>
   <div id="app" :class="$store.state.ui.theme.base.class">
+    <UiModal v-if="$store.state.ui.modals.errorNetwork.isOpen" nopad>
+      <UiPopupsErrorNetwork />
+    </UiModal>
     <Nuxt />
     <!-- Sets the global css variable for the theme flair color -->
     <v-style>
diff --git a/locales/en-US.js b/locales/en-US.js
index 757681cd4d..99ca730a4d 100644
--- a/locales/en-US.js
+++ b/locales/en-US.js
@@ -126,6 +126,12 @@ export default {
       contact:
         'Oops! Something went wrong! Help us improve your experience by sending an error report',
     },
+    error_network: {
+      title: 'Oops! Please Stand By',
+      subtitle:
+        "We're currently in our Alpha stage and working hard on connecting you to a satellite. It looks like we're having some technical issues at the moment. Please re-enter your pin to connect or try again later.",
+      action: 'Try Again',
+    },
   },
   files: {
     files: 'Files',
diff --git a/pages/auth/register/index.vue b/pages/auth/register/index.vue
index 3649ddac2e..e1c7bb94ed 100644
--- a/pages/auth/register/index.vue
+++ b/pages/auth/register/index.vue
@@ -42,17 +42,30 @@ export default Vue.extend({
   },
   watch: {
     allPrerequisitesReady(nextValue) {
+      console.log(nextValue)
       if (!nextValue) return
       this.$router.replace('/chat/direct')
     },
   },
+  mounted() {
+    if (this.allPrerequisitesReady) {
+      this.$router.replace('/chat/direct')
+    }
+  },
   methods: {
     async confirm(userData: UserRegistrationData) {
-      this.$store.dispatch('accounts/registerUser', {
-        name: userData.username,
-        image: userData.photoHash,
-        status: userData.status,
-      })
+      try {
+        await this.$store.dispatch('accounts/registerUser', {
+          name: userData.username,
+          image: userData.photoHash,
+          status: userData.status,
+        })
+      } catch (error: any) {
+        this.$store.commit('ui/toggleErrorNetworkModal', {
+          state: true,
+          action: () => this.confirm(userData),
+        })
+      }
     },
   },
 })
diff --git a/pages/index.vue b/pages/index.vue
index 8d6b833855..62b707e3b5 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -72,10 +72,17 @@ export default Vue.extend({
       } catch (error: any) {
         if (error.message === AccountsError.USER_NOT_REGISTERED) {
           this.$router.replace('/auth/register')
+          return
         }
         if (error.message === AccountsError.USER_DERIVATION_FAILED) {
           this.$router.replace('/setup/disclaimer')
+          return
         }
+
+        this.$store.commit('ui/toggleErrorNetworkModal', {
+          state: true,
+          action: this.loadAccount,
+        })
       }
     },
   },
diff --git a/store/ui/__snapshots__/state.test.ts.snap b/store/ui/__snapshots__/state.test.ts.snap
index 511de442b4..b6819330fa 100644
--- a/store/ui/__snapshots__/state.test.ts.snap
+++ b/store/ui/__snapshots__/state.test.ts.snap
@@ -54,6 +54,10 @@ Object {
     "creategroup": false,
     "crop": false,
     "error": false,
+    "errorNetwork": Object {
+      "action": null,
+      "isOpen": false,
+    },
     "glyph": false,
     "groupInvite": Object {
       "isOpen": false,
diff --git a/store/ui/mutations.ts b/store/ui/mutations.ts
index 9ee483e672..314d71b6f6 100644
--- a/store/ui/mutations.ts
+++ b/store/ui/mutations.ts
@@ -103,6 +103,13 @@ export default {
     // @ts-ignore
     state.modals[modal.name] = modal.state
   },
+  toggleErrorNetworkModal(
+    state: UIState,
+    modal: { state: boolean; action: Function | null },
+  ) {
+    // @ts-ignore
+    state.modals.errorNetwork = { isOpen: modal.state, action: modal.action }
+  },
   setGlyphModalPack(state: UIState, pack: string) {
     state.glyphModalPack = pack
   },
diff --git a/store/ui/state.ts b/store/ui/state.ts
index 187ba805b9..0b72a63ddd 100644
--- a/store/ui/state.ts
+++ b/store/ui/state.ts
@@ -37,6 +37,7 @@ const InitialUIState = (): UIState => ({
     callToAction: false,
     renameFile: false,
     crop: false,
+    errorNetwork: { isOpen: false, action: null },
   },
   glyphModalPack: '',
   chatbarContent: '',
diff --git a/store/ui/types.ts b/store/ui/types.ts
index 34258f36a2..2ddbf947c2 100644
--- a/store/ui/types.ts
+++ b/store/ui/types.ts
@@ -170,7 +170,7 @@ export interface UIState {
   showSearchResult: boolean
   showSidebar: boolean
   modals: {
-    [key: string]: boolean
+    [key: string]: boolean | object
   }
   glyphModalPack: string
   chatbarContent: string