Merge branch 'feature/status-scope-improvements' into 'develop'

Improve Post Scope UI

See merge request pleroma/pleroma-fe!286

2 files changed, 40 insertions, 6 deletions

diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 802d51ed..7aa0e7c4 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -2,6 +2,14 @@
 <div class="post-status-form">
   <form @submit.prevent="postStatus(newStatus)">
     <div class="form-group" >
+      <i18n
+        v-if="!this.$store.state.users.currentUser.locked && this.newStatus.visibility == 'private'"
+        path="post_status.account_not_locked_warning"
+        tag="p"
+        class="visibility-notice">
+        <router-link to="/user-settings">{{ $t('post_status.account_not_locked_warning_link') }}</router-link>
+      </i18n>
+      <p v-if="this.newStatus.visibility == 'direct'" class="visibility-notice">{{ $t('post_status.direct_warning') }}</p>
       <input
         v-if="scopeOptionsEnabled"
         type="text"
@@ -25,10 +33,10 @@
         @paste="paste">
       </textarea>
       <div v-if="scopeOptionsEnabled" class="visibility-tray">
-        <i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct"></i>
-        <i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private"></i>
-        <i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted"></i>
-        <i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public"></i>
+        <i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct" :title="$t('post_status.scope.direct')"></i>
+        <i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private" :title="$t('post_status.scope.private')"></i>
+        <i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted" :title="$t('post_status.scope.unlisted')"></i>
+        <i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public" :title="$t('post_status.scope.public')"></i>
       </div>
     </div>
     <div style="position:relative;" v-if="candidates">
@@ -102,6 +110,14 @@
   }
 }
 
+.visibility-notice {
+  padding: .5em;
+  border: 1px solid $fallback--faint;
+  border: 1px solid var(--faint, $fallback--faint);
+  border-radius: $fallback--inputRadius;
+  border-radius: var(--inputRadius, $fallback--inputRadius);
+}
+
 .post-status-form, .login {
   .form-bottom {
     display: flex;
diff --git a/src/i18n/messages.js b/src/i18n/messages.js
index 3a9f2e63..70a06ec1 100644
--- a/src/i18n/messages.js
+++ b/src/i18n/messages.js
@@ -117,7 +117,16 @@ const de = {
   },
   post_status: {
     posting: 'Veröffentlichen',
-    default: 'Sitze gerade im Hofbräuhaus.'
+    default: 'Sitze gerade im Hofbräuhaus.',
+    account_not_locked_warning: 'Dein Profil ist nicht {0}. Wer dir folgen will, kann das jederzeit tun und dann auch deine privaten Beiträge sehen.',
+    account_not_locked_warning_link: 'gesperrt',
+    direct_warning: 'Dieser Beitrag wird nur für die erwähnten Nutzer sichtbar sein.',
+    scope: {
+      public: 'Öffentlich - Beitrag an öffentliche Zeitleisten',
+      unlisted: 'Nicht gelistet - Nicht in öffentlichen Zeitleisten anzeigen',
+      private: 'Nur Folgende - Beitrag nur an Folgende',
+      direct: 'Direkt - Beitrag nur an erwähnte Profile'
+    }
   },
   finder: {
     find_user: 'Finde Benutzer',
@@ -350,7 +359,16 @@ const en = {
   post_status: {
     posting: 'Posting',
     content_warning: 'Subject (optional)',
-    default: 'Just landed in L.A.'
+    default: 'Just landed in L.A.',
+    account_not_locked_warning: 'Your account is not {0}. Anyone can follow you to view your follower-only posts.',
+    account_not_locked_warning_link: 'locked',
+    direct_warning: 'This post will only be visible to all the mentioned users.',
+    scope: {
+      public: 'Public - Post to public timelines',
+      unlisted: 'Unlisted - Do not post to public timelines',
+      private: 'Followers-only - Post to followers only',
+      direct: 'Direct - Post to mentioned users only'
+    }
   },
   finder: {
     find_user: 'Find user',