refs #151 Translate login

src/config/locales/en/translation.json

@@ -160,6 +160,17 @@
       "edit": "Edit"
     }
   },
+  "login": {
+    "domain_name_label": "First, let's log in to a Mastodon instance. Please enter an instance domain name.",
+    "search": "Search",
+    "login": "Login"
+  },
+  "authorize": {
+    "manually_1": "Now authorization page is opened in your browser.",
+    "manually_2": "If it is not opened, please open the following URL manually.",
+    "code_label": "Please paste authorization code from your browser:",
+    "submit": "Submit"
+  },
   "message": {
     "account_load_error": "Failed to load accounts",
     "account_remove_error": "Failed to remove the account",

src/config/locales/ja/translation.json

@@ -160,6 +160,17 @@
       "edit": "編集"
     }
   },
+  "login": {
+    "domain_name_label": "ドメイン名を入力してマストドンにログインしてください．",
+    "search": "検索",
+    "login": "ログイン"
+  },
+  "authorize": {
+    "manually_1": "認証用ページが自動的に開きます．",
+    "manually_2": "もし開かない場合は，以下のURLから手動で認証用ページを開いてください．",
+    "code_label": "ブラウザに表示された認証コードを貼り付けてください",
+    "submit": "認証"
+  },
   "message": {
     "account_load_error": "アカウントの読み込みに失敗しました",
     "account_remove_error": "アカウントの削除に失敗しました",

src/renderer/components/Authorize.vue

@@ -11,12 +11,12 @@
     </el-header>
     <el-main>
       <div class="authorization-url">
-        <p>Now authorization page is opened in your browser.</p>
+        <p>{{ $t('authorize.manually_1') }}</p>
-        <p>If it is not opened, please open the following URL manually.</p>
+        <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-item label="Please paste authorization code from your browser:">
+        <el-form-item :label="$t('authorize.code_label')">
           <el-input v-model="authorizeForm.code"></el-input>
         </el-form-item>
         <!-- Dummy form to guard submitting with enter -->
@@ -29,7 +29,7 @@
             @click="authorizeSubmit"
             v-loading="submitting"
             element-loading-background="rgba(0, 0, 0, 0.8)">
-            Submit
+            {{ $t('authorize.submit') }}
           </el-button>
         </el-form-item>
       </el-form>

src/renderer/components/Login/LoginForm.vue

@@ -1,6 +1,6 @@
 <template>
   <el-form ref="loginForm" label-width="120px" label-position="top" v-on:submit.prevent="confirm('loginForm')" class="login-form" :rules="rules" :model="form">
-    <el-form-item label="First, let's log in to a Mastodon instance. Please enter an instance domain name." prop="domainName">
+    <el-form-item :label="$t('login.domain_name_label')" prop="domainName">
       <el-input v-model="form.domainName" placeholder="mastodon.social" v-shortkey="['enter']" @shortkey.native="handleKey"></el-input>
     </el-form-item>
     <!-- Dummy form to guard submitting with enter -->
@@ -13,7 +13,7 @@
       v-if="selectedInstance === null"
       v-loading="searching"
       element-loading-background="rgba(0, 0, 0, 0.8)">
-      Search
+      {{ $t('login.search') }}
     </el-button>
     <el-form-item class="submit">
       <el-button
@@ -21,7 +21,7 @@
         class="login"
         @click="login"
         v-if="selectedInstance !== null">
-        Login
+        {{ $t('login.login') }}
       </el-button>
     </el-form-item>
   </el-form>
@@ -98,7 +98,7 @@ export default {
             })
             .catch(() => {
               this.$message({
-                message: this.$t('domain_doesnt_exist', {domain: this.form.domainName}),
+                message: this.$t('message.domain_doesnt_exist', {domain: this.form.domainName}),
                 type: 'error'
               })
             })

src/renderer/store/Login.js

@@ -33,19 +33,14 @@ const Login = {
     pageBack ({ commit }) {
       commit('changeInstance', null)
     },
-    confirmInstance ({ commit }, domain) {
+    async confirmInstance ({ commit }, domain) {
-      return new Promise((resolve, reject) => {
+      commit('changeSearching', true)
-        commit('changeSearching', true)
+      const res = await axios.get(`https://${domain}/api/v1/instance`)
-        axios
+        .finally(() => {
-          .get(`https://${domain}/api/v1/instance`)
+          commit('changeSearching', false)
-          .then((res) => {
+        })
-            commit('changeInstance', domain)
+      commit('changeInstance', domain)
-            resolve(res)
+      return res.data
-          })
-          .finally(() => {
-            commit('changeSearching', false)
-          })
-      })
     }
   }
 }