diff --git a/apps/web/package.json b/apps/web/package.json index 34423acc18..f8fe2b98be 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -112,7 +112,7 @@ "postcss-config-custom": "*", "rollup-plugin-visualizer": "^5.9.0", "tsconfig": "*", - "vite": "^4.5.10", + "vite": "^4.5.11", "vite-plugin-stylelint": "^3.3.3", "vite-plugin-vue-type-imports": "^0.2.4", "vitest": "^3.0.8", diff --git a/apps/web/src/services/alert-manager/v2/components/AlertDetailTabsTimelineModal.vue b/apps/web/src/services/alert-manager/v2/components/AlertDetailTabsTimelineModal.vue index f1224e6a6d..6f2bb29fec 100644 --- a/apps/web/src/services/alert-manager/v2/components/AlertDetailTabsTimelineModal.vue +++ b/apps/web/src/services/alert-manager/v2/components/AlertDetailTabsTimelineModal.vue @@ -91,11 +91,11 @@ const state = reactive({ const info = channelInfo as AlertHistoryNotificationChannelInfoType; let target = ''; if (type === TYPE.SERVICE) { - target = storeState.service[storeState.alertInfo.service_id].label; + target = storeState.service[storeState.alertInfo.service_id]?.label || storeState.alertInfo.service_id; } else if (type === TYPE.USER_GROUP) { - target = storeState.userGroup[info.user_group_id || ''].label; + target = storeState.userGroup[info.user_group_id || '']?.label || info.user_group_id; } else if (type === TYPE.USER) { - target = storeState.user[info.user_id || ''].label; + target = storeState.user[info.user_id || '']?.label || info.user_id; } return { type, diff --git a/apps/web/src/services/alert-manager/v2/pages/ServiceDetailPage.vue b/apps/web/src/services/alert-manager/v2/pages/ServiceDetailPage.vue index eab63c7cf3..60a8d68948 100644 --- a/apps/web/src/services/alert-manager/v2/pages/ServiceDetailPage.vue +++ b/apps/web/src/services/alert-manager/v2/pages/ServiceDetailPage.vue @@ -5,6 +5,15 @@ import { } from 'vue'; import { useRouter } from 'vue-router/composables'; +import { isEmpty } from 'lodash'; + +import type { Route } from '@cloudforet/mirinae/types/navigation/breadcrumbs/type'; + +import { i18n } from '@/translations'; + +import { useAllReferenceStore } from '@/store/reference/all-reference-store'; +import type { ServiceReferenceMap } from '@/store/reference/service-reference-store'; + import type { FavoriteOptions } from '@/common/modules/favorites/favorite-button/type'; import { FAVORITE_TYPE } from '@/common/modules/favorites/favorite-button/type'; import { useGnbStore } from '@/common/modules/navigations/stores/gnb-store'; @@ -14,7 +23,6 @@ import ServiceDetailTabs from '@/services/alert-manager/v2/components/ServiceDet import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant'; import { useServiceDetailPageStore } from '@/services/alert-manager/v2/stores/service-detail-page-store'; - interface Props { serviceId: string; } @@ -24,15 +32,24 @@ const props = withDefaults(defineProps(), { const gnbStore = useGnbStore(); const serviceDetailPageStore = useServiceDetailPageStore(); +const allReferenceStore = useAllReferenceStore(); +const allReferenceGetters = allReferenceStore.getters; const router = useRouter(); - +const storeState = reactive({ + serviceList: computed(() => allReferenceGetters.service), +}); const state = reactive({ favoriteOptions: computed(() => ({ type: FAVORITE_TYPE.SERVICE, id: props.serviceId, })), + pageNavigation: computed(() => [ + { name: i18n.t('MENU.ALERT_MANAGER') as string, to: { name: ALERT_MANAGER_ROUTE._NAME } }, + { name: i18n.t('MENU.ALERT_MANAGER_SERVICE') as string, to: { name: ALERT_MANAGER_ROUTE.SERVICE._NAME } }, + { name: storeState.serviceList[props.serviceId].label }, + ]), }); watch(() => props.serviceId, async (serviceId) => { if (!serviceId) return; @@ -43,6 +60,10 @@ watch(() => props.serviceId, async (serviceId) => { await serviceDetailPageStore.fetchServiceDetailData(serviceId); await gnbStore.setFavoriteItemId(state.favoriteOptions); }, { immediate: true }); +watch(() => storeState.serviceList, async (serviceList) => { + if (isEmpty(serviceList)) return; + gnbStore.setBreadcrumbs(state.pageNavigation); +}, { immediate: true }); onMounted(() => { if (!props.serviceId) { @@ -52,6 +73,7 @@ onMounted(() => { onUnmounted(() => { serviceDetailPageStore.initState(); + gnbStore.setBreadcrumbs([]); }); diff --git a/package-lock.json b/package-lock.json index a202d6133e..30e6719cf3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -209,7 +209,7 @@ "postcss-config-custom": "*", "rollup-plugin-visualizer": "^5.9.0", "tsconfig": "*", - "vite": "^4.5.10", + "vite": "^4.5.11", "vite-plugin-stylelint": "^3.3.3", "vite-plugin-vue-type-imports": "^0.2.4", "vitest": "^3.0.8", @@ -32279,9 +32279,9 @@ } }, "node_modules/vite": { - "version": "4.5.10", - "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.10.tgz", - "integrity": "sha512-f2ueoukYTMI/5kMMT7wW+ol3zL6z6PjN28zYrGKAjnbzXhRXWXPThD3uN6muCp+TbfXaDgGvRuPsg6mwVLaWwQ==", + "version": "4.5.11", + "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.11.tgz", + "integrity": "sha512-4mVdhLkZ0vpqZLGJhNm+X1n7juqXApEMGlUXcOQawA45UmpxivOYaMBkI/Js3FlBsNA8hCgEnX5X04moFitSGw==", "dev": true, "license": "MIT", "dependencies": { @@ -34890,7 +34890,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10" + "vite": "^4.5.11" } }, "packages/core-lib/node_modules/@types/node": { @@ -34907,7 +34907,7 @@ "@typescript-eslint/parser": "^5.41.0", "eslint": "8.22.0", "eslint-config-airbnb": "^19.0.4", - "eslint-config-turbo": "latest", + "eslint-config-turbo": "*", "eslint-import-resolver-typescript": "^2.7.1", "eslint-plugin-import": "^2.26.0", "eslint-plugin-mdx": "^1.17.1", @@ -35003,7 +35003,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10", + "vite": "^4.5.11", "vite-plugin-stylelint": "^3.3.3", "vue-router": "^3.6.5", "vue-tsc": "^2.2.8" @@ -35298,7 +35298,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10" + "vite": "^4.5.11" } }, "packages/utils/node_modules/@types/node": { @@ -36853,7 +36853,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10" + "vite": "^4.5.11" }, "dependencies": { "@types/node": { @@ -36922,7 +36922,7 @@ "v-click-outside": "^3.0.1", "v-tooltip": "^2.0.3", "velocity-animate": "^1.5.2", - "vite": "^4.5.10", + "vite": "^4.5.11", "vite-plugin-stylelint": "^3.3.3", "vue": "2.7.16", "vue-filepond": "^6.0.3", @@ -37010,7 +37010,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10" + "vite": "^4.5.11" }, "dependencies": { "@types/node": { @@ -46314,7 +46314,7 @@ "@typescript-eslint/parser": "^5.41.0", "eslint": "8.22.0", "eslint-config-airbnb": "^19.0.4", - "eslint-config-turbo": "latest", + "eslint-config-turbo": "*", "eslint-import-resolver-typescript": "^2.7.1", "eslint-plugin-import": "^2.26.0", "eslint-plugin-mdx": "^1.17.1", @@ -59135,9 +59135,9 @@ } }, "vite": { - "version": "4.5.10", - "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.10.tgz", - "integrity": "sha512-f2ueoukYTMI/5kMMT7wW+ol3zL6z6PjN28zYrGKAjnbzXhRXWXPThD3uN6muCp+TbfXaDgGvRuPsg6mwVLaWwQ==", + "version": "4.5.11", + "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.11.tgz", + "integrity": "sha512-4mVdhLkZ0vpqZLGJhNm+X1n7juqXApEMGlUXcOQawA45UmpxivOYaMBkI/Js3FlBsNA8hCgEnX5X04moFitSGw==", "dev": true, "requires": { "esbuild": "^0.18.10", @@ -60385,7 +60385,7 @@ "uuid": "^8.3.2", "v-click-outside": "^3.0.1", "v-tooltip": "^2.0.3", - "vite": "^4.5.10", + "vite": "^4.5.11", "vite-plugin-stylelint": "^3.3.3", "vite-plugin-vue-type-imports": "^0.2.4", "vitest": "^3.0.8", diff --git a/packages/core-lib/package.json b/packages/core-lib/package.json index 0448117da7..b1fd3e5c13 100644 --- a/packages/core-lib/package.json +++ b/packages/core-lib/package.json @@ -35,7 +35,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10" + "vite": "^4.5.11" }, "main": "dist/index.js", "types": "dist/index.d.ts", diff --git a/packages/mirinae/package.json b/packages/mirinae/package.json index 9cf09de3fd..d424526715 100644 --- a/packages/mirinae/package.json +++ b/packages/mirinae/package.json @@ -120,7 +120,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10", + "vite": "^4.5.11", "vite-plugin-stylelint": "^3.3.3", "vue-router": "^3.6.5", "vue-tsc": "^2.2.8" diff --git a/packages/utils/package.json b/packages/utils/package.json index f26e6612f0..44739b149b 100644 --- a/packages/utils/package.json +++ b/packages/utils/package.json @@ -34,7 +34,7 @@ "tsc-alias": "^1.6.11", "tsc-watch": "^6.0.0", "tsconfig": "*", - "vite": "^4.5.10" + "vite": "^4.5.11" }, "main": "dist/index.js", "types": "dist/index.d.ts", diff --git a/turbo.json b/turbo.json index 0a2ab38e00..b4f25bf0fc 100644 --- a/turbo.json +++ b/turbo.json @@ -2,6 +2,7 @@ "globalDependencies": [ "turbo.json", "package.json", "package-lock.json" ], + "globalEnv": ["VITE_VERCEL_EDGE_CONFIG"], "tasks": { "@cloudforet/utils#build": { "outputs": ["./dist/**"],