From 4a489919bce7dba3c1cea1560363cca1512d89ab Mon Sep 17 00:00:00 2001 From: Yongtae Park Date: Tue, 17 Jun 2025 16:13:06 +0900 Subject: [PATCH] fix(top-bar): resolve menu display issue (missing store changes) Signed-off-by: samuel.park --- .../src/common/modules/navigations/top-bar/TopBar.vue | 10 ++++------ .../modules/top-bar-integration/TopBarIntegration.vue | 6 +++--- .../modules/top-bar-notice/TopBarNotice.vue | 5 ++++- .../top-bar-notifications/TopBarNotifications.vue | 4 +++- .../web/src/common/modules/portals/TopNotification.vue | 4 +++- 5 files changed, 17 insertions(+), 12 deletions(-) diff --git a/apps/web/src/common/modules/navigations/top-bar/TopBar.vue b/apps/web/src/common/modules/navigations/top-bar/TopBar.vue index d6f0ef2a7e..c0309b9a75 100644 --- a/apps/web/src/common/modules/navigations/top-bar/TopBar.vue +++ b/apps/web/src/common/modules/navigations/top-bar/TopBar.vue @@ -8,9 +8,7 @@ import { includes } from 'lodash'; import { ROOT_ROUTE } from '@/router/constant'; import { useAppContextStore } from '@/store/app-context/app-context-store'; -import { useUserStore } from '@/store/user/user-store'; - -import type { MenuId } from '@/lib/menu/config'; +import { useAuthorizationStore } from '@/store/authorization/authorization-store'; import TopBarWorkspaces from '@/common/modules/navigations/top-bar/modules/top-bar-header/TopBarWorkspaces.vue'; import TopBarSearch from '@/common/modules/navigations/top-bar/modules/top-bar-search/TopBarSearch.vue'; @@ -19,12 +17,12 @@ import TopBarToolset from '@/common/modules/navigations/top-bar/modules/top-bar- const ALLOWED_MENUS_FOR_ALL_USERS = ['notifications', 'support', 'profile']; const appContextStore = useAppContextStore(); -const userStore = useUserStore(); +const athorizationStore = useAuthorizationStore(); const state = reactive({ isAdminMode: computed(() => appContextStore.getters.isAdminMode), openedMenu: '', - hasPermission: computed((() => userStore.getters.hasPermission)), + hasPermission: computed((() => athorizationStore.getters.hasPermission)), logoLink: computed(() => { if (state.isAdminMode) return { name: ROOT_ROUTE.ADMIN._NAME }; return null; @@ -38,7 +36,7 @@ const topBarWorkspaceRef = ref>(); const hideMenu = () => { state.openedMenu = ''; }; -const handleOpenMenu = (menuId: MenuId) => { +const handleOpenMenu = (menuId: string) => { if (state.openedMenu === menuId) { hideMenu(); } else if (state.hasPermission || includes(ALLOWED_MENUS_FOR_ALL_USERS, menuId)) { diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-integration/TopBarIntegration.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-integration/TopBarIntegration.vue index 3998f852a9..3cb4c99ca8 100644 --- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-integration/TopBarIntegration.vue +++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-integration/TopBarIntegration.vue @@ -8,7 +8,7 @@ import { PI, PTooltip, } from '@cloudforet/mirinae'; -import { useUserStore } from '@/store/user/user-store'; +import { useAuthorizationStore } from '@/store/authorization/authorization-store'; import TopBarIntegrationContextMenu from '@/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-integration/modules/TopBarIntegrationContextMenu.vue'; @@ -24,9 +24,9 @@ const props = withDefaults(defineProps(), { const emit = defineEmits<{(e: 'update:visible', value: boolean): void}>(); -const userStore = useUserStore(); +const authorizationStore = useAuthorizationStore(); const state = reactive({ - isNoRoleUser: computed(() => userStore.getters.isNoRoleUser), + isNoRoleUser: computed(() => authorizationStore.getters.isNoRoleUser), }); /* Util */ diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/TopBarNotice.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/TopBarNotice.vue index b381407e77..c88bbca64c 100644 --- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/TopBarNotice.vue +++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/TopBarNotice.vue @@ -8,6 +8,7 @@ import { PI, PTooltip, } from '@cloudforet/mirinae'; +import { useAuthorizationStore } from '@/store/authorization/authorization-store'; import { useNoticeStore } from '@/store/notice/notice-store'; import { useUserStore } from '@/store/user/user-store'; @@ -30,10 +31,12 @@ const emit = defineEmits<{(e: 'update:visible', value: boolean): void}>(); const noticeStore = useNoticeStore(); const noticeGetters = noticeStore.getters; const userStore = useUserStore(); +const authorizationStore = useAuthorizationStore(); + const state = reactive({ hasNotice: computed(() => noticeGetters.unreadNoticeCount > 0), - isNoRoleUser: computed(() => userStore.getters.isNoRoleUser), + isNoRoleUser: computed(() => authorizationStore.getters.isNoRoleUser), iconColor: computed(() => { if (props.visible) return blue[600]; return 'inherit'; diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notifications/TopBarNotifications.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notifications/TopBarNotifications.vue index c0be33717e..8bf394339d 100644 --- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notifications/TopBarNotifications.vue +++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notifications/TopBarNotifications.vue @@ -9,6 +9,7 @@ import { PI, PTooltip, } from '@cloudforet/mirinae'; +import { useAuthorizationStore } from '@/store/authorization/authorization-store'; import { useDisplayStore } from '@/store/display/display-store'; import { useUserStore } from '@/store/user/user-store'; @@ -28,10 +29,11 @@ const emit = defineEmits<{(e: 'update:visible', value: boolean): void}>(); const userStore = useUserStore(); const displayStore = useDisplayStore(); +const authorizationStore = useAuthorizationStore(); const state = reactive({ hasNotifications: computed(() => displayStore.getters.hasUncheckedNotifications), - isNoRoleUser: computed(() => userStore.getters.isNoRoleUser), + isNoRoleUser: computed(() => authorizationStore.getters.isNoRoleUser), notificationCount: 0, iconColor: computed(() => { if (props.visible) return blue[600]; diff --git a/apps/web/src/common/modules/portals/TopNotification.vue b/apps/web/src/common/modules/portals/TopNotification.vue index b287a5b20d..277799221a 100644 --- a/apps/web/src/common/modules/portals/TopNotification.vue +++ b/apps/web/src/common/modules/portals/TopNotification.vue @@ -7,6 +7,7 @@ import { PNotificationBar } from '@cloudforet/mirinae'; import { i18n } from '@/translations'; import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store'; +import { useAuthorizationStore } from '@/store/authorization/authorization-store'; import { useErrorStore } from '@/store/error/error-store'; import { useUserStore } from '@/store/user/user-store'; @@ -21,10 +22,11 @@ const props = withDefaults(defineProps<{ const userWorkspaceStore = useUserWorkspaceStore(); const errorStore = useErrorStore(); const userStore = useUserStore(); +const authorizationStore = useAuthorizationStore(); const route = useRoute(); const storeState = reactive({ - hasPermission: computed(() => userStore.getters.hasPermission), + hasPermission: computed(() => authorizationStore.getters.hasPermission), isDomainAdmin: computed(() => userStore.getters.isDomainAdmin), workspaceList: computed(() => userWorkspaceStore.getters.workspaceList), visibleAuthorizationError: computed(() => errorStore.state.visibleAuthorizationError),