Pull request #79: Admin updates

Merge in COSMOSEE/base from admin_updates to master

* commit '9cba0e2392ca68298a92abfbc91f98420e7208cf':
  Remove extra alert. Fix script options
  destroy not undeploy
  Add edit Dialog
  admin updates

Author: jmthomas

cosmos-cmd-tlm-api/app/models/notifications_api.rb

@@ -30,7 +30,7 @@ def initialize(uuid, channel, history_count = 0, start_offset = nil, scope: nil,
     else
       topics = ["cosmos_notifications"]
     end
-    start_offsets = [start_offset] if start_offset
+    start_offsets = [start_offset] if start_offset and start_offset != 'undefined'
     @thread = TopicsThread.new(topics, channel, history_count, offsets: start_offsets, transmit_msg_id: true)
     @thread.start
   end

cosmos-frontend-init/cosmosc2-tool-base/package-lock.json

@@ -36,7 +36,7 @@
 		"vuetify-loader": "1.7.2",
 		"webpack": "5.30.0",
 		"webpack-cli": "4.6.0",
-		"webpack-config-single-spa": "2.1.1",
+		"webpack-config-single-spa": "2.2.1",
 		"webpack-dev-server": "4.0.0-beta.2",
 		"webpack-merge": "5.7.3"
 	}

cosmos-frontend-init/cosmosc2-tool-base/package.json

@@ -22,7 +22,7 @@
     Learn more about CSP policies at https://content-security-policy.com/#directive
   -->
   <meta http-equiv="Content-Security-Policy"
-    content="default-src 'self' blob: data: https: localhost:*; script-src 'unsafe-inline' 'unsafe-eval' https: localhost:*; connect-src https: localhost:* ws://localhost:*; style-src 'unsafe-inline' https:; object-src 'none';">
+    content="default-src 'self' blob: data: https: localhost:*; script-src 'unsafe-inline' 'unsafe-eval' https: localhost:*; connect-src https: localhost:* ws://localhost:*; style-src 'unsafe-inline' https: localhost:*; object-src 'none';">
 
   <meta name="importmap-type" content="systemjs-importmap" />
   <!-- If you wish to turn off import-map-overrides for specific environments (prod), uncomment the line below -->

cosmos-frontend-init/cosmosc2-tool-base/src/index.ejs

@@ -1,4 +1,4 @@
-const { merge } = require('webpack-merge')
+const { mergeWithRules } = require('webpack-merge')
 const singleSpaDefaults = require('webpack-config-single-spa')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
@@ -20,7 +20,15 @@ module.exports = (webpackConfigEnv, argv) => {
     disableHtmlGeneration: true,
   })
 
