Merge remote-tracking branch 'origin/develop' into threecolumn

* origin/develop:
  Fix active popover style
  Use panel text instead of text for shoutbox icon
  Fix dropdown menu style inside panel header
  Fix phoenix sockets in dev mode
  Fix no reactivity on vuex 4 values
  fix tegulu
  heck
  fix i18n for good??
  force runtime build of i18n
  fix CSP by compiling the i18n templates as well

src/App.js

@@ -65,7 +65,7 @@ export default {
         }
       }
     },
-    shout () { return this.$store.state.shout.channel.state === 'joined' },
+    shout () { return this.$store.state.shout.joined },
     suggestionsEnabled () { return this.$store.state.instance.suggestionsEnabled },
     showInstanceSpecificPanel () {
       return this.$store.state.instance.showInstanceSpecificPanel &&

src/components/popover/popover.vue

@@ -149,5 +149,30 @@
     }
 
   }
+
+  .button-default.dropdown-item {
+    &,
+    i[class*=icon-] {
+      color: $fallback--text;
+      color: var(--btnText, $fallback--text);
+    }
+
+    &:active {
+      background-color: $fallback--lightBg;
+      background-color: var(--selectedMenuPopover, $fallback--lightBg);
+      color: $fallback--link;
+      color: var(--selectedMenuPopoverText, $fallback--link);
+    }
+
+    &:disabled {
+      color: $fallback--text;
+      color: var(--btnDisabledText, $fallback--text);
+    }
+
+    &.toggled {
+      color: $fallback--text;
+      color: var(--btnToggledText, $fallback--text);
+    }
+  }
 }
 </style>

src/components/shout_panel/shout_panel.vue

@@ -98,7 +98,7 @@
 
     .icon {
       color: $fallback--text;
-      color: var(--text, $fallback--text);
+      color: var(--panelText, $fallback--text);
       margin-right: 0.5em;
     }
 

src/components/side_drawer/side_drawer.js

@@ -49,7 +49,7 @@ const SideDrawer = {
     currentUser () {
       return this.$store.state.users.currentUser
     },
-    shout () { return this.$store.state.shout.channel.state === 'joined' },
+    shout () { return this.$store.state.shout.joined },
     unseenNotifications () {
       return unseenNotificationsFromStore(this.$store)
     },

src/i18n/messages.js

@@ -41,12 +41,12 @@ const loaders = {
 const messages = {
   languages: ['en', ...Object.keys(loaders)],
   default: {
-    en: require('./en.json')
+    en: require('./en.json').default
   },
   setLanguage: async (i18n, language) => {
     if (loaders[language]) {
       let messages = await loaders[language]()
-      i18n.setLocaleMessage(language, messages)
+      i18n.setLocaleMessage(language, messages.default)
     }
     i18n.locale = language
   }

src/i18n/te.json

@@ -49,7 +49,7 @@
   "notifications.repeated_you": "మీ స్థితిని పునరావృతం చేసారు",
   "notifications.no_more_notifications": "ఇక నోటిఫికేషన్లు లేవు",
   "post_status.new_status": "క్రొత్త స్థితిని పోస్ట్ చేయండి",
-  "post_status.account_not_locked_warning": "మీ ఖాతా {౦} కాదు. ఎవరైనా మిమ్మల్ని అనుసరించి అనుచరులకు మాత్రమే ఉద్దేశించిన పోస్టులను చూడవచ్చు.",
+  "post_status.account_not_locked_warning": "మీ ఖాతా {0} కాదు. ఎవరైనా మిమ్మల్ని అనుసరించి అనుచరులకు మాత్రమే ఉద్దేశించిన పోస్టులను చూడవచ్చు.",
   "post_status.account_not_locked_warning_link": "తాళం వేయబడినది",
   "post_status.attachments_sensitive": "జోడింపులను సున్నితమైనవిగా గుర్తించండి",
   "post_status.content_type.text/plain": "సాధారణ అక్షరాలు",

src/modules/shout.js

@@ -1,7 +1,8 @@
 const shout = {
   state: {
     messages: [],
-    channel: { state: '' }
+    channel: { state: '' },
+    joined: false
   },
   mutations: {
     setChannel (state, channel) {
@@ -13,11 +14,23 @@ const shout = {
     },
     setMessages (state, messages) {
       state.messages = messages.slice(-19, 20)
+    },
+    setJoined (state, joined) {
+      state.joined = joined
     }
   },
   actions: {
     initializeShout (store, socket) {
       const channel = socket.channel('chat:public')
+      channel.joinPush.receive('ok', () => {
+        store.commit('setJoined', true)
+      })
+      channel.onClose(() => {
+        store.commit('setJoined', false)
+      })
+      channel.onError(() => {
+        store.commit('setJoined', false)
+      })
       channel.on('new_msg', (msg) => {
         store.commit('addMessage', msg)
       })