From c17e6f0f6d92265ee2834d4d2688017e5e4bad4a Mon Sep 17 00:00:00 2001
From: Tamius Han <tamius.han@gmail.com>
Date: Sat, 16 May 2020 20:31:56 +0200
Subject: [PATCH] Discern popup of dev/nightly/testing versions from stable
 version

---
 src/ext/conf/BrowserDetect.js |  1 +
 src/popup/App.vue             | 20 +++++++++++++++++++-
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/src/ext/conf/BrowserDetect.js b/src/ext/conf/BrowserDetect.js
index d1cad75..1ab3508 100644
--- a/src/ext/conf/BrowserDetect.js
+++ b/src/ext/conf/BrowserDetect.js
@@ -8,6 +8,7 @@ const BrowserDetect = {
   chrome: process.env.BROWSER === 'chrome',
   edge: process.env.BROWSER === 'edge',
   processEnvBrowser: process.env.BROWSER,
+  processEnvChannel: process.env.CHANNEL,
 } 
 
 if (process.env.CHANNEL !== 'stable') {
diff --git a/src/popup/App.vue b/src/popup/App.vue
index 7f060ec..228f2e5 100644
--- a/src/popup/App.vue
+++ b/src/popup/App.vue
@@ -2,8 +2,11 @@
   <div v-if="settingsInitialized" 
        class="popup flex flex-column no-overflow"
   >
-    <div class="header flex-row flex-nogrow flex-noshrink">
+    <div class="header flex-row flex-nogrow flex-noshrink relative">
       <span class="smallcaps">Ultrawidify</span>: <small>Quick settings</small>
+      <div class="absolute channel-info" v-if="BrowserDetect.processEnvChannel !== 'stable'">
+        Build channel: {{BrowserDetect.processEnvChannel}}
+      </div>
     </div>
 
     <div class="flex flex-row body no-overflow flex-grow">
@@ -202,6 +205,7 @@ export default {
       videoTabDisabled: false,
       canShowVideoTab: {canShow: true, warning: true},
       showWhatsNew: false,
+      BrowserDetect: BrowserDetect,
     }
   },
   async created() {
@@ -240,6 +244,7 @@ export default {
     DefaultSettingsPanel,
     PerformancePanel,
     Debug,
+    BrowserDetect,
     AboutPanel,
     Donate,
     SiteDetailsPanel,
@@ -582,4 +587,17 @@ html, body {
   // width: 800px;
   height: 600px;
 }
+
+.relative {
+  position: relative;
+}
+.absolute {
+  position: absolute;
+}
+.channel-info {
+  height: 0px;
+  right: 1.5rem;
+  bottom: 0.85rem;
+  font-size: 0.75rem;
+}
 </style>