From 983854590474dbd7495f5795b04d7b46b0d5744d Mon Sep 17 00:00:00 2001
From: ilja <git@ilja.space>
Date: Mon, 14 Oct 2024 14:38:14 +0200
Subject: [PATCH] Add visual feedback when clicking translate

In a status, we can choose to translate the status (assuming there's a translator enabled on the backend)

It will translate, in practice generally according to detected language, and also provide an option to override the source language.

Translating can take a while, and there wasn't really a visual feedback when it was translating.
Now the translate button will be dissabled while translating.
---
 src/components/status_body/status_body.js  | 8 ++++++--
 src/components/status_body/status_body.vue | 1 +
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/status_body/status_body.js b/src/components/status_body/status_body.js
index 19cec6c6..7ff6c3aa 100644
--- a/src/components/status_body/status_body.js
+++ b/src/components/status_body/status_body.js
@@ -41,7 +41,8 @@ const StatusContent = {
       postLength: this.status.text.length,
       parseReadyDone: false,
       renderMisskeyMarkdown,
-      translateFrom: null
+      translateFrom: null,
+      translating: false
     }
   },
   computed: {
@@ -135,7 +136,10 @@ const StatusContent = {
     },
     translateStatus () {
       const translateTo = this.$store.getters.mergedConfig.translationLanguage || this.$store.state.instance.interfaceLanguage
-      this.$store.dispatch('translateStatus', { id: this.status.id, language: translateTo, from: this.translateFrom })
+      this.translating = true
+      this.$store.dispatch(
+        'translateStatus', { id: this.status.id, language: translateTo, from: this.translateFrom }
+      ).finally(() => { this.translating = false })
     }
   }
 }
diff --git a/src/components/status_body/status_body.vue b/src/components/status_body/status_body.vue
index 882b38c5..ba9a3ded 100644
--- a/src/components/status_body/status_body.vue
+++ b/src/components/status_body/status_body.vue
@@ -91,6 +91,7 @@
               {{ ' ' }}
               <button
                 class="btn button-default"
+                :disabled="translating"
                 @click="translateStatus"
               >
                 {{ $t('status.translate') }}