diff options
Diffstat (limited to 'app/assets/javascripts/observability/components/observability_app.vue')
-rw-r--r-- | app/assets/javascripts/observability/components/observability_app.vue | 26 |
1 files changed, 13 insertions, 13 deletions
diff --git a/app/assets/javascripts/observability/components/observability_app.vue b/app/assets/javascripts/observability/components/observability_app.vue index 33d23ea043b..ff9cf6ff6c5 100644 --- a/app/assets/javascripts/observability/components/observability_app.vue +++ b/app/assets/javascripts/observability/components/observability_app.vue @@ -2,7 +2,7 @@ import { darkModeEnabled } from '~/lib/utils/color_utils'; import { setUrlParams } from '~/lib/utils/url_utility'; -import { MESSAGE_EVENT_TYPE, OBSERVABILITY_ROUTES, SKELETON_VARIANT } from '../constants'; +import { MESSAGE_EVENT_TYPE, SKELETON_VARIANTS_BY_ROUTE } from '../constants'; import ObservabilitySkeleton from './skeleton/index.vue'; export default { @@ -23,16 +23,16 @@ export default { ); }, getSkeletonVariant() { - switch (this.$route.path) { - case OBSERVABILITY_ROUTES.DASHBOARDS: - return SKELETON_VARIANT.DASHBOARDS; - case OBSERVABILITY_ROUTES.EXPLORE: - return SKELETON_VARIANT.EXPLORE; - case OBSERVABILITY_ROUTES.MANAGE: - return SKELETON_VARIANT.MANAGE; - default: - return SKELETON_VARIANT.DASHBOARDS; - } + const [, variant] = + Object.entries(SKELETON_VARIANTS_BY_ROUTE).find(([path]) => + this.$route.path.endsWith(path), + ) || []; + + const DEFAULT_SKELETON = 'dashboards'; + + if (!variant) return DEFAULT_SKELETON; + + return variant; }, }, mounted() { @@ -51,7 +51,7 @@ export default { } = e; switch (type) { case MESSAGE_EVENT_TYPE.GOUI_LOADED: - this.$refs.iframeSkeleton.handleSkeleton(); + this.$refs.observabilitySkeleton.onContentLoaded(); break; case MESSAGE_EVENT_TYPE.GOUI_ROUTE_UPDATE: this.routeUpdateHandler(payload); @@ -80,7 +80,7 @@ export default { </script> <template> - <observability-skeleton ref="iframeSkeleton" :variant="getSkeletonVariant"> + <observability-skeleton ref="observabilitySkeleton" :variant="getSkeletonVariant"> <iframe id="observability-ui-iframe" data-testid="observability-ui-iframe" |