Merge pull request #1029 from h3poteto/iss-1027

closes #1027 Block to root path when user use brower-back

src/renderer/components/Authorize.vue

@@ -1,11 +1,10 @@
 <template>
-<div id="authorize">
+  <div id="authorize">
     <div>
       <el-header>
         <el-row>
           <el-col :span="24" class="close">
-          <el-button type="text" icon="el-icon-close" @click="close" class="close-button">
+            <el-button type="text" icon="el-icon-close" @click="close" class="close-button"> </el-button>
-          </el-button>
           </el-col>
         </el-row>
       </el-header>
@@ -15,7 +14,14 @@
           <p>{{ $t('authorize.manually_2') }}</p>
           <p class="url">{{ $route.query.url }}</p>
         </div>
-      <el-form ref="form" :model="authorizeForm" label-width="120px" label-position="top" class="authorize-form" v-on:submit.prevent="authorizeSubmit">
+        <el-form
+          ref="form"
+          :model="authorizeForm"
+          label-width="120px"
+          label-position="top"
+          class="authorize-form"
+          v-on:submit.prevent="authorizeSubmit"
+        >
           <el-form-item :label="$t('authorize.code_label')">
             <el-input v-model="authorizeForm.code"></el-input>
           </el-form-item>
@@ -24,18 +30,14 @@
             <el-input></el-input>
           </el-form-item>
           <el-form-item class="submit">
-          <el-button
+            <el-button type="primary" @click="authorizeSubmit" v-loading="submitting" element-loading-background="rgba(0, 0, 0, 0.8)">
-            type="primary"
-            @click="authorizeSubmit"
-            v-loading="submitting"
-            element-loading-background="rgba(0, 0, 0, 0.8)">
               {{ $t('authorize.submit') }}
             </el-button>
           </el-form-item>
         </el-form>
       </el-main>
     </div>
-</div>
+  </div>
 </template>
 
 <script>
@@ -47,7 +49,7 @@ export default {
       default: ''
     }
   },
-  data () {
+  data() {
     return {
       authorizeForm: {
         code: ''
@@ -55,20 +57,21 @@ export default {
       submitting: false
     }
   },
-  mounted () {
+  mounted() {
     console.log(this.url)
   },
   methods: {
-    authorizeSubmit () {
+    authorizeSubmit() {
       this.submitting = true
-      this.$store.dispatch('Authorize/submit', this.authorizeForm.code)
+      this.$store
+        .dispatch('Authorize/submit', this.authorizeForm.code)
         .finally(() => {
           this.submitting = false
         })
-        .then((id) => {
+        .then(id => {
           this.$router.push({ path: `/${id}/home` })
         })
-        .catch((err) => {
+        .catch(err => {
           if (err.name === 'DuplicateRecordError') {
             this.$message({
               message: this.$t('message.authorize_duplicate_error'),
@@ -82,8 +85,8 @@ export default {
           }
         })
     },
-    close () {
+    close() {
-      return this.$router.push({ path: '/' })
+      return this.$router.push({ path: '/', query: { redirect: 'home' } })
     }
   }
 }

src/renderer/components/Login.vue

@@ -1,10 +1,9 @@
 <template>
-<el-container id="login">
+  <el-container id="login">
     <el-header>
       <el-row>
         <el-col :span="24" class="close">
-        <el-button type="text" icon="el-icon-close" @click="close" class="close-button">
+          <el-button type="text" icon="el-icon-close" @click="close" class="close-button"> </el-button>
-        </el-button>
         </el-col>
       </el-row>
     </el-header>
@@ -12,7 +11,7 @@
       <div v-shortkey="['esc']" @shortkey="close"></div>
       <login-form></login-form>
     </el-container>
-</el-container>
+  </el-container>
 </template>
 
 <script>
@@ -28,9 +27,9 @@ export default {
     })
   },
   methods: {
-    close () {
+    close() {
       this.$store.dispatch('Login/pageBack')
-      return this.$router.push({ path: '/' })
+      return this.$router.push({ path: '/', query: { redirect: 'home' } })
     }
   }
 }

src/renderer/components/Preferences.vue

@@ -18,7 +18,8 @@
           class="setting-menu"
           :text-color="primaryColor"
           :background-color="backgroundColor"
-          :router="true">
+          :router="true"
+        >
           <el-menu-item index="/preferences/general">
             <icon name="cog" class="icon" scale="1.3"></icon>
             <span>{{ $t('preferences.general.title') }}</span>
@@ -60,10 +61,10 @@ export default {
     })
   },
   methods: {
-    close () {
+    close() {
-      this.$router.push('/')
+      this.$router.push({ path: '/', query: { redirect: 'home' } })
     },
-    activeRoute () {
+    activeRoute() {
       return this.$route.path
     }
   }

src/renderer/store/GlobalHeader.ts

@@ -46,6 +46,13 @@ const actions: ActionTree<GlobalHeaderState, RootState> = {
       console.error(err)
     }
     const accounts = await dispatch('listAccounts')
+    // Block to root path when user use browser-back, like mouse button.
+    // Because any contents are not rendered when browser back to / from home.
+    router.beforeEach((to, from, next) => {
+      if (!(to.fullPath === '/' && from.name)) {
+        return next()
+      }
+    })
     return accounts
   },
   startStreamings: async ({ dispatch }) => {