1 files changed, 11 insertions, 19 deletions

diff --git a/kamon-status/src/components/ModuleList.vue b/kamon-status/src/components/ModuleList.vue
index 746ccf16..eddc05d0 100644
--- a/kamon-status/src/components/ModuleList.vue
+++ b/kamon-status/src/components/ModuleList.vue
@@ -4,20 +4,19 @@
       <h3>Reporters</h3>
     </div>
     <div class="col-12 py-1" v-for="reporter in reporterModules" :key="reporter.name">
-      <module-card :moduleStatus="reporter" />
+      <module-status-card :module="reporter" />
     </div>
     <div v-if="!hasApmModule" class="col-12 py-1 apm-suggestion">
       <a href="https://kamon.io/" target="_blank">
-        <module-card :is-suggestion="true" :show-status-indicators="false" :moduleStatus="apmModuleSuggestion" />
+        <module-status-card :is-suggestion="true" :module="apmModuleSuggestion" />
       </a>
     </div>
 
-
     <div class="col-12 pt-4 pb-2" v-if="plainModules.length > 0">
       <h2>Modules</h2>
     </div>
     <div class="col-12 py-1" v-for="module in plainModules" :key="module.name">
-      <module-card :moduleStatus="module"/>
+      <module-status-card :module="module"/>
     </div>
   </div>
 </template>
@@ -25,12 +24,12 @@
 <script lang="ts">
 import { Component, Prop, Vue } from 'vue-property-decorator'
 import {Module, ModuleKind} from '../api/StatusApi'
-import ModuleCard from './ModuleCard.vue'
+import ModuleStatusCard from './ModuleStatusCard.vue'
 
 
 @Component({
   components: {
-    'module-card': ModuleCard
+    'module-status-card': ModuleStatusCard
   }
 })
 export default class ModuleList extends Vue {
@@ -40,16 +39,17 @@ export default class ModuleList extends Vue {
     description: 'See your metrics and trace data for free with a Starter account.',
     kind: ModuleKind.Combined,
     isProgrammaticallyRegistered: false,
-    isStarted: false,
+    enabled: false,
+    started: false,
     clazz: ''
   }
 
   get sortedModules(): Module[] {
     return this.modules.sort((left, right) => {
-      if (left.isStarted === right.isStarted) {
+      if (left.started === right.started) {
         return left.name.localeCompare(right.name)
       } else {
-        return left.isStarted ? -1 : 1
+        return left.started ? -1 : 1
       }
     })
   }
@@ -76,15 +76,7 @@ export default class ModuleList extends Vue {
   }
 
   private isStarted(module: Module): boolean {
-    return module.isStarted
-  }
-}
-</script>
-
-<style lang="scss">
-.apm-suggestion {
-  .kind-label {
-    background-color: #d0f3f0;
+    return module.started
   }
 }
-</style>
+</script>
\ No newline at end of file