add badge to ui for locked accounts

4 files changed, 11 insertions, 1 deletions

diff --git a/app/helpers/stream_entries_helper.rb b/app/helpers/stream_entries_helper.rb
index fe8505f3b..ed58efdb4 100644
--- a/app/helpers/stream_entries_helper.rb
+++ b/app/helpers/stream_entries_helper.rb
@@ -37,6 +37,7 @@ module StreamEntriesHelper
   def account_badge(account, all: false)
     content_tag(:div, class: 'roles') do
       roles = []
+      roles << content_tag(:div, t('accounts.roles.locked'), class: 'account-role locked') if account.locked?
       roles << content_tag(:div, t('accounts.roles.bot'), class: 'account-role bot') if account.bot?
       roles << content_tag(:div, t('accounts.roles.adult'), class: 'account-role adult') if account.adult_content?
       roles << content_tag(:div, t('accounts.roles.gently'), class: 'account-role gently') if account.gently?
diff --git a/app/javascript/flavours/glitch/features/account/components/header.js b/app/javascript/flavours/glitch/features/account/components/header.js
index 2b4adb4f5..0f03770b7 100644
--- a/app/javascript/flavours/glitch/features/account/components/header.js
+++ b/app/javascript/flavours/glitch/features/account/components/header.js
@@ -189,6 +189,8 @@ class Header extends ImmutablePureComponent {
     const content          = { __html: account.get('note_emojified') };
     const displayNameHtml = { __html: account.get('display_name_html') };
     const fields          = account.get('fields');
+
+    const badge_locked    = account.get('locked') ? (<div className='account-role locked'><FormattedMessage id='account.badges.locked' defaultMessage='🔒 Locked' /></div>) : null;
     const badge_bot       = account.get('bot') ? (<div className='account-role bot'><FormattedMessage id='account.badges.bot' defaultMessage='Bot' /></div>) : null;
     const badge_ac        = account.get('adult_content') ? (<div className='account-role adult'><FormattedMessage id='account.badges.adult' defaultMessage="🔞 Adult content" /></div>) : null;
     const badge_gently    = account.get('gently') ? (<div className='account-role gently'><FormattedMessage id='account.badges.gently' defaultMessage="Gentlies kobolds" /></div>) : null;
@@ -226,7 +228,7 @@ class Header extends ImmutablePureComponent {
             <h1>
               <span dangerouslySetInnerHTML={displayNameHtml} />
               <small>@{acct} {lockedIcon}</small>
-              <div className='roles'>{badge_admin}{badge_mod}{badge_ac}{badge_bot}{badge_gently}{badge_kobold}</div>
+              <div className='roles'>{badge_locked}{badge_admin}{badge_mod}{badge_ac}{badge_bot}{badge_gently}{badge_kobold}</div>
             </h1>
           </div>
 
diff --git a/app/javascript/flavours/glitch/styles/accounts.scss b/app/javascript/flavours/glitch/styles/accounts.scss
index 65c7fc80c..49236fe4c 100644
--- a/app/javascript/flavours/glitch/styles/accounts.scss
+++ b/app/javascript/flavours/glitch/styles/accounts.scss
@@ -234,6 +234,12 @@
     background-color: rgba(lighten(orange, 33%), 0.1);
     border-color: rgba(lighten(orange, 33%), 0.1);
   }
+
+  &.locked {
+    color: lighten($warning-red, 12%);
+    background-color: rgba(lighten($warning-red, 12%), 0.1);
+    border-color: rgba(lighten($warning-red, 12%), 0.5);
+  }
 }
 
 .account__header__fields {
diff --git a/app/javascript/mastodon/locales/en.json b/app/javascript/mastodon/locales/en.json
index 53166a19b..d61277d76 100644
--- a/app/javascript/mastodon/locales/en.json
+++ b/app/javascript/mastodon/locales/en.json
@@ -4,6 +4,7 @@
   "account.badges.adult": "🔞 Adult content",
   "account.badges.gently": "Gentlies kobolds",
   "account.badges.kobold": "Gently the kobold",
+  "account.badges.locked": "🔒 Locked",
   "account.block": "Block @{name}",
   "account.block_domain": "Hide {domain}",
   "account.blocked": "Blocked",