From 408677921b13d1b9218de3932411d88823ff6a03 Mon Sep 17 00:00:00 2001
From: silverpill <silverpill@firemail.cc>
Date: Sun, 25 Sep 2022 21:55:32 +0000
Subject: [PATCH] Disable "Publish" button while post is being published

---
 src/App.vue                   |  4 ++--
 src/components/PostEditor.vue | 16 +++++++++++++++-
 src/styles/_theme.scss        |  2 ++
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 2d6d4fc..5ee34d7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -136,9 +136,9 @@ button {
   }
 
   &[disabled] {
-    background-color: #ddd !important;
+    background-color: $btn-disabled-background-color !important;
     box-shadow: none;
-    color: #999 !important;
+    color: $btn-disabled-text-color !important;
     cursor: initial;
   }
 }
diff --git a/src/components/PostEditor.vue b/src/components/PostEditor.vue
index 1004348..01dc1a8 100644
--- a/src/components/PostEditor.vue
+++ b/src/components/PostEditor.vue
@@ -67,6 +67,7 @@
           type="submit"
           v-if="inReplyTo"
           class="submit-btn-small"
+          :disabled="!canPublish()"
           @click.prevent="publish()"
         >
           Publish
@@ -78,7 +79,7 @@
       <button
         class="btn"
         type="submit"
-        :disabled="getCharacterCount() < 0"
+        :disabled="!canPublish()"
         @click.prevent="publish()"
       >Publish</button>
     </div>
@@ -130,6 +131,7 @@ let attachment = $ref<Attachment | null>(null)
 let visibility = $ref(Visibility.Public)
 
 let visibilityMenuVisible = $ref(false)
+let isLoading = $ref(false)
 let errorMessage = $ref<string | null>(null)
 
 const author = $computed<User | null>(() => {
@@ -192,6 +194,10 @@ function getCharacterCount(): number {
   return (instance.post_character_limit - content.length)
 }
 
+function canPublish(): boolean {
+  return getCharacterCount() >= 0 && !isLoading
+}
+
 async function publish() {
   const contentRendered = renderMarkdownLite(content)
   const postData = {
@@ -200,6 +206,7 @@ async function publish() {
     visibility: visibility,
     mentions: [],
   }
+  isLoading = true
   let post
   try {
     post = await createPost(
@@ -209,10 +216,12 @@ async function publish() {
     )
   } catch (error: any) {
     errorMessage = error.message
+    isLoading = false
     return
   }
   // Refresh editor
   errorMessage = null
+  isLoading = false
   attachment = null
   content = ""
   if (postFormContentRef) {
@@ -288,6 +297,11 @@ textarea {
   .submit-btn-small {
     font-weight: bold;
     margin-left: $block-inner-padding;
+
+    &[disabled] {
+      color: $btn-disabled-text-color;
+      cursor: initial;
+    }
   }
 }
 
diff --git a/src/styles/_theme.scss b/src/styles/_theme.scss
index 1289dbf..cbd4dd6 100644
--- a/src/styles/_theme.scss
+++ b/src/styles/_theme.scss
@@ -26,6 +26,8 @@ $btn-border-radius: 8px;
 $btn-shadow: 2px 5px 10px -5px #B7B5B5;
 $btn-secondary-background-color: #CCCBC6;
 $btn-secondary-text-color: $text-color;
+$btn-disabled-background-color: #ddd;
+$btn-disabled-text-color: #999;
 
 $block-border-radius: 15px;
 $block-background-color: #fff;