Merge pull request #2175 from MetRonnie/version-info

Add workflow Cylc version to toolbar and menu

Author: oliver-sanders

src/components/cylc/commandMenu/Menu.vue

@@ -226,6 +226,9 @@ export default {
         ret += ' • '
         if (this.node.type === 'workflow') {
           ret += upperFirst(this.node.node.statusMsg || this.node.node.status || 'state unknown')
+          if (this.node.node.cylcVersion) {
+            ret += ` • Cylc ${this.node.node.cylcVersion}`
+          }
         } else {
           ret += upperFirst(this.node.node.state || 'state unknown')
           if (this.node.node.isHeld) {

src/components/cylc/workspace/Toolbar.vue

@@ -85,13 +85,20 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
       </div>
 
       <!-- n-window selector -->
-      <v-chip
+      <v-btn
         :disabled="isStopped"
-        link
+        variant="tonal"
+        rounded
         size="small"
         data-cy="n-win-selector"
       >
         N={{ nWindow }}
+        <template #append>
+          <v-icon
+            :icon="$options.icons.mdiChevronDown"
+            class="mx-n1"
+          />
+        </template>
         <v-menu
           activator="parent"
           :close-on-content-click="false"
@@ -122,11 +129,11 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
             </v-card-text>
           </v-card>
         </v-menu>
-      </v-chip>
+      </v-btn>
 
       <!-- workflow status message -->
-      <span class="status-msg text-md-body-1 text-body-2">
-        {{ statusMsg }}
+      <span class="status-msg text-body-2">
+        {{ statusAndVersion }}
       </span>
 
       <v-spacer class="mx-0" />
@@ -207,7 +214,8 @@ import {
   mdiPlusBoxMultiple,
   mdiStop,
   mdiViewList,
-  mdiAccount
+  mdiAccount,
+  mdiChevronDown,
 } from '@mdi/js'
 import { startCase } from 'lodash'
 import { until } from '@/utils'
@@ -221,6 +229,7 @@ import subscriptionComponentMixin from '@/mixins/subscriptionComponent'
 import SubscriptionQuery from '@/model/SubscriptionQuery.model'
 import gql from 'graphql-tag'
 import { eventBus } from '@/services/eventBus'
+import { upperFirst } from 'lodash-es'
 
 const QUERY = gql(`
 subscription Workflow ($workflowId: ID) {
@@ -242,6 +251,7 @@ fragment WorkflowData on Workflow {
   status
   statusMsg
   nEdgeDistance
+  cylcVersion
 }
 
 fragment AddedDelta on Added {
@@ -341,8 +351,12 @@ export default {
         this.currentWorkflow.node.status === WorkflowState.STOPPED.name
       )
     },
-    statusMsg () {
-      return this.currentWorkflow.node.statusMsg || ''
+    statusAndVersion () {
+      let ret = upperFirst(this.currentWorkflow.node.statusMsg || '')
+      if (this.currentWorkflow.node.cylcVersion) {
+        ret += ` • Cylc ${this.currentWorkflow.node.cylcVersion}`
+      }
+      return ret
     },
     enabled () {
       // object holding the states of controls that are supposed to be enabled
@@ -456,7 +470,8 @@ export default {
     run: mdiPlay,
     stop: mdiStop,
     mdiCog,
-    mdiAccount
+    mdiAccount,
+    mdiChevronDown,
   },
 }
 </script>

src/services/mock/json/workflows/multi.json

@@ -65,6 +65,7 @@
           "statusMsg": "paused",
           "owner": "user",
           "host": "ncc1701.starfleet.gov",
+          "cylcVersion": "8.5.0.dev",
           "port": 43078,
           "stateTotals": {
             "waiting": 2,

src/services/mock/json/workflows/one.json

@@ -7,6 +7,7 @@
         "owner": "user",
         "host": "localhost",
         "port": 43079,
+        "cylcVersion": "8.4.2",
         "status": "running",
         "statusMsg": "running",
         "stateTotals": {