Merge pull request #1804 from MetRonnie/userprofile

Mock server: update introspection query & userprofile responses

Author: oliver-sanders

src/components/cylc/Drawer.vue

@@ -28,7 +28,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
       <v-list
         class="pa-0 d-flex flex-column"
       >
-        <c-header :user="user.username" />
+        <c-header />
 
         <v-list-item
           to="/"
@@ -69,7 +69,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 <script>
 import Header from '@/components/cylc/Header.vue'
-import { mapMutations, mapState } from 'vuex'
+import { mapMutations } from 'vuex'
 import Workflows from '@/views/Workflows.vue'
 import { mdiHome, mdiGraphql } from '@mdi/js'
 import pkg from '@/../package.json'
@@ -94,7 +94,6 @@ export default {
   },
 
   computed: {
-    ...mapState('user', ['user']),
     drawer: {
       get () {
         return this.$store.state.app.drawer

src/components/cylc/Header.vue

@@ -149,10 +149,3 @@ const showGoButton = computed(() => (
 ))
 
 </script>
-
-<style>
-/* work around bug with v-combobox overflow https://github.com/vuetifyjs/vuetify/issues/17596 */
-  .v-combobox__selection {
-    overflow-x: hidden;
-  }
-</style>

src/components/cylc/workspace/Toolbar.vue

@@ -180,9 +180,6 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
         </v-avatar>
         <v-menu activator="parent">
           <v-card :title="user.username">
-            <v-card-subtitle v-if="user.admin">
-              Admin
-            </v-card-subtitle>
             <v-card-text>
               <v-btn
                 to="/user-profile"

src/lang/en-GB/UserProfile.json

@@ -1,9 +1,6 @@
 {
-  "tableHeader": "Your Profile",
-  "tableSubHeader": "This is a read-only view of your user",
+  "title": "Settings",
+  "yourProfile": "Your Profile",
   "username": "Username",
-  "administrator": "Administrator",
-  "groups": "Groups",
-  "created": "Created",
   "permissions": "Authorized Operations"
 }

src/lang/pt-BR/UserProfile.json

@@ -1,9 +1,6 @@
 {
-  "tableHeader": "Seu perfil de Usuário",
-  "tableSubHeader": "Esta é a lista (modo leitura) do perfil do seu usuário",
+  "title": "Configurações",
+  "yourProfile": "Seu perfil de Usuário",
   "username": "Nome de Usuário",
-  "administrator": "Administrador",
-  "groups": "Grupos",
-  "created": "Criado",
   "permissions": "Operações Autorizadas"
 }

src/model/User.model.js

@@ -1,4 +1,4 @@
-/**
+/*
  * Copyright (C) NIWA & British Crown (Met Office) & Contributors.
  *
  * This program is free software: you can redistribute it and/or modify
@@ -15,33 +15,37 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-/**
- * @typedef {object} User
- * @property {string} username - user name
- * @property {string[]} groups - user groups
- * @property {string} created - date when the user was created
- * @property {boolean} admin - whether the user is an administrator or not
- * @property {string} server - server URL
- * @property {string} owner - UIS owner
- * @property {string[]} permissions - list of permissions
- * @property {string} mode - single or multi user mode
- * @property {string} initials - user initials
- */
 export default class User {
-  constructor (username, groups, created, admin, server, owner, permissions, mode, initials) {
-    // the authenticated user
-    // (full info only available when authenticated via the hub)
+  constructor ({ username, owner, permissions, mode, initials, color }) {
+    /**
+     * @type {string}
+     */
     this.username = username
-    this.groups = groups
-    this.created = created
-    this.admin = admin
-    this.server = server || '?' // server can be unset
-    // the UIS owner
-    // (i.e. the user who's workflows we are looking at)
-    // (this might not be the authenticated user for multi-user setups)
+    /**
+     * the UIS owner (i.e. the user who's workflows we are looking at)
+     * (this might not be the authenticated user for multi-user setups)
+     * @type {string}
+     */
     this.owner = owner
+    /**
+     * list of permissions
+     * @type {string[]}
+     */
     this.permissions = permissions
+    /**
+     * single or multi user mode
+     * @type {string}
+     */
     this.mode = mode
+    /**
+     * user initials
+     * @type {string}
+     */
     this.initials = initials
+    /**
+     * user avatar color if set
+     * @type {string | null}
+     */
+    this.color = color
   }
 }

src/services/mock/json-server.cjs

@@ -51,8 +51,8 @@ server.ws('/subscriptions', (ws) => {
  * Render a response. This can be used to customize outputs,
  * map response parameters to other values.
  * @see https://www.rahulpnath.com/blog/setting-up-a-fake-rest-api-using-json-server/
- * @param req - express HTTP request
- * @param res - express HTTP response
+ * @param {import('express').Request} req - express HTTP request
+ * @param {import('express').Response} res - express HTTP response
  */
 router.render = async (req, res) => {
   // This is the original response.
@@ -65,11 +65,12 @@ router.render = async (req, res) => {
     } else {
       responseData = await graphql.handleGraphQLRequest(req)
     }
+    // NB: json-server returns 404 for requests that are not in the router
+    // but we have dynamic requests for the /graphql endpoint (i.e. no single
+    // data response) hence the status(200) below.
+    res.status(200)
   }
-  // NB: json-server returns 404 for requests that are not in db.json, but
-  //     we have dynamic requests for the /graphql endpoint (i.e. no single
-  //     data response) hence the status(200) below.
-  res.status(200).jsonp(responseData)
+  res.jsonp(responseData)
 }
 
 server.use(router)