Dev tools settings

components/tailored/messaging/message/reactions/Reactions.vue

@@ -104,7 +104,7 @@ export default Vue.extend({
      * @example
      */
     didIReact(reaction: any) {
-      return reaction.reactors.includes(this.$mock.user.name)
+      return reaction.reactors.includes(this.$store.state.accounts.details.textilePubkey)
     },
     getReactorsList(reactors: string[], limit = 3) {
       const numberOfReactors = reactors.length

components/tailored/settings/Sidebar.vue

@@ -87,6 +87,10 @@ export default Vue.extend({
               to: 'notifications',
               text: 'Notifications',
             },
+            {
+              to: 'info',
+              text: 'App Info',
+            },
           ] as Array<SidebarLink>,
         } as SidebarGrouping,
       ],

components/tailored/settings/modal/Modal.html

@@ -19,6 +19,7 @@
         <TailoredSettingsPagesAccounts v-if="page === 'accounts'" />
         <TailoredSettingsPagesAudio v-if="page === 'audio'" />
         <TailoredSettingsPagesDeveloper v-if="page === 'developer'" />
+        <TailoredSettingsPagesInfo v-if="page === 'info'" />
         <TailoredSettingsPagesKeybinds v-if="page === 'keybinds'" />
         <TailoredSettingsPagesNotifications v-if="page === 'notifications'" />
         <TailoredSettingsPagesProfile v-if="page === 'profile'" />

components/tailored/settings/pages/developer/index.vue

@@ -1,11 +1,11 @@
-<template src="./Developer.html" />
+<template src="./Info.html" />
 
 <script lang="ts">
 import Vue from 'vue'
 import { mapState } from 'vuex'
 
 export default Vue.extend({
-  name: 'DeveloperSettings',
+  name: 'InfoSettings',
   layout: 'settings',
   computed: {
     ...mapState(['accounts']),

components/tailored/settings/pages/info/Developer.html

@@ -0,0 +1,23 @@
+<div id="developer-settings">
+  <div class="columns is-desktop">
+    <div class="column">
+      <TypographyTitle :size="6" :text="$t('pages.settings.info.title')" />
+      <TypographySubtitle :size="6" :text="$t('pages.settings.info.subtitle')" />
+    </div>
+  </div>
+
+  <div class="columns is-desktop">
+    <div class="column">
+      <TypographyLabel :text="$t('pages.settings.app_info')" />
+      <br />
+<pre>
+App Version: {{ this.$config.clientVersion }}
+Browser:     {{ window.navigator.vendor }}, {{ window.navigator.product }}
+Language:    {{ window.navigator.product }}
+Platform:    {{ window.navigator.platform }}
+Online:      {{ window.navigator.onLine }}
+</pre>
+    </div>
+  </div>
+
+</div>

components/tailored/settings/pages/info/index.vue

@@ -0,0 +1,17 @@
+<template src="./Developer.html" />
+
+<script lang="ts">
+import Vue from 'vue'
+import { mapState } from 'vuex'
+
+export default Vue.extend({
+  name: 'DeveloperSettings',
+  layout: 'settings',
+  computed: {
+    ...mapState(['accounts']),
+    window() {
+      return window
+    },
+  },
+})
+</script>