-  return merge(defaultConfig, {
+  return mergeWithRules({
+    module: {
+      rules: {
+        test: 'match',
+        use: 'replace',
+        loader: 'replace',
+      },
+    },
+  })(defaultConfig, {
     // modify the webpack config however you'd like to by adding to this object
     output: {
       path: path.resolve(__dirname, 'tools/base'),
@@ -41,6 +49,11 @@ module.exports = (webpackConfigEnv, argv) => {
     module: {
       rules: [
         // ... other rules
+        {
+          test: /\.html$/i,
+          exclude: /node_modules/,
+          use: { loader: 'vue-loader' },
+        },
         {
           test: /\.vue$/,
           loader: 'vue-loader',

cosmos-frontend-init/cosmosc2-tool-base/webpack.config.js

@@ -0,0 +1,78 @@
+<!--
+# Copyright 2021 Ball Aerospace & Technologies Corp.
+# All Rights Reserved.
+#
+# This program is free software; you can modify and/or redistribute it
+# under the terms of the GNU Affero General Public License
+# as published by the Free Software Foundation; version 3 with
+# attribution addendums as found in the LICENSE.txt
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU Affero General Public License for more details.
+#
+# This program may also be used under the terms of a commercial or
+# enterprise edition license of COSMOS if purchased from the
+# copyright holder
+-->
+
+<template>
+  <v-dialog persistent v-model="show" width="600">
+    <v-card class="pa-3">
+      <v-card-title class="headline">{{ title }}</v-card-title>
+      <v-card-text>
+        <v-form ref="form" @submit.prevent="$emit('submit', json_content)">
+          <v-textarea
+            autofocus
+            solo
+            v-model="json_content"
+            rows="20"
+            :readonly="readonly"
+          ></v-textarea>
+          <v-btn color="primary" type="submit">Ok</v-btn>
+          &nbsp;&nbsp;
+          <v-btn color="primary" type="submit" @click="json_content = null"
+            >Cancel</v-btn
+          >
+        </v-form>
+      </v-card-text>
+    </v-card>
+  </v-dialog>
+</template>
+
+<script>
+export default {
+  props: {
+    content: {
+      type: String,
+      required: true,
+    },
+    title: String,
+    value: Boolean, // value is the default prop when using v-model
+    readonly: Boolean,
+  },
+  data() {
+    return {
+      json_content: this.content,
+    }
+  },
+  computed: {
+    show: {
+      get() {
+        return this.value
+      },
+      set(value) {
+        this.$emit('input', value) // input is the default event when using v-model
+      },
+    },
+  },
+}
+</script>
+
+<style scoped>
+.theme--dark .v-card__title,
+.theme--dark .v-card__subtitle {
+  background-color: var(--v-secondary-darken3);
+}
+</style>

cosmos-frontend-init/packages/cosmosc2-tool-admin/src/tools/CosmosAdmin/EditDialog.vue

@@ -19,6 +19,13 @@
 
 <template>
   <div>
+    <v-alert
+      :type="alertType"
+      v-model="showAlert"
+      dismissible
+      transition="scale-transition"
+      >{{ alert }}</v-alert
+    >
     <v-list data-test="interfaceList">
       <v-list-item
         v-for="cosmos_interface in interfaces"
@@ -27,6 +34,19 @@
         <v-list-item-content>
           <v-list-item-title v-text="cosmos_interface"></v-list-item-title>
         </v-list-item-content>
+        <v-list-item-icon>
+          <v-tooltip bottom>
+            <template v-slot:activator="{ on, attrs }">
+              <v-icon
+                @click="showInterface(cosmos_interface)"
+                v-bind="attrs"
+                v-on="on"
+                >mdi-eye</v-icon
+              >
+            </template>
+            <span>Show Interface Details</span>
+          </v-tooltip>
+        </v-list-item-icon>
         <v-list-item-icon>
           <v-tooltip bottom>
             <template v-slot:activator="{ on, attrs }">
@@ -49,19 +69,30 @@
       transition="scale-transition"
       >{{ alert }}</v-alert
     >
+    <EditDialog
+      :content="json_content"
+      title="Interface Details"
+      :readonly="true"
+      v-model="showDialog"
+      v-if="showDialog"
+      @submit="dialogCallback"
+    />
   </div>
 </template>
 
 <script>
 import Api from '@cosmosc2/tool-common/src/services/api'
+import EditDialog from '@/tools/CosmosAdmin/EditDialog'
 export default {
-  components: {},
+  components: { EditDialog },
   data() {
     return {
       interfaces: [],
       alert: '',
       alertType: 'success',
       showAlert: false,
+      json_content: '',
+      showDialog: false,
     }
   },
   mounted() {
@@ -83,6 +114,25 @@ export default {
         })
     },
     add() {},
+    showInterface(name) {
+      var self = this
+      Api.get('/cosmos-api/interfaces/' + name)
+        .then((response) => {
+          self.json_content = JSON.stringify(response.data, null, 1)
+          self.showDialog = true
+        })
+        .catch((error) => {
+          self.alert = error
+          self.alertType = 'error'
+          self.showAlert = true
+          setTimeout(() => {
+            self.showAlert = false
+          }, 5000)
+        })
+    },
+    dialogCallback(content) {
+      this.showDialog = false
+    },
     deleteInterface(name) {
       var self = this
       this.$dialog

cosmos-frontend-init/packages/cosmosc2-tool-admin/src/tools/CosmosAdmin/InterfacesTab.vue

@@ -19,6 +19,13 @@
 
 <template>
   <div>
+    <v-alert
+      :type="alertType"
+      v-model="showAlert"
+      dismissible
+      transition="scale-transition"
+      >{{ alert }}</v-alert
+    >
     <v-list data-test="microserviceList">
       <v-list-item v-for="microservice in microservices" :key="microservice">
         <v-list-item-content>
@@ -30,6 +37,19 @@
             {{ microservice_status[microservice].error }}
           </v-list-item-subtitle>
         </v-list-item-content>
+        <v-list-item-icon>
+          <v-tooltip bottom>
+            <template v-slot:activator="{ on, attrs }">
+              <v-icon
+                @click="editMicroservice(microservice)"
+                v-bind="attrs"
+                v-on="on"
+                >mdi-pencil</v-icon
+              >
+            </template>
+            <span>Edit Microservice</span>
+          </v-tooltip>
+        </v-list-item-icon>
         <v-list-item-icon>
           <v-tooltip bottom>
             <template v-slot:activator="{ on, attrs }">
@@ -45,28 +65,38 @@
         </v-list-item-icon>
       </v-list-item>
     </v-list>
-
     <v-alert
       :type="alertType"
       v-model="showAlert"
       dismissible
       transition="scale-transition"
       >{{ alert }}</v-alert
     >
+    <EditDialog
+      :content="json_content"
+      title="Edit Microservice"
+      v-model="showDialog"
+      v-if="showDialog"
+      @submit="dialogCallback"
+    />
   </div>
 </template>
 
 <script>
 import Api from '@cosmosc2/tool-common/src/services/api'
+import EditDialog from '@/tools/CosmosAdmin/EditDialog'
 export default {
-  components: {},
+  components: { EditDialog },
   data() {
     return {
       microservices: [],
       microservice_status: {},
+      microservice_id: null,
       alert: '',
       alertType: 'success',
       showAlert: false,
+      json_content: '',
+      showDialog: false,
     }
   },
   mounted() {
@@ -100,6 +130,53 @@ export default {
         })
     },
     add() {},
+    editMicroservice(name) {
+      var self = this
+      Api.get('/cosmos-api/microservices/' + name)
+        .then((response) => {
+          self.microservice_id = name
+          self.json_content = JSON.stringify(response.data, null, 1)
+          self.showDialog = true
+        })
+        .catch((error) => {
+          self.alert = error
+          self.alertType = 'error'
+          self.showAlert = true
+          setTimeout(() => {
+            self.showAlert = false
+          }, 5000)
+        })
+    },
+    dialogCallback(content) {
+      this.showDialog = false
+      if (content !== null) {
+        let parsed = JSON.parse(content)
+        let method = 'put'
+        let url = '/cosmos-api/microservices/' + this.microservice_id
+        if (parsed['name'] !== this.microservice_id) {
+          method = 'post'
+          url = '/cosmos-api/microservices'
+        }
+
+        Api[method](url, {
+          json: content,
+        })
+          .then((response) => {
+            this.alert = 'Modified Microservice'
+            this.alertType = 'success'
+            this.showAlert = true
+            setTimeout(() => {
+              this.showAlert = false
+            }, 5000)
+            this.update()
+          })
+          .catch((error) => {
+            this.alert = error
+            this.alertType = 'error'
+            this.showAlert = true
+          })
+      }
+    },
     deleteMicroservice(name) {
       var self = this
       this.$dialog