Add build & versions info to about menu (jaegertracing#606)

* Added jaeger ui version to about menu

Signed-off-by: Alan Pinkert <alan.pinkert@gmail.com>

* Added Jaeger version info from config

Signed-off-by: Alan Pinkert <alan.pinkert@gmail.com>

* Removed extra 'v' from Jaeger version

Signed-off-by: Alan Pinkert <alan.pinkert@gmail.com>

* Changed to use short git commit hash

Signed-off-by: Alan Pinkert <alan.pinkert@gmail.com>

* Added test for missing coverage

Signed-off-by: Alan Pinkert <alan.pinkert@gmail.com>
Signed-off-by: vvvprabhakar <vvvprabhakar@gmail.com>

packages/jaeger-ui/src/components/App/TopNav.test.js

@@ -24,6 +24,9 @@ describe('<TopNav>', () => {
   const blogUrl = 'https://medium.com/jaegertracing/';
   const labelAbout = 'About Jaeger';
   const dropdownItems = [
+    {
+      label: 'Version 1',
+    },
     {
       label: 'Docs',
       url: 'http://jaeger.readthedocs.io/en/latest/',
@@ -111,16 +114,27 @@ describe('<TopNav>', () => {
     });
 
     describe('<CustomNavDropdown>', () => {
+      let subMenu;
+
       beforeEach(() => {
         wrapper = shallow(<TopNav.CustomNavDropdown {...configMenuGroup} />);
+        subMenu = shallow(wrapper.find('Dropdown').props().overlay);
+      });
+
+      it('renders sub-menu text', () => {
+        dropdownItems.slice(0, 0).forEach(itemConfig => {
+          const item = subMenu.find(`[text="${itemConfig.label}"]`);
+          expect(item.length).toBe(1);
+          expect(item.prop('disabled')).toBe(true);
+        });
       });
 
-      it('renders sub-menu items', () => {
-        const subMenu = shallow(wrapper.find('Dropdown').props().overlay);
-        dropdownItems.forEach(itemConfig => {
+      it('renders sub-menu links', () => {
+        dropdownItems.slice(1, 2).forEach(itemConfig => {
           const item = subMenu.find(`[href="${itemConfig.url}"]`);
           expect(item.length).toBe(1);
           expect(item.prop('target')).toBe(itemConfig.anchorTarget || '_blank');
+          expect(item.text()).toBe(itemConfig.label);
         });
       });
     });

packages/jaeger-ui/src/components/App/TopNav.tsx

@@ -68,19 +68,22 @@ if (getConfigValue('qualityMetrics.menuEnabled')) {
   });
 }
 
-function getItemLink(item: ConfigMenuItem) {
+function getItem(item: ConfigMenuItem) {
   const { label, anchorTarget, url } = item;
+  const link = (
+    <a href={url} target={anchorTarget || '_blank'} rel="noopener noreferrer">
+      {label}
+    </a>
+  );
   return (
-    <Menu.Item key={label}>
-      <a href={url} target={anchorTarget || '_blank'} rel="noopener noreferrer">
-        {label}
-      </a>
+    <Menu.Item key={label} disabled={!url}>
+      {url ? link : label}
     </Menu.Item>
   );
 }
 
 function CustomNavDropdown({ label, items }: ConfigMenuGroup) {
-  const menuItems = <Menu>{items.map(getItemLink)}</Menu>;
+  const menuItems = <Menu>{items.map(getItem)}</Menu>;
   return (
     <Dropdown overlay={menuItems} placement="bottomRight">
       <a>
@@ -103,7 +106,7 @@ export function TopNavImpl(props: Props) {
       <Menu theme="dark" mode="horizontal" selectable={false} className="ub-right" selectedKeys={[pathname]}>
         {menuItems.map(m => {
           if (isItem(m)) {
-            return getItemLink(m);
+            return getItem(m);
           }
           return (
             <Menu.Item key={m.label}>

packages/jaeger-ui/src/constants/default-config.tsx

@@ -15,6 +15,9 @@
 import deepFreeze from 'deep-freeze';
 
 import { FALLBACK_DAG_MAX_NUM_SERVICES } from './index';
+import getVersion from '../utils/version/get-version';
+
+const { version } = require('../../package.json');
 
 export default deepFreeze(
   Object.defineProperty(
@@ -57,6 +60,18 @@ export default deepFreeze(
               label: 'GitHub',
               url: 'https://github.com/jaegertracing/',
             },
+            {
+              label: `Jaeger ${getVersion().gitVersion}`,
+            },
+            {
+              label: `Commit ${getVersion().gitCommit.substring(0, 7)}`,
+            },
+            {
+              label: `Build ${getVersion().buildDate}`,
+            },
+            {
+              label: `Jaeger UI v${version}`,
+            },
           ],
         },
       ],

packages/jaeger-ui/src/constants/default-version.tsx

@@ -0,0 +1,19 @@
+// Copyright (c) 2020 Uber Technologies, Inc.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+export default Object.freeze({
+  gitCommit: '',
+  gitVersion: '',
+  buildDate: '',
+});

packages/jaeger-ui/src/utils/version/get-version.test.js

@@ -0,0 +1,77 @@
+// Copyright (c) 2020 Uber Technologies, Inc.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+/* eslint-disable no-console, import/first */
+
+import getVersion from './get-version';
+import defaultVersion from '../../constants/default-version';
+
+describe('getVersion()', () => {
+  const warnFn = jest.fn();
+  let oldWarn;
+
+  beforeAll(() => {
+    oldWarn = console.warn;
+    console.warn = warnFn;
+  });
+
+  beforeEach(() => {
+    warnFn.mockClear();
+  });
+
+  afterAll(() => {
+    console.warn = oldWarn;
+  });
+
+  describe('`window.getVersion` is not a function', () => {
+    beforeAll(() => {
+      window.getVersion = undefined;
+    });
+
+    it('warns once', () => {
+      getVersion();
+      expect(warnFn.mock.calls.length).toBe(1);
+      getVersion();
+      expect(warnFn.mock.calls.length).toBe(1);
+    });
+
+    it('returns the default version information', () => {
+      expect(getVersion()).toEqual(defaultVersion);
+    });
+  });
+
+  describe('`window.getVersion` is a function', () => {
+    let embedded;
+    let getJaegerVersion;
+
+    beforeEach(() => {
+      embedded = {};
+      getJaegerVersion = jest.fn(() => embedded);
+      window.getJaegerVersion = getJaegerVersion;
+    });
+
+    it('returns the default version information when the embedded version information is `null`', () => {
+      embedded = null;
+      expect(getVersion()).toEqual(defaultVersion);
+    });
+
+    it('returns the embedded version information when it is not `null`', () => {
+      embedded = {
+        a: '1',
+        b: '2',
+      };
+      expect(getVersion()).toEqual(embedded);
+    });
+  });
+});

packages/jaeger-ui/src/utils/version/get-version.tsx

@@ -0,0 +1,35 @@
+// Copyright (c) 2020 Uber Technologies, Inc.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import defaultVersion from '../../constants/default-version';
+
+let haveWarnedFactoryFn = false;
+
+export default function getVersion() {
+  const getJaegerVersion = window.getJaegerVersion;
+  if (typeof getJaegerVersion !== 'function') {
+    if (!haveWarnedFactoryFn) {
+      // eslint-disable-next-line no-console
+      console.warn('Embedded version information not available');
+      haveWarnedFactoryFn = true;
+    }
+    return { ...defaultVersion };
+  }
+  const embedded = getJaegerVersion();
+  if (!embedded) {
+    return { ...defaultVersion };
+  }
+
+  return { ...embedded };
+}

packages/jaeger-ui/typings/custom.d.ts

@@ -22,6 +22,7 @@ declare interface Window {
   __webpack_public_path__: string; // eslint-disable-line camelcase
   // For getting ui config
   getJaegerUiConfig?: () => Record<string, any>;
+  getJaegerVersion?: () => Record<string, any>;
 }
 
 // For inlined envvars