From 3d65eccf047f1fbe4479559aa4a04902fd3a143c Mon Sep 17 00:00:00 2001
From: Hazel Koehler <acomputerdog@gmail.com>
Date: Sat, 16 Dec 2023 13:37:59 -0500
Subject: [PATCH 1/3] use main emoji button for spoiler / CW field

---
 .../post_status_form/post_status_form.js      | 19 ++++++++++++++++---
 .../post_status_form/post_status_form.vue     |  5 +++++
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 5647a9eb..b648b50c 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -213,7 +213,9 @@ const PostStatusForm = {
       preview: null,
       previewLoading: false,
       emojiInputShown: false,
-      idempotencyKey: ''
+      idempotencyKey: '',
+      activeEmojiInput: undefined,
+      activeTextInput: undefined
     }
   },
   computed: {
@@ -674,8 +676,19 @@ const PostStatusForm = {
       this.$refs['emoji-input'].resize()
     },
     showEmojiPicker () {
-      this.$refs['textarea'].focus()
-      this.$refs['emoji-input'].triggerShowPicker()
+      if (!this.activeEmojiInput || !this.activeTextInput)
+        this.focusStatusInput()
+
+      this.$refs[this.activeTextInput].focus()
+      this.$refs[this.activeEmojiInput].triggerShowPicker()
+    },
+    focusStatusInput() {
+      this.activeEmojiInput = 'emoji-input'
+      this.activeTextInput = 'textarea'
+    },
+    focusSubjectInput() {
+      this.activeEmojiInput = 'subject-emoji-input'
+      this.activeTextInput = 'subject-input'
     },
     clearError () {
       this.error = null
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index f4680336..601b7d0c 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -118,13 +118,16 @@
           />
         </div>
         <EmojiInput
+          ref="subject-emoji-input"
           v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
           v-model="newStatus.spoilerText"
           enable-emoji-picker
+          hide-emoji-button
           :suggest="emojiSuggestor"
           class="form-control"
         >
           <input
+            ref="subject-input"
             v-model="newStatus.spoilerText"
             type="text"
             :placeholder="$t('post_status.content_warning')"
@@ -132,6 +135,7 @@
             size="1"
             class="form-post-subject"
             @input="onSubjectInput"
+            @focus="focusSubjectInput()"
           >
         </EmojiInput>
         <i18n-t
@@ -173,6 +177,7 @@
             @input="resize"
             @compositionupdate="resize"
             @paste="paste"
+            @focus="focusStatusInput()"
           />
           <p
             v-if="hasStatusLengthLimit"

From 34e2800f5910be0bdc1abc9fb83d21dfde6424e0 Mon Sep 17 00:00:00 2001
From: Hazel Koehler <acomputerdog@gmail.com>
Date: Sat, 16 Dec 2023 14:44:26 -0500
Subject: [PATCH 2/3] add button to toggle the spoiler / CW field

---
 .../post_status_form/post_status_form.js      | 21 ++++++++++++++++++-
 .../post_status_form/post_status_form.vue     | 18 ++++++++++++++--
 src/i18n/en.json                              |  1 +
 3 files changed, 37 insertions(+), 3 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index b648b50c..3bc6dc99 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -199,6 +199,10 @@ const PostStatusForm = {
       }
     }
 
+    // When first loading the form, hide the subject (CW) field if it's disabled or doesn't have a starting value.
+    // "disableSubject" seems to take priority over "alwaysShowSubject"
+    const showSubject = !this.disableSubject && (statusParams.spoilerText || this.alwaysShowSubject)
+
     return {
       dropFiles: [],
       uploadingFiles: false,
@@ -215,7 +219,8 @@ const PostStatusForm = {
       emojiInputShown: false,
       idempotencyKey: '',
       activeEmojiInput: undefined,
-      activeTextInput: undefined
+      activeTextInput: undefined,
+      subjectVisible: showSubject
     }
   },
   computed: {
@@ -690,6 +695,20 @@ const PostStatusForm = {
       this.activeEmojiInput = 'subject-emoji-input'
       this.activeTextInput = 'subject-input'
     },
+    toggleSubjectVisible() {
+      // If hiding CW, then we need to clear the subject and reset focus
+      if (this.subjectVisible)
+      {
+        this.focusStatusInput()
+
+        // "nsfw" property is normally set by the @change listener, but this bypasses it.
+        // We need to clear it manually instead.
+        this.newStatus.spoilerText = ''
+        this.newStatus.nsfw = false
+      }
+
+      this.subjectVisible = !this.subjectVisible
+    },
     clearError () {
       this.error = null
     },
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 601b7d0c..74663fd7 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -119,7 +119,7 @@
         </div>
         <EmojiInput
           ref="subject-emoji-input"
-          v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
+          v-if="subjectVisible"
           v-model="newStatus.spoilerText"
           enable-emoji-picker
           hide-emoji-button
@@ -281,6 +281,15 @@
           >
             <FAIcon icon="poll-h" />
           </button>
+          <button
+            v-if="!disableSubject"
+            class="spoiler-icon button-unstyled"
+            :class="{ selected: subjectVisible }"
+            :title="$t('post_status.toggle_content_warning')"
+            @click="toggleSubjectVisible"
+          >
+            <FAIcon icon="eye-slash" />
+          </button>
         </div>
         <button
           v-if="posting"
@@ -461,7 +470,7 @@
     }
   }
 
