diff options
Diffstat (limited to 'kamon-status-page/src/main/vue/src/components/InstrumentationModuleList.vue')
-rw-r--r-- | kamon-status-page/src/main/vue/src/components/InstrumentationModuleList.vue | 44 |
1 files changed, 44 insertions, 0 deletions
diff --git a/kamon-status-page/src/main/vue/src/components/InstrumentationModuleList.vue b/kamon-status-page/src/main/vue/src/components/InstrumentationModuleList.vue new file mode 100644 index 00000000..224f6716 --- /dev/null +++ b/kamon-status-page/src/main/vue/src/components/InstrumentationModuleList.vue @@ -0,0 +1,44 @@ +<template> + <div class="row"> + <div class="col-12 pt-4 pb-2" v-if="modules.length > 0"> + <h2>Instrumentation Modules</h2> + </div> + <div class="col-12 py-1" v-for="module in sortedModules" :key="module.name"> + <instrumentation-module-status-card :module="module"/> + </div> + </div> +</template> + +<script lang="ts"> +import { Component, Prop, Vue } from 'vue-property-decorator' +import {InstrumentationModule} from '../api/StatusApi' +import InstrumentationModuleStatusCard from './InstrumentationModuleStatusCard.vue' + + +@Component({ + components: { + 'instrumentation-module-status-card': InstrumentationModuleStatusCard + } +}) +export default class ModuleList extends Vue { + @Prop() private modules!: InstrumentationModule[] + + get sortedModules(): InstrumentationModule[] { + return this.modules.sort((left, right) => { + if (left.active === right.active) { + return left.name.localeCompare(right.name) + } else { + return left.active ? -1 : 1 + } + }) + } +} +</script> + +<style lang="scss"> +.apm-suggestion { + .kind-label { + background-color: #d0f3f0; + } +} +</style> |