feat(header): mark Research Edition builds (#941)

* feat(header): mark Research Edition builds

* test(header): cover build flag rendering path

Author: TimeToBuildBob

.eslintrc.json

@@ -56,7 +56,8 @@
   "globals": {
     "PRODUCTION": false,
     "AW_SERVER_URL": false,
-    "COMMIT_HASH": false
+    "COMMIT_HASH": false,
+    "AW_RESEARCH_EDITION": false
   },
   "overrides": [
     {

src/components/Header.vue

@@ -6,6 +6,7 @@ div(:class="{'fixed-top-padding': fixedTopMenu}")
       b-navbar-brand(to="/" style="background-color: transparent;")
         img.aligh-middle(src="/logo.png" style="height: 1.5em;")
         span.ml-2.align-middle(style="font-size: 1em; color: #000;") {{ $t('app.name') }}
+        b-badge.ml-2.align-middle(v-if="researchEdition" variant="info" data-testid="research-edition-badge") {{ $t('app.researchEdition') }}
 
     b-navbar-toggle(target="nav-collapse")
 
@@ -47,6 +48,7 @@ div(:class="{'fixed-top-padding': fixedTopMenu}")
         b-navbar-brand(to="/" style="background-color: transparent;")
           img.ml-0.aligh-middle(src="/logo.png" style="height: 1.5em;")
           span.ml-2.align-middle(style="font-size: 1.0em; color: #000;") {{ $t('app.name') }}
+          b-badge.ml-2.align-middle(v-if="researchEdition" variant="info" data-testid="research-edition-badge") {{ $t('app.researchEdition') }}
 
       b-navbar-nav.ml-auto
         b-nav-item-dropdown
@@ -137,6 +139,7 @@ export default {
     return {
       activityViews: null,
       fixedTopMenu: this.$isAndroid,
+      researchEdition: typeof AW_RESEARCH_EDITION !== 'undefined' && AW_RESEARCH_EDITION,
     };
   },
   computed: {

src/globals.d.ts

@@ -5,6 +5,7 @@
 declare const PRODUCTION: boolean;
 declare const AW_SERVER_URL: string;
 declare const COMMIT_HASH: string;
+declare const AW_RESEARCH_EDITION: boolean;
 // JSON-encoded preset category sets shipped by this build (empty string if none).
 // See src/util/presetCategories.ts
 declare const AW_PRESET_CATEGORY_SETS: string;

src/i18n/locales/de.ts

@@ -1,6 +1,7 @@
 export default {
   app: {
     name: 'ActivityWatch',
+    researchEdition: 'Research Edition',
   },
   nav: {
     activity: 'Aktivität',

src/i18n/locales/en.ts

@@ -1,6 +1,7 @@
 export default {
   app: {
     name: 'ActivityWatch',
+    researchEdition: 'Research Edition',
   },
   nav: {
     activity: 'Activity',

src/i18n/locales/ru.ts

@@ -1,6 +1,7 @@
 export default {
   app: {
     name: 'ActivityWatch',
+    researchEdition: 'Research Edition',
   },
   nav: {
     activity: 'Активность',

src/i18n/locales/uk.ts

@@ -1,6 +1,7 @@
 export default {
   app: {
     name: 'ActivityWatch',
+    researchEdition: 'Research Edition',
   },
   nav: {
     activity: 'Активність',

src/i18n/locales/zh-CN.ts

@@ -2,6 +2,7 @@
 export default {
   app: {
     name: 'ActivityWatch',
+    researchEdition: 'Research Edition',
   },
   nav: {
     activity: '活动',

test/unit/Header.test.js

@@ -0,0 +1,69 @@
+import { shallowMount } from '@vue/test-utils';
+import { createPinia, setActivePinia } from 'pinia';
+import Header from '~/components/Header.vue';
+
+const mockEnsureLoaded = jest.fn().mockResolvedValue(undefined);
+const passthroughStub = { template: '<div><slot /></div>' };
+
+jest.mock('~/stores/buckets', () => ({
+  useBucketsStore: () => ({
+    ensureLoaded: mockEnsureLoaded,
+    buckets: [],
+  }),
+}));
+
+describe('Header research edition badge', () => {
+  afterEach(() => {
+    delete global.AW_RESEARCH_EDITION;
+  });
+
+  beforeEach(() => {
+    setActivePinia(createPinia());
+    mockEnsureLoaded.mockClear();
+  });
+
+  function mountHeader(buildFlag) {
+    if (buildFlag === undefined) {
+      delete global.AW_RESEARCH_EDITION;
+    } else {
+      global.AW_RESEARCH_EDITION = buildFlag;
+    }
+
+    return shallowMount(Header, {
+      mocks: {
+        $isAndroid: false,
+        $t: key => key,
+      },
+      stubs: {
+        'b-navbar': passthroughStub,
+        'b-navbar-nav': passthroughStub,
+        'b-navbar-brand': passthroughStub,
+        'b-navbar-toggle': passthroughStub,
+        'b-collapse': passthroughStub,
+        'b-nav-item': passthroughStub,
+        'b-nav-item-dropdown': passthroughStub,
+        'b-dropdown-item': passthroughStub,
+        'b-badge': passthroughStub,
+        icon: passthroughStub,
+      },
+    });
+  }
+
+  test('renders a badge in both brand sites for research builds', () => {
+    const wrapper = mountHeader(true);
+
+    expect(wrapper.findAll('[data-testid="research-edition-badge"]')).toHaveLength(2);
+  });
+
+  test('renders no badge for standard builds', () => {
+    const wrapper = mountHeader(false);
+
+    expect(wrapper.findAll('[data-testid="research-edition-badge"]')).toHaveLength(0);
+  });
+
+  test('renders no badge when the build flag is absent', () => {
+    const wrapper = mountHeader(undefined);
+
+    expect(wrapper.findAll('[data-testid="research-edition-badge"]')).toHaveLength(0);
+  });
+});

vite.config.js

@@ -91,6 +91,7 @@ export default defineConfig(({ mode }) => {
       PRODUCTION,
       AW_SERVER_URL: process.env.AW_SERVER_URL,
       COMMIT_HASH: process.env.COMMIT_HASH,
+      AW_RESEARCH_EDITION: process.env.AW_RESEARCH_EDITION === 'true',
       // Optional JSON preset category sets shipped by this build (see src/util/presetCategories.ts)
       AW_PRESET_CATEGORY_SETS: JSON.stringify(process.env.AW_PRESET_CATEGORY_SETS || ''),
       'process.env.VUE_APP_ON_ANDROID': process.env.VUE_APP_ON_ANDROID,