-  .media-upload-icon, .poll-icon, .emoji-icon {
+  .media-upload-icon, .poll-icon, .emoji-icon, .spoiler-icon {
     font-size: 1.85em;
     line-height: 1.1;
     flex: 1;
@@ -504,6 +513,11 @@
 
   .poll-icon {
     order: 3;
+    justify-content: center;
+  }
+
+  .spoiler-icon {
+    order: 4;
     justify-content: right;
   }
 
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 0160b187..a7fbb12f 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -380,6 +380,7 @@
             "text/x.misskeymarkdown": "MFM"
         },
         "content_warning": "Content Warning (optional)",
+        "toggle_content_warning": "Toggle content warning",
         "default": "Just arrived at Luna Nova Academy",
         "direct_warning_to_all": "This post will be visible to all the mentioned users.",
         "direct_warning_to_first_only": "This post will only be visible to the mentioned users at the beginning of the message.",

From ea9ad4d600a312b008287d8dabca12f758440495 Mon Sep 17 00:00:00 2001
From: Hazel Koehler <acomputerdog@gmail.com>
Date: Wed, 20 Dec 2023 12:39:31 -0500
Subject: [PATCH 3/3] fix "always show content warning" setting

---
 src/components/post_status_form/post_status_form.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 3bc6dc99..703d8a63 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -138,7 +138,7 @@ const PostStatusForm = {
       statusText = buildMentionsString({ user: this.repliedUser, attentions: this.attentions }, currentUser)
     }
 
-    const { postContentType: contentType, sensitiveByDefault, sensitiveIfSubject, interfaceLanguage } = this.$store.getters.mergedConfig
+    const { postContentType: contentType, sensitiveByDefault, sensitiveIfSubject, interfaceLanguage, alwaysShowSubjectInput } = this.$store.getters.mergedConfig
 
     let statusParams = {
       spoilerText: this.subject || '',
@@ -200,8 +200,8 @@ const PostStatusForm = {
     }
 
     // When first loading the form, hide the subject (CW) field if it's disabled or doesn't have a starting value.
-    // "disableSubject" seems to take priority over "alwaysShowSubject"
-    const showSubject = !this.disableSubject && (statusParams.spoilerText || this.alwaysShowSubject)
+    // "disableSubject" seems to take priority over "alwaysShowSubjectInput".
+    const showSubject = !this.disableSubject && (statusParams.spoilerText || alwaysShowSubjectInput)
 
     return {
       dropFiles: [],