Display UI version in the footer

.github/workflows/build_docker_images.yml

@@ -54,6 +54,10 @@ jobs:
               - 'airlock_processor/**/*'
             airlock_processor_version:
               - 'airlock_processor/_version.py'
+            ui_app:
+              - 'ui/app/**/*'
+            ui_app_version:
+              - 'ui/app/package.json'
 
       - name: "Stale version: api"
         if: ${{ steps.filter.outputs.api == 'true' &&
@@ -80,6 +84,11 @@ jobs:
           steps.filter.outputs.airlock_processor_version == 'false' }}
         run: echo "::error::Code update without version change" && exit 1
 
+      - name: "Stale version: ui_app"
+        if: ${{ steps.filter.outputs.ui_app == 'true' &&
+          steps.filter.outputs.ui_app_version == 'false' }}
+        run: echo "::error::Code update without version change" && exit 1
+
       - name: Set up Docker Buildx
         id: buildx
         uses: docker/setup-buildx-action@v2

CHANGELOG.md

@@ -27,9 +27,10 @@ ENHANCEMENTS:
 * Add additional fields for Airlock Notification event ([#2798](https://github.com/microsoft/AzureTRE/pull/2798))
 * Fail firewall database migration if there's no firewall deployed ([#2792](https://github.com/microsoft/AzureTRE/pull/2792))
 * Added optional parameter to allow a client to retrieve a template by name and version ([#2802](https://github.com/microsoft/AzureTRE/pull/2802))
-* Added support for `allOf` usage in Resource Templates - both across the API and the UI. This allows a template author to specify certain fields as being conditionally present / conditionally required, and means we can tidy up some of the resource creation forms substantially. ([#2795](https://github.com/microsoft/AzureTRE/pull/2795)).
+* Added support for `allOf` usage in Resource Templates - both across the API and the UI. This allows a template author to specify certain fields as being conditionally present / conditionally required, and means we can tidy up some of the resource creation forms substantially ([#2795](https://github.com/microsoft/AzureTRE/pull/2795)).
 * As part of the above change, the `auto_create` string passed to the `client_id` field in each Workspace template has now moved to an `auth_type` enum field, where the user can select the authentication type from a dropdown.
-* Adds extra dns zones and links into core network
+* Adds extra dns zones and links into core network ([#2828](https://github.com/microsoft/AzureTRE/pull/2828)).
+* Add UI version to its footer card ([#2849](https://github.com/microsoft/AzureTRE/pull/2849)).
 
 BUG FIXES:
 * Show the correct createdBy value for airlock requests in UI and in API queries ([#2779](https://github.com/microsoft/AzureTRE/pull/2779))

devops/scripts/build_deploy_ui.sh

@@ -8,13 +8,16 @@ DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" >/dev/null 2>&1 && pwd )"
 
 pushd "$DIR/../../ui/app"
 
+ui_version=$(jq -r '.version' package.json)
+
 # replace the values in the config file
 jq --arg rootClientId "${SWAGGER_UI_CLIENT_ID}" \
   --arg rootTenantId "${AAD_TENANT_ID}" \
   --arg treApplicationId "api://${API_CLIENT_ID}" \
   --arg treUrl "https://${FQDN}/api" \
   --arg treId "${TRE_ID}" \
-  '.rootClientId = $rootClientId | .rootTenantId = $rootTenantId | .treApplicationId = $treApplicationId | .treUrl = $treUrl | .treId = $treId' ./src/config.source.json > ./src/config.json
+  --arg version "${ui_version}" \
+  '.rootClientId = $rootClientId | .rootTenantId = $rootTenantId | .treApplicationId = $treApplicationId | .treUrl = $treUrl | .treId = $treId | .version = $version' ./src/config.source.json > ./src/config.json
 
 # build and deploy the app
 yarn install

ui/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tre-ui",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": true,
   "dependencies": {
     "@azure/msal-browser": "^2.24.0",

ui/app/src/components/shared/Footer.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
 import { AnimationClassNames, Callout, IconButton, FontWeights, Stack, Text, getTheme, mergeStyles, mergeStyleSets, StackItem } from '@fluentui/react';
 import { HttpMethod, useAuthApiCall } from '../../hooks/useAuthApiCall';
 import { ApiEndpoint } from '../../models/apiEndpoints';
+import config from "../../config.json";
 
 // TODO:
 // - change text to link
@@ -50,6 +51,10 @@ export const Footer: React.FunctionComponent = () => {
                   <Stack.Item style={calloutKeyStyles}>API Version:</Stack.Item>
                   <Stack.Item style={calloutValueStyles}>{apiMetadata.api_version}</Stack.Item>
                 </Stack>
+                <Stack horizontal tokens={{ childrenGap: 5 }}>
+                  <Stack.Item style={calloutKeyStyles}>UI Version:</Stack.Item>
+                  <Stack.Item style={calloutValueStyles}>{config.version}</Stack.Item>
+                </Stack>
               </Stack.Item>
             </Stack>
           </Text>

ui/app/src/config.source.json

@@ -5,5 +5,6 @@
     "treUrl": "https://my-tre.northeurope.cloudapp.azure.com/api",
     "pollingDelayMilliseconds": 10000,
     "treId": "my-tre",
-    "debug": false
+    "debug": false,
+    "version": "0.0.0"
 }