diff --git a/apps/web/package.json b/apps/web/package.json
index 8b3c297869..96bc4b2e2c 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -46,6 +46,7 @@
     "@vueuse/core": "^10.7.2",
     "@vueuse/integrations": "^11.1.0",
     "@vvo/tzdb": "^6.4.1",
+    "console-vue-query-devtools-sdk": "^0.0.16",
     "animated-number-vue": "^1.0.0",
     "axios": "^1.8.2",
     "axios-auth-refresh": "^3.2.2",
@@ -112,7 +113,7 @@
     "postcss-config-custom": "*",
     "rollup-plugin-visualizer": "^5.9.0",
     "tsconfig": "*",
-    "vite": "^4.5.13",
+    "vite": "^4.5.14",
     "vite-plugin-stylelint": "^3.3.3",
     "vite-plugin-vue-type-imports": "^0.2.4",
     "vitest": "^3.0.8",
diff --git a/apps/web/src/App.vue b/apps/web/src/App.vue
index 95d5dde6b7..37a8ac669e 100755
--- a/apps/web/src/App.vue
+++ b/apps/web/src/App.vue
@@ -6,6 +6,9 @@ import {
 import type { Location } from 'vue-router';
 import { useRoute, useRouter } from 'vue-router/composables';
 
+import { useQueryClient } from '@tanstack/vue-query';
+import { ConsoleVueQueryDevtools } from 'console-vue-query-devtools-sdk';
+
 import { LocalStorageAccessor } from '@cloudforet/core-lib/local-storage-accessor';
 import {
     PNoticeAlert, PToastAlert, PIconModal, PSidebar, PDataLoader,
@@ -15,6 +18,7 @@ import { EXTERNAL_PAGE_ROUTE } from '@/router/constant';
 import { getRouteScope } from '@/router/helpers/route-helper';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { SIDEBAR_TYPE } from '@/store/display/constant';
 import { useDisplayStore } from '@/store/display/display-store';
 import { useErrorStore } from '@/store/error/error-store';
@@ -37,6 +41,15 @@ import MobileGuideModal from '@/services/auth/components/MobileGuideModal.vue';
 import { AUTH_ROUTE } from '@/services/auth/routes/route-constant';
 import { LANDING_ROUTE } from '@/services/landing/routes/route-constant';
 
+if (import.meta.env.DEV) {
+    const queryClient = useQueryClient();
+    import('@/_dev-tools/vue-query-console-debug').then((mod) => mod.initVueQueryConsoleDebug(queryClient))
+        .catch((error) => {
+            console.error('Failed to load vue-query-console-debug module:', error);
+            console.error('Ensure the module exists and the path is correct.');
+        });
+}
+
 const router = useRouter();
 const route = useRoute();
 
@@ -56,6 +69,7 @@ const state = reactive({
 });
 
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const appContextStore = useAppContextStore();
 const errorStore = useErrorStore();
 const globalUIStore = useGlobalUIStore();
@@ -74,7 +88,7 @@ const goToSignIn = async () => {
         name: AUTH_ROUTE.SIGN_OUT._NAME,
         query: { previousPath: route.fullPath },
     };
-    userStore.setCurrentGrantInfo(undefined);
+    authorizationStore.setCurrentGrantInfo(undefined);
     errorStore.setVisibleSessionExpiredError(false);
 
     await router.push(to);
@@ -104,6 +118,7 @@ watch(() => state.userId, (userId) => {
     <div v-cloak
          id="app"
     >
+        <console-vue-query-devtools />
         <template v-if="displayStore.state.isInitialized">
             <p-notice-alert group="noticeTopLeft" />
             <p-notice-alert group="noticeTopRight" />
diff --git a/apps/web/src/_dev-tools/vue-query-console-debug.ts b/apps/web/src/_dev-tools/vue-query-console-debug.ts
new file mode 100644
index 0000000000..b973872650
--- /dev/null
+++ b/apps/web/src/_dev-tools/vue-query-console-debug.ts
@@ -0,0 +1,166 @@
+import type { QueryClient, QueryKey, Query } from '@tanstack/vue-query';
+
+type QuerySummary = {
+    index: number;
+    queryKey: QueryKey;
+    gcTime: number;
+    observers: number;
+    data: unknown;
+    query: Query;
+    isActive: boolean;
+};
+interface DumpOptions {
+    appContext?: string;
+    resourceIdentifier?: string;
+    activeOnly?: boolean;
+    // TODO: Add sortBy, limit, showParamsSize, intentLabel support
+}
+
+
+export const initVueQueryConsoleDebug = (client: QueryClient) => {
+    const _summarizeQueries = (): QuerySummary[] => client.getQueryCache().getAll()
+        .sort((a, b) => {
+            const isActiveA = _isActive(a);
+            const isActiveB = _isActive(b);
+            return Number(isActiveB) - Number(isActiveA);
+        })
+        .map((query, index) => {
+            const data = query.state.data;
+            const observers = query.getObserversCount?.() ?? query.observers.length;
+
+            return {
+                index: index + 1,
+                queryKey: query.queryKey,
+                gcTime: query.gcTime,
+                observers,
+                data,
+                query,
+                isActive: _isActive(query),
+            };
+        });
+
+    const debugObject = {
+        /**
+         * Returns a raw summary of all queries in the cache.
+         */
+        getSummary: _summarizeQueries,
+        /**
+         * Logs a table summary of all queries.
+         * Includes appContext, resource path, context keys, and params.
+         */
+        dump: (options?: DumpOptions) => {
+            let summary = _summarizeQueries().map((q) => ({
+                index: q.index,
+                appContext: _extractAppContext(q.queryKey),
+                resourceIdentifier: _extractResourceIdentifier(q.queryKey),
+                contextKey: _extractContextKey(q.queryKey),
+                params: _extractParams(q.queryKey),
+                observers: q.observers,
+                isActive: q.isActive,
+            }));
+            if (options?.appContext) {
+                summary = summary.filter((q) => q.appContext.startsWith(options?.appContext ?? ''));
+            }
+            if (options?.resourceIdentifier) {
+                summary = summary.filter((q) => q.resourceIdentifier.startsWith(options?.resourceIdentifier ?? ''));
+            }
+            if (options?.activeOnly) {
+                summary = summary.filter((q) => q.isActive);
+            }
+            const result = Object.fromEntries(summary.map((q) => [`${q.index}`, {
+                appContext: q.appContext,
+                resourceIdentifier: q.resourceIdentifier,
+                contextKey: q.contextKey,
+                params: q.params,
+                observers: q.observers,
+                isActive: q.isActive,
+            }]));
+
+            console.table(result);
+        },
+        /**
+         * Logs full details for every query in the cache.
+         * Grouped and expanded in the browser console.
+         */
+        log: () => {
+            _summarizeQueries().forEach((q) => {
+                console.group(`Query #${q.index}`);
+                console.log('queryKey:', q.queryKey);
+                console.log('gcTime:', q.gcTime);
+                console.log('observers:', q.observers);
+                console.log('data:', q.data);
+                console.groupEnd();
+            });
+        },
+        /**
+         * Logs details for a specific query by its index in the cache.
+         */
+        inspect: (index: number) => {
+            const q = _summarizeQueries().find((query) => query.index === index);
+            if (!q) {
+                console.warn('Query index not found');
+                (window as any).__QUERY_DEBUG__.dump();
+                return;
+            }
+            console.group(`Inspecting Query #${index}`);
+            console.log('queryKey:', q.queryKey);
+            console.log('gcTime:', q.gcTime);
+            console.log('observers:', q.observers);
+            console.log('data:', q.data);
+            console.log('query:', q.query);
+            console.groupEnd();
+        },
+    };
+
+    (window as any).__QUERY_DEBUG__ = debugObject;
+};
+
+
+const _isActive = (query: Query) => {
+    const data = query.state.data;
+    return (data !== undefined && query.state.dataUpdatedAt > 0) || (query.options as { enabled?: boolean })?.enabled === true;
+};
+
+/* --------------------- Extractors --------------------- */
+
+const _extractAppContext = (key: QueryKey): string => {
+    if (!Array.isArray(key) || key.length === 0) return '';
+    if (key[0] === 'admin') return 'admin';
+    if (key.length < 2) return '';
+    if (key[0] === 'workspace') return `${key[1]}`;
+    return '';
+};
+
+const _extractResourceIdentifier = (key: QueryKey): string => {
+    if (!Array.isArray(key) || key.length < 4) return '';
+    if (key[0] === 'admin') return `${key[1]}/${key[2]}/${key[3]}`;
+    if (key.length < 5) return '';
+    if (key[0] === 'workspace') return `${key[2]}/${key[3]}/${key[4]}`;
+    return '';
+};
+
+const _extractContextKey = (key: QueryKey): string => {
+    if (!Array.isArray(key) || key.length < 5) return '';
+    const startIndex = key[0] === 'admin' ? 4 : 5;
+    const lastIndex = key.length - 1;
+    const hasParams = typeof key[lastIndex] === 'object' && !Array.isArray(key[lastIndex]) && key[lastIndex] !== null;
+
+    const contextPart = hasParams ? key.slice(startIndex, lastIndex) : key.slice(startIndex);
+    const parts = contextPart.filter((k) => typeof k === 'string' || typeof k === 'number');
+
+    return parts.join(', ');
+};
+
+const _extractParams = (key: QueryKey): string => {
+    if (!Array.isArray(key) || key.length < 5) return '';
+    if (key[0] === 'admin') {
+        const lastNamespace = key[key.length - 1];
+        return typeof lastNamespace === 'object' ? JSON.stringify(lastNamespace) : '';
+    }
+    if (key.length < 6) return '';
+    if (key[0] === 'workspace') {
+        const lastNamespace = key[key.length - 1];
+        return typeof lastNamespace === 'object' ? JSON.stringify(lastNamespace) : '';
+    }
+    return '';
+};
diff --git a/apps/web/src/api-clients/_common/composables/use-api-query-key.ts b/apps/web/src/api-clients/_common/composables/use-api-query-key.ts
deleted file mode 100644
index 1c92d0c5f8..0000000000
--- a/apps/web/src/api-clients/_common/composables/use-api-query-key.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import { computed, reactive } from 'vue';
-
-import type {
-    ResourceName, ServiceName, Verb,
-} from '@/api-clients/_common/types/query-key-type';
-
-import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-
-/**
- * Generates a computed query key for API requests, incorporating global parameters.
- *
- * @param service - The service name, representing the API service scope (e.g., 'dashboard').
- * @param resource - The resource name, specifying the target API resource (e.g., 'public-data-table').
- * @param verb - The API action verb, defining the type of request (e.g., 'get', 'list', 'update').
- * @param additionalGlobalParams - Optional additional global parameters (e.g., workspace ID, admin mode).
- * @returns A computed reference to the query key array, structured as `[service, resource, verb, { globalParams }]`.
- *
- * ### Example Usage:
- * ```ts
- *  const queryKey = useAPIQueryKey('dashboard', 'public-data-table', 'get');
- * ```
- * The generated query key ensures:
- * - **Type safety**: Prevents invalid API calls by enforcing a valid `service/resource/verb` combination.
- * - **Auto-completion**: Provides intelligent suggestions based on predefined API structure.
- * - **Cache management**: Enables precise cache invalidation and data synchronization.
- */
-
-interface GlobalQueryParams {
-    workspaceId?: string;
-    isAdminMode?: boolean;
-}
-export const useAPIQueryKey = <S extends ServiceName, R extends ResourceName<S>, V extends Verb<S, R>>(
-    service: S,
-    resource: R,
-    verb: V,
-    additionalGlobalParams?: Partial<GlobalQueryParams>,
-) => {
-    const appContextStore = useAppContextStore();
-    const userWorkspaceStore = useUserWorkspaceStore();
-
-    const _state = reactive({
-        currentWorkdpaceId: computed<string|undefined>(() => userWorkspaceStore.getters.currentWorkspaceId),
-        isAdminMode: computed<boolean>(() => appContextStore.getters.isAdminMode),
-    });
-
-    const globalQueryParams = reactive<GlobalQueryParams>({
-        workspaceId: _state.currentWorkdpaceId,
-        isAdminMode: _state.isAdminMode,
-        ...additionalGlobalParams,
-    });
-
-    return computed(() => [service, resource, verb, { ...globalQueryParams }]);
-};
diff --git a/apps/web/src/api-clients/_common/types/query-key-type.ts b/apps/web/src/api-clients/_common/types/query-key-type.ts
deleted file mode 100644
index fadaec94d7..0000000000
--- a/apps/web/src/api-clients/_common/types/query-key-type.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import type { API_DOC } from '@/api-clients/_common/constants/api-doc-constant';
-
-
-/**
- * Extracts all possible keys for `{service-name}`, `{resource-name}`, and `{verb}`
- */
-export type ServiceName = keyof typeof API_DOC;
-export type ResourceName<S extends ServiceName> = keyof (typeof API_DOC)[S];
-export type Verb<S extends ServiceName, R extends ResourceName<S>> = Extract<(typeof API_DOC)[S][R], string[]>[number] | string;
diff --git a/apps/web/src/api-clients/api-client-manager.ts b/apps/web/src/api-clients/api-client-manager.ts
deleted file mode 100644
index 4ea744e4c0..0000000000
--- a/apps/web/src/api-clients/api-client-manager.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
-
-import { ApiClientEndpoint } from '@/lib/config/global-config/schema/api-client-schema';
-import type { ApiClientsSchemaType, GlobalServiceConfig } from '@/lib/config/global-config/types/type';
-
-
-class APIClientManager {
-    // eslint-disable-next-line no-undef
-    [key: string]: any;
-
-    private config: GlobalServiceConfig = {} as GlobalServiceConfig;
-
-    private apiClientsSchema: ApiClientsSchemaType = {} as ApiClientsSchemaType;
-
-    async initialize(mergedConfig) {
-        this.config = mergedConfig;
-
-        this.apiClientsSchema = JSON.parse(JSON.stringify(ApiClientEndpoint));
-        this.defineDynamicServices();
-    }
-
-    private defineDynamicServices() {
-        if (!this.apiClientsSchema) {
-            throw new Error('[APIClientManager] APIClientManager is not initialized. Call initialize() first.');
-        }
-
-        Object.keys(this.apiClientsSchema).forEach((serviceName) => {
-            const propertyName = serviceName.toLowerCase()
-                .replace(/_([a-z])/g, (_, char) => char.toUpperCase());
-
-            Object.defineProperty(this, propertyName, {
-                get: () => this.createServiceHandler(serviceName),
-                enumerable: true,
-            });
-        });
-    }
-
-    private createServiceHandler(serviceName: string) {
-        const serviceConfig = this.config?.[serviceName] || null;
-        if (!serviceConfig || !serviceConfig.ENABLED) {
-            return null;
-        }
-
-        const apiClientSchemaByService = this.apiClientsSchema[serviceName];
-        if (!apiClientSchemaByService) {
-            return null;
-        }
-
-        const version = serviceConfig.VERSION;
-        const clientEndpoint = apiClientSchemaByService[version];
-        if (!clientEndpoint) {
-            return null;
-        }
-
-        const endpoint = SpaceConnector.clientV2[clientEndpoint];
-
-        return { endpoint, version };
-    }
-}
-
-export default new APIClientManager();
diff --git a/apps/web/src/api-clients/config/domain-config/composables/use-domain-config-api.ts b/apps/web/src/api-clients/config/domain-config/composables/use-domain-config-api.ts
index ac53167f95..cfc59f37ad 100644
--- a/apps/web/src/api-clients/config/domain-config/composables/use-domain-config-api.ts
+++ b/apps/web/src/api-clients/config/domain-config/composables/use-domain-config-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { DomainConfigCreateParameters } from '@/api-clients/config/domain-config/schema/api-verbs/create';
 import type { DomainConfigGetParameters } from '@/api-clients/config/domain-config/schema/api-verbs/get';
@@ -10,9 +9,6 @@ import type { DomainConfigUpdateParameters } from '@/api-clients/config/domain-c
 import type { DomainConfigModel } from '@/api-clients/config/domain-config/schema/model';
 
 export const useDomainConfigApi = () => {
-    const domainConfigQueryKey = useAPIQueryKey('config', 'domain-config', 'get');
-    const domainConfigListQueryKey = useAPIQueryKey('config', 'domain-config', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.config.domainConfig.create<DomainConfigCreateParameters, DomainConfigModel>,
         update: SpaceConnector.clientV2.config.domainConfig.update<DomainConfigUpdateParameters, DomainConfigModel>,
@@ -22,8 +18,6 @@ export const useDomainConfigApi = () => {
     };
 
     return {
-        domainConfigQueryKey,
-        domainConfigListQueryKey,
         domainConfigAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/config/public-config/composables/use-public-config-api.ts b/apps/web/src/api-clients/config/public-config/composables/use-public-config-api.ts
index 9f64ce0881..88c0bbf533 100644
--- a/apps/web/src/api-clients/config/public-config/composables/use-public-config-api.ts
+++ b/apps/web/src/api-clients/config/public-config/composables/use-public-config-api.ts
@@ -1,9 +1,8 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { PublicConfigCreateParameters } from '@/api-clients/config/public-config/schema/api-verbs/create';
-import type { PublicConfigGetParameters as PublicConfigDeleteParameters } from '@/api-clients/config/public-config/schema/api-verbs/delete';
+import type { PublicConfigDeleteParameters } from '@/api-clients/config/public-config/schema/api-verbs/delete';
 import type { PublicConfigGetParameters } from '@/api-clients/config/public-config/schema/api-verbs/get';
 import type { PublicConfigListParameters } from '@/api-clients/config/public-config/schema/api-verbs/list';
 import type { PublicConfigSetParameters } from '@/api-clients/config/public-config/schema/api-verbs/set';
@@ -11,9 +10,6 @@ import type { PublicConfigUpdateParameters } from '@/api-clients/config/public-c
 import type { PublicConfigModel } from '@/api-clients/config/public-config/schema/model';
 
 export const usePublicConfigApi = () => {
-    const publicConfigQueryKey = useAPIQueryKey('config', 'public-config', 'get');
-    const publicConfigListQueryKey = useAPIQueryKey('config', 'public-config', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.config.publicConfig.create<PublicConfigCreateParameters, PublicConfigModel>,
         update: SpaceConnector.clientV2.config.publicConfig.update<PublicConfigUpdateParameters, PublicConfigModel>,
@@ -24,8 +20,6 @@ export const usePublicConfigApi = () => {
     };
 
     return {
-        publicConfigQueryKey,
-        publicConfigListQueryKey,
         publicConfigAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/config/public-config/schema/api-verbs/delete.ts b/apps/web/src/api-clients/config/public-config/schema/api-verbs/delete.ts
index ab2a71a3b2..9853868da0 100644
--- a/apps/web/src/api-clients/config/public-config/schema/api-verbs/delete.ts
+++ b/apps/web/src/api-clients/config/public-config/schema/api-verbs/delete.ts
@@ -1,3 +1,3 @@
-export interface PublicConfigGetParameters {
+export interface PublicConfigDeleteParameters {
     name: string;
 }
diff --git a/apps/web/src/api-clients/config/shared-config/composables/use-shared-config-api.ts b/apps/web/src/api-clients/config/shared-config/composables/use-shared-config-api.ts
index 7056ddbeb2..7bb052c0c3 100644
--- a/apps/web/src/api-clients/config/shared-config/composables/use-shared-config-api.ts
+++ b/apps/web/src/api-clients/config/shared-config/composables/use-shared-config-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { SharedConfigCreateParameters } from '@/api-clients/config/shared-config/schema/api-verbs/create';
 import type { SharedConfigDeleteParameters } from '@/api-clients/config/shared-config/schema/api-verbs/delete';
@@ -10,9 +9,6 @@ import type { SharedConfigUpdateParameters } from '@/api-clients/config/shared-c
 import type { SharedConfigModel } from '@/api-clients/config/shared-config/schema/model';
 
 export const useSharedConfigApi = () => {
-    const sharedConfigQueryKey = useAPIQueryKey('config', 'shared-config', 'get');
-    const sharedConfigListQueryKey = useAPIQueryKey('config', 'shared-config', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.config.sharedConfig.create<SharedConfigCreateParameters, SharedConfigModel>,
         update: SpaceConnector.clientV2.config.sharedConfig.update<SharedConfigUpdateParameters, SharedConfigModel>,
@@ -22,8 +18,6 @@ export const useSharedConfigApi = () => {
     };
 
     return {
-        sharedConfigQueryKey,
-        sharedConfigListQueryKey,
         sharedConfigAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/config/user-config/composables/use-user-config-api.ts b/apps/web/src/api-clients/config/user-config/composables/use-user-config-api.ts
index 6ece467964..74b4f3867d 100644
--- a/apps/web/src/api-clients/config/user-config/composables/use-user-config-api.ts
+++ b/apps/web/src/api-clients/config/user-config/composables/use-user-config-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { UserConfigCreateParameters } from '@/api-clients/config/user-config/schema/api-verbs/create';
 import type { UserConfigDeleteParameters } from '@/api-clients/config/user-config/schema/api-verbs/delete';
@@ -11,9 +10,6 @@ import type { UserConfigUpdateParameters } from '@/api-clients/config/user-confi
 import type { UserConfigModel } from '@/api-clients/config/user-config/schema/model';
 
 export const useUserConfigApi = () => {
-    const userConfigQueryKey = useAPIQueryKey('config', 'user-config', 'get');
-    const userConfigListQueryKey = useAPIQueryKey('config', 'user-config', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.config.userConfig.create<UserConfigCreateParameters, UserConfigModel>,
         update: SpaceConnector.clientV2.config.userConfig.update<UserConfigUpdateParameters, UserConfigModel>,
@@ -24,8 +20,6 @@ export const useUserConfigApi = () => {
     };
 
     return {
-        userConfigQueryKey,
-        userConfigListQueryKey,
         userConfigAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/cost-analysis/cost-report-config/composables/use-cost-report-config-api.ts b/apps/web/src/api-clients/cost-analysis/cost-report-config/composables/use-cost-report-config-api.ts
index 8f4839086a..49dc08c0c4 100644
--- a/apps/web/src/api-clients/cost-analysis/cost-report-config/composables/use-cost-report-config-api.ts
+++ b/apps/web/src/api-clients/cost-analysis/cost-report-config/composables/use-cost-report-config-api.ts
@@ -15,12 +15,8 @@ interface UseCostReportConfigApiReturn {
 
 export const useCostReportConfigApi = (): UseCostReportConfigApiReturn => {
     const actions = {
-        async update(params: CostReportConfigUpdateParameters) {
-            return SpaceConnector.clientV2.costAnalysis.costReportConfig.update<CostReportConfigUpdateParameters, CostReportConfigModel>(params);
-        },
-        async list(params: CostReportConfigListParameters) {
-            return SpaceConnector.clientV2.costAnalysis.costReportConfig.list<CostReportConfigListParameters, ListResponse<CostReportConfigModel>>(params);
-        },
+        update: SpaceConnector.clientV2.costAnalysis.costReportConfig.update<CostReportConfigUpdateParameters, CostReportConfigModel>,
+        list: SpaceConnector.clientV2.costAnalysis.costReportConfig.list<CostReportConfigListParameters, ListResponse<CostReportConfigModel>>,
     };
 
     return {
diff --git a/apps/web/src/api-clients/cost-analysis/data-source/composables/use-data-source-api.ts b/apps/web/src/api-clients/cost-analysis/data-source/composables/use-data-source-api.ts
index 94eff42640..452af1e8d1 100644
--- a/apps/web/src/api-clients/cost-analysis/data-source/composables/use-data-source-api.ts
+++ b/apps/web/src/api-clients/cost-analysis/data-source/composables/use-data-source-api.ts
@@ -18,18 +18,10 @@ interface UseDataSourceApiReturn {
 
 export const useDataSourceApi = (): UseDataSourceApiReturn => {
     const actions = {
-        async get(params: CostDataSourceGetParameters) {
-            return SpaceConnector.clientV2.costAnalysis.dataSource.get<CostDataSourceGetParameters, CostDataSourceModel>(params);
-        },
-        async list(params: CostDataSourceListParameters) {
-            return SpaceConnector.clientV2.costAnalysis.dataSource.list<CostDataSourceListParameters, ListResponse<CostDataSourceModel>>(params);
-        },
-        async sync(params: CostDataSourceSyncParameters) {
-            return SpaceConnector.clientV2.costAnalysis.dataSource.sync<CostDataSourceSyncParameters>(params);
-        },
-        async updatePermissions(params: CostDataSourceUpdatePermissionsParameters) {
-            return SpaceConnector.clientV2.costAnalysis.dataSource.updatePermissions<CostDataSourceUpdatePermissionsParameters, CostDataSourceModel>(params);
-        },
+        get: SpaceConnector.clientV2.costAnalysis.dataSource.get<CostDataSourceGetParameters, CostDataSourceModel>,
+        list: SpaceConnector.clientV2.costAnalysis.dataSource.list<CostDataSourceListParameters, ListResponse<CostDataSourceModel>>,
+        sync: SpaceConnector.clientV2.costAnalysis.dataSource.sync<CostDataSourceSyncParameters>,
+        updatePermissions: SpaceConnector.clientV2.costAnalysis.dataSource.updatePermissions<CostDataSourceUpdatePermissionsParameters, CostDataSourceModel>,
     };
 
     return {
diff --git a/apps/web/src/api-clients/identity/agent/composables/use-agent-api.ts b/apps/web/src/api-clients/identity/agent/composables/use-agent-api.ts
index 0cbe4a8d08..a4e5b0ba2f 100644
--- a/apps/web/src/api-clients/identity/agent/composables/use-agent-api.ts
+++ b/apps/web/src/api-clients/identity/agent/composables/use-agent-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { AgentCreateParameters } from '@/api-clients/identity/agent/schema/api-verbs/create';
 import type { AgentDeleteParameters } from '@/api-clients/identity/agent/schema/api-verbs/delete';
@@ -12,9 +11,6 @@ import type { AgentRegenerateParameters } from '@/api-clients/identity/agent/sch
 import type { AgentModel } from '@/api-clients/identity/agent/schema/model';
 
 export const useAgentApi = () => {
-    const agentQueryKey = useAPIQueryKey('identity', 'agent', 'get');
-    const agentListQueryKey = useAPIQueryKey('identity', 'agent', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.agent.create<AgentCreateParameters, AgentModel>,
         delete: SpaceConnector.clientV2.identity.agent.delete<AgentDeleteParameters>,
@@ -26,8 +22,6 @@ export const useAgentApi = () => {
     };
 
     return {
-        agentQueryKey,
-        agentListQueryKey,
         agentAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/app/composables/use-app-api.ts b/apps/web/src/api-clients/identity/app/composables/use-app-api.ts
index bc88a5189c..4381dff6d4 100644
--- a/apps/web/src/api-clients/identity/app/composables/use-app-api.ts
+++ b/apps/web/src/api-clients/identity/app/composables/use-app-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { AppCreateParameters } from '@/api-clients/identity/app/schema/api-verbs/create';
 import type { AppDeleteParameters } from '@/api-clients/identity/app/schema/api-verbs/delete';
@@ -14,9 +13,6 @@ import type { AppUpdateParameters } from '@/api-clients/identity/app/schema/api-
 import type { AppModel } from '@/api-clients/identity/app/schema/model';
 
 export const useAppApi = () => {
-    const appQueryKey = useAPIQueryKey('identity', 'app', 'get');
-    const appListQueryKey = useAPIQueryKey('identity', 'app', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.app.create<AppCreateParameters, AppModel>,
         update: SpaceConnector.clientV2.identity.app.update<AppUpdateParameters, AppModel>,
@@ -30,8 +26,6 @@ export const useAppApi = () => {
     };
 
     return {
-        appQueryKey,
-        appListQueryKey,
         appAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/domain/composables/use-domain-api.ts b/apps/web/src/api-clients/identity/domain/composables/use-domain-api.ts
index c8b369212b..e3eecf1ef6 100644
--- a/apps/web/src/api-clients/identity/domain/composables/use-domain-api.ts
+++ b/apps/web/src/api-clients/identity/domain/composables/use-domain-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { DomainGetParameters } from '@/api-clients/identity/domain/schema/api-verbs/get';
 import type { DomainGetAuthInfoParams } from '@/api-clients/identity/domain/schema/api-verbs/get-auth-info';
@@ -9,9 +8,6 @@ import type { DomainModel } from '@/api-clients/identity/domain/schema/model';
 
 
 export const useDomainApi = () => {
-    const domainQueryKey = useAPIQueryKey('identity', 'domain', 'get');
-    const domainListQueryKey = useAPIQueryKey('identity', 'domain', 'list');
-
     const actions = {
         get: SpaceConnector.clientV2.identity.domain.get<DomainGetParameters, DomainModel>,
         list: SpaceConnector.clientV2.identity.domain.list<DomainListParameters, ListResponse<DomainModel>>,
@@ -19,8 +15,6 @@ export const useDomainApi = () => {
     };
 
     return {
-        domainQueryKey,
-        domainListQueryKey,
         domainAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/endpoint/composables/use-endpoint-api.ts b/apps/web/src/api-clients/identity/endpoint/composables/use-endpoint-api.ts
index 9660716ddb..386bdb6461 100644
--- a/apps/web/src/api-clients/identity/endpoint/composables/use-endpoint-api.ts
+++ b/apps/web/src/api-clients/identity/endpoint/composables/use-endpoint-api.ts
@@ -1,19 +1,15 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { EndpointListParameters } from '@/api-clients/identity/endpoint/schema/api-verbs/list';
 import type { EndpointModel } from '@/api-clients/identity/endpoint/schema/model';
 
 export const useEndpointApi = () => {
-    const endpointListQueryKey = useAPIQueryKey('identity', 'endpoint', 'list');
-
     const actions = {
         list: SpaceConnector.clientV2.identity.endpoint.list<EndpointListParameters, ListResponse<EndpointModel>>,
     };
 
     return {
-        endpointListQueryKey,
         endpointAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/job/composables/use-job-api.ts b/apps/web/src/api-clients/identity/job/composables/use-job-api.ts
index cdec08b3f0..319265693a 100644
--- a/apps/web/src/api-clients/identity/job/composables/use-job-api.ts
+++ b/apps/web/src/api-clients/identity/job/composables/use-job-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { IdentityJobDeleteParameters } from '@/api-clients/identity/job/schema/api-verbs/delete';
 import type { IdentityJobGetParameters } from '@/api-clients/identity/job/schema/api-verbs/get';
@@ -9,9 +8,6 @@ import type { IdentityJobStatParameters } from '@/api-clients/identity/job/schem
 import type { IdentityJobModel } from '@/api-clients/identity/job/schema/model';
 
 export const useJobApi = () => {
-    const jobQueryKey = useAPIQueryKey('identity', 'job', 'get');
-    const jobListQueryKey = useAPIQueryKey('identity', 'job', 'list');
-
     const actions = {
         delete: SpaceConnector.clientV2.identity.job.delete<IdentityJobDeleteParameters>,
         get: SpaceConnector.clientV2.identity.job.get<IdentityJobGetParameters, IdentityJobModel>,
@@ -20,8 +16,6 @@ export const useJobApi = () => {
     };
 
     return {
-        jobQueryKey,
-        jobListQueryKey,
         jobAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/package/composables/use-package-api.ts b/apps/web/src/api-clients/identity/package/composables/use-package-api.ts
index 63666bc57d..3dac02be0f 100644
--- a/apps/web/src/api-clients/identity/package/composables/use-package-api.ts
+++ b/apps/web/src/api-clients/identity/package/composables/use-package-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { PackageChangeOrderParameters } from '@/api-clients/identity/package/schema/api-verbs/change-order';
 import type { PackageCreateParameters } from '@/api-clients/identity/package/schema/api-verbs/create';
@@ -13,9 +12,6 @@ import type { PackageModel } from '@/api-clients/identity/package/schema/model';
 
 
 export const usePackageApi = () => {
-    const packageQueryKey = useAPIQueryKey('identity', 'package', 'get');
-    const packageListQueryKey = useAPIQueryKey('identity', 'package', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.package.create<PackageCreateParameters, PackageModel>,
         update: SpaceConnector.clientV2.identity.package.update<PackageUpdateParameters, PackageModel>,
@@ -27,8 +23,6 @@ export const usePackageApi = () => {
     };
 
     return {
-        packageQueryKey,
-        packageListQueryKey,
         packageAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/project-group/composables/use-project-group-api.ts b/apps/web/src/api-clients/identity/project-group/composables/use-project-group-api.ts
index c544f5fd42..5477be2074 100644
--- a/apps/web/src/api-clients/identity/project-group/composables/use-project-group-api.ts
+++ b/apps/web/src/api-clients/identity/project-group/composables/use-project-group-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ProjectGroupAddUsersParameters } from '@/api-clients/identity/project-group/schema/api-verbs/add-users';
 import type { ProjectGroupChangeParentGroupParameters } from '@/api-clients/identity/project-group/schema/api-verbs/change-parent-group';
@@ -14,9 +13,6 @@ import type { ProjectGroupModel } from '@/api-clients/identity/project-group/sch
 
 
 export const useProjectGroupApi = () => {
-    const projectGroupQueryKey = useAPIQueryKey('identity', 'project-group', 'get');
-    const projectGroupListQueryKey = useAPIQueryKey('identity', 'project-group', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.projectGroup.create<ProjectGroupCreateParameters, ProjectGroupModel>,
         update: SpaceConnector.clientV2.identity.projectGroup.update<ProjectGroupUpdateParameters, ProjectGroupModel>,
@@ -29,8 +25,6 @@ export const useProjectGroupApi = () => {
     };
 
     return {
-        projectGroupQueryKey,
-        projectGroupListQueryKey,
         projectGroupAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/project/composables/use-project-api.ts b/apps/web/src/api-clients/identity/project/composables/use-project-api.ts
index 561f6a805e..719a441e58 100644
--- a/apps/web/src/api-clients/identity/project/composables/use-project-api.ts
+++ b/apps/web/src/api-clients/identity/project/composables/use-project-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ProjectAddUsersParameters } from '@/api-clients/identity/project/schema/api-verbs/add-users';
 import type { ProjectChangeProjectGroupParameters } from '@/api-clients/identity/project/schema/api-verbs/change-project-group';
@@ -15,9 +14,6 @@ import type { ProjectModel } from '@/api-clients/identity/project/schema/model';
 
 
 export const useProjectApi = () => {
-    const projectQueryKey = useAPIQueryKey('identity', 'project', 'get');
-    const projectListQueryKey = useAPIQueryKey('identity', 'project', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.project.create<ProjectCreateParameters, ProjectModel>,
         update: SpaceConnector.clientV2.identity.project.update<ProjectUpdateParameters, ProjectModel>,
@@ -31,8 +27,6 @@ export const useProjectApi = () => {
     };
 
     return {
-        projectQueryKey,
-        projectListQueryKey,
         projectAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/provider/composables/use-provider-api.ts b/apps/web/src/api-clients/identity/provider/composables/use-provider-api.ts
index d7bd5a98b9..961e700d35 100644
--- a/apps/web/src/api-clients/identity/provider/composables/use-provider-api.ts
+++ b/apps/web/src/api-clients/identity/provider/composables/use-provider-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ProviderCreateParameters } from '@/api-clients/identity/provider/schema/api-verbs/create';
 import type { ProviderDeleteParameters } from '@/api-clients/identity/provider/schema/api-verbs/delete';
@@ -12,9 +11,6 @@ import type { ProviderModel } from '@/api-clients/identity/provider/schema/model
 
 
 export const useProviderApi = () => {
-    const providerQueryKey = useAPIQueryKey('identity', 'provider', 'get');
-    const providerListQueryKey = useAPIQueryKey('identity', 'provider', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.provider.create<ProviderCreateParameters, ProviderModel>,
         update: SpaceConnector.clientV2.identity.provider.update<ProviderUpdateParameters, ProviderModel>,
@@ -25,8 +21,6 @@ export const useProviderApi = () => {
     };
 
     return {
-        providerQueryKey,
-        providerListQueryKey,
         providerAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/role-binding/composables/use-role-binding-api.ts b/apps/web/src/api-clients/identity/role-binding/composables/use-role-binding-api.ts
index 037091c426..bd6d129db5 100644
--- a/apps/web/src/api-clients/identity/role-binding/composables/use-role-binding-api.ts
+++ b/apps/web/src/api-clients/identity/role-binding/composables/use-role-binding-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { RoleCreateParameters } from '@/api-clients/identity/role-binding/schema/api-verbs/create';
 import type { RoleBindingDeleteParameters } from '@/api-clients/identity/role-binding/schema/api-verbs/delete';
@@ -9,9 +8,6 @@ import type { RoleBindingUpdateRoleParameters } from '@/api-clients/identity/rol
 import type { RoleBindingModel } from '@/api-clients/identity/role-binding/schema/model';
 
 export const useRoleBindingApi = () => {
-    const roleBindingQueryKey = useAPIQueryKey('identity', 'role-binding', 'get');
-    const roleBindingListQueryKey = useAPIQueryKey('identity', 'role-binding', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.roleBinding.create<RoleCreateParameters, RoleBindingModel>,
         delete: SpaceConnector.clientV2.identity.roleBinding.delete<RoleBindingDeleteParameters>,
@@ -20,8 +16,6 @@ export const useRoleBindingApi = () => {
     };
 
     return {
-        roleBindingQueryKey,
-        roleBindingListQueryKey,
         roleBindingAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/role/composables/use-role-api.ts b/apps/web/src/api-clients/identity/role/composables/use-role-api.ts
index c6d7986873..f42c8ee16f 100644
--- a/apps/web/src/api-clients/identity/role/composables/use-role-api.ts
+++ b/apps/web/src/api-clients/identity/role/composables/use-role-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { RoleCreateParameters } from '@/api-clients/identity/role/schema/api-verbs/create';
 import type { RoleDeleteParameters } from '@/api-clients/identity/role/schema/api-verbs/delete';
@@ -13,9 +12,6 @@ import type { RoleUpdateParameters } from '@/api-clients/identity/role/schema/ap
 import type { BasicRoleModel, RoleModel } from '@/api-clients/identity/role/schema/model';
 
 export const useRoleApi = () => {
-    const roleQueryKey = useAPIQueryKey('identity', 'role', 'get');
-    const roleListQueryKey = useAPIQueryKey('identity', 'role', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.role.create<RoleCreateParameters, RoleModel>,
         update: SpaceConnector.clientV2.identity.role.update<RoleUpdateParameters, RoleModel>,
@@ -28,8 +24,6 @@ export const useRoleApi = () => {
     };
 
     return {
-        roleQueryKey,
-        roleListQueryKey,
         roleAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/schema/composables/use-schema-api.ts b/apps/web/src/api-clients/identity/schema/composables/use-schema-api.ts
index a8733654a0..0b5b061108 100644
--- a/apps/web/src/api-clients/identity/schema/composables/use-schema-api.ts
+++ b/apps/web/src/api-clients/identity/schema/composables/use-schema-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { SchemaCreateParameters } from '@/api-clients/identity/schema/schema/api-verbs/create';
 import type { SchemaDeleteParameters } from '@/api-clients/identity/schema/schema/api-verbs/delete';
@@ -11,9 +10,6 @@ import type { SchemaUpdateParameters } from '@/api-clients/identity/schema/schem
 import type { SchemaModel } from '@/api-clients/identity/schema/schema/model';
 
 export const useSchemaApi = () => {
-    const schemaQueryKey = useAPIQueryKey('identity', 'schema', 'get');
-    const schemaListQueryKey = useAPIQueryKey('identity', 'schema', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.schema.create<SchemaCreateParameters, SchemaModel>,
         update: SpaceConnector.clientV2.identity.schema.update<SchemaUpdateParameters, SchemaModel>,
@@ -24,8 +20,6 @@ export const useSchemaApi = () => {
     };
 
     return {
-        schemaQueryKey,
-        schemaListQueryKey,
         schemaAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/service-account/composables/use-service-account-api.ts b/apps/web/src/api-clients/identity/service-account/composables/use-service-account-api.ts
index 771f6dac2f..97c61212cf 100644
--- a/apps/web/src/api-clients/identity/service-account/composables/use-service-account-api.ts
+++ b/apps/web/src/api-clients/identity/service-account/composables/use-service-account-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ServiceAccountCreateParameters } from '@/api-clients/identity/service-account/schema/api-verbs/create';
 import type { ServiceAccountDeleteParameters } from '@/api-clients/identity/service-account/schema/api-verbs/detele';
@@ -14,9 +13,6 @@ import type { ServiceAccountModel } from '@/api-clients/identity/service-account
 
 
 export const useServiceAccountApi = () => {
-    const serviceAccountQueryKey = useAPIQueryKey('identity', 'service-account', 'get');
-    const serviceAccountListQueryKey = useAPIQueryKey('identity', 'service-account', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.serviceAccount.create<ServiceAccountCreateParameters, ServiceAccountModel>,
         update: SpaceConnector.clientV2.identity.serviceAccount.update<ServiceAccountUpdateParameters, ServiceAccountModel>,
@@ -29,8 +25,6 @@ export const useServiceAccountApi = () => {
     };
 
     return {
-        serviceAccountQueryKey,
-        serviceAccountListQueryKey,
         serviceAccountAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/token/composables/use-token-api.ts b/apps/web/src/api-clients/identity/token/composables/use-token-api.ts
index e447a9000f..394d45a6fd 100644
--- a/apps/web/src/api-clients/identity/token/composables/use-token-api.ts
+++ b/apps/web/src/api-clients/identity/token/composables/use-token-api.ts
@@ -1,23 +1,17 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { TokenGrantParameters } from '@/api-clients/identity/token/schema/api-verbs/grant';
 import type { TokenIssueParameters } from '@/api-clients/identity/token/schema/api-verbs/issue';
 import type { TokenIssueModel, TokenGrantModel } from '@/api-clients/identity/token/schema/model';
 
 
 export const useTokenApi = () => {
-    const tokenQueryKey = useAPIQueryKey('identity', 'token', 'issue');
-    const tokenGrantQueryKey = useAPIQueryKey('identity', 'token', 'grant');
-
     const actions = {
         issue: SpaceConnector.clientV2.identity.token.issue<TokenIssueParameters, TokenIssueModel>,
         grant: SpaceConnector.clientV2.identity.token.grant<TokenGrantParameters, TokenGrantModel>,
     };
 
     return {
-        tokenQueryKey,
-        tokenGrantQueryKey,
         tokenAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/trusted-account/composables/use-trusted-account-api.ts b/apps/web/src/api-clients/identity/trusted-account/composables/use-trusted-account-api.ts
index 63a1359fa8..5c926fbabd 100644
--- a/apps/web/src/api-clients/identity/trusted-account/composables/use-trusted-account-api.ts
+++ b/apps/web/src/api-clients/identity/trusted-account/composables/use-trusted-account-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { TrustedAccountCreateParameters } from '@/api-clients/identity/trusted-account/schema/api-verbs/create';
 import type { TrustedAccountDeleteParameters } from '@/api-clients/identity/trusted-account/schema/api-verbs/detele';
@@ -13,9 +12,6 @@ import type { TrustedAccountModel } from '@/api-clients/identity/trusted-account
 
 
 export const useTrustedAccountApi = () => {
-    const trustedAccountQueryKey = useAPIQueryKey('identity', 'trusted-account', 'get');
-    const trustedAccountListQueryKey = useAPIQueryKey('identity', 'trusted-account', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.trustedAccount.create<TrustedAccountCreateParameters, TrustedAccountModel>,
         update: SpaceConnector.clientV2.identity.trustedAccount.update<TrustedAccountUpdateParameters, TrustedAccountModel>,
@@ -27,8 +23,6 @@ export const useTrustedAccountApi = () => {
     };
 
     return {
-        trustedAccountQueryKey,
-        trustedAccountListQueryKey,
         trustedAccountAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/user-group/composables/use-user-group-api.ts b/apps/web/src/api-clients/identity/user-group/composables/use-user-group-api.ts
index f3f7d590c3..3d5fd32f9a 100644
--- a/apps/web/src/api-clients/identity/user-group/composables/use-user-group-api.ts
+++ b/apps/web/src/api-clients/identity/user-group/composables/use-user-group-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { UserGroupAddUsersParameters } from '@/api-clients/identity/user-group/schema/api-verbs/add-users';
 import type { UserGroupCreateParameters } from '@/api-clients/identity/user-group/schema/api-verbs/create';
@@ -13,9 +12,6 @@ import type { UserGroupModel } from '@/api-clients/identity/user-group/schema/mo
 
 
 export const useUserGroupApi = () => {
-    const userGroupQueryKey = useAPIQueryKey('identity', 'user-group', 'get');
-    const userGroupListQueryKey = useAPIQueryKey('identity', 'user-group', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.userGroup.create<UserGroupCreateParameters, UserGroupModel>,
         update: SpaceConnector.clientV2.identity.userGroup.update<UserGroupUpdateParameters, UserGroupModel>,
@@ -27,8 +23,6 @@ export const useUserGroupApi = () => {
     };
 
     return {
-        userGroupQueryKey,
-        userGroupListQueryKey,
         userGroupAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/user-profile/composables/use-user-profile-api.ts b/apps/web/src/api-clients/identity/user-profile/composables/use-user-profile-api.ts
index d2216672b9..e772db888a 100644
--- a/apps/web/src/api-clients/identity/user-profile/composables/use-user-profile-api.ts
+++ b/apps/web/src/api-clients/identity/user-profile/composables/use-user-profile-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { UserProfileConfirmEmailParameters } from '@/api-clients/identity/user-profile/schema/api-verbs/confirm-email';
 import type { UserProfileConfirmMfaParameters } from '@/api-clients/identity/user-profile/schema/api-verbs/confirm-mfa';
 import type { UserProfileEnableMfaParameters } from '@/api-clients/identity/user-profile/schema/api-verbs/enable-mfa';
@@ -12,8 +11,6 @@ import type { UserProfileVerifyEmailParameters } from '@/api-clients/identity/us
 
 
 export const useUserProfileApi = () => {
-    const userProfileQueryKey = useAPIQueryKey('identity', 'user-profile', 'get');
-
     const actions = {
         update: SpaceConnector.clientV2.identity.userProfile.update<UserProfileUpdateParameters, any>,
         updatePassword: SpaceConnector.clientV2.identity.userProfile.updatePassword<UserProfileUpdatePasswordParameters, any>,
@@ -26,7 +23,6 @@ export const useUserProfileApi = () => {
     };
 
     return {
-        userProfileQueryKey,
         userProfileAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/user/composables/use-user-api.ts b/apps/web/src/api-clients/identity/user/composables/use-user-api.ts
index cacbbbc1f0..314ec3e23e 100644
--- a/apps/web/src/api-clients/identity/user/composables/use-user-api.ts
+++ b/apps/web/src/api-clients/identity/user/composables/use-user-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { UserCreateParameters } from '@/api-clients/identity/user/schema/api-verbs/create';
 import type { UserDeleteParameters } from '@/api-clients/identity/user/schema/api-verbs/delete';
@@ -14,9 +13,6 @@ import type { UserVerifyEmailParameters } from '@/api-clients/identity/user/sche
 import type { UserModel } from '@/api-clients/identity/user/schema/model';
 
 export const useUserApi = () => {
-    const userQueryKey = useAPIQueryKey('identity', 'user', 'get');
-    const userListQueryKey = useAPIQueryKey('identity', 'user', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.user.create<UserCreateParameters, UserModel>,
         update: SpaceConnector.clientV2.identity.user.update<UserUpdateParameters, UserModel>,
@@ -30,8 +26,6 @@ export const useUserApi = () => {
     };
 
     return {
-        userQueryKey,
-        userListQueryKey,
         userAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/workspace-group-user/composables/use-workspace-group-user-api.ts b/apps/web/src/api-clients/identity/workspace-group-user/composables/use-workspace-group-user-api.ts
index e1ce722657..fab5821b63 100644
--- a/apps/web/src/api-clients/identity/workspace-group-user/composables/use-workspace-group-user-api.ts
+++ b/apps/web/src/api-clients/identity/workspace-group-user/composables/use-workspace-group-user-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { WorkspaceGroupUserAddParameters } from '@/api-clients/identity/workspace-group-user/schema/api-verbs/add';
 import type { WorkspaceGroupUserFindParameters } from '@/api-clients/identity/workspace-group-user/schema/api-verbs/find';
@@ -11,9 +10,6 @@ import type { WorkspaceGroupUserUpdateRoleParameters } from '@/api-clients/ident
 import type { WorkspaceGroupUserModel } from '@/api-clients/identity/workspace-group-user/schema/model';
 
 export const useWorkspaceGroupUserApi = () => {
-    const workspaceGroupUserQueryKey = useAPIQueryKey('identity', 'workspace-group-user', 'get');
-    const workspaceGroupUserListQueryKey = useAPIQueryKey('identity', 'workspace-group-user', 'list');
-
     const actions = {
         add: SpaceConnector.clientV2.identity.workspaceGroupUser.add<WorkspaceGroupUserAddParameters, WorkspaceGroupUserModel>,
         remove: SpaceConnector.clientV2.identity.workspaceGroupUser.remove<WorkspaceGroupUserRemoveParameters>,
@@ -25,8 +21,6 @@ export const useWorkspaceGroupUserApi = () => {
     };
 
     return {
-        workspaceGroupUserQueryKey,
-        workspaceGroupUserListQueryKey,
         workspaceGroupUserAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/workspace-group/composables/use-workspace-group-api.ts b/apps/web/src/api-clients/identity/workspace-group/composables/use-workspace-group-api.ts
index 6d823bcfaf..756b377597 100644
--- a/apps/web/src/api-clients/identity/workspace-group/composables/use-workspace-group-api.ts
+++ b/apps/web/src/api-clients/identity/workspace-group/composables/use-workspace-group-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { WorkspaceGroupAddUsersParameters } from '@/api-clients/identity/workspace-group/schema/api-verbs/add-users';
 import type { WorkspaceGroupCreateParameters } from '@/api-clients/identity/workspace-group/schema/api-verbs/create';
@@ -14,9 +13,6 @@ import type { WorkspaceGroupUpdateRoleParameters } from '@/api-clients/identity/
 import type { WorkspaceGroupModel } from '@/api-clients/identity/workspace-group/schema/model';
 
 export const useWorkspaceGroupApi = () => {
-    const workspaceGroupQueryKey = useAPIQueryKey('identity', 'workspace-group', 'get');
-    const workspaceGroupListQueryKey = useAPIQueryKey('identity', 'workspace-group', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.workspaceGroup.create<WorkspaceGroupCreateParameters, WorkspaceGroupModel>,
         update: SpaceConnector.clientV2.identity.workspaceGroup.update<WorkspaceGroupUpdateParameters, WorkspaceGroupModel>,
@@ -30,8 +26,6 @@ export const useWorkspaceGroupApi = () => {
     };
 
     return {
-        workspaceGroupQueryKey,
-        workspaceGroupListQueryKey,
         workspaceGroupAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/workspace-user/composables/use-workspace-user-api.ts b/apps/web/src/api-clients/identity/workspace-user/composables/use-workspace-user-api.ts
index 1981d3e820..1136eeae6e 100644
--- a/apps/web/src/api-clients/identity/workspace-user/composables/use-workspace-user-api.ts
+++ b/apps/web/src/api-clients/identity/workspace-user/composables/use-workspace-user-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { WorkspaceUserCreateParameters } from '@/api-clients/identity/workspace-user/schema/api-verbs/create';
 import type { FindWorkspaceUserParameters } from '@/api-clients/identity/workspace-user/schema/api-verbs/find';
@@ -9,9 +8,6 @@ import type { WorkspaceUserListParameters } from '@/api-clients/identity/workspa
 import type { WorkspaceUserModel } from '@/api-clients/identity/workspace-user/schema/model';
 
 export const useWorkspaceUserApi = () => {
-    const workspaceUserQueryKey = useAPIQueryKey('identity', 'workspace-user', 'get');
-    const workspaceUserListQueryKey = useAPIQueryKey('identity', 'workspace-user', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.workspaceUser.create<WorkspaceUserCreateParameters, WorkspaceUserModel>,
         get: SpaceConnector.clientV2.identity.workspaceUser.get<WorkspaceUserGetParameters, WorkspaceUserModel>,
@@ -20,8 +16,6 @@ export const useWorkspaceUserApi = () => {
     };
 
     return {
-        workspaceUserQueryKey,
-        workspaceUserListQueryKey,
         workspaceUserAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/identity/workspace/composables/use-workspace-api.ts b/apps/web/src/api-clients/identity/workspace/composables/use-workspace-api.ts
index e2d4115f5b..83ee5f71de 100644
--- a/apps/web/src/api-clients/identity/workspace/composables/use-workspace-api.ts
+++ b/apps/web/src/api-clients/identity/workspace/composables/use-workspace-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { WorkspaceAddPackageParameters } from '@/api-clients/identity/workspace/schema/api-verbs/add-package';
 import type { WorkspaceChangeWorkspaceGroupParameters } from '@/api-clients/identity/workspace/schema/api-verbs/change-workspace-group';
@@ -12,9 +11,6 @@ import type { WorkspaceUpdateParameters } from '@/api-clients/identity/workspace
 import type { WorkspaceModel } from '@/api-clients/identity/workspace/schema/model';
 
 export const useWorkspaceApi = () => {
-    const workspaceQueryKey = useAPIQueryKey('identity', 'workspace', 'get');
-    const workspaceListQueryKey = useAPIQueryKey('identity', 'workspace', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.identity.workspace.create<WorkspaceCreateParameters, WorkspaceModel>,
         update: SpaceConnector.clientV2.identity.workspace.update<WorkspaceUpdateParameters, WorkspaceModel>,
@@ -26,8 +22,6 @@ export const useWorkspaceApi = () => {
     };
 
     return {
-        workspaceQueryKey,
-        workspaceListQueryKey,
         workspaceAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/inventory/metric-data/composables/use-metric-data-api.ts b/apps/web/src/api-clients/inventory/metric-data/composables/use-metric-data-api.ts
index d23b8633d9..153dc8ab0b 100644
--- a/apps/web/src/api-clients/inventory/metric-data/composables/use-metric-data-api.ts
+++ b/apps/web/src/api-clients/inventory/metric-data/composables/use-metric-data-api.ts
@@ -11,12 +11,8 @@ import type { MetricDataModel } from '@/schema/inventory/metric-data/model';
 
 export const useMetricDataApi = () => {
     const actions = {
-        async list(params: MetricDataListParameters) {
-            return SpaceConnector.clientV2.inventory.metricData.list<MetricDataListParameters, ListResponse<MetricDataModel>>(params);
-        },
-        async analyze<T = any>(params: MetricDataAnalyzeParameters) {
-            return SpaceConnector.clientV2.inventory.metricData.analyze<MetricDataAnalyzeParameters, AnalyzeResponse<T>>(params);
-        },
+        list: SpaceConnector.clientV2.inventory.metricData.list<MetricDataListParameters, ListResponse<MetricDataModel>>,
+        analyze: SpaceConnector.clientV2.inventory.metricData.analyze<MetricDataAnalyzeParameters, AnalyzeResponse<any>>,
     };
 
     return {
diff --git a/apps/web/src/api-clients/opsflow/comment/composables/use-comment-api.ts b/apps/web/src/api-clients/opsflow/comment/composables/use-comment-api.ts
index a48c00a006..b5574bf903 100644
--- a/apps/web/src/api-clients/opsflow/comment/composables/use-comment-api.ts
+++ b/apps/web/src/api-clients/opsflow/comment/composables/use-comment-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { CommentCreateParameters } from '@/api-clients/opsflow/comment/schema/api-verbs/create';
 import type { CommentDeleteParameters } from '@/api-clients/opsflow/comment/schema/api-verbs/delete';
@@ -10,9 +9,6 @@ import type { CommentUpdateParameters } from '@/api-clients/opsflow/comment/sche
 import type { CommentModel } from '@/api-clients/opsflow/comment/schema/model';
 
 export const useCommentApi = () => {
-    const commentQueryKey = useAPIQueryKey('opsflow', 'comment', 'get');
-    const commentListQueryKey = useAPIQueryKey('opsflow', 'comment', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.opsflow.comment.create<CommentCreateParameters, CommentModel>,
         update: SpaceConnector.clientV2.opsflow.comment.update<CommentUpdateParameters, CommentModel>,
@@ -22,8 +18,6 @@ export const useCommentApi = () => {
     };
 
     return {
-        commentQueryKey,
-        commentListQueryKey,
         commentAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/opsflow/event/composables/use-event-api.ts b/apps/web/src/api-clients/opsflow/event/composables/use-event-api.ts
index 3a10564a88..af673ee3e3 100644
--- a/apps/web/src/api-clients/opsflow/event/composables/use-event-api.ts
+++ b/apps/web/src/api-clients/opsflow/event/composables/use-event-api.ts
@@ -1,19 +1,15 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { EventListParameters } from '@/api-clients/opsflow/event/schema/api-verbs/list';
 import type { EventModel } from '@/api-clients/opsflow/event/schema/model';
 
 export const useEventApi = () => {
-    const eventListQueryKey = useAPIQueryKey('opsflow', 'event', 'list');
-
     const actions = {
         list: SpaceConnector.clientV2.opsflow.event.list<EventListParameters, ListResponse<EventModel>>,
     };
 
     return {
-        eventListQueryKey,
         eventAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/opsflow/task-category/composables/use-task-category-api.ts b/apps/web/src/api-clients/opsflow/task-category/composables/use-task-category-api.ts
index 9839b45774..cb69cf81ec 100644
--- a/apps/web/src/api-clients/opsflow/task-category/composables/use-task-category-api.ts
+++ b/apps/web/src/api-clients/opsflow/task-category/composables/use-task-category-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { TaskCategoryCreateParameters } from '@/api-clients/opsflow/task-category/schema/api-verbs/create';
 import type { TaskCategoryDeleteParameters } from '@/api-clients/opsflow/task-category/schema/api-verbs/delete';
@@ -10,9 +9,6 @@ import type { TaskCategoryUpdateParameters } from '@/api-clients/opsflow/task-ca
 import type { TaskCategoryModel } from '@/api-clients/opsflow/task-category/schema/model';
 
 export const useTaskCategoryApi = () => {
-    const taskCategoryQueryKey = useAPIQueryKey('opsflow', 'task-category', 'get');
-    const taskCategoryListQueryKey = useAPIQueryKey('opsflow', 'task-category', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.opsflow.taskCategory.create<TaskCategoryCreateParameters, TaskCategoryModel>,
         update: SpaceConnector.clientV2.opsflow.taskCategory.update<TaskCategoryUpdateParameters, TaskCategoryModel>,
@@ -22,8 +18,6 @@ export const useTaskCategoryApi = () => {
     };
 
     return {
-        taskCategoryQueryKey,
-        taskCategoryListQueryKey,
         taskCategoryAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/opsflow/task-type/composables/use-task-type-api.ts b/apps/web/src/api-clients/opsflow/task-type/composables/use-task-type-api.ts
index 70a688ae0a..7e045ff1d2 100644
--- a/apps/web/src/api-clients/opsflow/task-type/composables/use-task-type-api.ts
+++ b/apps/web/src/api-clients/opsflow/task-type/composables/use-task-type-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { TaskTypeCreateParameters } from '@/api-clients/opsflow/task-type/schema/api-verbs/create';
 import type { TaskTypeDeleteParameters } from '@/api-clients/opsflow/task-type/schema/api-verbs/delete';
@@ -11,9 +10,6 @@ import type { TaskTypeUpdateFieldsParameters } from '@/api-clients/opsflow/task-
 import type { TaskTypeModel } from '@/api-clients/opsflow/task-type/schema/model';
 
 export const useTaskTypeApi = () => {
-    const taskTypeQueryKey = useAPIQueryKey('opsflow', 'task-type', 'get');
-    const taskTypeListQueryKey = useAPIQueryKey('opsflow', 'task-type', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.opsflow.taskType.create<TaskTypeCreateParameters, TaskTypeModel>,
         update: SpaceConnector.clientV2.opsflow.taskType.update<TaskTypeUpdateParameters, TaskTypeModel>,
@@ -24,8 +20,6 @@ export const useTaskTypeApi = () => {
     };
 
     return {
-        taskTypeQueryKey,
-        taskTypeListQueryKey,
         taskTypeAPI: actions,
     };
 };
diff --git a/apps/web/src/api-clients/opsflow/task/composables/use-task-api.ts b/apps/web/src/api-clients/opsflow/task/composables/use-task-api.ts
index 501cd4101e..7c2fcd17c2 100644
--- a/apps/web/src/api-clients/opsflow/task/composables/use-task-api.ts
+++ b/apps/web/src/api-clients/opsflow/task/composables/use-task-api.ts
@@ -1,6 +1,5 @@
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { useAPIQueryKey } from '@/api-clients/_common/composables/use-api-query-key';
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { TaskChangeAssigneeParameters } from '@/api-clients/opsflow/task/schema/api-verbs/change-assignee';
 import type { TaskChangeStatusParameters } from '@/api-clients/opsflow/task/schema/api-verbs/change-status';
@@ -13,9 +12,6 @@ import type { TaskUpdateDescriptionParameters } from '@/api-clients/opsflow/task
 import type { TaskModel } from '@/api-clients/opsflow/task/schema/model';
 
 export const useTaskApi = () => {
-    const taskQueryKey = useAPIQueryKey('opsflow', 'task', 'get');
-    const taskListQueryKey = useAPIQueryKey('opsflow', 'task', 'list');
-
     const actions = {
         create: SpaceConnector.clientV2.opsflow.task.create<TaskCreateParameters, TaskModel>,
         update: SpaceConnector.clientV2.opsflow.task.update<TaskUpdateParameters, TaskModel>,
@@ -28,8 +24,6 @@ export const useTaskApi = () => {
     };
 
     return {
-        taskQueryKey,
-        taskListQueryKey,
         taskAPI: actions,
     };
 };
diff --git a/apps/web/src/common/components/bookmark/BookmarkFolderFormModal.vue b/apps/web/src/common/components/bookmark/BookmarkFolderFormModal.vue
index 6b4b6e90f6..58679a5c34 100644
--- a/apps/web/src/common/components/bookmark/BookmarkFolderFormModal.vue
+++ b/apps/web/src/common/components/bookmark/BookmarkFolderFormModal.vue
@@ -10,7 +10,7 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { BOOKMARK_MODAL_TYPE } from '@/common/components/bookmark/constant/constant';
 import { useBookmarkStore } from '@/common/components/bookmark/store/bookmark-store';
@@ -38,13 +38,13 @@ const bookmarkStore = useBookmarkStore();
 const bookmarkState = bookmarkStore.state;
 const appContextStore = useAppContextStore();
 const appContextGetters = appContextStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const emit = defineEmits<{(e: 'confirm', isEdit?: boolean, name?: string): void; }>();
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextGetters.isAdminMode),
-    isWorkspaceMember: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 
     modal: computed<BookmarkModalStateType>(() => bookmarkState.modal),
     bookmarkType: computed<BookmarkType|undefined>(() => bookmarkState.bookmarkType),
diff --git a/apps/web/src/common/components/bookmark/BookmarkLinkFormModal.vue b/apps/web/src/common/components/bookmark/BookmarkLinkFormModal.vue
index fb6063854a..99b12f4346 100644
--- a/apps/web/src/common/components/bookmark/BookmarkLinkFormModal.vue
+++ b/apps/web/src/common/components/bookmark/BookmarkLinkFormModal.vue
@@ -15,7 +15,7 @@ import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
@@ -47,14 +47,14 @@ const userWorkspaceStore = useUserWorkspaceStore();
 const userWorkspaceStoreGetters = userWorkspaceStore.getters;
 const appContextStore = useAppContextStore();
 const appContextGetters = appContextStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const emit = defineEmits<{(e: 'confirm', selectedFolder?: BookmarkItem, scope?: BookmarkType): void; }>();
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextGetters.isAdminMode),
     currentWorkspaceId: computed<string|undefined>(() => userWorkspaceStoreGetters.currentWorkspaceId),
-    isWorkspaceMember: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 
     modal: computed<BookmarkModalStateType>(() => bookmarkState.modal),
     selectedBookmark: computed<BookmarkItem|undefined>(() => bookmarkState.selectedBookmark),
diff --git a/apps/web/src/common/components/schedule-setting-form/ScheduleSettingForm.vue b/apps/web/src/common/components/schedule-setting-form/ScheduleSettingForm.vue
index 20158e75d8..d77d64cb52 100644
--- a/apps/web/src/common/components/schedule-setting-form/ScheduleSettingForm.vue
+++ b/apps/web/src/common/components/schedule-setting-form/ScheduleSettingForm.vue
@@ -3,7 +3,7 @@ import {
     computed, onMounted, reactive, watch,
 } from 'vue';
 
-import { range, zipObject } from 'lodash';
+import { map, range, zipObject } from 'lodash';
 
 import {
     PFieldGroup, PRadioGroup, PRadio, PI, PSelectButton, PSelectDropdown,
@@ -13,6 +13,7 @@ import type { SelectDropdownMenuItem } from '@cloudforet/mirinae/types/controls/
 import type { ServiceChannelScheduleType } from '@/schema/alert-manager/service-channel/type';
 import { i18n } from '@/translations';
 
+import { timezoneList } from '@/store/user/constant';
 import { useUserStore } from '@/store/user/user-store';
 
 import type {
@@ -42,6 +43,10 @@ const storeState = reactive({
     timezone: computed(() => userState.timezone || 'UTC'),
 });
 const state = reactive({
+    timezones: computed<SelectDropdownMenuItem[]>(() => map(timezoneList, (d) => ({
+        type: 'item', label: d === 'UTC' ? `${d} (default)` : d, name: d,
+    }))),
+    timezone: [{ label: storeState.timezone, name: storeState.timezone }] as SelectDropdownMenuItem[],
     scheduleTypeList: computed<ScheduleRadioType[]>(() => [
         { name: 'WEEK_DAY', label: i18n.t('COMMON.SCHEDULE_SETTING.WEEKDAYS') },
         { name: 'ALL_DAY', label: i18n.t('COMMON.SCHEDULE_SETTING.EVERYDAY') },
@@ -128,10 +133,10 @@ const areDayArraysEqual = (selectedDayButton: DayType[], compareDays: DayType[])
 };
 
 
-watch([() => state.selectedRadioIdx, () => state.selectedDayButton, () => state.start, () => state.end], ([selectedRadioIdx]) => {
+watch([() => state.selectedRadioIdx, () => state.selectedDayButton, () => state.start, () => state.end, () => state.timezone], ([selectedRadioIdx]) => {
     emit('update-form', {
         SCHEDULE_TYPE: state.scheduleTypeList[selectedRadioIdx].name,
-        TIMEZONE: storeState.timezone,
+        TIMEZONE: state.timezone[0]?.name,
         ...state.scheduleDayForm,
     });
 }, { immediate: true });
@@ -155,6 +160,19 @@ onMounted(() => {
 
 <template>
     <div class="schedule-setting-form flex flex-col">
+        <p-field-group :label="$t('COMMON.SCHEDULE_SETTING.SET_TIMEZONE')"
+                       required
+                       class="flex flex-col"
+        >
+            <p-select-dropdown :menu="state.timezones"
+                               :selected.sync="state.timezone"
+                               :page-size="10"
+                               is-filterable
+                               is-fixed-width
+                               show-delete-all-button
+                               class="timezone-dropdown"
+            />
+        </p-field-group>
         <p-field-group :label="$t('COMMON.SCHEDULE_SETTING.SCHEDULE_SETTING')"
                        required
         >
@@ -205,3 +223,9 @@ onMounted(() => {
         </p-field-group>
     </div>
 </template>
+
+<style lang="postcss" scoped>
+.timezone-dropdown {
+    width: 16.625rem;
+}
+</style>
diff --git a/apps/web/src/common/composables/contents-accessibility/index.ts b/apps/web/src/common/composables/contents-accessibility/index.ts
index 7581899961..09228415af 100644
--- a/apps/web/src/common/composables/contents-accessibility/index.ts
+++ b/apps/web/src/common/composables/contents-accessibility/index.ts
@@ -1,7 +1,7 @@
 import type { Ref } from 'vue';
 import { computed, reactive, toRef } from 'vue';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
+import { useMenuStore } from '@/store/menu/menu-store';
 
 import type { MenuId } from '@/lib/menu/config';
 
@@ -10,10 +10,10 @@ interface UseContentsAccessibilityReturnType {
 }
 
 export const useContentsAccessibility = (menuId: MenuId): UseContentsAccessibilityReturnType => {
-    const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+    const menuStore = useMenuStore();
 
     const state = reactive({
-        visibleContents: computed<boolean>(() => globalConfigSchemaStore.getters.menuList.findIndex((menu) => menu.id === menuId) !== -1),
+        visibleContents: computed<boolean>(() => menuStore.getters.menuList.findIndex((menu) => menu.id === menuId) !== -1),
     });
 
     return {
diff --git a/apps/web/src/common/composables/global-dashboard/use-global-dashboard-query.ts b/apps/web/src/common/composables/global-dashboard/use-global-dashboard-query.ts
new file mode 100644
index 0000000000..d7f5654ded
--- /dev/null
+++ b/apps/web/src/common/composables/global-dashboard/use-global-dashboard-query.ts
@@ -0,0 +1,61 @@
+import {
+    computed,
+} from 'vue';
+
+
+import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
+
+import { usePrivateDashboardApi } from '@/api-clients/dashboard/private-dashboard/composables/use-private-dashboard-api';
+import { usePublicDashboardApi } from '@/api-clients/dashboard/public-dashboard/composables/use-public-dashboard-api';
+import { useScopedQuery } from '@/query/composables/use-scoped-query';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
+
+import { useAppContextStore } from '@/store/app-context/app-context-store';
+
+
+const DEFAULT_LIST_DATA = { results: [] };
+const STALE_TIME = 1000 * 60 * 5;
+
+const publicDashboardListApiQueryHelper = new ApiQueryHelper().addFilter({ k: 'resource_group', v: 'WORKSPACE', o: '=' });
+
+export const useGlobalDashboardQuery = () => {
+    const { publicDashboardAPI } = usePublicDashboardApi();
+    const { privateDashboardAPI } = usePrivateDashboardApi();
+
+    const appContextStore = useAppContextStore();
+    const _isAdminMode = computed<boolean>(() => appContextStore.getters.isAdminMode);
+
+    /* Query Keys */
+    const { key: publicDashboardListQueryKey, params: publicDashboardListParams } = useServiceQueryKey('dashboard', 'public-dashboard', 'list', {
+        params: computed(() => ({
+            query: {
+                filter: publicDashboardListApiQueryHelper.data.filter,
+            },
+        })),
+    });
+    const { key: privateDashboardListQueryKey, params: privateDashboardListParams } = useServiceQueryKey('dashboard', 'private-dashboard', 'list', {
+        params: computed(() => ({})),
+    });
+
+    return {
+        publicDashboardListQuery: useScopedQuery({
+            queryKey: publicDashboardListQueryKey,
+            queryFn: () => publicDashboardAPI.list(publicDashboardListParams.value),
+            select: (data) => data?.results ?? [],
+            initialData: DEFAULT_LIST_DATA,
+            initialDataUpdatedAt: 0,
+            staleTime: STALE_TIME,
+            enabled: computed(() => !_isAdminMode.value),
+        }, ['WORKSPACE']),
+        privateDashboardListQuery: useScopedQuery({
+            queryKey: privateDashboardListQueryKey,
+            queryFn: () => privateDashboardAPI.list(privateDashboardListParams.value),
+            select: (data) => data?.results || [],
+            initialData: DEFAULT_LIST_DATA,
+            initialDataUpdatedAt: 0,
+            staleTime: STALE_TIME,
+            enabled: computed(() => !_isAdminMode.value),
+        }, ['WORKSPACE']),
+    };
+};
+
diff --git a/apps/web/src/common/composables/grant-scope-guard/index.ts b/apps/web/src/common/composables/grant-scope-guard/index.ts
index ad4d72cf34..66d41b1897 100644
--- a/apps/web/src/common/composables/grant-scope-guard/index.ts
+++ b/apps/web/src/common/composables/grant-scope-guard/index.ts
@@ -3,8 +3,8 @@ import { computed, reactive, watch } from 'vue';
 import type { GrantScope } from '@/api-clients/identity/token/schema/type';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import type { GrantInfo } from '@/store/user/type';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
+import type { GrantInfo } from '@/store/authorization/type';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
@@ -14,10 +14,10 @@ interface GrantScopeGuardReturnType {
 }
 export const useGrantScopeGuard = (requiredScopes: GrantScope[], apiFunction: () => Promise<void>): GrantScopeGuardReturnType => {
     const appContextStore = useAppContextStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const state = reactive({
-        currentGrantInfo: computed<GrantInfo>(() => userStore.state.currentGrantInfo || { scope: 'USER' }),
+        currentGrantInfo: computed<GrantInfo>(() => authorizationStore.state.currentGrantInfo || { scope: 'USER' }),
         isLoading: computed(() => appContextStore.getters.globalGrantLoading),
         isValidScope: computed(() => requiredScopes.includes(state.currentGrantInfo.scope)),
     });
diff --git a/apps/web/src/common/composables/page-editable-status/index.ts b/apps/web/src/common/composables/page-editable-status/index.ts
index a77d60f18c..b5a3eb803c 100644
--- a/apps/web/src/common/composables/page-editable-status/index.ts
+++ b/apps/web/src/common/composables/page-editable-status/index.ts
@@ -1,9 +1,7 @@
 import type { Ref } from 'vue';
 import { computed, reactive, toRef } from 'vue';
 
-import { useUserStore } from '@/store/user/user-store';
-
-import type { PageAccessMap } from '@/lib/access-control/config';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { useCurrentMenuId } from '@/common/composables/current-menu-id';
 
@@ -12,17 +10,11 @@ interface UsePageEditableStatusReturnType {
 }
 
 export const usePageEditableStatus = (): UsePageEditableStatusReturnType => {
-    const userStore = useUserStore();
-    const userGetters = userStore.getters;
-
+    const authorizationStore = useAuthorizationStore();
     const { currentMenuId } = useCurrentMenuId();
 
-    const storeState = reactive({
-        pageAccessPermissionMap: computed<PageAccessMap>(() => userGetters.pageAccessPermissionMap),
-    });
-
     const state = reactive({
-        hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[currentMenuId.value]?.write),
+        hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[currentMenuId.value]?.write),
     });
 
     return {
diff --git a/apps/web/src/common/modules/favorites/favorite-button/FavoriteButton.vue b/apps/web/src/common/modules/favorites/favorite-button/FavoriteButton.vue
index 0644fc399b..e7368abb22 100644
--- a/apps/web/src/common/modules/favorites/favorite-button/FavoriteButton.vue
+++ b/apps/web/src/common/modules/favorites/favorite-button/FavoriteButton.vue
@@ -2,7 +2,7 @@
 import {
     computed, reactive,
 } from 'vue';
-import { useRoute } from 'vue-router/composables';
+import { useRoute, useRouter } from 'vue-router/composables';
 
 import { PI } from '@cloudforet/mirinae';
 
@@ -12,7 +12,6 @@ import type { MetricExampleModel } from '@/schema/inventory/metric-example/model
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useDisplayStore } from '@/store/display/display-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CloudServiceTypeReferenceMap } from '@/store/reference/cloud-service-type-reference-store';
 import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
@@ -34,13 +33,14 @@ import {
     convertWorkspaceConfigToReferenceData,
     convertServiceConfigToReferenceData,
 } from '@/lib/helper/config-data-helper';
+import { useAllMenuList } from '@/lib/menu/use-all-menu-list';
 
+import { useGlobalDashboardQuery } from '@/common/composables/global-dashboard/use-global-dashboard-query';
 import { useFavoriteStore } from '@/common/modules/favorites/favorite-button/store/favorite-store';
 import type { FavoriteType, FavoriteConfig } 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';
 
-import { useDashboardQuery } from '@/services/dashboards/composables/use-dashboard-query';
 
 interface Props {
     itemId: string;
@@ -57,6 +57,7 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 const route = useRoute();
+const router = useRouter();
 
 const allReferenceStore = useAllReferenceStore();
 const userWorkspaceStore = useUserWorkspaceStore();
@@ -66,18 +67,19 @@ const favoriteStore = useFavoriteStore();
 const favoriteStoreGetters = favoriteStore.getters;
 const gnbStore = useGnbStore();
 const gnbStoreGetters = gnbStore.getters;
-const displayStore = useDisplayStore();
+const { getAllMenuList } = useAllMenuList();
+
 
 /* Query */
 const {
-    publicDashboardList,
-    privateDashboardList,
-} = useDashboardQuery();
+    publicDashboardListQuery,
+    privateDashboardListQuery,
+} = useGlobalDashboardQuery();
 
 const emit = defineEmits<{(e: 'click-favorite'): void;
 }>();
 
-const dashboardList = computed(() => [...publicDashboardList.value, ...privateDashboardList.value]);
+const dashboardList = computed(() => [...(publicDashboardListQuery?.data?.value ?? []), ...(privateDashboardListQuery?.data?.value ?? [])]);
 const storeState = reactive({
     favoriteMenuList: computed(() => favoriteStoreGetters.favoriteMenuList),
     favoriteWorkspaceMenuList: computed(() => favoriteStoreGetters.workspaceItems),
@@ -152,7 +154,7 @@ const convertFavoriteToReferenceData = (favoriteConfig: FavoriteConfig): Referen
     if (itemType === FAVORITE_TYPE.SERVICE) {
         return convertServiceConfigToReferenceData([favoriteConfig], storeState.service)[0];
     }
-    const allMenuList = displayStore.getAllMenuList(route);
+    const allMenuList = getAllMenuList(route, router);
     return convertMenuConfigToReferenceData([favoriteConfig], allMenuList)[0];
 };
 </script>
diff --git a/apps/web/src/common/modules/favorites/favorite-button/store/favorite-store.ts b/apps/web/src/common/modules/favorites/favorite-button/store/favorite-store.ts
index d41b32a4a0..daa94a742d 100644
--- a/apps/web/src/common/modules/favorites/favorite-button/store/favorite-store.ts
+++ b/apps/web/src/common/modules/favorites/favorite-button/store/favorite-store.ts
@@ -1,5 +1,3 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
 import { computed, reactive, watch } from 'vue';
 
 import { defineStore } from 'pinia';
@@ -62,6 +60,10 @@ export const useFavoriteStore = defineStore('favorite', () => {
 
     const actions = {
         fetchFavorite: async () => {
+            if (!_getters.userId) {
+                console.error('userId is not found');
+                return;
+            }
             favoriteListApiQuery.setFilters([
                 { k: 'user_id', v: _getters.userId, o: '=' },
                 { k: 'name', v: 'console:favorite:', o: '' },
@@ -79,6 +81,10 @@ export const useFavoriteStore = defineStore('favorite', () => {
             }
         },
         fetchWorkspaceFavorite: async () => {
+            if (!_getters.userId) {
+                console.error('userId is not found');
+                return;
+            }
             favoriteListApiQuery.setFilters([
                 { k: 'user_id', v: _getters.userId, o: '=' },
                 { k: 'name', v: `console:favorite:${FAVORITE_TYPE.WORKSPACE}`, o: '' },
diff --git a/apps/web/src/common/modules/navigations/gnb/GNBNavigationRail.vue b/apps/web/src/common/modules/navigations/gnb/GNBNavigationRail.vue
index f4593f0749..16e010e23b 100644
--- a/apps/web/src/common/modules/navigations/gnb/GNBNavigationRail.vue
+++ b/apps/web/src/common/modules/navigations/gnb/GNBNavigationRail.vue
@@ -14,13 +14,13 @@ import type { ContextMenuType } from '@cloudforet/mirinae/types/controls/context
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useDisplayStore } from '@/store/display/display-store';
-import type { DisplayMenu } from '@/store/display/type';
+import type { DisplayMenu } from '@/store/menu/type';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
 
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
+import { useAllMenuList } from '@/lib/menu/use-all-menu-list';
 
 import BetaMark from '@/common/components/marks/BetaMark.vue';
 import NewMark from '@/common/components/marks/NewMark.vue';
@@ -44,7 +44,7 @@ const gnbStore = useGnbStore();
 const gnbGetters = gnbStore.getters;
 const userWorkspaceStore = useUserWorkspaceStore();
 const userWorkspaceGetters = userWorkspaceStore.getters;
-const displayStore = useDisplayStore();
+const { getAllMenuList } = useAllMenuList();
 
 const route = useRoute();
 const router = useRouter();
@@ -69,7 +69,7 @@ const state = reactive({
     isMenuDescription: undefined as boolean | undefined,
     gnbMenuList: computed<GNBMenuType[]|undefined>(() => {
         let results = [] as GNBMenuType[];
-        const allMenuList = displayStore.getAllMenuList(route);
+        const allMenuList = getAllMenuList(route, router);
         const menuList = allMenuList.filter((d) => !d.hideOnGNB);
         if (state.isInit && isEmpty(storeState.costDataSource)) {
             results = removeCostExplorerFromMenuList(menuList);
diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/TopBarSearchDropdown.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/TopBarSearchDropdown.vue
index d6f8b76d00..b2662c3d76 100644
--- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/TopBarSearchDropdown.vue
+++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/TopBarSearchDropdown.vue
@@ -13,10 +13,9 @@ import type { ValueItem } from '@cloudforet/mirinae/types/controls/search/query-
 
 import { useReferenceRouter } from '@/router/composables/use-reference-router';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { MENU_ID } from '@/lib/menu/config';
 
 import { useRecentStore } from '@/common/modules/navigations/stores/recent-store';
@@ -54,8 +53,8 @@ const BOTTOM_MARGIN = 5.5 * 16;
 
 const topBarSearchStore = useTopBarSearchStore();
 const recentStore = useRecentStore();
-const userStore = useUserStore();
 const windowSize = useWindowSize();
+const authorizationStore = useAuthorizationStore();
 
 const { getReferenceLocation } = useReferenceRouter();
 
@@ -73,7 +72,6 @@ const getTabHeaderHeight = () => {
 const storeState = reactive({
     activeTab: computed(() => topBarSearchStore.state.activeTab),
     cloudServiceTypeMap: computed(() => allReferenceStore.getters.cloudServiceType),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 
 const state = reactive({
@@ -86,7 +84,7 @@ const state = reactive({
     tabs: computed(() => {
         const accessMenuList: ValueItem[] = [];
         state.defaultServiceTabs.forEach((i) => {
-            if (storeState.pageAccessPermissionMap[i.id]) {
+            if (authorizationStore.getters.pageAccessPermissionMap[i.id]) {
                 accessMenuList.push({ label: i.label, name: i.name });
             }
         });
diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/modules/TopBarSearchServiceTab.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/modules/TopBarSearchServiceTab.vue
index 4ec074ee72..8ae2bc60ae 100644
--- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/modules/TopBarSearchServiceTab.vue
+++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/modules/TopBarSearchServiceTab.vue
@@ -12,15 +12,15 @@ import { getTextHighlightRegex, PDataLoader, PDivider } from '@cloudforet/mirina
 import { i18n } from '@/translations';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useDisplayStore } from '@/store/display/display-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
+
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import type { SuggestionMenu } from '@/lib/helper/menu-suggestion-helper';
 import { getAllSuggestionMenuList } from '@/lib/helper/menu-suggestion-helper';
 import type { MenuInfo } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
+import { useAllMenuList } from '@/lib/menu/use-all-menu-list';
 
 import { useProxyValue } from '@/common/composables/proxy-state';
 import { useRecentStore } from '@/common/modules/navigations/stores/recent-store';
@@ -49,8 +49,8 @@ const props = withDefaults(defineProps<Props>(), {
 const userWorkspaceStore = useUserWorkspaceStore();
 const topBarSearchStore = useTopBarSearchStore();
 const recentStore = useRecentStore();
-const userStore = useUserStore();
-const displayStore = useDisplayStore();
+const authorizationStore = useAuthorizationStore();
+const { getAllMenuList } = useAllMenuList();
 
 const route = useRoute();
 const router = useRouter();
@@ -66,12 +66,11 @@ const storeState = reactive({
     currentWorkspaceId: computed(() => userWorkspaceStore.getters.currentWorkspaceId),
     inputText: computed(() => topBarSearchStore.getters.inputText),
     trimmedInputText: computed(() => topBarSearchStore.getters.trimmedInputText),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 
 const state = reactive({
     allMenuList: computed<SuggestionMenu[]>(() => {
-        const allMenuList = displayStore.getAllMenuList(route);
+        const allMenuList = getAllMenuList(route, router);
         return getAllSuggestionMenuList(allMenuList);
     }),
     allMenuMap: computed(() => {
@@ -99,7 +98,7 @@ const state = reactive({
     recentMenuList: computed(() => {
         const _recentMenuList: RecentItem[] = [];
         recentStore.state.recentMenuList.forEach((i) => {
-            if (storeState.pageAccessPermissionMap[i.data.id]) {
+            if (authorizationStore.getters.pageAccessPermissionMap[i.data.id]) {
                 _recentMenuList.push(i);
             }
         });
diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/TopBarToolset.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/TopBarToolset.vue
index 2f471bf2ec..b6ca3f9cde 100644
--- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/TopBarToolset.vue
+++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/TopBarToolset.vue
@@ -7,9 +7,10 @@ import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useDomainStore } from '@/store/domain/domain-store';
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
 import { useUserStore } from '@/store/user/user-store';
 
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
+
 import TopBarAdminToggleButton from '@/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-admin-toggle-button/TopBarAdminToggleButton.vue';
 import TopBarFavorite
     from '@/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-favorite/TopBarFavorite.vue';
@@ -32,13 +33,13 @@ const emit = defineEmits<{(event: 'hide-menu'): void;
 const appContextStore = useAppContextStore();
 const domainStore = useDomainStore();
 const userStore = useUserStore();
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
 
 const state = reactive({
     isDomainAdmin: computed(() => userStore.getters.isDomainAdmin),
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
     isGrantLoading: computed(() => appContextStore.getters.globalGrantLoading),
-    visibleAlertIcon: computed(() => globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleAlertIcon),
+    visibleAlertIcon: computed(() => alertManagerUiAffectsSchema.value?.visibleAlertIcon),
     tooltipTexts: computed<Record<string, string>>(() => ({
         adminToggle: (state.isAdminMode ? i18n.t('COMMON.GNB.TOOLTIP.EXIT_ADMIN_MODE') : i18n.t('COMMON.GNB.TOOLTIP.ENABLE_ADMIN_MODE')) as string,
     })),
diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-favorite/modules/TopBarFavoriteContextMenu.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-favorite/modules/TopBarFavoriteContextMenu.vue
index 07c40ad50a..a3a90c3d17 100644
--- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-favorite/modules/TopBarFavoriteContextMenu.vue
+++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-favorite/modules/TopBarFavoriteContextMenu.vue
@@ -19,17 +19,14 @@ import { i18n } from '@/translations';
 import { useReferenceRouter } from '@/router/composables/use-reference-router';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useDisplayStore } from '@/store/display/display-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
 import type { MetricReferenceMap } from '@/store/reference/metric-reference-store';
 import type { ProjectGroupReferenceMap } from '@/store/reference/project-group-reference-store';
 import type { ProjectReferenceMap } from '@/store/reference/project-reference-store';
 import type { ServiceReferenceMap } from '@/store/reference/service-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import { isUserAccessibleToMenu } from '@/lib/access-control';
-import type { PageAccessMap } from '@/lib/access-control/config';
 import type { ReferenceData } from '@/lib/helper/config-data-helper';
 import {
     convertCostAnalysisConfigToReferenceData,
@@ -39,10 +36,12 @@ import {
     convertProjectGroupConfigToReferenceData, convertServiceConfigToReferenceData,
     getParsedKeysWithManagedCostQueryFavoriteKey,
 } from '@/lib/helper/config-data-helper';
-import type { MenuInfo } from '@/lib/menu/config';
+import type { MenuId, MenuInfo } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
+import { useAllMenuList } from '@/lib/menu/use-all-menu-list';
 
+import { useGlobalDashboardQuery } from '@/common/composables/global-dashboard/use-global-dashboard-query';
 import { useGrantScopeGuard } from '@/common/composables/grant-scope-guard';
 import { useFavoriteStore } from '@/common/modules/favorites/favorite-button/store/favorite-store';
 import { FAVORITE_TYPE } from '@/common/modules/favorites/favorite-button/type';
@@ -52,7 +51,6 @@ import TopBarSuggestionList from '@/common/modules/navigations/top-bar/modules/T
 
 import { ASSET_INVENTORY_ROUTE } from '@/services/asset-inventory/routes/route-constant';
 import { COST_EXPLORER_ROUTE } from '@/services/cost-explorer/routes/route-constant';
-import { useDashboardQuery } from '@/services/dashboards/composables/use-dashboard-query';
 import { DASHBOARDS_ROUTE } from '@/services/dashboards/routes/route-constant';
 import { PROJECT_ROUTE_V2 } from '@/services/project/v2/routes/route-constant';
 
@@ -78,21 +76,20 @@ const favoriteStore = useFavoriteStore();
 const favoriteGetters = favoriteStore.getters;
 const gnbStore = useGnbStore();
 const gnbStoreGetters = gnbStore.getters;
-const userStore = useUserStore();
-const displayStore = useDisplayStore();
-
+const authorizationStore = useAuthorizationStore();
+const { getAllMenuList } = useAllMenuList();
 const { getReferenceLocation } = useReferenceRouter();
 
 /* Query */
 const {
-    publicDashboardList,
-    privateDashboardList,
-} = useDashboardQuery();
+    publicDashboardListQuery,
+    privateDashboardListQuery,
+} = useGlobalDashboardQuery();
 
 const router = useRouter();
 const route = useRoute();
 
-const dashboardList = computed(() => [...publicDashboardList.value, ...privateDashboardList.value]);
+const dashboardList = computed(() => [...(publicDashboardListQuery?.data?.value ?? []), ...(privateDashboardListQuery?.data?.value ?? [])]);
 const storeState = reactive({
     currentWorkspaceId: computed<string|undefined>(() => userWorkspaceStore.getters.currentWorkspaceId),
     costDataSource: computed<CostDataSourceReferenceMap>(() => allReferenceStore.getters.costDataSource),
@@ -102,13 +99,13 @@ const storeState = reactive({
     projectGroups: computed<ProjectGroupReferenceMap>(() => allReferenceStore.getters.projectGroup),
     service: computed<ServiceReferenceMap>(() => allReferenceStore.getters.service),
     costQuerySets: computed<CostQuerySetModel[]>(() => gnbStoreGetters.costQuerySets),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
+    pageAccessPermissionList: computed<MenuId[]>(() => authorizationStore.getters.pageAccessPermissionList),
 });
 const state = reactive({
     loading: true,
     showAll: false,
     showAllType: undefined as undefined|FavoriteType,
-    accessProject: computed<boolean>(() => !isEmpty(storeState.pageAccessPermissionMap[MENU_ID.PROJECT])),
+    accessProject: computed<boolean>(() => !isEmpty(authorizationStore.getters.pageAccessPermissionMap[MENU_ID.PROJECT])),
     items: computed<FavoriteMenuItem[]>(() => {
         const results: FavoriteMenuItem[] = [];
         if (state.favoriteMenuItems.length) {
@@ -186,14 +183,14 @@ const state = reactive({
     }),
     //
     favoriteMenuItems: computed<ReferenceData[]>(() => {
-        const allMenuList = displayStore.getAllMenuList(route);
+        const allMenuList = getAllMenuList(route, router);
         return convertMenuConfigToReferenceData(
             favoriteGetters.menuItems ?? [],
             allMenuList,
         );
     }),
     favoriteCostAnalysisItems: computed<ReferenceData[]>(() => {
-        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.COST_ANALYSIS, userStore.getters.pageAccessPermissionList);
+        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.COST_ANALYSIS, storeState.pageAccessPermissionList);
         return isUserAccessible
             ? convertCostAnalysisConfigToReferenceData(
                 favoriteGetters.costAnalysisItems ?? [],
@@ -203,7 +200,7 @@ const state = reactive({
             : [];
     }),
     favoriteDashboardItems: computed<ReferenceData[]>(() => {
-        const isUserAccessibleToDashboards = isUserAccessibleToMenu(MENU_ID.DASHBOARDS, userStore.getters.pageAccessPermissionList);
+        const isUserAccessibleToDashboards = isUserAccessibleToMenu(MENU_ID.DASHBOARDS, storeState.pageAccessPermissionList);
         if (!isUserAccessibleToDashboards) return [];
         return convertDashboardConfigToReferenceData(
             favoriteGetters.dashboardItems ?? [],
@@ -211,7 +208,7 @@ const state = reactive({
         );
     }),
     favoriteMetricItems: computed<ReferenceData[]>(() => {
-        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.METRIC_EXPLORER, userStore.getters.pageAccessPermissionList);
+        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.METRIC_EXPLORER, storeState.pageAccessPermissionList);
         if (!isUserAccessible) return [];
         const favoriteMetricItems = convertMetricConfigToReferenceData(favoriteGetters.metricItems ?? [], storeState.metrics);
         const favoriteMetricExampleItems = convertMetricExampleConfigToReferenceData(favoriteGetters.metricExampleItems ?? [], storeState.metricExamples);
@@ -221,14 +218,14 @@ const state = reactive({
         ];
     }),
     favoriteProjects: computed<ReferenceData[]>(() => {
-        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.PROJECT, userStore.getters.pageAccessPermissionList);
+        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.PROJECT, storeState.pageAccessPermissionList);
         if (!isUserAccessible) return [];
         const favoriteProjectItems = convertProjectConfigToReferenceData(favoriteGetters.projectItems ?? [], storeState.projects);
         const favoriteProjectGroupItems = convertProjectGroupConfigToReferenceData(favoriteGetters.projectGroupItems ?? [], storeState.projectGroups);
         return [...favoriteProjectGroupItems, ...favoriteProjectItems];
     }),
     favoriteServiceItems: computed<ReferenceData[]>(() => {
-        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.SERVICE, userStore.getters.pageAccessPermissionList);
+        const isUserAccessible = isUserAccessibleToMenu(MENU_ID.SERVICE, storeState.pageAccessPermissionList);
         return isUserAccessible ? convertServiceConfigToReferenceData(favoriteGetters.serviceItems ?? [], storeState.service) : [];
     }),
 });
@@ -242,6 +239,8 @@ const getItemLength = (type: FavoriteType): number => {
     if (type === FAVORITE_TYPE.COST_ANALYSIS) return state.favoriteCostAnalysisItems.length;
     return 0;
 };
+const isUserAccessibleToMenu = (menuId: MenuId, pageAccessList: MenuId[]): boolean => pageAccessList.some((id) => id === menuId);
+
 
 /* Event */
 const handleClickMenuButton = (type: FavoriteType) => {
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 0da0b9f797..b381407e77 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,7 +8,7 @@ import {
     PI, PTooltip,
 } from '@cloudforet/mirinae';
 
-import { useNoticeStore } from '@/store/notice';
+import { useNoticeStore } from '@/store/notice/notice-store';
 import { useUserStore } from '@/store/user/user-store';
 
 import { useGrantScopeGuard } from '@/common/composables/grant-scope-guard';
diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/modules/TopBarNoticeContextMenu.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/modules/TopBarNoticeContextMenu.vue
index 49fe0e1185..7a343b675b 100644
--- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/modules/TopBarNoticeContextMenu.vue
+++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-notice/modules/TopBarNoticeContextMenu.vue
@@ -17,7 +17,7 @@ import { POST_BOARD_TYPE } from '@/schema/board/post/constant';
 import type { PostModel } from '@/schema/board/post/model';
 import { i18n } from '@/translations';
 
-import { useNoticeStore } from '@/store/notice';
+import { useNoticeStore } from '@/store/notice/notice-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 import { useGrantScopeGuard } from '@/common/composables/grant-scope-guard';
diff --git a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-profile/TopBarProfile.vue b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-profile/TopBarProfile.vue
index c6de3c4c1b..cb60b9da4b 100644
--- a/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-profile/TopBarProfile.vue
+++ b/apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-profile/TopBarProfile.vue
@@ -23,6 +23,7 @@ import WorkspaceOwnerImage from '@/assets/images/role/img_avatar_workspace-owner
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useDomainStore } from '@/store/domain/domain-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { RoleReferenceMap } from '@/store/reference/role-reference-store';
@@ -38,7 +39,6 @@ import { AUTH_ROUTE } from '@/services/auth/routes/route-constant';
 import { LANDING_ROUTE } from '@/services/landing/routes/route-constant';
 import { MY_PAGE_ROUTE } from '@/services/my-page/routes/route-constant';
 
-
 interface Props {
     visible: boolean
 }
@@ -49,6 +49,7 @@ const props = withDefaults(defineProps<Props>(), {
 const appContextStore = useAppContextStore();
 const domainStore = useDomainStore();
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const emit = defineEmits<{(e: 'update:visible', visible: boolean): void; }>();
 
@@ -69,7 +70,7 @@ const state = reactive({
         return UserImage;
     }),
     baseRoleType: computed(() => userStore.state.roleType),
-    currentRoleType: computed(() => userStore.state.currentRoleInfo?.roleType),
+    currentRoleType: computed(() => authorizationStore.state.currentRoleInfo?.roleType),
     visibleRoleType: computed(() => {
         if (state.baseRoleType === ROLE_TYPE.DOMAIN_ADMIN) return 'Admin';
         if (state.currentRoleType === ROLE_TYPE.WORKSPACE_OWNER) return 'Workspace Owner';
diff --git a/apps/web/src/common/modules/popup/notice/NoticePopup.vue b/apps/web/src/common/modules/popup/notice/NoticePopup.vue
index 97e8efef27..e3a537bbb6 100644
--- a/apps/web/src/common/modules/popup/notice/NoticePopup.vue
+++ b/apps/web/src/common/modules/popup/notice/NoticePopup.vue
@@ -15,6 +15,7 @@ import type { PostModel } from '@/schema/board/post/model';
 import type { NoticeConfigData } from '@/schema/board/post/type';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useUserStore } from '@/store/user/user-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
@@ -22,9 +23,10 @@ import NoticePopupItem from '@/common/modules/popup/notice/modules/NoticePopupIt
 
 const appContextStore = useAppContextStore();
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const state = reactive({
     isSessionExpired: computed<boolean>(() => !!userStore.state.isSessionExpired),
-    isNoRoleUser: computed<boolean>(() => userStore.getters.isNoRoleUser),
+    isNoRoleUser: computed<boolean>(() => authorizationStore.getters.isNoRoleUser),
     popupList: [] as PostModel[],
     hasLoaded: false,
 });
@@ -79,7 +81,7 @@ watch([
     () => state.isSessionExpired,
     () => state.isNoRoleUser,
     () => appContextStore.getters.globalGrantLoading,
-    () => userStore.state.currentGrantInfo,
+    () => authorizationStore.state.currentGrantInfo,
 ], async ([hasLoaded, isSessionExpired, isNoRoleUser, globalGrantLoading, grantInfo]) => {
     if (hasLoaded) return;
     if (isNoRoleUser || isSessionExpired) {
diff --git a/apps/web/src/common/modules/popup/notice/modules/NoticePopupItem.vue b/apps/web/src/common/modules/popup/notice/modules/NoticePopupItem.vue
index 838833dda4..13e4a0056b 100644
--- a/apps/web/src/common/modules/popup/notice/modules/NoticePopupItem.vue
+++ b/apps/web/src/common/modules/popup/notice/modules/NoticePopupItem.vue
@@ -8,7 +8,7 @@ import { iso8601Formatter } from '@cloudforet/utils';
 
 import type { PostModel } from '@/schema/board/post/model';
 
-import { useNoticeStore } from '@/store/notice';
+import { useNoticeStore } from '@/store/notice/notice-store';
 import { useUserStore } from '@/store/user/user-store';
 
 import { isMobile } from '@/lib/helper/cross-browsing-helper';
diff --git a/apps/web/src/common/modules/widgets/_widget-field-value-manager/constant/validator-registry.ts b/apps/web/src/common/modules/widgets/_widget-field-value-manager/constant/validator-registry.ts
index e335d1d35f..620ea444b6 100644
--- a/apps/web/src/common/modules/widgets/_widget-field-value-manager/constant/validator-registry.ts
+++ b/apps/web/src/common/modules/widgets/_widget-field-value-manager/constant/validator-registry.ts
@@ -1,5 +1,3 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
 import { every } from 'lodash';
 
 import { DATA_TABLE_OPERATOR } from '@/common/modules/widgets/_constants/data-table-constant';
@@ -101,7 +99,7 @@ export const widgetValidatorRegistry: WidgetValidatorRegistry = {
                 const dependentValue: string|string[]|undefined = allValueMap?.[formatRulesOptions.dependentField]?.value?.data;
                 if (!dependentValue) return !!fieldValue.field;
                 if (Array.isArray(dependentValue)) {
-                    return !dependentValue.includes(fieldValue.field);
+                    return typeof fieldValue.field === 'string' && !dependentValue.includes(fieldValue.field);
                 }
                 return dependentValue !== fieldValue.field;
             }
diff --git a/apps/web/src/lib/access-control/index.ts b/apps/web/src/lib/access-control/index.ts
deleted file mode 100644
index b6d004d43a..0000000000
--- a/apps/web/src/lib/access-control/index.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import type { Route } from 'vue-router';
-
-import { clone } from 'lodash';
-
-import type { MenuId } from '@/lib/menu/config';
-
-export const calculateIsAccessibleRoute = (route: Route, pagePermissions: MenuId[]): boolean => {
-    const closetMenuRoute = clone(route?.matched)?.reverse().find((match) => !!match.meta.menuId);
-    const menuId = closetMenuRoute?.meta.menuId;
-    return pagePermissions.some((id) => id === menuId);
-};
-
-export const isUserAccessibleToMenu = (menuId: MenuId, pageAccessList: MenuId[]): boolean => pageAccessList.some((id) => id === menuId);
diff --git a/apps/web/src/lib/access-control/redirect-route-helper.ts b/apps/web/src/lib/access-control/redirect-route-helper.ts
index 4bb1998124..06d71777eb 100644
--- a/apps/web/src/lib/access-control/redirect-route-helper.ts
+++ b/apps/web/src/lib/access-control/redirect-route-helper.ts
@@ -3,28 +3,30 @@ import type { Location } from 'vue-router/types/router';
 
 import { ERROR_ROUTE } from '@/router/constant';
 
-import { useGlobalConfigSchemaStore, type FlattenedMenuMap } from '@/store/global-config-schema/global-config-schema-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
+import type { FlattenedMenuMap } from '@/store/menu/menu-store';
+import { useMenuStore } from '@/store/menu/menu-store';
 import { pinia } from '@/store/pinia';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
 
-const getSubMenuListByMenuId = (menuId: MenuId, flattenedMenu: FlattenedMenuMap): MenuId[] => {
+const _getSubMenuListByMenuId = (menuId: MenuId, flattenedMenu: FlattenedMenuMap): MenuId[] => {
     if (flattenedMenu[menuId]) return flattenedMenu[menuId] || [];
     return [];
 };
 
-export const getRedirectRouteByPagePermission = (route: Route, pagePermissionsMap: PageAccessMap): Location => {
+export const getRedirectRouteByPagePermission = (route: Route): Location => {
     const menuId = route.meta?.menuId;
     if (!menuId) return { name: ERROR_ROUTE._NAME, params: { statusCode: '404' } };
 
-    const globalConfigSchemaStore = useGlobalConfigSchemaStore(pinia);
-    const generateFlattenedMenuMap = globalConfigSchemaStore.getters.generateFlattenedMenuMap;
-    const subMenuIdList = getSubMenuListByMenuId(menuId, generateFlattenedMenuMap);
+    const menuStore = useMenuStore(pinia);
+    const authorizationStore = useAuthorizationStore(pinia);
+
+    const subMenuIdList = _getSubMenuListByMenuId(menuId, menuStore.getters.generateFlattenedMenuMap);
     let redirectMenuId: MenuId|undefined;
     subMenuIdList.some((subMenuId) => {
-        if (pagePermissionsMap[subMenuId]) {
+        if (authorizationStore.getters.pageAccessPermissionMap[subMenuId]) {
             redirectMenuId = subMenuId;
             return true;
         }
diff --git a/apps/web/src/lib/config/global-config/api-client-manager.ts b/apps/web/src/lib/config/global-config/api-client-manager.ts
new file mode 100644
index 0000000000..99c7ad8fb8
--- /dev/null
+++ b/apps/web/src/lib/config/global-config/api-client-manager.ts
@@ -0,0 +1,107 @@
+import camelCase from 'lodash/camelCase';
+import kebabCase from 'lodash/kebabCase';
+
+import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
+
+import { ApiClientEndpoint } from '@/lib/config/global-config/schema/api-client-schema';
+import type { ApiClientsSchemaType, GlobalServiceConfig } from '@/lib/config/global-config/types/type';
+
+interface ServiceEndpoint {
+    endpoint: any;
+    version: string;
+}
+
+class APIClientManagerError extends Error {
+    constructor(message: string) {
+        super(`[APIClientManager] ${message}`);
+        this.name = 'APIClientManagerError';
+    }
+}
+
+class APIClientManager {
+    // eslint-disable-next-line no-undef
+    [key: string]: any;
+
+    private config: GlobalServiceConfig | null = null;
+
+    private apiClientsSchema: ApiClientsSchemaType | null = null;
+
+    private serviceEndpoints: Map<string, ServiceEndpoint> = new Map();
+
+    async initialize(mergedConfig: GlobalServiceConfig): Promise<void> {
+        this.config = mergedConfig;
+        this.apiClientsSchema = JSON.parse(JSON.stringify(ApiClientEndpoint));
+        await this.initializeServiceConfig();
+        this.defineDynamicServices();
+    }
+
+    private async initializeServiceConfig(): Promise<void> {
+        if (!this.config || !this.apiClientsSchema) {
+            throw new APIClientManagerError('Configuration or schema is not initialized');
+        }
+
+        const serviceConfig: Record<string, { enabled: boolean }> = {};
+
+        Object.entries(this.config).forEach(([serviceName, config]) => {
+            if (this.apiClientsSchema?.[serviceName]) {
+                const version = config.VERSION;
+                const endpoint = this.apiClientsSchema[serviceName][version];
+                if (endpoint) {
+                    const formattedEndpoint = APIClientManager.formatEndpoint(endpoint);
+                    serviceConfig[formattedEndpoint] = {
+                        enabled: config.ENABLED,
+                    };
+                }
+            }
+        });
+
+        SpaceConnector.setServiceConfig(serviceConfig);
+    }
+
+    private static formatEndpoint(endpoint: string): string {
+        return kebabCase(endpoint);
+    }
+
+    private defineDynamicServices(): void {
+        if (!this.apiClientsSchema) {
+            throw new APIClientManagerError('APIClientManager is not initialized');
+        }
+
+        Object.keys(this.apiClientsSchema).forEach((serviceName) => {
+            const propertyName = APIClientManager.formatPropertyName(serviceName);
+            Object.defineProperty(this, propertyName, {
+                get: () => this.getServiceEndpoint(serviceName),
+                enumerable: true,
+                configurable: true,
+            });
+        });
+    }
+
+    private static formatPropertyName(serviceName: string): string {
+        return camelCase(serviceName);
+    }
+
+    private getServiceEndpoint(serviceName: string): ServiceEndpoint | null {
+        if (this.serviceEndpoints.has(serviceName)) {
+            return this.serviceEndpoints.get(serviceName) ?? null;
+        }
+
+        const serviceConfig = this.config?.[serviceName];
+        if (!serviceConfig?.ENABLED) return null;
+
+        const apiClientSchemaByService = this.apiClientsSchema?.[serviceName];
+        if (!apiClientSchemaByService) return null;
+
+        const version = serviceConfig.VERSION;
+        const clientEndpoint = apiClientSchemaByService[version];
+        if (!clientEndpoint) return null;
+
+        const endpoint = SpaceConnector.clientV2[clientEndpoint];
+        const serviceEndpoint: ServiceEndpoint = { endpoint, version };
+
+        this.serviceEndpoints.set(serviceName, serviceEndpoint);
+        return serviceEndpoint;
+    }
+}
+
+export default new APIClientManager();
diff --git a/apps/web/src/lib/config/global-config/composables/use-global-config-ui-affects-schema.ts b/apps/web/src/lib/config/global-config/composables/use-global-config-ui-affects-schema.ts
new file mode 100644
index 0000000000..331900bcb4
--- /dev/null
+++ b/apps/web/src/lib/config/global-config/composables/use-global-config-ui-affects-schema.ts
@@ -0,0 +1,17 @@
+import { computed } from 'vue';
+
+import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
+
+import type { FeatureKeyType } from '@/lib/config/global-config/types/type';
+
+import { SERVICE_FEATURES } from '../constants/constants';
+
+export const useGlobalConfigUiAffectsSchema = (featureKey: FeatureKeyType) => {
+    if (!Object.values(SERVICE_FEATURES).includes(featureKey)) {
+        throw new Error(`Invalid feature key: ${featureKey}`);
+    }
+
+    const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+
+    return computed(() => globalConfigSchemaStore.state.uiAffectsSchema[featureKey]);
+};
diff --git a/apps/web/src/lib/config/global-config/constants/constants.ts b/apps/web/src/lib/config/global-config/constants/constants.ts
index c10e39b046..914f28347f 100644
--- a/apps/web/src/lib/config/global-config/constants/constants.ts
+++ b/apps/web/src/lib/config/global-config/constants/constants.ts
@@ -1,4 +1,4 @@
-export const FEATURES = {
+export const SERVICE_FEATURES = {
     DASHBOARDS: 'DASHBOARDS',
     PROJECT: 'PROJECT',
     SERVICE_ACCOUNT: 'SERVICE_ACCOUNT',
diff --git a/apps/web/src/lib/config/global-config/dynamic-schema-manager.ts b/apps/web/src/lib/config/global-config/dynamic-schema-manager.ts
new file mode 100644
index 0000000000..7d81451971
--- /dev/null
+++ b/apps/web/src/lib/config/global-config/dynamic-schema-manager.ts
@@ -0,0 +1,78 @@
+import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
+import { pinia } from '@/store/pinia';
+
+import type {
+    GeneratedMenuSchema,
+    GeneratedRouteSchema,
+    GeneratedRouteMetadataSchema,
+    GeneratedUiAffectSchema,
+} from '@/lib/config/global-config/types/type';
+
+type DynamicMenuHandler = (menuSchema: GeneratedMenuSchema) => Promise<GeneratedMenuSchema>;
+
+export class DynamicSchemaManager {
+    private static instance: DynamicSchemaManager;
+
+    private globalConfigSchemaStore = useGlobalConfigSchemaStore(pinia);
+
+    private dynamicMenuHandlers: Map<string, DynamicMenuHandler> = new Map();
+
+    // private constructor() {
+    //     this.initializeHandlers();
+    // }
+
+    static getInstance(): DynamicSchemaManager {
+        if (!DynamicSchemaManager.instance) {
+            DynamicSchemaManager.instance = new DynamicSchemaManager();
+        }
+        return DynamicSchemaManager.instance;
+    }
+
+    // private initializeHandlers() {
+    //     // Example
+    //     this.registerDynamicMenuHandler('OPS_FLOW', async (menuSchema: GeneratedMenuSchema) => {
+    //         const updatedMenu = { ...menuSchema };
+    //         if (!isEmpty(menuSchema?.OPS_FLOW)) {}
+    //         return updatedMenu;
+    //     });
+
+    //     watch(() => this.taskManagementTemplateStore.state, () => {
+    //         const currentMenuSchema = this.globalConfigSchemaStore.state.menuSchema;
+    //         if (!isEmpty(currentMenuSchema?.OPS_FLOW)) {
+    //             this.updateMenuSchema(currentMenuSchema);
+    //         }
+    //     }, { deep: true });
+    // }
+
+    registerDynamicMenuHandler(serviceName: string, handler: DynamicMenuHandler) {
+        this.dynamicMenuHandlers.set(serviceName, handler);
+    }
+
+    private async updateMenuSchema(menuSchema: GeneratedMenuSchema) {
+        const updatedMenuSchema = await this.applyDynamicMenu(menuSchema);
+        this.globalConfigSchemaStore.setMenuSchema(updatedMenuSchema);
+    }
+
+    private async applyDynamicMenu(menuSchema: GeneratedMenuSchema): Promise<GeneratedMenuSchema> {
+        return Array.from(this.dynamicMenuHandlers.values()).reduce(
+            async (acc, handler) => handler(await acc),
+            Promise.resolve(menuSchema),
+        );
+    }
+
+    async updateSchema(
+        menuSchema: GeneratedMenuSchema,
+        routeSchema: GeneratedRouteSchema,
+        routeMetadataSchema: GeneratedRouteMetadataSchema,
+        uiAffectSchema: GeneratedUiAffectSchema,
+    ) {
+        const dynamicMenuSchema = await this.applyDynamicMenu(menuSchema);
+
+        this.globalConfigSchemaStore.setMenuSchema(dynamicMenuSchema);
+        this.globalConfigSchemaStore.setRouteSchema(routeSchema);
+        this.globalConfigSchemaStore.setRouteMetadataSchema(routeMetadataSchema);
+        this.globalConfigSchemaStore.setUiAffectsSchema(uiAffectSchema);
+    }
+}
+
+export default DynamicSchemaManager.getInstance();
diff --git a/apps/web/src/lib/config/global-config/feature-schema-manager.ts b/apps/web/src/lib/config/global-config/feature-schema-manager.ts
index a98d2c889f..46be67762b 100644
--- a/apps/web/src/lib/config/global-config/feature-schema-manager.ts
+++ b/apps/web/src/lib/config/global-config/feature-schema-manager.ts
@@ -1,6 +1,4 @@
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
-import { pinia } from '@/store/pinia';
-
+import dynamicSchemaManager from '@/lib/config/global-config/dynamic-schema-manager';
 import { getFeatureConfigurator } from '@/lib/config/global-config/helpers/get-feature-configurator';
 import type {
     FeatureConfigurator,
@@ -22,17 +20,23 @@ export class FeatureSchemaManager {
         },
     };
 
-    initialize(config: GlobalServiceConfig) {
-        const globalConfigSchemaStore = useGlobalConfigSchemaStore(pinia);
+    async initialize(config: GlobalServiceConfig) {
         this.config = {
             ...this.config,
             ...config,
         };
 
-        globalConfigSchemaStore.setMenuSchema(this.createMenuSchema());
-        globalConfigSchemaStore.setRouteSchema(this.createRouteSchema());
-        globalConfigSchemaStore.setRouteMetadataSchema(this.createRouteMetadata());
-        globalConfigSchemaStore.setUiAffectsSchema(this.createUiAffectsSchema());
+        const menuSchema = this.createMenuSchema();
+        const routeSchema = this.createRouteSchema();
+        const routeMetadataSchema = this.createRouteMetadata();
+        const uiAffectSchema = this.createUiAffectsSchema();
+
+        await dynamicSchemaManager.updateSchema(
+            menuSchema,
+            routeSchema,
+            routeMetadataSchema,
+            uiAffectSchema,
+        );
     }
 
     private forEachEnabledFeature<T>(callback: (feature: string, configurator: FeatureConfigurator, currentVersion: FeatureVersion) => T): T[] {
diff --git a/apps/web/src/lib/site-initializer/merge-config.ts b/apps/web/src/lib/config/global-config/helpers/merge-config.ts
similarity index 100%
rename from apps/web/src/lib/site-initializer/merge-config.ts
rename to apps/web/src/lib/config/global-config/helpers/merge-config.ts
diff --git a/apps/web/src/lib/config/global-config/schema/api-client-schema.ts b/apps/web/src/lib/config/global-config/schema/api-client-schema.ts
index 069bd075f5..bb1728c9c0 100644
--- a/apps/web/src/lib/config/global-config/schema/api-client-schema.ts
+++ b/apps/web/src/lib/config/global-config/schema/api-client-schema.ts
@@ -8,6 +8,9 @@ export const ApiClientEndpoint: ApiClientsSchemaType = {
     PROJECT: {
         V1: 'identity',
     },
+    SERVICE_ACCOUNT: {
+        V1: 'identity',
+    },
     ASSET_INVENTORY: {
         V1: 'inventory',
     },
diff --git a/apps/web/src/lib/config/global-config/types/type.ts b/apps/web/src/lib/config/global-config/types/type.ts
index ca1eb4a382..fa0ad80510 100644
--- a/apps/web/src/lib/config/global-config/types/type.ts
+++ b/apps/web/src/lib/config/global-config/types/type.ts
@@ -1,9 +1,9 @@
 import type { RouteConfig } from 'vue-router';
 
-import type { FEATURES } from '@/lib/config/global-config/constants/constants';
+import type { SERVICE_FEATURES } from '@/lib/config/global-config/constants/constants';
 import type { Menu } from '@/lib/menu/config';
 
-export type FeatureKeyType = typeof FEATURES[keyof typeof FEATURES];
+export type FeatureKeyType = typeof SERVICE_FEATURES[keyof typeof SERVICE_FEATURES];
 export type FeatureVersion = 'V1' | 'V2';
 
 export type ServiceConfig = {
@@ -25,7 +25,7 @@ export interface GeneratedMenuConfig {
     menu: Menu;
     adminMenu?: Menu|null;
 }
-export type GeneratedMenuSchema = Record<string, GeneratedMenuConfig>;
+export type GeneratedMenuSchema = Record<FeatureKeyType, GeneratedMenuConfig>;
 
 type UiAffectConfig = {
     method: string;
@@ -35,7 +35,7 @@ export interface GeneratedUiAffectConfig {
     feature: string;
     affects: UiAffectConfig[];
 }
-export type GeneratedUiAffectSchema = Record<string, Record<string, boolean>>;
+export type GeneratedUiAffectSchema = Record<FeatureKeyType, Record<string, boolean>>;
 
 export interface RouteVersionInfo {
     name: string;
@@ -68,6 +68,7 @@ type apiClientType = {
 export type ApiClientsSchemaType = {
     DASHBOARDS: apiClientType,
     PROJECT: apiClientType,
+    SERVICE_ACCOUNT: apiClientType,
     ASSET_INVENTORY: apiClientType,
     COST_ANALYSIS: apiClientType,
     OPS_FLOW: apiClientType,
diff --git a/apps/web/src/lib/helper/menu-suggestion-helper.ts b/apps/web/src/lib/helper/menu-suggestion-helper.ts
index 7413566335..3f57bc4cf6 100644
--- a/apps/web/src/lib/helper/menu-suggestion-helper.ts
+++ b/apps/web/src/lib/helper/menu-suggestion-helper.ts
@@ -1,6 +1,6 @@
 import type { TranslateResult } from 'vue-i18n';
 
-import type { DisplayMenu } from '@/store/display/type';
+import type { DisplayMenu } from '@/store/menu/type';
 
 export interface SuggestionMenu {
     id: string;
diff --git a/apps/web/src/lib/menu/config.ts b/apps/web/src/lib/menu/config.ts
index f419e34380..ccb273dd90 100644
--- a/apps/web/src/lib/menu/config.ts
+++ b/apps/web/src/lib/menu/config.ts
@@ -1,5 +1,7 @@
 // Menu Ids' Rule: All menu ids are dot-delimited in depth, up to two depths.
-import type { HighlightTagType } from '@/store/display/type';
+import type { TranslateResult } from 'vue-i18n';
+
+import type { HighlightTagType } from '@/store/menu/type';
 
 
 export const MENU_ID = Object.freeze({
@@ -54,6 +56,7 @@ export type MenuId = typeof MENU_ID[keyof typeof MENU_ID];
 
 export interface Menu {
     id: MenuId;
+    label?: string|TranslateResult;
     needPermissionByRole?: boolean;
     subMenuList?: Menu[];
     hideOnGNB?: boolean;
diff --git a/apps/web/src/lib/menu/use-all-menu-list.ts b/apps/web/src/lib/menu/use-all-menu-list.ts
new file mode 100644
index 0000000000..2cce50d63a
--- /dev/null
+++ b/apps/web/src/lib/menu/use-all-menu-list.ts
@@ -0,0 +1,106 @@
+import { computed } from 'vue';
+import type { RawLocation, Route } from 'vue-router';
+import type VueRouter from 'vue-router';
+
+import { i18n } from '@/translations';
+
+import { makeAdminRouteName } from '@/router/helpers/route-helper';
+
+
+import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
+import { useMenuStore } from '@/store/menu/menu-store';
+import type { DisplayMenu } from '@/store/menu/type';
+
+import { MENU_ID } from '@/lib/menu/config';
+import type { Menu, MenuId, MenuInfo } from '@/lib/menu/config';
+import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
+
+
+export const useAllMenuList = () => {
+    const appContextStore = useAppContextStore();
+    const menuStore = useMenuStore();
+    const authorizationStore = useAuthorizationStore();
+    const userWorkspaceStore = useUserWorkspaceStore();
+
+    const _isAdminMode = computed(() => appContextStore.getters.isAdminMode);
+    const _currentWorkspaceId = computed(() => userWorkspaceStore.getters.currentWorkspaceId);
+
+
+    const getAllMenuList = (route: Route, router: VueRouter): DisplayMenu[] => {
+        const isMyPage = route?.path.startsWith('/my-page');
+        let _allGnbMenuList: DisplayMenu[];
+
+        _allGnbMenuList = _getDisplayMenuList(menuStore.getters.menuList, _isAdminMode.value);
+        _allGnbMenuList = _filterMenuByRoute(_allGnbMenuList, router, _currentWorkspaceId.value);
+        if (!_isAdminMode.value) {
+            _allGnbMenuList = _filterMenuByAccessPermission(_allGnbMenuList, authorizationStore.getters.pageAccessPermissionList);
+        }
+
+        if (!isMyPage) {
+            _allGnbMenuList.forEach((menu) => {
+                if (menu.id === MENU_ID.MY_PAGE) {
+                    menu.hideOnGNB = true;
+                }
+            });
+        }
+
+        return _allGnbMenuList;
+    };
+
+    return {
+        getAllMenuList,
+    };
+};
+
+const _filterMenuByRoute = (menuList: DisplayMenu[], router: VueRouter, targetWorkspaceId?: string): DisplayMenu[] => menuList.reduce((results, _menu) => {
+    const menu = { ..._menu };
+    if (menu.subMenuList) {
+        menu.subMenuList = _filterMenuByRoute(menu.subMenuList, router, targetWorkspaceId);
+        if (menu.subMenuList.length) {
+            results.push(menu);
+            return results;
+        }
+    }
+
+    const to: RawLocation = {
+        name: menu.to.name,
+        params: targetWorkspaceId ? { workspaceId: targetWorkspaceId } : {},
+    };
+    const link = router.resolve(to);
+    if (link?.href !== '/') results.push(menu);
+
+    return results;
+}, [] as DisplayMenu[]);
+const _filterMenuByAccessPermission = (menuList: DisplayMenu[], pagePermissionList: MenuId[]): DisplayMenu[] => menuList.reduce((results, _menu) => {
+    const menu = { ..._menu };
+
+    if (menu.subMenuList) {
+        menu.subMenuList = _filterMenuByAccessPermission(menu.subMenuList, pagePermissionList);
+    }
+
+    if (menu.subMenuList?.length) results.push(menu);
+    else {
+        const hasPermission = pagePermissionList.some((menuId) => menuId === menu.id);
+        if (hasPermission) results.push(menu);
+    }
+
+    return results;
+}, [] as DisplayMenu[]);
+
+const _getDisplayMenuList = (menuList: Menu[], isAdminMode?: boolean): DisplayMenu[] => menuList.map((d) => {
+    const menuInfo: MenuInfo = MENU_INFO_MAP[d.id];
+    const routeName = isAdminMode ? makeAdminRouteName(MENU_INFO_MAP[d.id].routeName) : MENU_INFO_MAP[d.id].routeName;
+    const label = d.label || i18n.t(menuInfo.translationId);
+
+    return {
+        ...d,
+        id: d.id,
+        label,
+        icon: menuInfo.icon,
+        highlightTag: menuInfo.highlightTag,
+        to: { name: routeName },
+        subMenuList: d.subMenuList ? _getDisplayMenuList(d.subMenuList, isAdminMode) : [],
+    } as DisplayMenu;
+});
diff --git a/apps/web/src/lib/site-initializer/api-client.ts b/apps/web/src/lib/site-initializer/api-connector.ts
similarity index 97%
rename from apps/web/src/lib/site-initializer/api-client.ts
rename to apps/web/src/lib/site-initializer/api-connector.ts
index 8f6f503339..cb8e399a4d 100644
--- a/apps/web/src/lib/site-initializer/api-client.ts
+++ b/apps/web/src/lib/site-initializer/api-connector.ts
@@ -5,6 +5,7 @@ import type { DevConfig, MockConfig, AuthConfig } from '@cloudforet/core-lib/spa
 import type { TokenGrantParameters } from '@/api-clients/identity/token/schema/api-verbs/grant';
 import type { TokenGrantModel } from '@/api-clients/identity/token/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useErrorStore } from '@/store/error/error-store';
 import { pinia } from '@/store/pinia';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
@@ -390,8 +391,8 @@ const getApiEndpoints = (config) => {
         return [ENDPOINT_V1, ENDPOINT_V2];
     }
     if (!ENDPOINT_V1) {
-        throw new Error('ApiClient init failed: There are no endpoint v1.');
-    } else throw new Error('ApiClient init failed: There are no endpoint v2.');
+        throw new Error('ApiConnector init failed: There are no endpoint v1.');
+    } else throw new Error('ApiConnector init failed: There are no endpoint v2.');
 };
 const getApiSettings = (config) => {
     const apiV1Timeout = config.get('CONSOLE_API.TIMEOUT');
@@ -414,8 +415,8 @@ const getAuthConfig = (config): AuthConfig => ({
     apiKey: config.get('DEV.AUTH.API_KEY'),
 });
 
-export const initApiClient = async (config) => {
-    const userStore = useUserStore(pinia);
+export const initApiConnectorAndAuth = async (config) => {
+    const authorizationStore = useAuthorizationStore(pinia);
     const endpoints = getApiEndpoints(config);
     const tokenApi = new TokenAPI(endpoints[1], getSessionTimeoutCallback());
     const apiSettings = getApiSettings(config);
@@ -424,14 +425,12 @@ export const initApiClient = async (config) => {
         mockConfig: getMockConfig(config),
         authConfig: getAuthConfig(config),
     };
-    const serviceConfig = config.get('SERVICES') || {};
     await SpaceConnector.init(
         endpoints,
         tokenApi,
         apiSettings,
         devConfig,
         getAfterCallApiMap(),
-        serviceConfig,
     );
     const existingRefreshToken = SpaceConnector.getRefreshToken();
 
@@ -445,8 +444,8 @@ export const initApiClient = async (config) => {
         };
         const response = await SpaceConnector.clientV2.identity.token.grant<TokenGrantParameters, TokenGrantModel>(grantRequest);
         SpaceConnector.setToken(response.access_token);
-        userStore.setCurrentGrantInfo({ scope: 'USER' });
-        userStore.setCurrentRoleInfo(undefined);
+        authorizationStore.setCurrentGrantInfo({ scope: 'USER' });
+        authorizationStore.setCurrentRoleInfo(undefined);
     } catch (e) {
         console.error(e);
     }
diff --git a/apps/web/src/lib/site-initializer/index.ts b/apps/web/src/lib/site-initializer/index.ts
index f8cfc979e7..e0344085b5 100644
--- a/apps/web/src/lib/site-initializer/index.ts
+++ b/apps/web/src/lib/site-initializer/index.ts
@@ -2,7 +2,6 @@ import { computed, watch } from 'vue';
 
 import { QueryHelper } from '@cloudforet/core-lib/query';
 
-import APIClientManager from '@/api-clients/api-client-manager';
 import { SpaceRouter } from '@/router';
 import { setI18nLocale } from '@/translations';
 
@@ -10,6 +9,7 @@ import { ERROR_ROUTE, ROOT_ROUTE } from '@/router/constant';
 import { errorRoutes } from '@/router/error-routes';
 import { integralRoutes } from '@/router/integral-routes';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useDisplayStore } from '@/store/display/display-store';
 import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
 import { pinia } from '@/store/pinia';
@@ -17,22 +17,27 @@ import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import { useUserStore } from '@/store/user/user-store';
 
 import config from '@/lib/config';
+import APIClientManager from '@/lib/config/global-config/api-client-manager';
 import featureSchemaManager from '@/lib/config/global-config/feature-schema-manager';
+import { mergeConfig } from '@/lib/config/global-config/helpers/merge-config';
+import type { GlobalServiceConfig } from '@/lib/config/global-config/types/type';
 import { initRequestIdleCallback } from '@/lib/request-idle-callback-polyfill';
 import { initAmcharts5 } from '@/lib/site-initializer/amcharts5';
 import { initGtag, initGtm } from '@/lib/site-initializer/analysis';
-import { initApiClient } from '@/lib/site-initializer/api-client';
+import { initApiConnectorAndAuth } from '@/lib/site-initializer/api-connector';
 import { initDayjs } from '@/lib/site-initializer/dayjs';
 import { initDomain } from '@/lib/site-initializer/domain';
 import { initDomainSettings } from '@/lib/site-initializer/domain-settings';
 import { initEcharts } from '@/lib/site-initializer/echarts';
 import { initErrorHandler } from '@/lib/site-initializer/error-handler';
-import { mergeConfig } from '@/lib/site-initializer/merge-config';
 import { initModeSetting } from '@/lib/site-initializer/mode-setting';
 import { checkSsoAccessToken } from '@/lib/site-initializer/sso';
-import { initUserAndAuth } from '@/lib/site-initializer/user-auth';
+import { initUserAndToken } from '@/lib/site-initializer/user-token';
 import { initWorkspace } from '@/lib/site-initializer/workspace';
 
+import { useTaskManagementTemplateStore } from '@/services/ops-flow/task-management-templates/stores/use-task-management-template-store';
+
+
 const initQueryHelper = () => {
     const userStore = useUserStore(pinia);
     QueryHelper.init(computed(() => userStore.state.timezone));
@@ -40,9 +45,9 @@ const initQueryHelper = () => {
 
 let isRouterInitialized = false;
 const initRouter = (domainId?: string) => {
-    const userStore = useUserStore(pinia);
     const globalConfigSchemaStore = useGlobalConfigSchemaStore(pinia);
     const allReferenceStore = useAllReferenceStore(pinia);
+    const authorizationStore = useAuthorizationStore(pinia);
     const afterGrantedCallback = () => allReferenceStore.flush();
 
     const adminChildren = integralRoutes[0].children?.find(
@@ -63,9 +68,9 @@ const initRouter = (domainId?: string) => {
     }
 
     if (!domainId) {
-        SpaceRouter.init(errorRoutes, afterGrantedCallback, userStore);
+        SpaceRouter.init(errorRoutes, afterGrantedCallback, authorizationStore);
     } else {
-        SpaceRouter.init(integralRoutes, afterGrantedCallback, userStore);
+        SpaceRouter.init(integralRoutes, afterGrantedCallback, authorizationStore);
     }
     isRouterInitialized = true;
 };
@@ -75,6 +80,15 @@ const initI18n = () => {
     setI18nLocale(userStore.state.language || '');
 };
 
+const initOpsFlowTaskManagementTemplate = async (mergedConfig: GlobalServiceConfig) => {
+    if (!mergedConfig.OPS_FLOW.ENABLED) return;
+    const taskManagementTemplateStore = useTaskManagementTemplateStore(pinia);
+    await Promise.allSettled([
+        taskManagementTemplateStore.setInitialTemplateId(),
+        taskManagementTemplateStore.setInitialLandingData(),
+    ]);
+};
+
 const removeInitializer = () => {
     const el = document.getElementById('site-loader-wrapper');
     if (el?.parentElement) el.parentElement.removeChild(el);
@@ -84,15 +98,17 @@ const init = async () => {
     /* Init SpaceONE Console */
     try {
         await config.init();
-        await initApiClient(config);
+        await initApiConnectorAndAuth(config);
         const domainId = await initDomain(config);
-        const userId = await initUserAndAuth(config);
+        const userId = await initUserAndToken(config);
         const mergedConfig = await mergeConfig(config, domainId);
+        await APIClientManager.initialize(mergedConfig);
         initDomainSettings();
         await initModeSetting();
         await initWorkspace(userId);
+        await initOpsFlowTaskManagementTemplate(mergedConfig);
         await featureSchemaManager.initialize(mergedConfig);
-        await APIClientManager.initialize(mergedConfig);
+        initErrorHandler();
         initRouter(domainId);
         // prefetchResources();
         initI18n();
@@ -102,7 +118,6 @@ const init = async () => {
         initGtm(config);
         initAmcharts5(config);
         initEcharts();
-        initErrorHandler();
         initRequestIdleCallback();
         const results = await Promise.allSettled([
             checkSsoAccessToken(),
diff --git a/apps/web/src/lib/site-initializer/initTaskManagementTemplate.ts b/apps/web/src/lib/site-initializer/initTaskManagementTemplate.ts
deleted file mode 100644
index 8c69456436..0000000000
--- a/apps/web/src/lib/site-initializer/initTaskManagementTemplate.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { pinia } from '@/store/pinia';
-
-import {
-    useTaskManagementTemplateStore,
-} from '@/services/ops-flow/task-management-templates/stores/use-task-management-template-store';
-
-
-export const initTaskManagementTemplate = async () => {
-    const taskManagementTemplateStore = useTaskManagementTemplateStore(pinia);
-    await Promise.allSettled([
-        taskManagementTemplateStore.setInitialTemplateId(),
-        taskManagementTemplateStore.setInitialLandingData(),
-    ]);
-};
diff --git a/apps/web/src/lib/site-initializer/user-auth.ts b/apps/web/src/lib/site-initializer/user-token.ts
similarity index 95%
rename from apps/web/src/lib/site-initializer/user-auth.ts
rename to apps/web/src/lib/site-initializer/user-token.ts
index 27f78671a1..9f51728cf5 100644
--- a/apps/web/src/lib/site-initializer/user-auth.ts
+++ b/apps/web/src/lib/site-initializer/user-token.ts
@@ -7,7 +7,7 @@ import { pinia } from '@/store/pinia';
 import { useUserStore } from '@/store/user/user-store';
 
 
-export const initUserAndAuth = async (config): Promise<string | undefined> => {
+export const initUserAndToken = async (config): Promise<string | undefined> => {
     const domainStore = useDomainStore(pinia);
     const userStore = useUserStore(pinia);
     let userId = userStore.state.userId;
diff --git a/apps/web/src/lib/site-initializer/workspace.ts b/apps/web/src/lib/site-initializer/workspace.ts
index f6ea3974bc..3e1d596c06 100644
--- a/apps/web/src/lib/site-initializer/workspace.ts
+++ b/apps/web/src/lib/site-initializer/workspace.ts
@@ -17,15 +17,6 @@ export const initWorkspace = async (userId?: string): Promise<void> => {
 
     /* Set Default Workspace */
     const { pathname } = window.location;
-    // let workspaceId: string | undefined;
-    // const workspacePath = pathname?.split('/')[1];
-    // if (workspacePath === 'admin') {
-    //     workspaceId = undefined;
-    // } else if (workspacePath) {
-    //     workspaceId = workspacePath;
-    // } else workspaceId = lastAccessedWorkspaceId;
-    // userWorkspaceStore.setCurrentWorkspace(workspaceId);
-    //
 
     if (!USER_PAGE_FIRST_PATH_LIST.includes(pathname?.split('/')[1])) {
         userWorkspaceStore.setCurrentWorkspace(lastAccessedWorkspaceId);
diff --git a/apps/web/src/query/composables/use-scoped-query.ts b/apps/web/src/query/composables/use-scoped-query.ts
index df7398f27e..2ee342c174 100644
--- a/apps/web/src/query/composables/use-scoped-query.ts
+++ b/apps/web/src/query/composables/use-scoped-query.ts
@@ -42,7 +42,7 @@ import type { GrantScope } from '@/api-clients/identity/token/schema/type';
 import type { QueryKeyArray } from '@/query/query-key/_types/query-key-type';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 
 type ScopedEnabled = MaybeRef<boolean>;
@@ -65,10 +65,10 @@ export const useScopedQuery = <TQueryFnData, TError = unknown, TData = TQueryFnD
     }
 
     const appContextStore = useAppContextStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const currentGrantScope = computed<GrantScope | undefined>(
-        () => userStore.state.currentGrantInfo?.scope,
+        () => authorizationStore.state.currentGrantInfo?.scope,
     );
     const isAppReady = computed(() => !appContextStore.getters.globalGrantLoading);
 
diff --git a/apps/web/src/router/helpers/route-helper.ts b/apps/web/src/router/helpers/route-helper.ts
index 056679765a..fb27627324 100644
--- a/apps/web/src/router/helpers/route-helper.ts
+++ b/apps/web/src/router/helpers/route-helper.ts
@@ -2,6 +2,7 @@ import type { Route, NavigationGuardNext } from 'vue-router';
 
 import type { JwtPayload } from 'jwt-decode';
 import { jwtDecode } from 'jwt-decode';
+import { clone } from 'lodash';
 
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
@@ -12,7 +13,6 @@ import {
 } from '@/router/constant';
 import type { RouteScopeType } from '@/router/types';
 
-import { calculateIsAccessibleRoute } from '@/lib/access-control';
 import type { MenuId } from '@/lib/menu/config';
 import { getLastAccessedWorkspaceId, setCurrentAccessedWorkspaceId } from '@/lib/site-initializer/last-accessed-workspace';
 
@@ -21,6 +21,16 @@ import { LANDING_ROUTE } from '@/services/landing/routes/route-constant';
 import { ADMIN_WORKSPACE_HOME_ROUTE } from '@/services/workspace-home/routes/admin/route-constant';
 import { WORKSPACE_HOME_ROUTE } from '@/services/workspace-home/routes/route-constant';
 
+
+const _getValidWorkspaceId = (workspaceId: string|undefined, workspaceList: WorkspaceModel[]): string|undefined => workspaceList.find((w) => w.workspace_id === workspaceId)?.workspace_id;
+
+const _calculateIsAccessibleRoute = (route: Route, pagePermissions: MenuId[]): boolean => {
+    const closetMenuRoute = clone(route?.matched)?.reverse().find((match) => !!match.meta.menuId);
+    const menuId = closetMenuRoute?.meta.menuId;
+    return pagePermissions.some((id) => id === menuId);
+};
+
+
 export const makeAdminRouteName = (routeName: string): string => {
     if (routeName.startsWith('admin.')) return routeName;
     return `admin.${routeName}`;
@@ -50,9 +60,6 @@ export const getDecodedDataFromAccessToken = (): {rol: string, wid: string} => {
     }
 };
 
-export const getValidWorkspaceId = (workspaceId: string|undefined, workspaceList: WorkspaceModel[]): string|undefined => workspaceList.find((w) => w.workspace_id === workspaceId)?.workspace_id;
-
-
 
 // Router BeforeEach Guard - Route-Validation-and-Verification Process
 export const processTokenVerification = (to: Route, next: NavigationGuardNext, routeScope: RouteScopeType): boolean => {
@@ -122,7 +129,7 @@ export const processWorkspaceAccessValidation = async (to: Route, next: Navigati
     const targetWorkspaceId = to.params.workspaceId;
     if (!targetWorkspaceId) {
         let lastAccessedWorkspaceId = await getLastAccessedWorkspaceId();
-        if (!getValidWorkspaceId(lastAccessedWorkspaceId, workspaceList)) {
+        if (!_getValidWorkspaceId(lastAccessedWorkspaceId, workspaceList)) {
             await setCurrentAccessedWorkspaceId(undefined);
             lastAccessedWorkspaceId = undefined;
         }
@@ -138,7 +145,7 @@ export const processWorkspaceAccessValidation = async (to: Route, next: Navigati
         return false;
     }
 
-    if (!getValidWorkspaceId(targetWorkspaceId, workspaceList)) {
+    if (!_getValidWorkspaceId(targetWorkspaceId, workspaceList)) {
         next({
             name: ERROR_ROUTE._NAME, params: { statusCode: '404' },
         });
@@ -155,7 +162,7 @@ export const shouldUpdateScope = (prevRole: string, routeScope: RouteScopeType,
     return isScopeChanged || isWorkspaceChanged;
 };
 export const verifyPageAccessAndRedirect = (to: Route, next: NavigationGuardNext, workspaceId: string, pageAccessPermissionList: MenuId[]): void => {
-    const isAccessibleRoute = calculateIsAccessibleRoute(to, pageAccessPermissionList);
+    const isAccessibleRoute = _calculateIsAccessibleRoute(to, pageAccessPermissionList);
     if (isAccessibleRoute) {
         next({
             ...to,
diff --git a/apps/web/src/router/index.ts b/apps/web/src/router/index.ts
index 04b8710ab0..a63525d659 100755
--- a/apps/web/src/router/index.ts
+++ b/apps/web/src/router/index.ts
@@ -22,9 +22,8 @@ import {
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useErrorStore } from '@/store/error/error-store';
+import type { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { pinia } from '@/store/pinia';
-import type { useUserStore } from '@/store/user/user-store';
 
 import { getRecentConfig } from '@/lib/helper/router-recent-helper';
 import type { MenuId } from '@/lib/menu/config';
@@ -36,7 +35,7 @@ const CHUNK_LOAD_REFRESH_STORAGE_KEY = 'SpaceRouter/ChunkLoadFailRefreshed';
 const grantAndLoadByCurrentScope = async (
     scope: GrantScope,
     afterGrantedCallback: () => void,
-    userStore: ReturnType<typeof useUserStore>,
+    authorizationStore: ReturnType<typeof useAuthorizationStore>,
     workspaceId?: string,
 ): Promise<{ failStatus: boolean }> => {
     const refreshToken = SpaceConnector.getRefreshToken();
@@ -46,20 +45,22 @@ const grantAndLoadByCurrentScope = async (
         workspace_id: workspaceId,
     };
 
-    const errorStore = useErrorStore(pinia);
-    const isGranted: boolean = await userStore.grantRole(grantRequest);
+    const isGranted: boolean = await authorizationStore.grantRole(grantRequest);
     if (isGranted) {
         afterGrantedCallback();
     }
-    const grantAccessFailStatus = errorStore.state.grantAccessFailStatus;
     return {
-        failStatus: !!grantAccessFailStatus,
+        failStatus: !!authorizationStore.state.grantAccessFailStatus,
     };
 };
 export class SpaceRouter {
     static router: VueRouter;
 
-    static init(routes: RouteConfig[], afterGrantedCallback: () => void, userStore: ReturnType<typeof useUserStore>) {
+    static init(
+        routes: RouteConfig[],
+        afterGrantedCallback: () => void,
+        authorizationStore: ReturnType<typeof useAuthorizationStore>,
+    ) {
         if (SpaceRouter.router) throw new Error('Router init failed: Already initiated.');
 
         Vue.use(VueRouter);
@@ -116,7 +117,7 @@ export class SpaceRouter {
 
             /* Grant Scope Process */
             if (routeScope !== ROUTE_SCOPE.EXCLUDE_AUTH && shouldUpdateScope(prevRole, routeScope, prevWorkspaceId, to.params.workspaceId)) {
-                const { failStatus } = await grantAndLoadByCurrentScope(routeScope, afterGrantedCallback, userStore, to.params.workspaceId);
+                const { failStatus } = await grantAndLoadByCurrentScope(routeScope, afterGrantedCallback, authorizationStore, to.params.workspaceId);
 
                 if (failStatus) { // Grant fail
                     await userWorkspaceStore.load();
@@ -125,7 +126,7 @@ export class SpaceRouter {
                         params: { statusCode: '404' },
                     });
                 } else if (routeScope === ROUTE_SCOPE.WORKSPACE) { // Grant success - Workspace
-                    verifyPageAccessAndRedirect(to, next, to.params.workspaceId, userStore.getters.pageAccessPermissionList);
+                    verifyPageAccessAndRedirect(to, next, to.params.workspaceId, authorizationStore.getters.pageAccessPermissionList);
                 } else next(); // Grant success - Others (Admin, User)
             } else { // Grant Process Not Needed
                 appContextStore.setGlobalGrantLoading(false);
@@ -140,7 +141,7 @@ export class SpaceRouter {
             // set target page as GTag page view
             if (GTag.gtag) GTag.setPageView(to);
             const isAdminMode = appContextStore.getters.isAdminMode;
-            const pageAccessPermissionMap = userStore.getters.pageAccessPermissionMap;
+            const pageAccessPermissionMap = authorizationStore.getters.pageAccessPermissionMap;
             const routeScope = getRouteScope(to);
 
             if (!isAdminMode && routeScope === 'WORKSPACE') {
diff --git a/apps/web/src/schema/alert-manager/service/constants.ts b/apps/web/src/schema/alert-manager/service/constants.ts
index 646b22b57c..a0afd1eb66 100644
--- a/apps/web/src/schema/alert-manager/service/constants.ts
+++ b/apps/web/src/schema/alert-manager/service/constants.ts
@@ -19,3 +19,8 @@ export const SERVICE_ALERTS_TYPE = {
     ACKNOWLEDGED: 'ACKNOWLEDGED',
     RESOLVED: 'RESOLVED',
 } as const;
+
+export const SERVICE_HEALTHY_TYPE = {
+    HEALTHY: 'HEALTHY',
+    UNHEALTHY: 'UNHEALTHY',
+};
diff --git a/apps/web/src/schema/alert-manager/service/model.ts b/apps/web/src/schema/alert-manager/service/model.ts
index 9abedbd232..bad20bc731 100644
--- a/apps/web/src/schema/alert-manager/service/model.ts
+++ b/apps/web/src/schema/alert-manager/service/model.ts
@@ -1,6 +1,6 @@
 import type { Tags } from '@/api-clients/_common/schema/model';
 import type {
-    AlertsInfoType, AlertsType, MembersType, ServiceOptionsType,
+    AlertsInfoType, AlertsType, HealthyType, MembersType, ServiceOptionsType,
 } from '@/schema/alert-manager/service/type';
 
 export interface ServiceModel {
@@ -9,6 +9,7 @@ export interface ServiceModel {
     service_key: string;
     description: string;
     members: Record<MembersType, string[]>;
+    service_healthy: HealthyType;
     options: ServiceOptionsType;
     channels?: string[];
     webhooks?: string[];
diff --git a/apps/web/src/schema/alert-manager/service/type.ts b/apps/web/src/schema/alert-manager/service/type.ts
index e1e93dd0c5..67cc5867ec 100644
--- a/apps/web/src/schema/alert-manager/service/type.ts
+++ b/apps/web/src/schema/alert-manager/service/type.ts
@@ -1,11 +1,13 @@
 import type {
     NOTIFICATION_URGENCY, RECOVERY_MODE, MEMBERS_TYPE, SERVICE_ALERTS_TYPE,
+    SERVICE_HEALTHY_TYPE,
 } from '@/schema/alert-manager/service/constants';
 
 export type NotificationUrgencyType = typeof NOTIFICATION_URGENCY[keyof typeof NOTIFICATION_URGENCY];
 export type RecoveryModeType = typeof RECOVERY_MODE[keyof typeof RECOVERY_MODE];
 export type MembersType = typeof MEMBERS_TYPE[keyof typeof MEMBERS_TYPE];
 export type AlertsType = typeof SERVICE_ALERTS_TYPE[keyof typeof SERVICE_ALERTS_TYPE];
+export type HealthyType = typeof SERVICE_HEALTHY_TYPE[keyof typeof SERVICE_HEALTHY_TYPE];
 
 export type ServiceOptionsType = {
     notification_urgency: NotificationUrgencyType;
diff --git a/apps/web/src/services/_shared/dashboard/core/composables/_internal/use-dashboard-manageable.ts b/apps/web/src/services/_shared/dashboard/core/composables/_internal/use-dashboard-manageable.ts
index 01c058e077..2179f37da9 100644
--- a/apps/web/src/services/_shared/dashboard/core/composables/_internal/use-dashboard-manageable.ts
+++ b/apps/web/src/services/_shared/dashboard/core/composables/_internal/use-dashboard-manageable.ts
@@ -8,21 +8,20 @@ import type { PublicFolderModel } from '@/api-clients/dashboard/public-folder/sc
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { useDashboardSharedContext } from '@/services/_shared/dashboard/core/composables/_internal/use-dashboard-shared-context';
 import type { DashboardSharedEntryPoint } from '@/services/_shared/dashboard/core/types/dashboard-shared-type';
 
 
-
 export const useDashboardManageable = () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const appContextStore = useAppContextStore();
     const { entryPoint } = useDashboardSharedContext();
     const isAdminMode = computed(() => appContextStore.getters.isAdminMode);
 
     const storeState = reactive({
-        isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+        isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
     });
 
     const _isManageable = (
diff --git a/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateScopeForm.vue b/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateScopeForm.vue
index 3c5e0874f0..ae2785cc07 100644
--- a/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateScopeForm.vue
+++ b/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateScopeForm.vue
@@ -14,7 +14,7 @@ import type { WorkspaceModel } from '@/api-clients/identity/workspace/schema/mod
 import { i18n } from '@/translations';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import WorkspaceLogoIcon from '@/common/modules/navigations/top-bar/modules/top-bar-header/WorkspaceLogoIcon.vue';
 
@@ -34,9 +34,9 @@ const dashboardCreatePageStore = useDashboardCreatePageStore();
 const dashboardCreatePageState = dashboardCreatePageStore.state;
 const userWorkspaceStore = useUserWorkspaceStore();
 const userWorkspaceState = userWorkspaceStore.$state;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const storeState = reactive({
-    isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
     selectedWorkspace: computed<WorkspaceModel|undefined>(() => userWorkspaceState.getters.currentWorkspace),
 });
 
diff --git a/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateStep2BundleCase.vue b/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateStep2BundleCase.vue
index 562684ae10..ece80b7ef4 100644
--- a/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateStep2BundleCase.vue
+++ b/apps/web/src/services/_shared/dashboard/dashboard-create/contextual-components/DashboardCreateStep2BundleCase.vue
@@ -21,6 +21,7 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useUserStore } from '@/store/user/user-store';
 
 import { showErrorMessage, showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -54,6 +55,7 @@ const dashboardCreatePageStore = useDashboardCreatePageStore();
 const dashboardCreatePageState = dashboardCreatePageStore.state;
 const dashboardTreeControlStore = useDashboardTreeControlStore();
 const dashboardTreeControlState = dashboardTreeControlStore.state;
+const authorizationStore = useAuthorizationStore();
 const userStore = useUserStore();
 const router = useRouter();
 const {
@@ -62,7 +64,7 @@ const {
 
 const dashboardTemplateQuery = useDashboardTemplateQuery();
 const storeState = reactive({
-    isWorkspaceMember: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 });
 const state = reactive({
     loading: false,
diff --git a/apps/web/src/services/alert-manager/v1/components/AlertMainDataTable.vue b/apps/web/src/services/alert-manager/v1/components/AlertMainDataTable.vue
index efbf69a62a..61e8eb16b7 100644
--- a/apps/web/src/services/alert-manager/v1/components/AlertMainDataTable.vue
+++ b/apps/web/src/services/alert-manager/v1/components/AlertMainDataTable.vue
@@ -25,13 +25,13 @@ import { ALERT_STATE, ALERT_URGENCY } from '@/schema/monitoring/alert/constants'
 import { useReferenceRouter } from '@/router/composables/use-reference-router';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { ProjectReferenceMap } from '@/store/reference/project-reference-store';
 import type { UserReferenceMap } from '@/store/reference/user-reference-store';
 import type { WebhookReferenceMap } from '@/store/reference/webhook-reference-store';
 import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { FILE_NAME_PREFIX } from '@/lib/excel-export/constant';
 import { downloadExcel } from '@/lib/helper/file-download-helper';
 import type { MenuId } from '@/lib/menu/config';
@@ -94,12 +94,12 @@ const emit = defineEmits<{(event: 'update', filters: Partial<AlertListTableFilte
 const allReferenceStore = useAllReferenceStore();
 const userWorkspaceStore = useUserWorkspaceStore();
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const storeState = reactive({
     timezone: computed<string>(() => userStore.state.timezone || ''),
     projects: computed<ProjectReferenceMap>(() => allReferenceStore.getters.project),
     users: computed<UserReferenceMap>(() => allReferenceStore.getters.user),
     webhooks: computed<WebhookReferenceMap>(() => allReferenceStore.getters.webhook),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 
 /* Search Tags */
@@ -213,7 +213,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
 });
 
 /* formatters & autocomplete handlers */
diff --git a/apps/web/src/services/alert-manager/v1/components/EscalationPolicyForm.vue b/apps/web/src/services/alert-manager/v1/components/EscalationPolicyForm.vue
index 7d0af44909..2ccf19a949 100644
--- a/apps/web/src/services/alert-manager/v1/components/EscalationPolicyForm.vue
+++ b/apps/web/src/services/alert-manager/v1/components/EscalationPolicyForm.vue
@@ -18,8 +18,8 @@ import { i18n } from '@/translations';
 import { useReferenceRouter } from '@/router/composables/use-reference-router';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
 import { useFormValidator } from '@/common/composables/form-validator';
 import type { ProjectTreeNodeData } from '@/common/modules/project/project-tree-type';
@@ -45,8 +45,7 @@ const allReferenceStore = useAllReferenceStore();
 const userWorkspaceStore = useUserWorkspaceStore();
 const escalationPolicyFormStore = useEscalationPolicyFormStore();
 const escalationPolicyFormState = escalationPolicyFormStore.$state;
-const userStore = useUserStore();
-
+const authorizationStore = useAuthorizationStore();
 const { getReferenceLocation } = useReferenceRouter();
 
 const state = reactive({
@@ -57,7 +56,7 @@ const state = reactive({
         PROJECT: i18n.t('MONITORING.ALERT.ESCALATION_POLICY.FORM.PROJECT'),
     })),
     resourceGroups: computed<{label: TranslateResult; value: EscalationPolicyModel['resource_group']}[]>(() => {
-        const currentRoleType = userStore.state.currentRoleInfo?.roleType;
+        const currentRoleType = authorizationStore.state.currentRoleInfo?.roleType;
         const resGroup: {label: TranslateResult; value: EscalationPolicyModel['resource_group']}[] = [
             { label: i18n.t('MONITORING.ALERT.ESCALATION_POLICY.FORM.PROJECT'), value: 'PROJECT' },
         ];
diff --git a/apps/web/src/services/alert-manager/v1/routes/routes.ts b/apps/web/src/services/alert-manager/v1/routes/routes.ts
index c08be0f49b..d9341c4475 100644
--- a/apps/web/src/services/alert-manager/v1/routes/routes.ts
+++ b/apps/web/src/services/alert-manager/v1/routes/routes.ts
@@ -1,8 +1,5 @@
 import type { RouteConfig } from 'vue-router';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -24,10 +21,7 @@ const alertManagerRoute: RouteConfig = {
         menuId: MENU_ID.ALERT_MANAGER,
         translationId: MENU_INFO_MAP[MENU_ID.ALERT_MANAGER].translationId,
     },
-    redirect: (to) => {
-        const userStore = useUserStore(pinia);
-        return getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap);
-    },
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: AlertManagerContainer,
     children: [
         {
diff --git a/apps/web/src/services/alert-manager/v2/components/AlertDetailInfoTable.vue b/apps/web/src/services/alert-manager/v2/components/AlertDetailInfoTable.vue
index 7bf1cbce01..fb675195b8 100644
--- a/apps/web/src/services/alert-manager/v2/components/AlertDetailInfoTable.vue
+++ b/apps/web/src/services/alert-manager/v2/components/AlertDetailInfoTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
 import { computed, reactive } from 'vue';
 import { useRouter } from 'vue-router/composables';
+import type { RawLocation } from 'vue-router/types/router';
 
+import { QueryHelper } from '@cloudforet/core-lib/query';
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 import {
     PBadge, PDefinitionTable, PPaneLayout, PLink, PTextButton,
@@ -29,7 +31,6 @@ import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-co
 import { useAlertDetailPageStore } from '@/services/alert-manager/v2/stores/alert-detail-page-store';
 import { ASSET_INVENTORY_ROUTE } from '@/services/asset-inventory/routes/route-constant';
 
-
 type BadgeInfo = {
     badgeType: string;
     styleType: string;
@@ -44,6 +45,7 @@ const userWorkspaceStore = useUserWorkspaceStore();
 
 const router = useRouter();
 
+const queryHelper = new QueryHelper();
 
 const storeState = reactive({
     webhook: computed<WebhookReferenceMap>(() => allReferenceGetters.webhook),
@@ -101,22 +103,58 @@ const getBadgeInfo = (value: AlertSeverityType): BadgeInfo => {
     }
 };
 
-const handleRouteViewButton = async (id: string) => {
+const createRouteParams = (params: {
+    provider: string;
+    group: string;
+    name: string;
+    id: string;
+}): RawLocation => ({
+    name: ASSET_INVENTORY_ROUTE.CLOUD_SERVICE.DETAIL._NAME,
+    params: {
+        provider: params.provider,
+        group: params.group,
+        name: params.name,
+        workspaceId: userWorkspaceStore.getters.currentWorkspaceId || '',
+    },
+    query: {
+        filters: queryHelper.setFilters([
+            { k: 'cloud_service_id', v: params.id, o: '=' },
+        ]).rawQueryStrings,
+    },
+});
+
+const handleRouteViewButton = async (id: string, type?: string) => {
+    const [provider, group, name] = type?.split('.') || [];
+
+    if (!type && !id) {
+        console.warn('Invalid parameters: both id and type are missing');
+        return;
+    }
+
     try {
-        const response = await SpaceConnector.clientV2.inventory.cloudService.get<CloudServiceGetParameters, CloudServiceModel>({
-            cloud_service_id: id,
-        });
-        window.open(router.resolve({
-            name: ASSET_INVENTORY_ROUTE.CLOUD_SERVICE.DETAIL._NAME,
-            params: {
+        const routeParams = type ? {
+            provider, group, name, id,
+        } : await (async () => {
+            const response = await SpaceConnector.clientV2.inventory.cloudService.get<CloudServiceGetParameters, CloudServiceModel>({
+                cloud_service_id: id,
+            });
+            return {
                 provider: response.provider,
                 group: response.cloud_service_group,
                 name: response.cloud_service_type,
-                workspaceId: userWorkspaceStore.getters.currentWorkspaceId,
-            },
-        }).href, '_blank');
-    } catch (e: any) {
-        ErrorHandler.handleError(e, true);
+                id: response.cloud_service_id,
+            };
+        })();
+
+        window.open(router.resolve(createRouteParams(routeParams)).href, '_blank');
+    } catch (e) {
+        if (!type) {
+            ErrorHandler.handleError(e, true);
+            return;
+        }
+        window.open(router.resolve(createRouteParams({
+            provider, group, name, id,
+        })).href, '_blank');
     }
 };
 </script>
@@ -162,7 +200,7 @@ const handleRouteViewButton = async (id: string) => {
                         <p-text-button v-if="item.asset_id"
                                        style-type="highlight"
                                        icon-right="ic_arrow-right-up"
-                                       @click="handleRouteViewButton(item.asset_id)"
+                                       @click="handleRouteViewButton(item.asset_id, item.asset_type)"
                         >
                             {{ $t('ALERT_MANAGER.ALERTS.VIEW_RESOURCE') }}
                         </p-text-button>
diff --git a/apps/web/src/services/alert-manager/v2/components/AlertsDetailHeader.vue b/apps/web/src/services/alert-manager/v2/components/AlertsDetailHeader.vue
index 5df8ec0d03..6fe48327b1 100644
--- a/apps/web/src/services/alert-manager/v2/components/AlertsDetailHeader.vue
+++ b/apps/web/src/services/alert-manager/v2/components/AlertsDetailHeader.vue
@@ -12,9 +12,12 @@ import { usePageEditableStatus } from '@/common/composables/page-editable-status
 
 import AlertDetailDeleteModal from '@/services/alert-manager/v2/components/AlertDetailDeleteModal.vue';
 import AlertDetailEditModal from '@/services/alert-manager/v2/components/AlertDetailEditModal.vue';
+import { ALERT_PERIOD_DROPDOWN_MENU } from '@/services/alert-manager/v2/constants/alert-table-constant';
 import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant';
 import { useAlertDetailPageStore } from '@/services/alert-manager/v2/stores/alert-detail-page-store';
 import { useAlertPageStore } from '@/services/alert-manager/v2/stores/alert-page-store';
+import type { Period } from '@/services/alert-manager/v2/types/alert-manager-type';
+
 
 type ModalType = 'edit' | 'delete';
 
@@ -34,6 +37,9 @@ const storeState = reactive({
     selectedStatus: computed<string>(() => alertPageState.selectedStatus),
     selectedUrgency: computed<string>(() => alertPageState.selectedUrgency),
     selectedSearchFilter: computed<string[]|undefined>(() => alertPageState.selectedSearchFilter),
+    selectedLabels: computed<string|undefined>(() => (alertPageState.selectedLabels.length > 0 ? alertPageState.selectedLabels[0].name : undefined)),
+    period: computed<Period>(() => alertPageState.selectedPeriod),
+    selectedPeriodRange: computed<string>(() => alertPageState.selectedPeriodRange),
 });
 const state = reactive({
     menuItems: computed<MenuItem[]>(() => [
@@ -66,6 +72,9 @@ const handleRouteBackButton = () => {
                 status: storeState.selectedStatus,
                 urgency: storeState.selectedUrgency,
                 filters: storeState.selectedSearchFilter,
+                labels: storeState.selectedLabels,
+                period: storeState.selectedPeriodRange === ALERT_PERIOD_DROPDOWN_MENU.CUSTOM ? `start=${storeState.period.start}&end=${storeState.period.end}` : undefined,
+                range: storeState.selectedPeriodRange,
             },
         }).catch(() => {});
     }
diff --git a/apps/web/src/services/alert-manager/v2/components/AlertsManagementTable.vue b/apps/web/src/services/alert-manager/v2/components/AlertsManagementTable.vue
index 15cf2138e8..2d31136f9c 100644
--- a/apps/web/src/services/alert-manager/v2/components/AlertsManagementTable.vue
+++ b/apps/web/src/services/alert-manager/v2/components/AlertsManagementTable.vue
@@ -3,11 +3,11 @@ import {
     computed, reactive, watch,
 } from 'vue';
 import type { TranslateResult } from 'vue-i18n';
-import { useRoute } from 'vue-router/composables';
+import { useRoute, useRouter } from 'vue-router/composables';
+import type { RawLocation } from 'vue-router/types/router';
 
 import dayjs from 'dayjs';
 
-import { makeDistinctValueHandler } from '@cloudforet/core-lib/component-util/query-search';
 import { QueryHelper } from '@cloudforet/core-lib/query';
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
@@ -15,13 +15,17 @@ import {
     PToolboxTable, PSelectDropdown, PLink, PBadge, PI, PSelectStatus, PDivider,
 } from '@cloudforet/mirinae';
 import type { SelectDropdownMenuItem, AutocompleteHandler } from '@cloudforet/mirinae/types/controls/dropdown/select-dropdown/type';
+import type { ValueHandlerMap } from '@cloudforet/mirinae/types/controls/search/query-search/type';
 import type { DataTableFieldType } from '@cloudforet/mirinae/types/data-display/tables/data-table/type';
 import { iso8601Formatter } from '@cloudforet/utils';
 
 import { ALERT_STATUS, ALERT_URGENCY } from '@/schema/alert-manager/alert/constants';
 import type { AlertModel } from '@/schema/alert-manager/alert/model';
+import type { CloudServiceGetParameters } from '@/schema/inventory/cloud-service/api-verbs/get';
+import type { CloudServiceModel } from '@/schema/inventory/cloud-service/model';
 import { i18n } from '@/translations';
 
+import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { AppReferenceMap } from '@/store/reference/app-reference-store';
 import type { ServiceReferenceMap } from '@/store/reference/service-reference-store';
@@ -43,6 +47,7 @@ import {
     alertStatusBadgeStyleTypeFormatter, calculateTime,
     getAlertStateI18n,
     getAlertUrgencyI18n,
+    makeTriggeredValueHandler,
 } from '@/services/alert-manager/v2/composables/alert-table-data';
 import {
     ALERT_EXCEL_FIELDS,
@@ -59,7 +64,9 @@ import { useServiceDetailPageStore } from '@/services/alert-manager/v2/stores/se
 import type {
     AlertFilterType, AlertPeriodItemType,
     AlertPeriodDropdownMenuType,
+    Period,
 } from '@/services/alert-manager/v2/types/alert-manager-type';
+import { ASSET_INVENTORY_ROUTE } from '@/services/asset-inventory/routes/route-constant';
 
 const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
@@ -70,8 +77,11 @@ const serviceDetailPageStore = useServiceDetailPageStore();
 const serviceDetailPageState = serviceDetailPageStore.state;
 const userStore = useUserStore();
 const userState = userStore.state;
+const userWorkspaceStore = useUserWorkspaceStore();
+const userWorkspaceGetters = userWorkspaceStore.getters;
 
 const route = useRoute();
+const router = useRouter();
 
 const storeState = reactive({
     webhook: computed<WebhookReferenceMap>(() => allReferenceGetters.webhook),
@@ -83,8 +93,12 @@ const storeState = reactive({
     selectedServiceId: computed<string>(() => alertPageState.selectedServiceId),
     selectedStatus: computed<string>(() => alertPageState.selectedStatus),
     selectedUrgency: computed<string>(() => alertPageState.selectedUrgency),
+    selectedLabels: computed<SelectDropdownMenuItem[]>(() => alertPageState.selectedLabels),
     selectedSearchFilter: computed<string[]|undefined>(() => alertPageState.selectedSearchFilter),
+    period: computed<Period>(() => alertPageState.selectedPeriod),
+    selectedPeriodRange: computed<string>(() => alertPageState.selectedPeriodRange),
     timezone: computed<string>(() => userState.timezone || ''),
+    currentWorkspaceId: computed<string>(() => userWorkspaceGetters.currentWorkspaceId || ''),
 });
 const state = reactive({
     loading: false,
@@ -104,6 +118,13 @@ const state = reactive({
     defaultFields: computed<DataTableFieldType[]>(() => (state.isServicePage ? ALERT_MANAGEMENT_TABLE_FIELDS : [{ name: 'service_id', label: 'Service' }, ...ALERT_MANAGEMENT_TABLE_FIELDS])),
     fields: route.name === ALERT_MANAGER_ROUTE.SERVICE.DETAIL._NAME ? ALERT_MANAGEMENT_TABLE_FIELDS : [{ name: 'service_id', label: 'Service' }, ...ALERT_MANAGEMENT_TABLE_FIELDS],
     customRangeModalVisible: false,
+    tableHandler: computed<ValueHandlerMap>(() => ({
+        ...ALERT_MANAGEMENT_TABLE_HANDLER.valueHandlerMap,
+        triggered_by: makeTriggeredValueHandler({
+            webhooks: storeState.webhook,
+            apps: storeState.app,
+        }),
+    })),
 });
 const filterState = reactive({
     urgencyFields: computed<SelectDropdownMenuItem[]>(() => ([
@@ -111,7 +132,6 @@ const filterState = reactive({
         { label: i18n.t('ALERT_MANAGER.ALERTS.HIGH'), name: ALERT_URGENCY.HIGH },
         { label: i18n.t('ALERT_MANAGER.ALERTS.LOW'), name: ALERT_URGENCY.LOW },
     ])),
-    period: { start: undefined, end: undefined },
     periodMenuItems: computed<AlertPeriodItemType[]>(() => [
         {
             type: 'item',
@@ -149,16 +169,15 @@ const filterState = reactive({
     isPeriodInvalid: computed<boolean>(() => {
         const now = dayjs().utc();
         const checkPeriod = (limit:number):{isStartInvalid:boolean, isEndInvalid:boolean} => {
-            const isStartInvalid = now.diff(filterState.period?.start, 'month') >= limit;
-            const isEndInvalid = now.diff(filterState.period?.end, 'month') >= limit;
+            const isStartInvalid = now.diff(storeState.period?.start, 'month') >= limit;
+            const isEndInvalid = now.diff(storeState.period?.end, 'month') >= limit;
             return { isStartInvalid, isEndInvalid };
         };
         const LIMIT_MONTH = 36;
         const { isStartInvalid, isEndInvalid } = checkPeriod(LIMIT_MONTH);
         return isStartInvalid || isEndInvalid;
     }),
-    selectedPeriod: ALERT_PERIOD_DROPDOWN_MENU.ALL as string,
-    showPeriodBadge: computed<boolean>(() => filterState.selectedPeriod === ALERT_PERIOD_DROPDOWN_MENU.CUSTOM && filterState.period.start && filterState.period.end),
+    showPeriodBadge: computed<boolean>(() => storeState.selectedPeriodRange === ALERT_PERIOD_DROPDOWN_MENU.CUSTOM && storeState.period?.start && storeState.period?.end),
     serviceDropdownList: computed<SelectDropdownMenuItem[]>(() => alertPageGetters.serviceDropdownList),
     statusFields: computed<AlertFilterType[]>(() => ([
         { label: i18n.t('ALERT_MANAGER.ALERTS.OPEN'), name: ALERT_STATUS_FILTERS.OPEN },
@@ -168,8 +187,6 @@ const filterState = reactive({
         { label: i18n.t('ALERT_MANAGER.ALERTS.IGNORED'), name: ALERT_STATUS_FILTERS.IGNORED },
         { label: i18n.t('ALERT_MANAGER.ALERTS.ALL'), name: 'ALL' },
     ])),
-    labelHandler: computed(() => makeDistinctValueHandler('alert_manager.Alert', 'labels')),
-    selectedLabels: [] as SelectDropdownMenuItem[],
 });
 
 const alertListApiQueryHelper = new ApiQueryHelper().setSort('created_at', true)
@@ -219,8 +236,9 @@ const getServiceName = (id: string): TranslateResult => {
     if (filterState.serviceDropdownList.length === 0) return '';
     return filterState.serviceDropdownList.find((i) => i.name === id)?.label || '';
 };
-const handleSelectLabelsItem = (value: SelectDropdownMenuItem[]) => {
-    filterState.selectedLabels = value;
+const handleSelectLabelsItem = async (value: SelectDropdownMenuItem[]) => {
+    await alertPageStore.setSelectedLabels(value[0]?.name);
+    await replaceUrlQuery('labels', value[0]?.name);
     fetchAlertsList();
 };
 const handleSelectServiceDropdownItem = async (id: string) => {
@@ -244,11 +262,16 @@ const handleSelectPeriod = async (periodMenuName: AlertPeriodDropdownMenuType) =
         return;
     }
     if (periodMenuName === ALERT_PERIOD_DROPDOWN_MENU.ALL) {
-        filterState.period = { start: undefined, end: undefined };
+        alertPageStore.setSelectedPeriod({ start: undefined, end: undefined });
     }
-    filterState.selectedPeriod = periodMenuName;
     const selectedPeriodItem = filterState.periodMenuItems.find((d) => d.name === periodMenuName) || {} as AlertPeriodItemType;
-    filterState.period = selectedPeriodItem.relativePeriod ? convertRelativePeriodToPeriod(selectedPeriodItem.relativePeriod) : filterState.period;
+    alertPageStore.setSelectedPeriodRange(periodMenuName);
+    alertPageStore.setSelectedPeriod(selectedPeriodItem.relativePeriod ? convertRelativePeriodToPeriod(selectedPeriodItem.relativePeriod) : storeState.period);
+    replaceUrlQuery({
+        range: periodMenuName,
+        period: undefined,
+    });
+
     await fetchAlertsList();
 };
 const handleChange = async (options: any = {}) => {
@@ -283,12 +306,70 @@ const handleExportToExcel = async () => {
     });
 };
 const handleCustomRangeModalConfirm = (start: string, end: string) => {
-    filterState.period = { start, end };
-    filterState.selectedPeriod = ALERT_PERIOD_DROPDOWN_MENU.CUSTOM;
+    alertPageStore.setSelectedPeriodRange(ALERT_PERIOD_DROPDOWN_MENU.CUSTOM);
+    alertPageStore.setSelectedPeriod({ start, end });
     state.customRangeModalVisible = false;
+    replaceUrlQuery('period', `start=${start}&end=${end}`);
+    replaceUrlQuery('range', ALERT_PERIOD_DROPDOWN_MENU.CUSTOM);
     fetchAlertsList();
 };
+const createRouteParams = (params: {
+    provider: string;
+    group: string;
+    name: string;
+    id: string;
+}): RawLocation => {
+    const queryHelper = new QueryHelper();
+    return {
+        name: ASSET_INVENTORY_ROUTE.CLOUD_SERVICE.DETAIL._NAME,
+        params: {
+            provider: params.provider,
+            group: params.group,
+            name: params.name,
+            workspaceId: storeState.currentWorkspaceId || '',
+        },
+        query: {
+            filters: queryHelper.setFilters([
+                { k: 'cloud_service_id', v: params.id, o: '=' },
+            ]).rawQueryStrings,
+        },
+    };
+};
+
+const handleRouteViewButton = async (id: string, type?: string) => {
+    const [provider, group, name] = type?.split('.') || [];
 
+    if (!type && !id) {
+        console.warn('Invalid parameters: both id and type are missing');
+        return;
+    }
+
+    try {
+        const routeParams = type ? {
+            provider, group, name, id,
+        } : await (async () => {
+            const response = await SpaceConnector.clientV2.inventory.cloudService.get<CloudServiceGetParameters, CloudServiceModel>({
+                cloud_service_id: id,
+            });
+            return {
+                provider: response.provider,
+                group: response.cloud_service_group,
+                name: response.cloud_service_type,
+                id: response.cloud_service_id,
+            };
+        })();
+
+        window.open(router.resolve(createRouteParams(routeParams)).href, '_blank');
+    } catch (e) {
+        if (!type) {
+            ErrorHandler.handleError(e, true);
+            return;
+        }
+        window.open(router.resolve(createRouteParams({
+            provider, group, name, id,
+        })).href, '_blank');
+    }
+};
 const fetchAlertsList = async () => {
     state.loading = true;
     try {
@@ -301,22 +382,21 @@ const fetchAlertsList = async () => {
         } else if (storeState.selectedStatus !== 'ALL') {
             filterQueryHelper.addFilter({ k: 'status', v: storeState.selectedStatus, o: '=' });
         }
-        if (filterState.selectedLabels.length > 0) {
-            filterQueryHelper.addFilter({ k: 'labels', v: filterState.selectedLabels.map((i) => i.name), o: '=' });
+        if (storeState.selectedLabels?.length > 0) {
+            filterQueryHelper.addFilter({ k: 'labels', v: storeState.selectedLabels.map((i) => i.name), o: '=' });
         }
 
-        if (filterState.period.start && filterState.period.end && (filterState.period.start === filterState.period.end)) {
-            filterQueryHelper.addFilter({ k: 'created_at', v: filterState.period.start, o: '>=' });
+        if (storeState.period.start && storeState.period.end && (storeState.period.start === storeState.period.end)) {
+            filterQueryHelper.addFilter({ k: 'created_at', v: storeState.period.start, o: '>=' });
         } else {
-            if (filterState.period.start) {
-                filterQueryHelper.addFilter({ k: 'created_at', v: filterState.period.start, o: '>=' });
+            if (storeState.period.start) {
+                filterQueryHelper.addFilter({ k: 'created_at', v: storeState.period.start, o: '>=' });
             }
-            if (filterState.period.end) {
-                filterQueryHelper.addFilter({ k: 'created_at', v: filterState.period.end, o: '<=' });
+            if (storeState.period.end) {
+                filterQueryHelper.addFilter({ k: 'created_at', v: storeState.period.end, o: '<=' });
             }
         }
 
-
         if (state.isServicePage) {
             filterQueryHelper.addFilter({ k: 'service_id', v: storeState.serviceId, o: '=' });
         } else if (storeState.selectedServiceId) {
@@ -349,13 +429,28 @@ watch(() => storeState.serviceId, async (serviceId) => {
 
 (async () => {
     const {
-        serviceId, status, urgency, filters,
+        serviceId, status, urgency, filters, labels, period, range,
     } = route.query;
     if (!state.isServicePage) {
         await alertPageStore.setSelectedServiceId(serviceId as string);
     }
     await alertPageStore.setSelectedStatus(status as string || 'OPEN');
     await alertPageStore.setSelectedUrgency(urgency as string || 'ALL');
+    await alertPageStore.setSelectedLabels(labels as string);
+
+    const params = new URLSearchParams(period as string);
+
+    alertPageStore.setSelectedPeriodRange(range as string || ALERT_PERIOD_DROPDOWN_MENU.ALL);
+    if (range === ALERT_PERIOD_DROPDOWN_MENU.CUSTOM) {
+        await alertPageStore.setSelectedPeriod({
+            start: params.get('start') || undefined,
+            end: params.get('end') || undefined,
+        });
+    } else {
+        const selectedPeriodItem = filterState.periodMenuItems.find((d) => d.name === range) || {} as AlertPeriodItemType;
+        alertPageStore.setSelectedPeriod(selectedPeriodItem.relativePeriod ? convertRelativePeriodToPeriod(selectedPeriodItem.relativePeriod) : storeState.period);
+    }
+
     if (filters) {
         await queryTagHelper.setURLQueryStringFilters(route.query.filters);
     }
@@ -380,7 +475,7 @@ watch(() => storeState.serviceId, async (serviceId) => {
                          :fields="state.fields"
                          :items="state.refinedAlertList"
                          :key-item-sets="ALERT_MANAGEMENT_TABLE_HANDLER.keyItemSets"
-                         :value-handler-map="ALERT_MANAGEMENT_TABLE_HANDLER.valueHandlerMap"
+                         :value-handler-map="state.tableHandler"
                          settings-visible
                          @change="handleChange"
                          @click-settings="handleClickSettings"
@@ -416,7 +511,7 @@ watch(() => storeState.serviceId, async (serviceId) => {
                                            disable-proxy
                                            style-type="rounded"
                                            use-fixed-menu-style
-                                           :selected="filterState.selectedPeriod"
+                                           :selected="storeState.selectedPeriodRange"
                                            :invalid="filterState.isPeriodInvalid"
                                            @select="handleSelectPeriod"
                         />
@@ -425,7 +520,7 @@ watch(() => storeState.serviceId, async (serviceId) => {
                                  style-type="gray200"
                                  class="ml-2"
                         >
-                            {{ `${dayjs.utc(filterState.period.start).format('MMM D, YYYY')} ~ ${dayjs.utc(filterState.period.end).format('MMM D, YYYY')}` }}
+                            {{ `${dayjs.utc(storeState.period.start).format('MMM D, YYYY')} ~ ${dayjs.utc(storeState.period.end).format('MMM D, YYYY')}` }}
                         </p-badge>
                     </div>
                     <p-divider vertical
@@ -444,11 +539,10 @@ watch(() => storeState.serviceId, async (serviceId) => {
                     <p-select-dropdown :selection-label="$t('ALERT_MANAGER.ALERTS.LABEL')"
                                        :handler="labelMenuItemsHandler()"
                                        style-type="rounded"
-                                       appearance-type="stack"
                                        show-delete-all-button
                                        selection-highlight
                                        use-fixed-menu-style
-                                       :selected="filterState.selectedLabels"
+                                       :selected="storeState.selectedLabels"
                                        class="service-dropdown"
                                        @update:selected="handleSelectLabelsItem"
                     />
@@ -531,6 +625,28 @@ watch(() => storeState.serviceId, async (serviceId) => {
             <template #col-triggered_by-format="{ value }">
                 <span>{{ getCreatedByNames(value) }}</span>
             </template>
+            <template #col-resources-format="{ value }">
+                <div v-for="(item, idx) in value"
+                     :key="`resource-item-${idx}`"
+                >
+                    <component :is="item.asset_id ? PLink : 'p'"
+                               class="resource-item"
+                               :class="{ 'link': item.asset_id }"
+                               @click="item.asset_id ? handleRouteViewButton(item.asset_id, item.asset_type) : null"
+                    >
+                        <span class="flex items-center">
+                            <span class="text inline-block truncate">{{ item?.name }}</span>
+                            <p-i v-if="item.asset_id"
+                                 name="ic_arrow-right-up"
+                                 class="ml-0.5"
+                                 height="0.875rem"
+                                 width="0.875rem"
+                                 color="inherit"
+                            />
+                        </span>
+                    </component>
+                </div>
+            </template>
         </p-toolbox-table>
         <custom-field-modal :visible="state.visibleCustomFieldModal"
                             :resource-type="state.isServicePage ? 'service.alert' : 'alertManager.alert'"
@@ -540,8 +656,8 @@ watch(() => storeState.serviceId, async (serviceId) => {
                             @custom-field-loaded="handleCustomFieldUpdate"
         />
         <custom-date-modal :visible.sync="state.customRangeModalVisible"
-                           :start="filterState.period?.start"
-                           :end="filterState.period?.end"
+                           :start="storeState.period?.start"
+                           :end="storeState.period?.end"
                            :datetime-picker-data-type="'yearToDate'"
                            use-restricted-mode
                            @confirm="handleCustomRangeModalConfirm"
@@ -599,5 +715,13 @@ watch(() => storeState.serviceId, async (serviceId) => {
             }
         }
     }
+    .resource-item {
+        .text {
+            max-width: 20rem;
+        }
+        &.link {
+            @apply text-secondary truncate cursor-pointer;
+        }
+    }
 }
 </style>
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceDetailHeader.vue b/apps/web/src/services/alert-manager/v2/components/ServiceDetailHeader.vue
index b377f02207..92414637f1 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceDetailHeader.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceDetailHeader.vue
@@ -22,6 +22,7 @@ import ServiceDetailEditModal from '@/services/alert-manager/v2/components/Servi
 import ServiceDetailMemberModal from '@/services/alert-manager/v2/components/ServiceDetailMemberModal.vue';
 import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant';
 import { useServiceDetailPageStore } from '@/services/alert-manager/v2/stores/service-detail-page-store';
+import { useServiceListPageStore } from '@/services/alert-manager/v2/stores/service-list-page-store';
 import type { Service } from '@/services/alert-manager/v2/types/alert-manager-type';
 
 type ModalType = 'edit' | 'delete' | 'member' | 'alert';
@@ -30,6 +31,8 @@ const serviceDetailPageStore = useServiceDetailPageStore();
 const serviceDetailPageState = serviceDetailPageStore.state;
 const serviceDetailPageGetters = serviceDetailPageStore.getters;
 
+const serviceListPageStore = useServiceListPageStore();
+
 const router = useRouter();
 const route = useRoute();
 
@@ -75,7 +78,20 @@ const handleActionModal = (type: ModalType) => {
 };
 const handleGoBackButton = () => {
     if (state.isSettingMode) {
-        router.push({ name: ALERT_MANAGER_ROUTE.SERVICE._NAME }).catch(() => {});
+        const validUnhealthyPage = (!Number.isNaN(serviceListPageStore.unhealthyThisPage) && serviceListPageStore.unhealthyThisPage > 0)
+            ? serviceListPageStore.unhealthyThisPage
+            : 1;
+        const validHealthyPage = (!Number.isNaN(serviceListPageStore.healthyThisPage) && serviceListPageStore.healthyThisPage > 0)
+            ? serviceListPageStore.healthyThisPage
+            : 1;
+        router.push({
+            name: ALERT_MANAGER_ROUTE.SERVICE._NAME,
+            query: {
+                unhealthyPage: validUnhealthyPage.toString(),
+                healthyPage: validHealthyPage.toString(),
+                serviceName: route.query.filterService,
+            },
+        }).catch(() => {});
         return;
     }
     replaceUrlQuery({
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceDetailMemberModal.vue b/apps/web/src/services/alert-manager/v2/components/ServiceDetailMemberModal.vue
index 57c6d443ea..40f25eee93 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceDetailMemberModal.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceDetailMemberModal.vue
@@ -1,17 +1,18 @@
 <script setup lang="ts">
 import { useWindowSize } from '@vueuse/core';
-import { computed, reactive } from 'vue';
+import { computed, onMounted, reactive } from 'vue';
 import type { TranslateResult } from 'vue-i18n';
 
 import { partition, reject, map } from 'lodash';
 
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 import {
-    PButton, PButtonModal, PPaneLayout, PFieldGroup, PFieldTitle, PDataLoader, PIconButton, PAvatar, screens, PEmpty,
+    PButton, PButtonModal, PPaneLayout, PFieldGroup, PFieldTitle, PDataLoader, PIconButton, PAvatar, screens, PEmpty, PScopedNotification, PLink,
 } from '@cloudforet/mirinae';
 
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import type { RoleType } from '@/api-clients/identity/role/type';
+import type { ServiceChannelModel } from '@/schema/alert-manager/service-channel/model';
 import type { ServiceChangeMembersParameters } from '@/schema/alert-manager/service/api-verbs/chagne-members';
 import { MEMBERS_TYPE } from '@/schema/alert-manager/service/constants';
 import type { MembersType } from '@/schema/alert-manager/service/type';
@@ -29,6 +30,8 @@ import UserSelectDropdown from '@/common/modules/user/UserSelectDropdown.vue';
 
 import { indigo } from '@/styles/colors';
 
+import { SERVICE_DETAIL_TABS } from '@/services/alert-manager/v2/constants/common-constant';
+import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant';
 import { useServiceDetailPageStore } from '@/services/alert-manager/v2/stores/service-detail-page-store';
 import type { Service } from '@/services/alert-manager/v2/types/alert-manager-type';
 import { useRoleFormatter } from '@/services/iam/composables/refined-table-data';
@@ -54,6 +57,7 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 const serviceDetailPageStore = useServiceDetailPageStore();
+const serviceDetailPageState = serviceDetailPageStore.state;
 const serviceDetailPageGetters = serviceDetailPageStore.getters;
 
 const { width } = useWindowSize();
@@ -65,10 +69,12 @@ const storeState = reactive({
     serviceInfo: computed<Service>(() => serviceDetailPageGetters.serviceInfo),
     userMap: computed<UserReferenceMap>(() => serviceDetailPageGetters.userReferenceMap),
     userGroupMap: computed<UserGroupReferenceMap>(() => serviceDetailPageGetters.userGroupReferenceMap),
+    serviceChannelList: computed<ServiceChannelModel[]>(() => serviceDetailPageState.serviceChannelList),
 });
 const state = reactive({
     loading: false,
     isMobileSize: computed(() => width.value < screens.mobile.max),
+    isDeleteModalVisible: false,
     proxyVisible: useProxyValue('visible', props, emit),
     mode: 'member' as modalMode,
     modalInfo: computed<ModalInfoType>(() => {
@@ -111,6 +117,7 @@ const state = reactive({
     userGroupList: computed<MemberInfoType[]>(() => state.memberList.filter((i) => i.type === 'USER_GROUP').map((i) => i.key)),
     excludedSelectedIds: [] as string[],
     formattedMemberItems: {} as Record<MembersType, string[]>,
+    selectedDeleteMember: {} as MemberInfoType,
 });
 
 const formatRoleType = (roleType: RoleType) => roleType?.toLowerCase().replace(/_/g, ' ').replace(/(?:^|\s)\w/g, (match) => match.toUpperCase());
@@ -135,12 +142,22 @@ const handleConfirm = async () => {
         await inviteMember();
     }
 };
-const handleRemoveMember = async (key: string) => {
-    const _memberList = reject(state.memberList, { key });
+const hasForwardValue = (): boolean => storeState.serviceChannelList.some((item) => {
+    const forwardType = item.data?.FORWARD_TYPE;
+    const forwardData = item.data?.[forwardType];
+    return Array.isArray(forwardData) && forwardData.includes(state.selectedDeleteMember.key);
+});
+const handleClickDeleteMember = (member: MembersType) => {
+    state.selectedDeleteMember = member;
+    state.isDeleteModalVisible = true;
+};
+const handleRemoveMember = async () => {
+    const _memberList = reject(state.memberList, { key: state.selectedDeleteMember.key });
     const [userList, userGroupList] = partition(_memberList, { type: 'USER' });
     const selectedWorkspaceMemberList = map(userList, 'key');
     const selectedUserGroupList = map(userGroupList, 'key');
     await fetcherChangeMembers(selectedWorkspaceMemberList, selectedUserGroupList);
+    state.isDeleteModalVisible = false;
 };
 const inviteMember = async () => {
     state.loading = true;
@@ -160,6 +177,13 @@ const inviteMember = async () => {
         state.excludedSelectedIds = [];
     }
 };
+const getNotificationLink = () => ({
+    name: ALERT_MANAGER_ROUTE.SERVICE.DETAIL._NAME,
+    query: {
+        tab: SERVICE_DETAIL_TABS.NOTIFICATIONS,
+        filterMemberId: state.selectedDeleteMember.key,
+    },
+});
 
 const fetcherChangeMembers = async (userData: string[], userGroupData: string[]) => {
     try {
@@ -178,103 +202,170 @@ const fetcherChangeMembers = async (userData: string[], userGroupData: string[])
         ErrorHandler.handleError(e, true);
     }
 };
+
+onMounted(() => {
+    serviceDetailPageStore.fetchServiceChannelList(storeState.serviceInfo.service_id);
+});
 </script>
 
 <template>
-    <p-button-modal class="service-detail-invitation-modal"
-                    :header-title="state.modalInfo.title"
-                    :size="state.modalInfo.size"
-                    :fade="true"
-                    :backdrop="true"
-                    :visible="state.proxyVisible"
-                    :loading="state.loading"
-                    @confirm="handleConfirm"
-                    @cancel="handleClose"
-                    @close="handleClose"
-    >
-        <template #body>
-            <div>
-                <div v-if="state.mode === 'member'"
-                     class="bg-violet-100 p-4 rounded-md"
-                >
-                    <p-data-loader :loading="false">
-                        <p-pane-layout class="member-list p-3">
-                            <p-field-group class="title flex items-center">
-                                <p-field-title :label="$t('ALERT_MANAGER.SERVICE.INVITE_MEMBER_DESC')"
-                                               required
-                                />
-                                <p-button v-if="hasReadWriteAccess"
-                                          style-type="tertiary"
-                                          icon-left="ic_plus_bold"
-                                          class="ml-auto"
-                                          @click="handleClickInviteButton"
-                                >
-                                    {{ $t('ALERT_MANAGER.SERVICE.INVITE') }}
-                                </p-button>
-                            </p-field-group>
-                            <div v-if="state.memberList.length > 0">
-                                <div v-for="(item, idx) in state.memberList"
-                                     :key="`member-item-${idx}`"
-                                     class="flex items-center justify-between p-2 text-label-md"
-                                >
-                                    <div class="member-info-content">
-                                        <p v-if="!state.isMobileSize"
-                                           class="inline"
-                                        >
-                                            <img v-if="item.type === MEMBERS_TYPE.USER"
-                                                 :src="useRoleFormatter(item?.roleType || ROLE_TYPE.USER).image"
-                                                 alt="Role Type Icon"
-                                                 class="role-image"
+    <div>
+        <p-button-modal class="service-detail-invitation-modal"
+                        :header-title="state.modalInfo.title"
+                        :size="state.modalInfo.size"
+                        :fade="true"
+                        :backdrop="true"
+                        :visible="state.proxyVisible"
+                        :loading="state.loading"
+                        @confirm="handleConfirm"
+                        @cancel="handleClose"
+                        @close="handleClose"
+        >
+            <template #body>
+                <div>
+                    <div v-if="state.mode === 'member'"
+                         class="bg-violet-100 p-4 rounded-md"
+                    >
+                        <p-data-loader :loading="false">
+                            <p-pane-layout class="member-list p-3">
+                                <p-field-group class="title flex items-center">
+                                    <p-field-title :label="$t('ALERT_MANAGER.SERVICE.INVITE_MEMBER_DESC')"
+                                                   required
+                                    />
+                                    <p-button v-if="hasReadWriteAccess"
+                                              style-type="tertiary"
+                                              icon-left="ic_plus_bold"
+                                              class="ml-auto"
+                                              @click="handleClickInviteButton"
+                                    >
+                                        {{ $t('ALERT_MANAGER.SERVICE.INVITE') }}
+                                    </p-button>
+                                </p-field-group>
+                                <div v-if="state.memberList.length > 0">
+                                    <div v-for="(item, idx) in state.memberList"
+                                         :key="`member-item-${idx}`"
+                                         class="flex items-center justify-between p-2 text-label-md"
+                                    >
+                                        <div class="member-info-content">
+                                            <p v-if="!state.isMobileSize"
+                                               class="inline"
+                                            >
+                                                <img v-if="item.type === MEMBERS_TYPE.USER"
+                                                     :src="useRoleFormatter(item?.roleType || ROLE_TYPE.USER).image"
+                                                     alt="Role Type Icon"
+                                                     class="role-image"
+                                                >
+                                                <p-avatar v-else
+                                                          class="menu-icon"
+                                                          icon="ic_member"
+                                                          :color="indigo[300]"
+                                                          size="sm"
+                                                />
+                                            </p>
+                                            <span>{{ item?.label }}</span>
+                                        </div>
+                                        <p class="member-info-content">
+                                            <span v-if="!state.isMobileSize"
+                                                  class="text-gray-500"
                                             >
-                                            <p-avatar v-else
-                                                      class="menu-icon"
-                                                      icon="ic_member"
-                                                      :color="indigo[300]"
-                                                      size="sm"
+                                                {{ item.type === MEMBERS_TYPE.USER ? formatRoleType(item?.roleType) : $t('ALERT_MANAGER.SERVICE.USER_GROUP') }}
+                                            </span>
+                                            <p-icon-button name="ic_delete"
+                                                           size="sm"
+                                                           @click="handleClickDeleteMember(item)"
                                             />
                                         </p>
-                                        <span>{{ item?.label }}</span>
                                     </div>
-                                    <p class="member-info-content">
-                                        <span v-if="!state.isMobileSize"
-                                              class="text-gray-500"
-                                        >
-                                            {{ item.type === MEMBERS_TYPE.USER ? formatRoleType(item?.roleType) : $t('ALERT_MANAGER.SERVICE.USER_GROUP') }}
-                                        </span>
-                                        <p-icon-button name="ic_delete"
-                                                       size="sm"
-                                                       @click="handleRemoveMember(item.key)"
-                                        />
-                                    </p>
                                 </div>
-                            </div>
 
-                            <p-empty v-else
-                                     show-image
-                                     class="pt-12"
-                                     :title="$t('ALERT_MANAGER.SERVICE.EMPTY_MEMBER')"
-                            />
-                        </p-pane-layout>
-                    </p-data-loader>
+                                <p-empty v-else
+                                         show-image
+                                         class="pt-12"
+                                         :title="$t('ALERT_MANAGER.SERVICE.EMPTY_MEMBER')"
+                                />
+                            </p-pane-layout>
+                        </p-data-loader>
+                    </div>
+                    <div v-else
+                         class="py-4"
+                    >
+                        <p class="pb-2">
+                            {{ $t('ALERT_MANAGER.SERVICE.INVITE_MEMBER_DESC') }}
+                        </p>
+                        <user-select-dropdown selection-type="multiple"
+                                              appearance-type="stack"
+                                              use-fixed-menu-style
+                                              excluded-hidden-ids
+                                              :excluded-selected-ids="state.excludedSelectedIds"
+                                              :placeholder="$t('ALERT_MANAGER.SERVICE.MODAL_MEMBER_PLACEHOLDER')"
+                                              @formatted-selected-ids="handleFormattedSelectedIds"
+                        />
+                    </div>
                 </div>
-                <div v-else
-                     class="py-4"
-                >
-                    <p class="pb-2">
-                        {{ $t('ALERT_MANAGER.SERVICE.INVITE_MEMBER_DESC') }}
-                    </p>
-                    <user-select-dropdown selection-type="multiple"
-                                          appearance-type="stack"
-                                          use-fixed-menu-style
-                                          excluded-hidden-ids
-                                          :excluded-selected-ids="state.excludedSelectedIds"
-                                          :placeholder="$t('ALERT_MANAGER.SERVICE.MODAL_MEMBER_PLACEHOLDER')"
-                                          @formatted-selected-ids="handleFormattedSelectedIds"
-                    />
+            </template>
+        </p-button-modal>
+        <p-button-modal v-if="state.isDeleteModalVisible"
+                        :header-title="i18n.t('ALERT_MANAGER.SERVICE.MODAL.DELETE_MEMBER_TITLE')"
+                        size="sm"
+                        theme-color="alert"
+                        :visible.sync="state.isDeleteModalVisible"
+                        :disabled="hasForwardValue()"
+                        @confirm="handleRemoveMember"
+                        @cancel="state.isDeleteModalVisible = false"
+        >
+            <template #body>
+                <div class="flex flex-col gap-8">
+                    <p-scoped-notification v-if="hasForwardValue()"
+                                           type="danger"
+                                           layout="in-section"
+                    >
+                        <p class="pt-1 pb-2">
+                            <span>{{ $t('ALERT_MANAGER.SERVICE.MODAL.DELETE_MEMBER_DESC', { name: state.selectedDeleteMember.label }) }} </span>
+                            <span class="font-bold">{{ $t('ALERT_MANAGER.SERVICE.MODAL.DELETE_MEMBER_DESC_BOLD', { name: state.selectedDeleteMember.label }) }}</span>
+                        </p>
+                        <p-link :to="getNotificationLink()"
+                                action-icon="internal-link"
+                                class="mt-1"
+                                highlight
+                                new-tab
+                        >
+                            {{ $t('ALERT_MANAGER.SERVICE.MODAL.NOTIFICATION_LINK_TEXT') }}
+                        </p-link>
+                    </p-scoped-notification>
+                    <div class="p-3 border border-gray-200 rounded-md">
+                        <div class="flex items-center justify-between text-label-md">
+                            <div class="member-info-content">
+                                <p class="inline">
+                                    <img v-if="state.selectedDeleteMember.type === MEMBERS_TYPE.USER"
+                                         :src="useRoleFormatter(state.selectedDeleteMember.roleType || ROLE_TYPE.USER).image"
+                                         alt="Role Type Icon"
+                                         class="role-image"
+                                    >
+                                    <p-avatar v-else
+                                              class="menu-icon"
+                                              icon="ic_member"
+                                              :color="indigo[300]"
+                                              size="sm"
+                                    />
+                                </p>
+                                <span>{{ state.selectedDeleteMember?.label }}</span>
+                            </div>
+                            <p class="member-info-content">
+                                <span v-if="!state.isMobileSize"
+                                      class="text-gray-500"
+                                >
+                                    {{ state.selectedDeleteMember.type === MEMBERS_TYPE.USER ? formatRoleType(state.selectedDeleteMember.roleType) : $t('ALERT_MANAGER.SERVICE.USER_GROUP') }}
+                                </span>
+                            </p>
+                        </div>
+                    </div>
                 </div>
-            </div>
-        </template>
-    </p-button-modal>
+            </template>
+            <template #confirm-button>
+                <span>{{ $t('ALERT_MANAGER.SERVICE.MODAL.REMOVE') }}</span>
+            </template>
+        </p-button-modal>
+    </div>
 </template>
 
 <style scoped lang="postcss">
@@ -284,14 +375,15 @@ const fetcherChangeMembers = async (userData: string[], userGroupData: string[])
         .title {
             margin-bottom: 0.5rem;
         }
-        .member-info-content {
-            @apply flex items-center gap-2;
-            .role-image {
-                @apply rounded-full;
-                width: 1.5rem;
-                height: 1.5rem;
-            }
-        }
+    }
+}
+
+.member-info-content {
+    @apply flex items-center gap-2;
+    .role-image {
+        @apply rounded-full;
+        width: 1.5rem;
+        height: 1.5rem;
     }
 }
 </style>
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotifications.vue b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotifications.vue
index 6b0aadbd2e..48324091be 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotifications.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotifications.vue
@@ -23,14 +23,12 @@ import type { ValueHandlerMap } from '@cloudforet/mirinae/types/controls/search/
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ServiceChannelListParameters } from '@/schema/alert-manager/service-channel/api-verbs/list';
 import {
-    SERVICE_CHANNEL_FORWARD_TYPE,
     SERVICE_CHANNEL_STATE,
     SERVICE_CHANNEL_TYPE,
 } from '@/schema/alert-manager/service-channel/constants';
 import type { ServiceChannelModel } from '@/schema/alert-manager/service-channel/model';
-import type { ServiceChannelDataType } from '@/schema/alert-manager/service-channel/type';
 import type { ServiceModel } from '@/schema/alert-manager/service/model';
-import { i18n, i18n as _i18n } from '@/translations';
+import { i18n } from '@/translations';
 
 import { FILE_NAME_PREFIX } from '@/lib/excel-export/constant';
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
@@ -46,7 +44,7 @@ import ServiceDetailTabsNotificationsTableModal
     from '@/services/alert-manager/v2/components/ServiceDetailTabsNotificationsTableModal.vue';
 import ServiceDetailTabsNotificationsUpdateModal
     from '@/services/alert-manager/v2/components/ServiceDetailTabsNotificationsUpdateModal.vue';
-import { alertManagerStateFormatter } from '@/services/alert-manager/v2/composables/refined-table-data';
+import { alertManagerStateFormatter, getProtocolInfo } from '@/services/alert-manager/v2/composables/refined-table-data';
 import { SERVICE_TAB_HEIGHT } from '@/services/alert-manager/v2/constants/common-constant';
 import {
     ALERT_EXCEL_FIELDS,
@@ -56,7 +54,7 @@ import {
 import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant';
 import { useServiceCreateFormStore } from '@/services/alert-manager/v2/stores/service-create-form-store';
 import { useServiceDetailPageStore } from '@/services/alert-manager/v2/stores/service-detail-page-store';
-import type { ProtocolInfo, NotificationsModalType, ProtocolCardItemType } from '@/services/alert-manager/v2/types/alert-manager-type';
+import type { NotificationsModalType, ProtocolCardItemType } from '@/services/alert-manager/v2/types/alert-manager-type';
 
 interface Props {
     tableHeight: number;
@@ -80,26 +78,26 @@ const tableState = reactive({
         {
             type: 'item',
             name: 'ENABLE',
-            label: _i18n.t('ALERT_MANAGER.ENABLE'),
+            label: i18n.t('ALERT_MANAGER.ENABLE'),
             disabled: !state.selectedItem || state.selectedItem?.state === SERVICE_CHANNEL_STATE.ENABLED,
         },
         {
             type: 'item',
             name: 'DISABLE',
-            label: _i18n.t('ALERT_MANAGER.DISABLED'),
+            label: i18n.t('ALERT_MANAGER.DISABLED'),
             disabled: !state.selectedItem || state.selectedItem?.state === SERVICE_CHANNEL_STATE.DISABLED,
         },
         { type: 'divider' },
         {
             type: 'item',
             name: 'UPDATE',
-            label: _i18n.t('ALERT_MANAGER.UPDATE'),
+            label: i18n.t('ALERT_MANAGER.UPDATE'),
             disabled: !state.selectedItem,
         },
         {
             type: 'item',
             name: 'DELETE',
-            label: _i18n.t('ALERT_MANAGER.DELETE'),
+            label: i18n.t('ALERT_MANAGER.DELETE'),
             disabled: !state.selectedItem,
         },
     ])),
@@ -140,25 +138,6 @@ const notificationsListApiQueryHelper = new ApiQueryHelper().setSort('created_at
 const queryTagHelper = useQueryTags({ keyItemSets: NOTIFICATION_MANAGEMENT_TABLE_KEY_ITEMS_SETS });
 const { queryTags } = queryTagHelper;
 
-const getProtocolInfo = (id: string, data?: ServiceChannelDataType): ProtocolInfo => {
-    if (id === 'forward') {
-        if (data?.FORWARD_TYPE === SERVICE_CHANNEL_FORWARD_TYPE.ALL_MEMBER) {
-            return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.NOTIFY_TO_ALL_MEMBER') };
-        }
-        if (data?.FORWARD_TYPE === SERVICE_CHANNEL_FORWARD_TYPE.USER_GROUP) {
-            return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.NOTIFY_TO_USER_GROUP') };
-        }
-        if (data?.FORWARD_TYPE === SERVICE_CHANNEL_FORWARD_TYPE.USER) {
-            return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.NOTIFY_TO_USER') };
-        }
-        return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.ASSOCIATED_MEMBER') };
-    }
-    const protocol = storeState.notificationProtocolList.find((item) => item.protocol_id === id);
-    return {
-        name: protocol?.name || '',
-        icon: protocol?.icon || '',
-    };
-};
 const handleCloseModal = () => {
     state.selectIndex = undefined;
     fetchNotificationList();
@@ -298,11 +277,11 @@ onUnmounted(() => {
                          height="1rem"
                     />
                     <p-lazy-img v-else
-                                :src="assetUrlConverter(getProtocolInfo(value).icon)"
+                                :src="assetUrlConverter(getProtocolInfo(value, storeState.notificationProtocolList).icon || '')"
                                 width="1rem"
                                 height="1rem"
                     />
-                    <span>{{ getProtocolInfo(value, item.data).name }}</span>
+                    <span>{{ getProtocolInfo(value, storeState.notificationProtocolList, item.data).name }}</span>
                 </div>
             </template>
         </p-toolbox-table>
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDeleteModal.vue b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDeleteModal.vue
index 112aae553a..aadccceda3 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDeleteModal.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDeleteModal.vue
@@ -1,18 +1,32 @@
 <script setup lang="ts">
-import { reactive } from 'vue';
+import { computed, onMounted, reactive } from 'vue';
 
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
+import {
+    PButtonModal, PScopedNotification, PLink, PDataTable, PStatus, PI, PLazyImg,
+} from '@cloudforet/mirinae';
 
+import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
+import type { EscalationPolicyListParameters } from '@/schema/alert-manager/escalation-policy/api-verbs/list';
+import type { EscalationPolicyModel } from '@/schema/alert-manager/escalation-policy/model';
 import type { ServiceChannelDeleteParameters } from '@/schema/alert-manager/service-channel/api-verbs/delete';
+import { SERVICE_CHANNEL_TYPE } from '@/schema/alert-manager/service-channel/constants';
 import type { ServiceChannelModel } from '@/schema/alert-manager/service-channel/model';
+import type { ServiceModel } from '@/schema/alert-manager/service/model';
 import { i18n } from '@/translations';
 
+import { assetUrlConverter } from '@/lib/helper/asset-helper';
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
-import DeleteModal from '@/common/components/modals/DeleteModal.vue';
 import ErrorHandler from '@/common/composables/error/errorHandler';
 import { useProxyValue } from '@/common/composables/proxy-state';
 
+import { alertManagerStateFormatter, getProtocolInfo } from '@/services/alert-manager/v2/composables/refined-table-data';
+import { SERVICE_DETAIL_TABS } from '@/services/alert-manager/v2/constants/common-constant';
+import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant';
+import { useServiceDetailPageStore } from '@/services/alert-manager/v2/stores/service-detail-page-store';
+import type { ProtocolCardItemType } from '@/services/alert-manager/v2/types/alert-manager-type';
+
 interface Props {
     selectedItem?: ServiceChannelModel;
     visible?: boolean;
@@ -26,9 +40,42 @@ const emit = defineEmits<{(e: 'close'): void,
     (e: 'update:visible'): void
 }>();
 
+const serviceDetailPageStore = useServiceDetailPageStore();
+const serviceDetailPageState = serviceDetailPageStore.state;
+const serviceDetailPageGetters = serviceDetailPageStore.getters;
+
+const storeState = reactive({
+    service: computed<ServiceModel>(() => serviceDetailPageState.serviceInfo),
+});
 const state = reactive({
     loading: false,
     proxyVisible: useProxyValue('visible', props, emit),
+    escalationPolicyList: [] as EscalationPolicyModel[],
+    notificationProtocolList: computed<ProtocolCardItemType[]>(() => serviceDetailPageGetters.notificationProtocolList),
+});
+const tableState = reactive({
+    fields: [
+        { name: 'name', label: 'Name' },
+        { name: 'protocol_id', label: 'Channel' },
+        { name: 'state', label: 'State' },
+    ],
+    filteredItems: computed<Partial<ServiceChannelModel>[]>(() => [{
+        name: props.selectedItem?.name,
+        protocol_id: props.selectedItem?.channel_type === SERVICE_CHANNEL_TYPE.FORWARD ? 'forward' : props.selectedItem?.protocol_id,
+        state: props.selectedItem?.state,
+    }]),
+});
+
+const hasNotificationValue = (): boolean => {
+    if (!props.selectedItem?.channel_id) return false;
+    return state.escalationPolicyList.some((item) => item.rules.some((rule) => rule.channels.includes(props.selectedItem?.channel_id || '')));
+};
+const getEscalationPolicyLink = () => ({
+    name: ALERT_MANAGER_ROUTE.SERVICE.DETAIL._NAME,
+    query: {
+        tab: SERVICE_DETAIL_TABS.SETTINGS,
+        filterNotificationId: props.selectedItem?.channel_id,
+    },
 });
 
 const handleConfirm = async () => {
@@ -46,13 +93,79 @@ const handleConfirm = async () => {
         state.loading = false;
     }
 };
+const fetchEscalationPolicyList = async () => {
+    try {
+        const { results } = await SpaceConnector.clientV2.alertManager.escalationPolicy.list<EscalationPolicyListParameters, ListResponse<EscalationPolicyModel>>({
+            service_id: storeState.service.service_id,
+        });
+        state.escalationPolicyList = results || [];
+    } catch (e) {
+        ErrorHandler.handleError(e);
+        state.escalationPolicyList = [];
+    }
+};
+
+onMounted(() => {
+    fetchEscalationPolicyList();
+});
 </script>
 
 <template>
-    <delete-modal :header-title="$t('ALERT_MANAGER.NOTIFICATIONS.MODAL_DELETE_TITLE')"
-                  :confirm-text="$t('ALERT_MANAGER.NOTIFICATIONS.MODAL_DELETE_BUTTON')"
-                  :visible.sync="state.proxyVisible"
-                  :loading="state.loading"
-                  @confirm="handleConfirm"
-    />
+    <p-button-modal :header-title="i18n.t('ALERT_MANAGER.SERVICE.MODAL.DELETE_NOTIFICATION_TITLE')"
+                    theme-color="alert"
+                    :loading="state.loading"
+                    :visible.sync="state.proxyVisible"
+                    :disabled="hasNotificationValue()"
+                    @confirm="handleConfirm"
+    >
+        <template #body>
+            <div class="flex flex-col gap-8">
+                <p-scoped-notification v-if="hasNotificationValue()"
+                                       type="danger"
+                                       layout="in-section"
+                >
+                    <p class="pt-1 pb-2">
+                        <span>{{ $t('ALERT_MANAGER.SERVICE.MODAL.DELETE_NOTIFICATION_DESC', { name: props.selectedItem?.name }) }} </span>
+                        <span class="font-bold">{{ $t('ALERT_MANAGER.SERVICE.MODAL.DELETE_NOTIFICATION_DESC_BOLD', { name: props.selectedItem?.name }) }}</span>
+                    </p>
+                    <p-link :to="getEscalationPolicyLink()"
+                            action-icon="internal-link"
+                            class="mt-1"
+                            highlight
+                            new-tab
+                    >
+                        {{ $t('ALERT_MANAGER.SERVICE.MODAL.ESCALATION_LINK_TEXT') }}
+                    </p-link>
+                </p-scoped-notification>
+                <p-data-table :fields="tableState.fields"
+                              :items="tableState.filteredItems"
+                >
+                    <template #col-state-format="{ value }">
+                        <p-status
+                            class="capitalize"
+                            v-bind="alertManagerStateFormatter(value)"
+                        />
+                    </template>
+                    <template #col-protocol_id-format="{value, item}">
+                        <div class="flex items-center gap-2">
+                            <p-i v-if="value === 'forward'"
+                                 name="ic_notification-protocol_users"
+                                 width="1rem"
+                                 height="1rem"
+                            />
+                            <p-lazy-img v-else
+                                        :src="assetUrlConverter(getProtocolInfo(value, state.notificationProtocolList, item.data).icon || '')"
+                                        width="1rem"
+                                        height="1rem"
+                            />
+                            <span>{{ getProtocolInfo(value, state.notificationProtocolList, item.data).name }}</span>
+                        </div>
+                    </template>
+                </p-data-table>
+            </div>
+        </template>
+        <template #confirm-button>
+            <span>{{ $t('ALERT_MANAGER.SERVICE.MODAL.REMOVE') }}</span>
+        </template>
+    </p-button-modal>
 </template>
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDetail.vue b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDetail.vue
index e76accc70c..a04687a0aa 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDetail.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsNotificationsDetail.vue
@@ -37,6 +37,7 @@ type ScheduleInfo = {
     value: TranslateResult;
     days: string;
     time: string;
+    timezone: string;
 };
 
 const serviceDetailPageStore = useServiceDetailPageStore();
@@ -111,14 +112,18 @@ const getUserGroupName = (userGroup: string[] = []): string => userGroup.map((gr
 }).join(', ');
 const getScheduleInfo = (schedule: ServiceChannelScheduleInfoType): ScheduleInfo => {
     const scheduleInfo = {
-        styleType: '', value: '' as TranslateResult, days: [] as TranslateResult[], time: '',
+        styleType: '', value: '' as TranslateResult, days: [] as TranslateResult[], time: '', timezone: '',
     };
 
     const formatTime = (time: number | undefined, defaultTime: number): string => `${String(time ?? defaultTime).padStart(2, '0')}:00`;
 
     Object.entries(schedule).forEach(([day, s]) => {
-        if (day === 'SCHEDULE_TYPE' || day === 'TIMEZONE') return;
+        if (day === 'SCHEDULE_TYPE') return;
 
+        if (day === 'TIMEZONE') {
+            scheduleInfo.timezone = s as string;
+            return;
+        }
         const scheduleDay = s as ServiceChannelScheduleDayType;
         if (!scheduleDay) return;
 
@@ -223,17 +228,21 @@ watch(() => storeState.selectedNotificationId, async (selectedId) => {
                     </span>
                 </template>
                 <template #data-schedule="{value}">
-                    <div class="inline-flex items-center gap-2">
-                        <p-badge class="selected-item-badge"
-                                 badge-type="solid-outline"
-                                 :style-type="getScheduleInfo(value).styleType"
-                        >
-                            {{ getScheduleInfo(value).value }}
-                        </p-badge>
-                        <div class="flex flex-col">
-                            <p>{{ $t('ALERT_MANAGER.NOTIFICATIONS.DAY') }} - {{ getScheduleInfo(value).days }}</p>
-                            <p>{{ $t('ALERT_MANAGER.NOTIFICATIONS.TIME') }} - {{ getScheduleInfo(value).time }}</p>
+                    <div class="flex flex-col gap-1">
+                        <div class="flex items-center gap-2">
+                            <p>{{ $t('ALERT_MANAGER.NOTIFICATIONS.DAY') }}:</p>
+                            <p-badge class="selected-item-badge"
+                                     badge-type="solid-outline"
+                                     :style-type="getScheduleInfo(value).styleType"
+                            >
+                                {{ getScheduleInfo(value).value }}
+                            </p-badge>
+                            <p>{{ getScheduleInfo(value).days }}</p>
                         </div>
+                        <p>{{ $t('ALERT_MANAGER.NOTIFICATIONS.TIME') }}: {{ getScheduleInfo(value).time }}</p>
+                        <p class="text-gray-500">
+                            {{ $t('ALERT_MANAGER.TIMEZONE') }}: {{ getScheduleInfo(value).timezone }}
+                        </p>
                     </div>
                 </template>
             </p-definition-table>
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsOverviewNotification.vue b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsOverviewNotification.vue
index d564dfb614..111c70ddf6 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsOverviewNotification.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceDetailTabsOverviewNotification.vue
@@ -4,13 +4,10 @@ import {
     computed, reactive, ref, watch,
 } from 'vue';
 
-import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 import {
     PFieldTitle, PIconButton, PLazyImg, PDivider, PTextButton, PDataLoader, PI,
 } from '@cloudforet/mirinae';
 
-import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
-import type { ServiceChannelListParameters } from '@/schema/alert-manager/service-channel/api-verbs/list';
 import { SERVICE_CHANNEL_TYPE } from '@/schema/alert-manager/service-channel/constants';
 import type { ServiceChannelModel } from '@/schema/alert-manager/service-channel/model';
 
@@ -29,6 +26,7 @@ const rowItemsWrapperRef = ref<null | HTMLElement>(null);
 const itemEl = ref<null | HTMLElement>(null);
 
 const serviceDetailPageStore = useServiceDetailPageStore();
+const serviceDetailPageState = serviceDetailPageStore.state;
 const serviceDetailPageGetters = serviceDetailPageStore.getters;
 
 const { width: rowItemsWrapperWidth } = useElementSize(rowItemsWrapperRef);
@@ -36,13 +34,13 @@ const { width: rowItemsWrapperWidth } = useElementSize(rowItemsWrapperRef);
 const storeState = reactive({
     serviceId: computed<string>(() => serviceDetailPageGetters.serviceInfo.service_id),
     notificationProtocolList: computed<ProtocolCardItemType[]>(() => serviceDetailPageGetters.notificationProtocolList),
+    serviceChannelList: computed<ServiceChannelModel[]>(() => serviceDetailPageState.serviceChannelList.slice(0, 15)),
 });
 const state = reactive({
     loading: true,
     pageStart: 0,
-    items: [] as ServiceChannelModel[],
     visibleCount: computed<number>(() => Math.floor((rowItemsWrapperWidth.value - DEFAULT_LEFT_PADDING) / ITEM_DEFAULT_WIDTH)),
-    pageMax: computed<number>(() => Math.max(state.items.length - state.visibleCount, 0)),
+    pageMax: computed<number>(() => Math.max(storeState.serviceChannelList.length - state.visibleCount, 0)),
 });
 
 const handleClickArrowButton = (increment: number) => {
@@ -68,19 +66,12 @@ const handleRouteDetail = () => (
     serviceDetailPageStore.setCurrentTab(SERVICE_DETAIL_TABS.NOTIFICATIONS)
 );
 
-const fetchServiceChannelList = async () => {
+const fetchServiceChannelList = async (serviceId: string) => {
     state.loading = true;
     try {
-        const { results } = await SpaceConnector.clientV2.alertManager.serviceChannel.list<ServiceChannelListParameters, ListResponse<ServiceChannelModel>>({
-            service_id: storeState.serviceId,
-            query: {
-                sort: [{ key: 'created_at', desc: true }],
-            },
-        });
-        state.items = (results || []).slice(0, 15);
+        await serviceDetailPageStore.fetchServiceChannelList(serviceId);
     } catch (e) {
         ErrorHandler.handleError(e);
-        state.items = [];
     } finally {
         state.loading = false;
     }
@@ -88,7 +79,7 @@ const fetchServiceChannelList = async () => {
 
 watch(() => storeState.serviceId, (serviceId) => {
     if (!serviceId) return;
-    fetchServiceChannelList();
+    fetchServiceChannelList(serviceId);
 }, { immediate: true });
 </script>
 
@@ -100,9 +91,9 @@ watch(() => storeState.serviceId, (serviceId) => {
                        font-weight="regular"
         />
         <p-data-loader :loading="state.loading"
-                       :data="state.items"
+                       :data="storeState.serviceChannelList"
                        class="content flex-1 pt-2"
-                       :class="{ 'empty': !state.items.length }"
+                       :class="{ 'empty': !storeState.serviceChannelList.length }"
         >
             <div ref="rowItemsWrapperRef"
                  class="row-items-wrapper"
@@ -110,7 +101,7 @@ watch(() => storeState.serviceId, (serviceId) => {
                 <div ref="itemEl"
                      class="row-items-container"
                 >
-                    <div v-for="(item, idx) in state.items"
+                    <div v-for="(item, idx) in storeState.serviceChannelList"
                          :key="`service-detail-notification-item-${idx}`"
                          class="item"
                     >
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceList.vue b/apps/web/src/services/alert-manager/v2/components/ServiceList.vue
index 68aac1297d..8768009464 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceList.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceList.vue
@@ -1,36 +1,38 @@
 <script setup lang="ts">
-import { computed, onMounted, reactive } from 'vue';
-import { useRouter } from 'vue-router/composables';
-
-import { isEmpty } from 'lodash';
+import { onMounted, reactive, watch } from 'vue';
+import {
+    useRoute, useRouter,
+} from 'vue-router/composables';
 
 import { makeDistinctValueHandler } from '@cloudforet/core-lib/component-util/query-search';
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
 import {
-    PToolbox, PDataLoader, PEmpty, PButton,
+    PToolbox, PDataLoader, PEmpty, PButton, PPagination,
 } from '@cloudforet/mirinae';
 import type { ToolboxOptions } from '@cloudforet/mirinae/types/controls/toolbox/type';
 
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ServiceListParameters } from '@/schema/alert-manager/service/api-verbs/list';
+import { SERVICE_HEALTHY_TYPE } from '@/schema/alert-manager/service/constants';
 import type { ServiceModel } from '@/schema/alert-manager/service/model';
 
+import { replaceUrlQuery } from '@/lib/router-query-string';
+
 import ErrorHandler from '@/common/composables/error/errorHandler';
 import { usePageEditableStatus } from '@/common/composables/page-editable-status';
 import { useQueryTags } from '@/common/composables/query-tags';
 
 import ServiceListContent from '@/services/alert-manager/v2/components/ServiceListContent.vue';
 import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant';
-import type { AlertManagementTableHandlerType } from '@/services/alert-manager/v2/types/alert-manager-type';
-
-const pageSizeOptions = [15, 30, 45];
+import { useServiceListPageStore } from '@/services/alert-manager/v2/stores/service-list-page-store';
 
 const { hasReadWriteAccess } = usePageEditableStatus();
 
 const router = useRouter();
+const route = useRoute();
 
-const SERVICE_SEARCH_HANDLER: AlertManagementTableHandlerType = {
+const SERVICE_SEARCH_HANDLER = {
     keyItemSets: [{
         title: 'Properties',
         items: [
@@ -44,108 +46,232 @@ const SERVICE_SEARCH_HANDLER: AlertManagementTableHandlerType = {
 
 const state = reactive({
     loading: true,
+    healthyLoading: true,
     totalCount: 0,
-    serviceList: [] as ServiceModel[],
-    alertServiceList: computed<ServiceModel[]>(() => state.serviceList.filter((item) => !isEmpty(item?.alerts.TRIGGERED) || !isEmpty(item?.alerts.ACKNOWLEDGED))),
-    healthyServiceList: computed<ServiceModel[]>(() => state.serviceList.filter((item) => isEmpty(item?.alerts.TRIGGERED) && isEmpty(item?.alerts.ACKNOWLEDGED))),
+    healthyTotalCount: 0,
+    alertServiceList: [] as ServiceModel[],
+    healthyServiceList: [] as ServiceModel[],
 });
 
-const serviceListApiQueryHelper = new ApiQueryHelper().setSort('created_at', true)
-    .setPage(1, 15);
+const serviceListPageStore = useServiceListPageStore();
+
+const serviceListApiQueryHelper = new ApiQueryHelper().setSort('created_at', true);
+const healthyServiceListApiQueryHelper = new ApiQueryHelper().setSort('created_at', true);
 const queryTagHelper = useQueryTags({ keyItemSets: SERVICE_SEARCH_HANDLER.keyItemSets });
 const { queryTags } = queryTagHelper;
 
-const handleChangeToolbox = async (options: ToolboxOptions) => {
+const handleToolbox = async (options: ToolboxOptions) => {
     if (options.queryTags !== undefined) queryTagHelper.setQueryTags(options.queryTags);
-    if (options.pageStart !== undefined) serviceListApiQueryHelper.setPageStart(options.pageStart);
-    if (options.pageLimit !== undefined) serviceListApiQueryHelper.setPageLimit(options.pageLimit);
+    await fetchBothLists();
+};
+
+const fetchBothLists = async () => {
+    await Promise.all([
+        fetchServiceList(),
+        fetchHealthyServiceList(),
+    ]);
+};
+
+const handleUnhealthyPageChange = async () => {
     await fetchServiceList();
 };
-const handleClickCreateButton = () => {
-    router.push({
-        name: ALERT_MANAGER_ROUTE.SERVICE.CREATE._NAME,
-    }).catch(() => {});
+
+const handleHealthyPageChange = async () => {
+    await fetchHealthyServiceList();
 };
 
 const fetchServiceList = async () => {
     state.loading = true;
     try {
-        serviceListApiQueryHelper.setFilters([
+        const validPage = Math.max(1, serviceListPageStore.unhealthyThisPage);
+        const pageStart = (validPage - 1) * serviceListPageStore.unhealthyPageSize + 1;
+
+        serviceListApiQueryHelper.setPage(pageStart, serviceListPageStore.unhealthyPageSize).setFilters([
             ...queryTagHelper.filters.value,
+            { k: 'service_healthy', v: SERVICE_HEALTHY_TYPE.UNHEALTHY, o: '=' },
         ]);
         const { results, total_count } = await SpaceConnector.clientV2.alertManager.service.list<ServiceListParameters, ListResponse<ServiceModel>>({
             query: serviceListApiQueryHelper.data,
             details: true,
         });
-        state.serviceList = results || [];
+        state.alertServiceList = results || [];
         state.totalCount = total_count || 0;
     } catch (e) {
         ErrorHandler.handleError(e);
-        state.serviceList = [];
+        state.alertServiceList = [];
         state.totalCount = 0;
     } finally {
         state.loading = false;
     }
 };
 
+const fetchHealthyServiceList = async () => {
+    state.healthyLoading = true;
+    try {
+        const validPage = Math.max(1, serviceListPageStore.healthyThisPage);
+        const pageStart = (validPage - 1) * serviceListPageStore.healthyPageSize + 1;
+
+        healthyServiceListApiQueryHelper.setPage(pageStart, serviceListPageStore.healthyPageSize).setFilters([
+            ...queryTagHelper.filters.value,
+            { k: 'service_healthy', v: SERVICE_HEALTHY_TYPE.HEALTHY, o: '=' },
+        ]);
+        const { results, total_count } = await SpaceConnector.clientV2.alertManager.service.list<ServiceListParameters, ListResponse<ServiceModel>>({
+            query: healthyServiceListApiQueryHelper.data,
+            details: true,
+        });
+        state.healthyServiceList = results || [];
+        state.healthyTotalCount = total_count || 0;
+    } catch (e) {
+        ErrorHandler.handleError(e);
+        state.healthyServiceList = [];
+        state.healthyTotalCount = 0;
+    } finally {
+        state.healthyLoading = false;
+    }
+};
+
+const handleClickCreateButton = () => {
+    router.push({
+        name: ALERT_MANAGER_ROUTE.SERVICE.CREATE._NAME,
+    }).catch(() => {});
+};
+
+const handleNavigateToDetail = (serviceId: string) => {
+    const validUnhealthyPage = (!Number.isNaN(serviceListPageStore.unhealthyThisPage) && serviceListPageStore.unhealthyThisPage > 0)
+        ? serviceListPageStore.unhealthyThisPage
+        : 1;
+    const validHealthyPage = (!Number.isNaN(serviceListPageStore.healthyThisPage) && serviceListPageStore.healthyThisPage > 0)
+        ? serviceListPageStore.healthyThisPage
+        : 1;
+
+    router.push({
+        name: ALERT_MANAGER_ROUTE.SERVICE.DETAIL._NAME,
+        params: { serviceId },
+        query: {
+            unhealthyPage: validUnhealthyPage.toString(),
+            healthyPage: validHealthyPage.toString(),
+        },
+    }).catch(() => {});
+};
+
 onMounted(async () => {
-    await fetchServiceList();
+    const { unhealthyPage, healthyPage } = route.query;
+
+    let parsedUnhealthy = parseInt(unhealthyPage as string);
+    let parsedHealthy = parseInt(healthyPage as string);
+
+    parsedUnhealthy = (!Number.isNaN(parsedUnhealthy) && parsedUnhealthy > 0) ? parsedUnhealthy : 1;
+    parsedHealthy = (!Number.isNaN(parsedHealthy) && parsedHealthy > 0) ? parsedHealthy : 1;
+
+    serviceListPageStore.setUnhealthyPage(parsedUnhealthy);
+    serviceListPageStore.setHealthyPage(parsedHealthy);
+
+    await fetchBothLists();
+});
+
+watch(() => route.query.serviceName, async (serviceName) => {
+    if (!serviceName) return;
+    queryTagHelper.setQueryTags([
+        {
+            key: { name: 'name', label: 'Name' },
+            operator: '=',
+            value: { label: serviceName as string, name: serviceName },
+        },
+    ]);
+    await fetchBothLists();
+}, { immediate: true });
+watch(() => serviceListPageStore.unhealthyThisPage, (val) => {
+    replaceUrlQuery({
+        unhealthyPage: String(val),
+        healthyPage: String(serviceListPageStore.healthyThisPage),
+    });
+    handleUnhealthyPageChange();
+});
+
+watch(() => serviceListPageStore.healthyThisPage, (val) => {
+    replaceUrlQuery({
+        unhealthyPage: String(serviceListPageStore.unhealthyThisPage),
+        healthyPage: String(val),
+    });
+    handleHealthyPageChange();
 });
 </script>
 
 <template>
-    <div class="service-list flex flex-col gap-2">
+    <div class="service-list flex flex-col gap-6">
         <p-toolbox search-type="query"
                    searchable
                    filters-visible
-                   :page-size-options="pageSizeOptions"
-                   :page-size="15"
+                   :page-size-changeable="false"
+                   :pagination-visible="false"
                    :query-tags="queryTags"
                    :key-item-sets="SERVICE_SEARCH_HANDLER.keyItemSets"
                    :value-handler-map="SERVICE_SEARCH_HANDLER.valueHandlerMap"
-                   :total-count="state.totalCount"
-                   @change="handleChangeToolbox"
-                   @refresh="fetchServiceList"
+                   @change="handleToolbox"
+                   @refresh="fetchBothLists"
         />
-        <p-data-loader :loading="state.loading"
-                       :data="state.serviceList"
-                       loader-backdrop-color="transparent"
-                       class="loader-wrapper"
-        >
-            <div class="flex flex-col gap-4">
-                <service-list-content v-if="state.alertServiceList.length > 0"
-                                      :list="state.alertServiceList"
-                                      type="alert"
-                />
-                <service-list-content v-if="state.healthyServiceList.length > 0"
-                                      :list="state.healthyServiceList"
-                                      type="healthy"
-                />
-            </div>
-            <template #no-data>
-                <div class="pt-12">
-                    <p-empty show-image
-                             :show-button="hasReadWriteAccess"
-                    >
-                        <template #image>
-                            <img src="../../../../assets/images/img_jellyocto-with-a-telescope.png"
-                                 alt="empty-image"
-                            >
-                        </template>
-                        <template v-if="hasReadWriteAccess"
-                                  #button
+
+        <section>
+            <p-data-loader :loading="state.loading"
+                           :data="state.alertServiceList"
+                           loader-backdrop-color="transparent"
+                           class="loader-wrapper"
+            >
+                <div>
+                    <service-list-content v-if="state.alertServiceList.length > 0"
+                                          :list="state.alertServiceList"
+                                          type="alert"
+                                          @navigate-to-detail="handleNavigateToDetail"
+                    />
+                    <div class="flex justify-center mt-4">
+                        <p-pagination
+                            :total-count="state.totalCount"
+                            :this-page.sync="serviceListPageStore.unhealthyThisPage"
+                            :page-size.sync="serviceListPageStore.unhealthyPageSize"
+                            @change="handleUnhealthyPageChange"
+                        />
+                    </div>
+                </div>
+                <div>
+                    <service-list-content v-if="state.healthyServiceList.length > 0"
+                                          :list="state.healthyServiceList"
+                                          type="healthy"
+                                          @navigate-to-detail="handleNavigateToDetail"
+                    />
+                    <div class="flex justify-center mt-4">
+                        <p-pagination v-if="state.healthyTotalCount > serviceListPageStore.healthyPageSize"
+                                      :total-count="state.healthyTotalCount"
+                                      :this-page.sync="serviceListPageStore.healthyThisPage"
+                                      :page-size.sync="serviceListPageStore.healthyPageSize"
+                                      @change="handleHealthyPageChange"
+                        />
+                    </div>
+                </div>
+                <template #no-data>
+                    <div class="pt-12">
+                        <p-empty show-image
+                                 :show-button="hasReadWriteAccess"
                         >
-                            <p-button icon-left="ic_plus_bold"
-                                      @click="handleClickCreateButton"
+                            <template #image>
+                                <img src="../../../../assets/images/img_jellyocto-with-a-telescope.png"
+                                     alt="empty-image"
+                                >
+                            </template>
+                            <template v-if="hasReadWriteAccess"
+                                      #button
                             >
-                                {{ $t('ALERT_MANAGER.SERVICE.NO_DATA') }}
-                            </p-button>
-                        </template>
-                        {{ $t('ALERT_MANAGER.SERVICE.NO_DATA_DESC') }}
-                    </p-empty>
-                </div>
-            </template>
-        </p-data-loader>
+                                <p-button icon-left="ic_plus_bold"
+                                          @click="handleClickCreateButton"
+                                >
+                                    {{ $t('ALERT_MANAGER.SERVICE.NO_DATA') }}
+                                </p-button>
+                            </template>
+                            {{ $t('ALERT_MANAGER.SERVICE.NO_DATA_DESC') }}
+                        </p-empty>
+                    </div>
+                </template>
+            </p-data-loader>
+        </section>
     </div>
 </template>
 
diff --git a/apps/web/src/services/alert-manager/v2/components/ServiceListContent.vue b/apps/web/src/services/alert-manager/v2/components/ServiceListContent.vue
index 59a9692c15..e2514e95af 100644
--- a/apps/web/src/services/alert-manager/v2/components/ServiceListContent.vue
+++ b/apps/web/src/services/alert-manager/v2/components/ServiceListContent.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, reactive } from 'vue';
 import type { TranslateResult } from 'vue-i18n';
-import { useRouter } from 'vue-router/composables';
+import { useRoute, useRouter } from 'vue-router/composables';
 
 import {
     PSelectCard, PI, PLazyImg, PDivider, PTextButton,
@@ -36,7 +36,7 @@ const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
 const serviceDetailPageStore = useServiceDetailPageStore();
 
-
+const route = useRoute();
 const router = useRouter();
 
 const storeState = reactive({
@@ -72,6 +72,7 @@ const handleClickServiceItem = (id: string) => {
         },
         query: {
             tab: SERVICE_DETAIL_TABS.OVERVIEW,
+            filterService: route.query.serviceName,
         },
     }).catch(() => {});
 };
diff --git a/apps/web/src/services/alert-manager/v2/composables/alert-table-data.ts b/apps/web/src/services/alert-manager/v2/composables/alert-table-data.ts
index 7845e3ac25..634d0c267b 100644
--- a/apps/web/src/services/alert-manager/v2/composables/alert-table-data.ts
+++ b/apps/web/src/services/alert-manager/v2/composables/alert-table-data.ts
@@ -4,10 +4,16 @@ import type { TranslateResult } from 'vue-i18n';
 
 import dayjs from 'dayjs';
 
+import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
+import type { ValueHandler } from '@cloudforet/mirinae/types/controls/search/query-search/type';
+
 import { ALERT_STATUS } from '@/schema/alert-manager/alert/constants';
 import type { AlertStatusType, AlertUrgencyType } from '@/schema/alert-manager/alert/type';
 import { i18n } from '@/translations';
 
+import type { AppReferenceMap } from '@/store/reference/app-reference-store';
+import type { WebhookReferenceMap } from '@/store/reference/webhook-reference-store';
+
 export const getAlertStateI18n = (): ComputedRef<Record<AlertStatusType, TranslateResult>> => computed(() => ({
     ALL: i18n.t('ALERT_MANAGER.ALERTS.ALL'),
     TRIGGERED: i18n.t('ALERT_MANAGER.ALERTS.TRIGGERED'),
@@ -57,3 +63,36 @@ export const calculateTime = (time: string, timezone: string): string => {
 
     return parts.join(' ') || '0m';
 };
+
+export const makeTriggeredValueHandler = ({
+    webhooks,
+    apps,
+}: { webhooks: WebhookReferenceMap, apps: AppReferenceMap }): ValueHandler|undefined => async () => {
+    try {
+        const { results } = await SpaceConnector.client.addOns.autocomplete.distinct({
+            resource_type: 'alert_manager.Alert',
+            distinct_key: 'triggered_by',
+        });
+
+        return {
+            results: results.reduce((r, d) => {
+                if (d.name !== '' && d.name !== undefined && d.name !== null) {
+                    if (d.key.includes('webhook')) {
+                        r.push({ label: webhooks[d.key].label, name: d.key });
+                    } else if (d.key.includes('app')) {
+                        r.push({ label: apps[d.key].label, name: d.key });
+                    } else {
+                        r.push({ label: d.name, name: d.key });
+                    }
+                }
+                return r;
+            }, []),
+            totalCount: results.length,
+        };
+    } catch (e) {
+        return {
+            results: [],
+            totalCount: 0,
+        };
+    }
+};
diff --git a/apps/web/src/services/alert-manager/v2/composables/refined-table-data.ts b/apps/web/src/services/alert-manager/v2/composables/refined-table-data.ts
index c97000f82e..2900647bdb 100644
--- a/apps/web/src/services/alert-manager/v2/composables/refined-table-data.ts
+++ b/apps/web/src/services/alert-manager/v2/composables/refined-table-data.ts
@@ -1,4 +1,9 @@
+import { SERVICE_CHANNEL_FORWARD_TYPE } from '@/schema/alert-manager/service-channel/constants';
+import type { ServiceChannelDataType } from '@/schema/alert-manager/service-channel/type';
+import { i18n } from '@/translations';
+
 import { ALERT_MANAGER_STATE_COLOR } from '@/services/alert-manager/v2/constants/common-constant';
+import type { ProtocolCardItemType, ProtocolInfo } from '@/services/alert-manager/v2/types/alert-manager-type';
 
 const colorBindFactory = (colorMapping, textFnc) => (value) => ({
     text: textFnc(value),
@@ -6,3 +11,23 @@ const colorBindFactory = (colorMapping, textFnc) => (value) => ({
 });
 
 export const alertManagerStateFormatter = colorBindFactory(ALERT_MANAGER_STATE_COLOR, (value) => value.toLowerCase());
+
+export const getProtocolInfo = (id: string, list: ProtocolCardItemType[], data?: ServiceChannelDataType): ProtocolInfo => {
+    if (id === 'forward') {
+        if (data?.FORWARD_TYPE === SERVICE_CHANNEL_FORWARD_TYPE.ALL_MEMBER) {
+            return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.NOTIFY_TO_ALL_MEMBER') };
+        }
+        if (data?.FORWARD_TYPE === SERVICE_CHANNEL_FORWARD_TYPE.USER_GROUP) {
+            return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.NOTIFY_TO_USER_GROUP') };
+        }
+        if (data?.FORWARD_TYPE === SERVICE_CHANNEL_FORWARD_TYPE.USER) {
+            return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.NOTIFY_TO_USER') };
+        }
+        return { name: i18n.t('ALERT_MANAGER.NOTIFICATIONS.ASSOCIATED_MEMBER') };
+    }
+    const protocol = list.find((item) => item.protocol_id === id);
+    return {
+        name: protocol?.name || '',
+        icon: protocol?.icon || '',
+    };
+};
diff --git a/apps/web/src/services/alert-manager/v2/constants/alert-table-constant.ts b/apps/web/src/services/alert-manager/v2/constants/alert-table-constant.ts
index 6e167494e2..563ead1640 100644
--- a/apps/web/src/services/alert-manager/v2/constants/alert-table-constant.ts
+++ b/apps/web/src/services/alert-manager/v2/constants/alert-table-constant.ts
@@ -29,6 +29,7 @@ export const ALERT_MANAGEMENT_TABLE_FIELDS: DataTableFieldType[] = [
     { name: 'duration', label: 'Duration', sortable: false },
     { name: 'created_at', label: 'Created' },
     { name: 'resolved_at', label: 'Resolved' },
+    { name: 'resources', label: 'Resource' },
 ];
 export const ALERT_MANAGEMENT_TABLE_HANDLER: AlertManagementTableHandlerType = {
     keyItemSets: [{
@@ -42,7 +43,6 @@ export const ALERT_MANAGEMENT_TABLE_HANDLER: AlertManagementTableHandlerType = {
     valueHandlerMap: {
         title: makeDistinctValueHandler('alert_manager.Alert', 'title'),
         labels: makeDistinctValueHandler('alert_manager.Alert', 'labels'),
-        triggered_by: makeDistinctValueHandler('alert_manager.Alert', 'triggered_by'),
     },
 };
 export const ALERT_EXCEL_FIELDS: ExcelDataField[] = [
@@ -55,6 +55,7 @@ export const ALERT_EXCEL_FIELDS: ExcelDataField[] = [
     { key: 'triggered_by', name: 'Triggered by', reference: { reference_key: 'webhook_id', resource_type: 'alert_manager.Webhook' } },
     { key: 'created_at', name: 'Created', type: 'datetime' },
     { key: 'resolved_at', name: 'Resolved', type: 'datetime' },
+    { key: 'resources', name: 'Resource' },
 ];
 
 export const ALERT_CHANNEL_TABLE_FIELDS: DataTableFieldType[] = [
diff --git a/apps/web/src/services/alert-manager/v2/routes/routes.ts b/apps/web/src/services/alert-manager/v2/routes/routes.ts
index 2c960f005b..c9aa074f1f 100644
--- a/apps/web/src/services/alert-manager/v2/routes/routes.ts
+++ b/apps/web/src/services/alert-manager/v2/routes/routes.ts
@@ -1,8 +1,5 @@
 import type { RouteConfig } from 'vue-router';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -19,7 +16,6 @@ const AlertContainer = () => import('@/services/alert-manager/v2/AlertContainer.
 const AlertsMainPage = () => import('@/services/alert-manager/v2/pages/AlertsMainPage.vue');
 const AlertsDetailPage = () => import('@/services/alert-manager/v2/pages/AlertsDetailPage.vue');
 
-const userStore = useUserStore(pinia);
 const alertManagerRoute: RouteConfig = {
     path: 'alert-manager',
     name: ALERT_MANAGER_ROUTE._NAME,
@@ -27,7 +23,7 @@ const alertManagerRoute: RouteConfig = {
         menuId: MENU_ID.ALERT_MANAGER,
         translationId: MENU_INFO_MAP[MENU_ID.ALERT_MANAGER].translationId,
     },
-    redirect: (to) => getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap),
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: AlertManagerContainer,
     children: [
         {
diff --git a/apps/web/src/services/alert-manager/v2/stores/alert-page-store.ts b/apps/web/src/services/alert-manager/v2/stores/alert-page-store.ts
index e42c17826f..f84040a3b3 100644
--- a/apps/web/src/services/alert-manager/v2/stores/alert-page-store.ts
+++ b/apps/web/src/services/alert-manager/v2/stores/alert-page-store.ts
@@ -1,5 +1,3 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
 import { computed, reactive } from 'vue';
 
 import { defineStore } from 'pinia';
@@ -16,6 +14,9 @@ import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
+import { ALERT_PERIOD_DROPDOWN_MENU } from '@/services/alert-manager/v2/constants/alert-table-constant';
+import type { Period } from '@/services/alert-manager/v2/types/alert-manager-type';
+
 interface AlertPageStoreState {
     alertList: AlertModel[]
     totalAlertCount: number;
@@ -23,7 +24,10 @@ interface AlertPageStoreState {
     selectedServiceId: string;
     selectedStatus: string;
     selectedUrgency: string;
+    selectedLabels: SelectDropdownMenuItem[];
     selectedSearchFilter?: string[];
+    selectedPeriod: Period;
+    selectedPeriodRange: string;
 }
 
 export const useAlertPageStore = defineStore('page-alert', () => {
@@ -36,7 +40,10 @@ export const useAlertPageStore = defineStore('page-alert', () => {
         selectedServiceId: '',
         selectedStatus: 'OPEN',
         selectedUrgency: 'ALL',
+        selectedLabels: [],
         selectedSearchFilter: undefined,
+        selectedPeriod: { start: undefined, end: undefined },
+        selectedPeriodRange: ALERT_PERIOD_DROPDOWN_MENU.ALL,
     });
     const getters = {
         serviceDropdownList: computed<SelectDropdownMenuItem[]>(() => Object.values(allReferenceGetters.service).map((d) => ({
@@ -57,9 +64,22 @@ export const useAlertPageStore = defineStore('page-alert', () => {
         setSelectedUrgency(urgency: string) {
             state.selectedUrgency = urgency;
         },
+        setSelectedLabels(labels?: string) {
+            if (!labels) {
+                state.selectedLabels = [];
+                return;
+            }
+            state.selectedLabels = [{ name: labels, label: labels }];
+        },
         setSelectedSearchFilter(searchFilter?: string[]) {
             state.selectedSearchFilter = searchFilter;
         },
+        setSelectedPeriod(period: Period) {
+            state.selectedPeriod = period;
+        },
+        setSelectedPeriodRange(periodRange: string) {
+            state.selectedPeriodRange = periodRange;
+        },
     };
     const actions = {
         async init() {
diff --git a/apps/web/src/services/alert-manager/v2/stores/service-detail-page-store.ts b/apps/web/src/services/alert-manager/v2/stores/service-detail-page-store.ts
index 074d478875..5d6b50954b 100644
--- a/apps/web/src/services/alert-manager/v2/stores/service-detail-page-store.ts
+++ b/apps/web/src/services/alert-manager/v2/stores/service-detail-page-store.ts
@@ -11,6 +11,8 @@ import type { EventRuleListParameters } from '@/schema/alert-manager/event-rule/
 import type { EventRuleModel } from '@/schema/alert-manager/event-rule/model';
 import type { NotificationProtocolListParameters } from '@/schema/alert-manager/notification-protocol/api-verbs/list';
 import type { NotificationProtocolModel } from '@/schema/alert-manager/notification-protocol/model';
+import type { ServiceChannelListParameters } from '@/schema/alert-manager/service-channel/api-verbs/list';
+import type { ServiceChannelModel } from '@/schema/alert-manager/service-channel/model';
 import type { ServiceDeleteParameters } from '@/schema/alert-manager/service/api-verbs/delete';
 import type { ServiceGetParameters } from '@/schema/alert-manager/service/api-verbs/get';
 import type { ServiceUpdateParameters } from '@/schema/alert-manager/service/api-verbs/update';
@@ -44,6 +46,7 @@ interface ServiceFormStoreState {
     selectedWebhookId?: string;
     selectedNotificationId?: string;
     selectedEscalationPolicyId?: string;
+    serviceChannelList: ServiceChannelModel[];
     eventRuleList: EventRuleModel[];
     eventRuleInfo: EventRuleModel;
     eventRuleScopeModalVisible: boolean;
@@ -76,6 +79,7 @@ export const useServiceDetailPageStore = defineStore('page-service-detail', () =
         selectedWebhookId: undefined,
         selectedNotificationId: undefined,
         selectedEscalationPolicyId: undefined,
+        serviceChannelList: [],
         eventRuleList: [],
         eventRuleInfo: {} as EventRuleModel,
         eventRuleScopeModalVisible: false,
@@ -240,6 +244,20 @@ export const useServiceDetailPageStore = defineStore('page-service-detail', () =
                 state.eventRuleInfoLoading = false;
             }
         },
+        async fetchServiceChannelList(serviceId: string) {
+            try {
+                const { results } = await SpaceConnector.clientV2.alertManager.serviceChannel.list<ServiceChannelListParameters, ListResponse<ServiceChannelModel>>({
+                    service_id: serviceId,
+                    query: {
+                        sort: [{ key: 'created_at', desc: true }],
+                    },
+                });
+                state.serviceChannelList = results || [];
+            } catch (e) {
+                state.serviceChannelList = [];
+                throw e;
+            }
+        },
     };
 
     return {
diff --git a/apps/web/src/services/alert-manager/v2/stores/service-list-page-store.ts b/apps/web/src/services/alert-manager/v2/stores/service-list-page-store.ts
new file mode 100644
index 0000000000..b63fda6296
--- /dev/null
+++ b/apps/web/src/services/alert-manager/v2/stores/service-list-page-store.ts
@@ -0,0 +1,18 @@
+import { defineStore } from 'pinia';
+
+export const useServiceListPageStore = defineStore('serviceListPage', {
+    state: () => ({
+        unhealthyThisPage: 1,
+        unhealthyPageSize: 10,
+        healthyThisPage: 1,
+        healthyPageSize: 6,
+    }),
+    actions: {
+        setUnhealthyPage(page: number) {
+            this.unhealthyThisPage = page;
+        },
+        setHealthyPage(page: number) {
+            this.healthyThisPage = page;
+        },
+    },
+});
diff --git a/apps/web/src/services/asset-inventory/components/CloudServiceDetailTabs.vue b/apps/web/src/services/asset-inventory/components/CloudServiceDetailTabs.vue
index 3e4e9b3066..a048c9fe5a 100644
--- a/apps/web/src/services/asset-inventory/components/CloudServiceDetailTabs.vue
+++ b/apps/web/src/services/asset-inventory/components/CloudServiceDetailTabs.vue
@@ -16,9 +16,9 @@ import { i18n } from '@/translations';
 
 import { useServiceRouter } from '@/router/composables/use-service-router';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
 import { MENU_ID } from '@/lib/menu/config';
 import type { Reference } from '@/lib/reference/type';
 
@@ -62,7 +62,8 @@ const props = defineProps<Props>();
 const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
 const taskManagementTemplateStore = useTaskManagementTemplateStore();
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
+
 
 const router = useRouter();
 const serviceRouter = useServiceRouter(router);
@@ -71,7 +72,7 @@ const { visibleContents } = useContentsAccessibility(MENU_ID.OPS_FLOW);
 
 /* Tabs */
 const state = reactive({
-    visibleAlertTab: computed(() => globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleAssetAlertTab),
+    visibleAlertTab: computed(() => alertManagerUiAffectsSchema.value?.visibleAssetAlertTab),
 });
 const singleItemTabState = reactive({
     tabs: computed(() => {
diff --git a/apps/web/src/services/asset-inventory/components/CloudServiceHistoryDetailNoteTab.vue b/apps/web/src/services/asset-inventory/components/CloudServiceHistoryDetailNoteTab.vue
index 2a8343b746..cee4506c79 100644
--- a/apps/web/src/services/asset-inventory/components/CloudServiceHistoryDetailNoteTab.vue
+++ b/apps/web/src/services/asset-inventory/components/CloudServiceHistoryDetailNoteTab.vue
@@ -20,9 +20,9 @@ import type { NoteListParameters } from '@/schema/inventory/note/api-verbs/list'
 import type { NoteModel } from '@/schema/inventory/note/model';
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -31,7 +31,6 @@ import ErrorHandler from '@/common/composables/error/errorHandler';
 
 import { COST_EXPLORER_ROUTE } from '@/services/cost-explorer/routes/route-constant';
 
-
 interface Props {
     recordId: string;
     manageDisabled: boolean;
@@ -47,9 +46,7 @@ const emit = defineEmits<{(e: 'refresh-note-count'): void}>();
 const route = useRoute();
 
 const userStore = useUserStore();
-const storeState = reactive({
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
-});
+const authorizationStore = useAuthorizationStore();
 const state = reactive({
     id: '',
     noteInput: '',
@@ -72,7 +69,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
 });
 
 const handleChangeNoteInput = (e) => {
diff --git a/apps/web/src/services/asset-inventory/components/CloudServiceLSB.vue b/apps/web/src/services/asset-inventory/components/CloudServiceLSB.vue
index 1f6f6d0171..38a3393a3c 100644
--- a/apps/web/src/services/asset-inventory/components/CloudServiceLSB.vue
+++ b/apps/web/src/services/asset-inventory/components/CloudServiceLSB.vue
@@ -13,9 +13,9 @@ import {
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { ProviderReferenceMap } from '@/store/reference/provider-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
 import LSB from '@/common/modules/navigations/lsb/LSB.vue';
 import type {
@@ -47,14 +47,14 @@ const cloudServicePageState = cloudServicePageStore.$state;
 const cloudServiceDetailPageStore = useCloudServiceDetailPageStore();
 const cloudServiceDetailPageState = cloudServiceDetailPageStore.$state;
 const allReferenceStore = useAllReferenceStore();
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const route = useRoute();
 const router = useRouter();
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    currentGrantInfo: computed(() => userStore.state.currentGrantInfo),
+    currentGrantInfo: computed(() => authorizationStore.state.currentGrantInfo),
     providers: computed<ProviderReferenceMap>(() => allReferenceStore.getters.provider),
 });
 const state = reactive({
diff --git a/apps/web/src/services/asset-inventory/components/CollectorMainContents.vue b/apps/web/src/services/asset-inventory/components/CollectorMainContents.vue
index 00b801433a..aae4c0ddd6 100644
--- a/apps/web/src/services/asset-inventory/components/CollectorMainContents.vue
+++ b/apps/web/src/services/asset-inventory/components/CollectorMainContents.vue
@@ -21,11 +21,11 @@ import type { ToolboxOptions } from '@cloudforet/mirinae/types/controls/toolbox/
 
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { PluginReferenceMap } from '@/store/reference/plugin-reference-store';
 import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { FILE_NAME_PREFIX } from '@/lib/excel-export/constant';
 import { downloadExcel } from '@/lib/helper/file-download-helper';
 import type { ExcelDataField } from '@/lib/helper/file-download-helper/type';
@@ -46,7 +46,6 @@ import { useCollectorPageStore } from '@/services/asset-inventory/stores/collect
 import type { CollectorItemInfo } from '@/services/asset-inventory/types/collector-main-page-type';
 import { COST_EXPLORER_ROUTE } from '@/services/cost-explorer/routes/route-constant';
 
-
 /** * @function
  *   @name makePluginReferenceValueHandler
  *   @param distinct
@@ -82,6 +81,7 @@ const collectorPageStore = useCollectorPageStore();
 const collectorPageState = collectorPageStore.state;
 const allReferenceStore = useAllReferenceStore();
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const appContextStore = useAppContextStore();
 const router = useRouter();
 const route = useRoute();
@@ -90,7 +90,6 @@ const storeState = reactive({
     isAdminMode: computed<boolean>(() => appContextStore.getters.isAdminMode),
     plugins: computed<PluginReferenceMap>(() => allReferenceStore.getters.plugin),
     timezone: computed<string>(() => userStore.state.timezone ?? 'UTC'),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 
 const keyItemSets: KeyItemSet[] = [{
@@ -137,7 +136,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
     searchTags: computed(() => {
         const tags = searchQueryHelper.setFilters(collectorPageState.searchFilters).queryTags;
         return tags.reduce((r: QueryItem[], d: any): QueryItem[] => {
diff --git a/apps/web/src/services/asset-inventory/components/MetricExplorerHeader.vue b/apps/web/src/services/asset-inventory/components/MetricExplorerHeader.vue
index 18dca0dd3f..b6381c4878 100644
--- a/apps/web/src/services/asset-inventory/components/MetricExplorerHeader.vue
+++ b/apps/web/src/services/asset-inventory/components/MetricExplorerHeader.vue
@@ -23,10 +23,9 @@ import type { MetricModel } from '@/schema/inventory/metric/model';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
@@ -53,7 +52,7 @@ const metricExplorerPageState = metricExplorerPageStore.state;
 const metricExplorerPageGetters = metricExplorerPageStore.getters;
 const allReferenceStore = useAllReferenceStore();
 const appContextStore = useAppContextStore();
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const router = useRouter();
 const route = useRoute();
@@ -62,7 +61,6 @@ const storeState = reactive({
     namespaces: computed(() => allReferenceStore.getters.namespace),
     currentMetric: computed(() => metricExplorerPageState.metric),
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 const state = reactive({
     selectedMenuId: computed(() => {
@@ -74,7 +72,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
     currentMetricId: computed<string>(() => route.params.metricId),
     isDuplicateEnabled: computed<boolean>(() => Object.values(storeState.namespaces).find((d) => d.key === storeState.currentMetric?.namespace_id)?.data.group !== 'common'),
     currentMetricExampleId: computed<string|undefined>(() => route.params.metricExampleId),
diff --git a/apps/web/src/services/asset-inventory/components/MetricExplorerLSBMetric.vue b/apps/web/src/services/asset-inventory/components/MetricExplorerLSBMetric.vue
index d94f478bf2..95c10a143b 100644
--- a/apps/web/src/services/asset-inventory/components/MetricExplorerLSBMetric.vue
+++ b/apps/web/src/services/asset-inventory/components/MetricExplorerLSBMetric.vue
@@ -12,15 +12,14 @@ import {
 import type { TreeDisplayMap, TreeNode } from '@cloudforet/mirinae/types/data-display/tree/tree-view/type';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type {
     CloudServiceTypeItem,
     CloudServiceTypeReferenceMap,
 } from '@/store/reference/cloud-service-type-reference-store';
 import type { MetricReferenceItem } from '@/store/reference/metric-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -46,7 +45,7 @@ const allReferenceStore = useAllReferenceStore();
 const appContextStore = useAppContextStore();
 const metricExplorerPageStore = useMetricExplorerPageStore();
 const metricExplorerPageState = metricExplorerPageStore.state;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const route = useRoute();
 
 const storeState = reactive({
@@ -60,7 +59,6 @@ const storeState = reactive({
         return res;
     }),
     selectedNamespace: computed<NamespaceSubItemType|undefined>(() => metricExplorerPageState.selectedNamespace),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 const state = reactive({
     selectedMenuId: computed(() => {
@@ -72,7 +70,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
     selectedId: computed<string|undefined>(() => {
         const routeName = { name: storeState.isAdminMode ? ADMIN_ASSET_INVENTORY_ROUTE.METRIC_EXPLORER.DETAIL._NAME : ASSET_INVENTORY_ROUTE.METRIC_EXPLORER.DETAIL._NAME }.name;
         if (!props.isDetailPage) return undefined;
diff --git a/apps/web/src/services/asset-inventory/pages/CloudServicePage.vue b/apps/web/src/services/asset-inventory/pages/CloudServicePage.vue
index 45ff1fdc53..18b0e32d58 100644
--- a/apps/web/src/services/asset-inventory/pages/CloudServicePage.vue
+++ b/apps/web/src/services/asset-inventory/pages/CloudServicePage.vue
@@ -23,14 +23,13 @@ import { SpaceRouter } from '@/router';
 import type { CloudServiceAnalyzeParameters } from '@/schema/inventory/cloud-service/api-verbs/analyze';
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CollectorReferenceMap } from '@/store/reference/collector-reference-store';
 import type { ProjectGroupReferenceMap } from '@/store/reference/project-group-reference-store';
 import type { ProviderReferenceMap } from '@/store/reference/provider-reference-store';
 import type { ServiceAccountReferenceMap } from '@/store/reference/service-account-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { MENU_ID } from '@/lib/menu/config';
 import {
     arrayToQueryString,
@@ -69,7 +68,7 @@ const allReferenceStore = useAllReferenceStore();
 const cloudServicePageStore = useCloudServicePageStore();
 const cloudServicePageState = cloudServicePageStore.$state;
 const cloudServiceLSBStore = useCloudServiceLSBStore();
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const storeState = reactive({
     projects: computed(() => allReferenceStore.getters.project),
@@ -77,7 +76,6 @@ const storeState = reactive({
     serviceAccounts: computed<ServiceAccountReferenceMap>(() => allReferenceStore.getters.serviceAccount),
     providers: computed<ProviderReferenceMap>(() => allReferenceStore.getters.provider),
     collectors: computed<CollectorReferenceMap>(() => allReferenceStore.getters.collector),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 const handlerState = reactive({
     keyItemSets: computed<KeyItemSet[]>(() => [{
@@ -150,8 +148,8 @@ const state = reactive({
         }
         return result;
     }),
-    writableServiceAccount: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT].write),
-    writableCollector: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[MENU_ID.COLLECTOR].write),
+    writableServiceAccount: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT]?.write),
+    writableCollector: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[MENU_ID.COLLECTOR]?.write),
 });
 
 /* api */
diff --git a/apps/web/src/services/asset-inventory/pages/CollectorDetailPage.vue b/apps/web/src/services/asset-inventory/pages/CollectorDetailPage.vue
index fa73b5e487..c4db18f4ee 100644
--- a/apps/web/src/services/asset-inventory/pages/CollectorDetailPage.vue
+++ b/apps/web/src/services/asset-inventory/pages/CollectorDetailPage.vue
@@ -41,9 +41,9 @@ import type { CollectorGetParameters } from '@/schema/inventory/collector/api-ve
 import type { CollectorModel } from '@/schema/inventory/collector/model';
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
@@ -87,6 +87,7 @@ const collectorJobState = collectorJobStore.$state;
 const collectorDataModalStore = useCollectorDataModalStore();
 const collectorDetailPageStore = useCollectorDetailPageStore();
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const route = useRoute();
 
@@ -100,9 +101,6 @@ watch(() => collectorFormState.originCollector, async (collector) => {
 
 const queryHelper = new QueryHelper();
 
-const storeState = reactive({
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
-});
 const state = reactive({
     selectedMenuId: computed(() => {
         const reversedMatched = clone(route.matched).reverse();
@@ -113,7 +111,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
     isNotiVisible: computed(() => !collectorDetailPageStore.getters.isEditableCollector),
     isDomainAdmin: computed(() => userStore.getters.isDomainAdmin),
     loading: true,
diff --git a/apps/web/src/services/asset-inventory/pages/SecurityPage.vue b/apps/web/src/services/asset-inventory/pages/SecurityPage.vue
index 4157969357..e44048c72e 100644
--- a/apps/web/src/services/asset-inventory/pages/SecurityPage.vue
+++ b/apps/web/src/services/asset-inventory/pages/SecurityPage.vue
@@ -10,12 +10,11 @@ import {
 
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CollectorReferenceMap } from '@/store/reference/collector-reference-store';
 import type { ServiceAccountReferenceMap } from '@/store/reference/service-account-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { MENU_ID } from '@/lib/menu/config';
 
 import { useGrantScopeGuard } from '@/common/composables/grant-scope-guard';
@@ -31,7 +30,7 @@ import { SERVICE_ACCOUNT_ROUTE } from '@/services/service-account/routes/route-c
 const allReferenceStore = useAllReferenceStore();
 const securityPageStore = useSecurityPageStore();
 const securityPageGetters = securityPageStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const route = useRoute();
 
@@ -41,7 +40,6 @@ const storeState = reactive({
     selectedCloudServiceType: computed(() => securityPageGetters.selectedCloudServiceType),
     serviceAccounts: computed<ServiceAccountReferenceMap>(() => allReferenceStore.getters.serviceAccount),
     collectors: computed<CollectorReferenceMap>(() => allReferenceStore.getters.collector),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 const state = reactive({
     pageParams: computed<CloudServiceDetailPageParams|undefined>(() => route.params as unknown as CloudServiceDetailPageParams),
@@ -70,8 +68,8 @@ const state = reactive({
         }
         return result;
     }),
-    writableServiceAccount: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT].write),
-    writableCollector: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[MENU_ID.COLLECTOR].write),
+    writableServiceAccount: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT]?.write),
+    writableCollector: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[MENU_ID.COLLECTOR]?.write),
 });
 
 const initData = async () => {
diff --git a/apps/web/src/services/asset-inventory/pages/admin/AdminCollectorDetailPage.vue b/apps/web/src/services/asset-inventory/pages/admin/AdminCollectorDetailPage.vue
index a0a6ab872a..cb51702a9e 100644
--- a/apps/web/src/services/asset-inventory/pages/admin/AdminCollectorDetailPage.vue
+++ b/apps/web/src/services/asset-inventory/pages/admin/AdminCollectorDetailPage.vue
@@ -121,9 +121,9 @@ import type { CollectorGetParameters } from '@/schema/inventory/collector/api-ve
 import type { CollectorModel } from '@/schema/inventory/collector/model';
 import { i18n } from '@/translations';
 
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
+
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
@@ -168,7 +168,7 @@ const collectorJobState = collectorJobStore.$state;
 const collectorDataModalStore = useCollectorDataModalStore();
 const collectorDetailPageStore = useCollectorDetailPageStore();
 
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const route = useRoute();
 
@@ -182,9 +182,6 @@ watch(() => collectorFormState.originCollector, async (collector) => {
 
 const queryHelper = new QueryHelper();
 
-const storeState = reactive({
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
-});
 const state = reactive({
     selectedMenuId: computed(() => {
         const reversedMatched = clone(route.matched).reverse();
@@ -195,7 +192,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
     isNotiVisible: computed(() => !collectorDetailPageStore.getters.isEditableCollector),
     loading: true,
     collector: computed<CollectorModel|null>(() => collectorFormState.originCollector),
diff --git a/apps/web/src/services/asset-inventory/routes/routes.ts b/apps/web/src/services/asset-inventory/routes/routes.ts
index 1c973617fb..d963f1c9ce 100644
--- a/apps/web/src/services/asset-inventory/routes/routes.ts
+++ b/apps/web/src/services/asset-inventory/routes/routes.ts
@@ -2,9 +2,6 @@ import type { RouteConfig } from 'vue-router';
 
 import { upperCase } from 'lodash';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -34,7 +31,6 @@ const CollectJobPage = () => import('@/services/asset-inventory/pages/CollectHis
 const CollectorDetailPage = () => import('@/services/asset-inventory/pages/CollectorDetailPage.vue');
 
 
-const userStore = useUserStore(pinia);
 const assetInventoryRoute: RouteConfig = {
     path: 'asset-inventory',
     name: ASSET_INVENTORY_ROUTE._NAME,
@@ -42,7 +38,7 @@ const assetInventoryRoute: RouteConfig = {
         menuId: MENU_ID.ASSET_INVENTORY,
         translationId: MENU_INFO_MAP[MENU_ID.ASSET_INVENTORY].translationId,
     },
-    redirect: (to) => getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap),
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: AssetInventoryContainer,
     children: [
         {
diff --git a/apps/web/src/services/auth/authenticator/index.ts b/apps/web/src/services/auth/authenticator/index.ts
index 321277a92f..4917181454 100644
--- a/apps/web/src/services/auth/authenticator/index.ts
+++ b/apps/web/src/services/auth/authenticator/index.ts
@@ -4,6 +4,7 @@ import type { AuthType } from '@/api-clients/identity/user/schema/type';
 import { SpaceRouter } from '@/router';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useDisplayStore } from '@/store/display/display-store';
 import { useDomainStore } from '@/store/domain/domain-store';
 import { useErrorStore } from '@/store/error/error-store';
@@ -17,13 +18,15 @@ abstract class Authenticator {
         const errorStore = useErrorStore();
         const domainStore = useDomainStore();
         const userStore = useUserStore();
+        const authorizationStore = useAuthorizationStore();
         const displayStore = useDisplayStore(pinia);
-        await userStore.signIn({
+        await authorizationStore.signIn({
             domainId: domainStore.state.domainId,
             credentials,
             authType,
             verify_code: verifyCode,
         });
+        await userStore.getUserInfo();
         await userWorkspaceStore.load();
         displayStore.setIsSignInFailed(false);
         errorStore.reset();
@@ -31,11 +34,11 @@ abstract class Authenticator {
 
     static async signOut(): Promise<void> {
         const errorStore = useErrorStore();
-        const userStore = useUserStore();
+        const authorizationStore = useAuthorizationStore();
         const displayStore = useDisplayStore(pinia);
         try {
             if (SpaceRouter.router) {
-                userStore.signOut();
+                authorizationStore.signOut();
                 const userWorkspaceStore = useUserWorkspaceStore();
                 userWorkspaceStore.reset();
                 displayStore.setIsSignInFailed(false);
diff --git a/apps/web/src/services/cost-explorer/components/BudgetDetailHeading.vue b/apps/web/src/services/cost-explorer/components/BudgetDetailHeading.vue
index 0b7226e2ac..b86e7e3583 100644
--- a/apps/web/src/services/cost-explorer/components/BudgetDetailHeading.vue
+++ b/apps/web/src/services/cost-explorer/components/BudgetDetailHeading.vue
@@ -11,9 +11,9 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
 import { usePageEditableStatus } from '@/common/composables/page-editable-status';
 
@@ -34,15 +34,14 @@ const appContextStore = useAppContextStore();
 const budgetPageStore = useBudgetDetailPageStore();
 const budgetPageState = budgetPageStore.$state;
 const allReferenceStore = useAllReferenceStore();
-const userStore = useUserStore();
-
+const authorizationStore = useAuthorizationStore();
 const { hasReadWriteAccess } = usePageEditableStatus();
 
 const router = useRouter();
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
     dataSourceMap: computed<CostDataSourceReferenceMap>(() => allReferenceStore.getters.costDataSource),
 });
 const state = reactive({
diff --git a/apps/web/src/services/cost-explorer/pages/BudgetDetailPage.vue b/apps/web/src/services/cost-explorer/pages/BudgetDetailPage.vue
index f6bf045071..0fa7482ad0 100644
--- a/apps/web/src/services/cost-explorer/pages/BudgetDetailPage.vue
+++ b/apps/web/src/services/cost-explorer/pages/BudgetDetailPage.vue
@@ -7,9 +7,10 @@ import { PLink, PScopedNotification } from '@cloudforet/mirinae';
 import type { BudgetModel } from '@/api-clients/cost-analysis/budget/schema/model';
 import { i18n } from '@/translations';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
 import { useUserStore } from '@/store/user/user-store';
 
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
+
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
 import BudgetDetailBaseInformation from '@/services/cost-explorer/components/BudgetDetailBaseInformation.vue';
@@ -27,13 +28,14 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 const userStore = useUserStore();
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
+
 const budgetPageStore = useBudgetDetailPageStore();
 const budgetPageState = budgetPageStore.$state;
 const state = reactive({
     loading: true,
     budgetData: computed<BudgetModel|null>(() => budgetPageState.budgetData),
-    visibleBudgetNotification: computed<boolean>(() => globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleBudgetNotification ?? false),
+    visibleBudgetNotification: computed<boolean>(() => alertManagerUiAffectsSchema.value?.visibleBudgetNotification ?? false),
     isWorkspaceTarget: computed<boolean>(() => (state.budgetData?.resource_group === 'WORKSPACE')),
     adminModeLink: computed<Location>(() => ({
         name: ADMIN_COST_EXPLORER_ROUTE.BUDGET.DETAIL._NAME,
diff --git a/apps/web/src/services/cost-explorer/pages/BudgetMainPage.vue b/apps/web/src/services/cost-explorer/pages/BudgetMainPage.vue
index d88d7a97b8..eec8a1d4d6 100644
--- a/apps/web/src/services/cost-explorer/pages/BudgetMainPage.vue
+++ b/apps/web/src/services/cost-explorer/pages/BudgetMainPage.vue
@@ -8,7 +8,7 @@ import {
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { SpaceRouter } from '@/router';
 
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { usePageEditableStatus } from '@/common/composables/page-editable-status';
 
@@ -16,12 +16,12 @@ import BudgetListPeriodCustomModal from '@/services/cost-explorer/components/Bud
 import BudgetMainList from '@/services/cost-explorer/components/BudgetMainList.vue';
 import { COST_EXPLORER_ROUTE } from '@/services/cost-explorer/routes/route-constant';
 
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const { hasReadWriteAccess } = usePageEditableStatus();
 
 const storeState = reactive({
-    isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
 });
 
 const state = reactive({
diff --git a/apps/web/src/services/cost-explorer/routes/routes.ts b/apps/web/src/services/cost-explorer/routes/routes.ts
index 89d6a1545a..01b1bb5a5e 100644
--- a/apps/web/src/services/cost-explorer/routes/routes.ts
+++ b/apps/web/src/services/cost-explorer/routes/routes.ts
@@ -2,9 +2,6 @@ import type { RouteConfig } from 'vue-router';
 
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -31,10 +28,7 @@ const costExplorerRoutes: RouteConfig = {
         menuId: MENU_ID.COST_EXPLORER,
         translationId: MENU_INFO_MAP[MENU_ID.COST_EXPLORER].translationId,
     },
-    redirect: (to) => {
-        const userStore = useUserStore(pinia);
-        return getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap);
-    },
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: CostExplorerContainer,
     children: [
         {
diff --git a/apps/web/src/services/dashboards/DashboardsLSB.vue b/apps/web/src/services/dashboards/DashboardsLSB.vue
index 5fa2365968..7f2ac62643 100644
--- a/apps/web/src/services/dashboards/DashboardsLSB.vue
+++ b/apps/web/src/services/dashboards/DashboardsLSB.vue
@@ -14,7 +14,7 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -40,7 +40,7 @@ import { DASHBOARDS_ROUTE } from '@/services/dashboards/routes/route-constant';
 const appContextStore = useAppContextStore();
 const favoriteStore = useFavoriteStore();
 const favoriteGetters = favoriteStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const { hasReadWriteAccess } = usePageEditableStatus();
 
@@ -58,7 +58,7 @@ const {
 } = useDashboardFolderQuery();
 
 const storeState = reactive({
-    isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
     favoriteItems: computed(() => favoriteGetters.dashboardItems),
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
 });
diff --git a/apps/web/src/services/dashboards/components/dashboard-detail/DashboardCloneModal.vue b/apps/web/src/services/dashboards/components/dashboard-detail/DashboardCloneModal.vue
index 481d787e72..c22b70bcef 100644
--- a/apps/web/src/services/dashboards/components/dashboard-detail/DashboardCloneModal.vue
+++ b/apps/web/src/services/dashboards/components/dashboard-detail/DashboardCloneModal.vue
@@ -16,7 +16,7 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { showErrorMessage } from '@/lib/helper/notice-alert-helper';
 
@@ -29,7 +29,6 @@ import { ADMIN_DASHBOARDS_ROUTE } from '@/services/dashboards/routes/admin/route
 import { DASHBOARDS_ROUTE } from '@/services/dashboards/routes/route-constant';
 
 
-
 interface Props {
     visible: boolean;
     dashboardId: string;
@@ -51,7 +50,8 @@ const queryClient = useQueryClient();
 
 const router = useRouter();
 const appContextStore = useAppContextStore();
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
+
 const {
     forms: {
         name,
@@ -74,8 +74,8 @@ const {
 });
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    isWorkspaceOwner: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
-    isWorkspaceMember: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceOwner: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceMember: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 });
 const state = reactive({
     proxyVisible: useProxyValue('visible', props, emit),
diff --git a/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderFormModal.vue b/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderFormModal.vue
index 18b939028b..fb690b8048 100644
--- a/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderFormModal.vue
+++ b/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderFormModal.vue
@@ -19,6 +19,7 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useUserStore } from '@/store/user/user-store';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -31,7 +32,6 @@ import { useDashboardFolderQuery } from '@/services/dashboards/composables/use-d
 import { useDashboardPageControlStore } from '@/services/dashboards/stores/dashboard-page-control-store';
 import { useDashboardTreeControlStore } from '@/services/dashboards/stores/dashboard-tree-control-store';
 
-
 interface Props {
     visible: boolean;
     folderId?: string;
@@ -44,7 +44,9 @@ const emit = defineEmits<{(e: 'update:visible', visible: boolean): void;
 }>();
 
 const appContextStore = useAppContextStore();
+const authorizationStore = useAuthorizationStore();
 const userStore = useUserStore();
+
 const dashboardPageControlStore = useDashboardPageControlStore();
 const dashboardPageControlState = dashboardPageControlStore.state;
 const dashboardTreeControlStore = useDashboardTreeControlStore();
@@ -62,7 +64,7 @@ const {
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    isWorkspaceMember: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 });
 const state = reactive({
     proxyVisible: useProxyValue<boolean>('visible', props, emit),
diff --git a/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderTreeItem.vue b/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderTreeItem.vue
index 7b8bf7ff5d..48de417d25 100644
--- a/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderTreeItem.vue
+++ b/apps/web/src/services/dashboards/components/dashboard-folder/DashboardFolderTreeItem.vue
@@ -16,7 +16,7 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import NewMark from '@/common/components/marks/NewMark.vue';
 import FavoriteButton from '@/common/modules/favorites/favorite-button/FavoriteButton.vue';
@@ -51,7 +51,7 @@ const LABELS_LIMIT = 2;
 const appContextStore = useAppContextStore();
 const dashboardTreeControlStore = useDashboardTreeControlStore();
 const dashboardTreeControlState = dashboardTreeControlStore.state;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const { getDashboardManageable, getFolderManageable } = useDashboardManageable();
 const { getControlDashboardMenuItems, getControlFolderMenuItems } = useDashboardControlMenuHelper();
@@ -59,7 +59,7 @@ const { getControlDashboardMenuItems, getControlFolderMenuItems } = useDashboard
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
 });
 const state = reactive({
     slicedLabels: computed(() => props.treeData.data?.labels?.slice(0, LABELS_LIMIT) || []),
diff --git a/apps/web/src/services/dashboards/components/dashboard-main/DashboardBundleCloneModal.vue b/apps/web/src/services/dashboards/components/dashboard-main/DashboardBundleCloneModal.vue
index 057d8f4a81..722f13a81c 100644
--- a/apps/web/src/services/dashboards/components/dashboard-main/DashboardBundleCloneModal.vue
+++ b/apps/web/src/services/dashboards/components/dashboard-main/DashboardBundleCloneModal.vue
@@ -30,6 +30,7 @@ import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
 import { useUserStore } from '@/store/user/user-store';
@@ -89,6 +90,7 @@ const dashboardPageControlState = dashboardPageControlStore.state;
 const dashboardTreeControlStore = useDashboardTreeControlStore();
 const dashboardTreeControlState = dashboardTreeControlStore.state;
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const allReferenceStore = useAllReferenceStore();
 const { privateWidgetAPI } = usePrivateWidgetApi();
 const { publicWidgetAPI } = usePublicWidgetApi();
@@ -109,7 +111,7 @@ const queryClient = useQueryClient();
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    isWorkspaceMember: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
     costDataSource: computed<CostDataSourceReferenceMap>(() => allReferenceStore.getters.costDataSource),
     userId: computed<string|undefined>(() => userStore.state.userId),
 });
diff --git a/apps/web/src/services/dashboards/components/dashboard-main/DashboardLSBTree.vue b/apps/web/src/services/dashboards/components/dashboard-main/DashboardLSBTree.vue
index 705a089852..72a751db81 100644
--- a/apps/web/src/services/dashboards/components/dashboard-main/DashboardLSBTree.vue
+++ b/apps/web/src/services/dashboards/components/dashboard-main/DashboardLSBTree.vue
@@ -15,7 +15,7 @@ import type { PublicFolderModel } from '@/api-clients/dashboard/public-folder/sc
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import FavoriteButton from '@/common/modules/favorites/favorite-button/FavoriteButton.vue';
 import { FAVORITE_TYPE } from '@/common/modules/favorites/favorite-button/type';
@@ -43,11 +43,11 @@ const route = useRoute();
 const router = useRouter();
 const dashboardPageControlStore = useDashboardPageControlStore();
 const appContextStore = useAppContextStore();
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
 });
 
 const { getControlDashboardMenuItems, getControlFolderMenuItems } = useDashboardControlMenuHelper();
diff --git a/apps/web/src/services/dashboards/composables/use-dashboard-search-query.ts b/apps/web/src/services/dashboards/composables/use-dashboard-search-query.ts
index 237b0b8741..20ed7414cd 100644
--- a/apps/web/src/services/dashboards/composables/use-dashboard-search-query.ts
+++ b/apps/web/src/services/dashboards/composables/use-dashboard-search-query.ts
@@ -19,7 +19,7 @@ import { useScopedQuery } from '@/query/composables/use-scoped-query';
 import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 
 const DEFAULT_LIST_DATA = { results: [] };
@@ -35,12 +35,12 @@ export const useDashboardSearchQuery = ({ searchFilters }: UseDashboardSearchQue
     const { privateDashboardAPI } = usePrivateDashboardApi();
 
     const appContextStore = useAppContextStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const searchApiQueryHelper = new ApiQueryHelper();
 
     const _state = reactive({
         isAdminMode: computed<boolean>(() => appContextStore.getters.isAdminMode),
-        isWorkspaceOwner: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+        isWorkspaceOwner: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
     });
     const searchQuery = ref<Query>({});
 
diff --git a/apps/web/src/services/dashboards/helpers/dashboard-tree-data-helper.ts b/apps/web/src/services/dashboards/helpers/dashboard-tree-data-helper.ts
index 3251665228..12a4a267a8 100644
--- a/apps/web/src/services/dashboards/helpers/dashboard-tree-data-helper.ts
+++ b/apps/web/src/services/dashboards/helpers/dashboard-tree-data-helper.ts
@@ -1,9 +1,9 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
 import type { TreeNode } from '@cloudforet/mirinae/types/data-display/tree/tree-view/type';
 
 import type { DashboardModel } from '@/api-clients/dashboard/_types/dashboard-type';
 import type { FolderModel } from '@/api-clients/dashboard/_types/folder-type';
+import type { PublicDashboardModel } from '@/api-clients/dashboard/public-dashboard/schema/model';
+import type { PublicFolderModel } from '@/api-clients/dashboard/public-folder/schema/model';
 
 import type { DashboardTreeDataType, DashboardDataTableItem } from '@/services/dashboards/types/dashboard-folder-type';
 
@@ -22,7 +22,6 @@ export const getDashboardTreeData = (
             depth: 0,
             data: {
                 id: folder.folder_id,
-                name: folder.name,
                 type: 'FOLDER',
                 createdBy: folder.tags?.created_by,
                 isNew: newIdList?.includes(folder.folder_id),
@@ -40,7 +39,6 @@ export const getDashboardTreeData = (
             depth: 0,
             data: {
                 id: dashboard.dashboard_id,
-                name: dashboard.name,
                 type: 'DASHBOARD',
                 createdBy: dashboard.tags?.created_by,
                 isNew: newIdList?.includes(dashboard.dashboard_id),
@@ -52,7 +50,11 @@ export const getDashboardTreeData = (
 
         if (folderNode) {
             dashboardNode.depth = 1;
-            folderNode.children.push(dashboardNode);
+            if (Array.isArray(folderNode.children)) {
+                folderNode.children.push(dashboardNode);
+            } else {
+                folderNode.children = [dashboardNode];
+            }
         } else {
             rootNodes.push(dashboardNode);
         }
@@ -116,13 +118,13 @@ export const isPublicControlButtonDisabled = (dashboardItems: DashboardModel[],
         if (result) return;
         const _isFolder = id.includes('folder');
         if (_isFolder) {
-            const _folder = folderItems.find((f) => f.folder_id === id);
+            const _folder = folderItems.find((f) => f.folder_id === id) as PublicFolderModel;
             if (isProject) result = !!_folder?.shared;
             else if (_folder?.shared && _folder?.scope === 'WORKSPACE') {
                 result = true;
             }
         } else {
-            const _dashboard = dashboardItems.find((d) => d.dashboard_id === id);
+            const _dashboard = dashboardItems.find((d) => d.dashboard_id === id) as PublicDashboardModel;
             if (isProject) result = !!_dashboard?.shared;
             else if (_dashboard?.shared && _dashboard?.scope === 'WORKSPACE') {
                 result = true;
diff --git a/apps/web/src/services/dashboards/pages/DashboardsMainPage.vue b/apps/web/src/services/dashboards/pages/DashboardsMainPage.vue
index c68fe179c7..aa6cd16b74 100644
--- a/apps/web/src/services/dashboards/pages/DashboardsMainPage.vue
+++ b/apps/web/src/services/dashboards/pages/DashboardsMainPage.vue
@@ -23,7 +23,7 @@ import { SpaceRouter } from '@/router';
 
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { replaceUrlQuery } from '@/lib/router-query-string';
 
@@ -53,7 +53,7 @@ const appContextStore = useAppContextStore();
 const dashboardPageControlStore = useDashboardPageControlStore();
 const dashboardTreeControlStore = useDashboardTreeControlStore();
 const dashboardTreeControlState = dashboardTreeControlStore.state;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const { hasReadWriteAccess } = usePageEditableStatus();
 
@@ -80,8 +80,8 @@ const {
 } = useDashboardFolderQuery();
 
 const storeState = reactive({
-    isWorkspaceOwner: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
-    isWorkspaceMember: computed<boolean>(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceOwner: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+    isWorkspaceMember: computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
     isAdminMode: computed<boolean>(() => appContextStore.getters.isAdminMode),
 });
 
diff --git a/apps/web/src/services/iam/components/RoleManagementTabDetail.vue b/apps/web/src/services/iam/components/RoleManagementTabDetail.vue
index bdd99536f2..5fbcf76082 100644
--- a/apps/web/src/services/iam/components/RoleManagementTabDetail.vue
+++ b/apps/web/src/services/iam/components/RoleManagementTabDetail.vue
@@ -16,7 +16,7 @@ import type { RoleGetParameters } from '@/api-clients/identity/role/schema/api-v
 import type { RoleModel } from '@/api-clients/identity/role/schema/model';
 import { i18n } from '@/translations';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
+import { useMenuStore } from '@/store/menu/menu-store';
 
 import { PAGE_ACCESS } from '@/lib/access-control/config';
 import {
@@ -41,7 +41,7 @@ interface DetailMenuItems {
 
 const rolePageStore = useRolePageStore();
 const rolePageState = rolePageStore.$state;
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const menuStore = useMenuStore();
 
 const detailMenuItems = computed<DetailMenuItems[]>(() => [
     { name: 'page_access', label: i18n.t('IAM.ROLE.DETAIL.PAGE_ACCESS') as string },
@@ -145,7 +145,7 @@ watch(() => state.selectedRole.role_id, async (roleId) => {
     state.pageAccessDataList = getPageAccessMenuListByRoleType(state.data.role_type);
 
     const pageAccessPermissionMap = getPageAccessMapFromRawData({
-        pageAccessPermissions: state.pageAccess, isRolePage: true, menuList: globalConfigSchemaStore.getters.menuList,
+        pageAccessPermissions: state.pageAccess, isRolePage: true, menuList: menuStore.getters.menuList,
     });
 
     Object.entries(pageAccessPermissionMap).forEach(([itemId, accessible]) => {
diff --git a/apps/web/src/services/iam/components/RoleUpdateFormPermissionForm.vue b/apps/web/src/services/iam/components/RoleUpdateFormPermissionForm.vue
index 6e04ef2805..9ccb16c144 100644
--- a/apps/web/src/services/iam/components/RoleUpdateFormPermissionForm.vue
+++ b/apps/web/src/services/iam/components/RoleUpdateFormPermissionForm.vue
@@ -10,7 +10,7 @@ import { PPaneLayout } from '@cloudforet/mirinae';
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import type { RoleType } from '@/api-clients/identity/role/type';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
+import { useMenuStore } from '@/store/menu/menu-store';
 
 import { PAGE_ACCESS } from '@/lib/access-control/config';
 import { getPageAccessMapFromRawData } from '@/lib/access-control/page-access-helper';
@@ -40,7 +40,7 @@ const props = withDefaults(defineProps<Props>(), {
     formType: FORM_TYPE.CREATE,
 });
 
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const menuStore = useMenuStore();
 
 const emit = defineEmits<{(e: 'update-form', formData: RoleFormData): void,
     (e: 'update:is-page-access-valid', value: boolean): void,
@@ -96,7 +96,7 @@ const handleUpdateEditor = (value: string) => {
 const setPageAccessPermissionsData = () => {
     if (!props.initialPageAccess) return;
     const pageAccessPermissionMap = getPageAccessMapFromRawData({
-        pageAccessPermissions: props.initialPageAccess, isRolePage: true, menuList: globalConfigSchemaStore.getters.menuList,
+        pageAccessPermissions: props.initialPageAccess, isRolePage: true, menuList: menuStore.getters.menuList,
     });
     // eslint-disable-next-line no-restricted-syntax
     for (const [itemId, accessible] of Object.entries(pageAccessPermissionMap)) {
diff --git a/apps/web/src/services/iam/components/UserGroupDeleteDoubleCheckModal.vue b/apps/web/src/services/iam/components/UserGroupDeleteDoubleCheckModal.vue
index 1f8cd13078..6eac5578a6 100644
--- a/apps/web/src/services/iam/components/UserGroupDeleteDoubleCheckModal.vue
+++ b/apps/web/src/services/iam/components/UserGroupDeleteDoubleCheckModal.vue
@@ -4,7 +4,9 @@ import {
 } from 'vue';
 
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
-import { PDataTable, PButtonModal, PBadge } from '@cloudforet/mirinae';
+import {
+    PDataTable, PButtonModal, PLink, PScopedNotification,
+} from '@cloudforet/mirinae';
 
 import type { UserGroupDeleteUserGroupParameters } from '@/api-clients/identity/user-group/schema/api-verbs/delete';
 import type { UserGroupModel } from '@/api-clients/identity/user-group/schema/model';
@@ -18,9 +20,16 @@ import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
+import { ALERT_MANAGER_ROUTE } from '@/services/alert-manager/v2/routes/route-constant';
 import { USER_GROUP_MODAL_TYPE } from '@/services/iam/constants/user-group-constant';
 import { useUserGroupPageStore } from '@/services/iam/store/user-group-page-store';
 
+type TableItemType = {
+    user_group: string;
+    service?: string[];
+    description?: string;
+};
+
 const emit = defineEmits<{(e: 'confirm'): void; }>();
 
 const userGroupPageStore = useUserGroupPageStore();
@@ -39,6 +48,7 @@ const storeState = reactive({
 
 const state = reactive({
     loading: false,
+    isVisibleScopedNotification: computed<boolean>(() => tableState.filteredItems.filter((item) => item.service && item.service.length > 0).length > 0),
 });
 
 const tableState = reactive({
@@ -47,7 +57,7 @@ const tableState = reactive({
         { name: 'service', label: 'Service' },
         { name: 'description', label: 'Description' },
     ],
-    filteredItems: [],
+    filteredItems: [] as TableItemType[],
 });
 
 /* Component */
@@ -74,6 +84,21 @@ const handleCancel = () => {
         themeColor: 'primary',
     };
 };
+const getServicePageLocation = (service: string) => ({
+    name: ALERT_MANAGER_ROUTE.SERVICE._NAME,
+    query: {
+        serviceName: service,
+    },
+});
+const getServiceNames = (): string => {
+    const uniqueServices = new Set<string>();
+
+    tableState.filteredItems.forEach((item) => {
+        item.service?.forEach((svc) => uniqueServices.add(svc));
+    });
+
+    return Array.from(uniqueServices).join(', ');
+};
 
 /* API */
 const fetchDeleteUserGroup = async (params: UserGroupDeleteUserGroupParameters) => {
@@ -142,36 +167,41 @@ watch([() => storeState.serviceList, () => storeState.selectedUserGroupList], ([
                     :loading="state.loading"
                     :visible="userGroupPageState.modal.type === USER_GROUP_MODAL_TYPE.DELETE"
                     :theme-color="userGroupPageState.modal.themeColor"
+                    :disabled="state.isVisibleScopedNotification"
                     @confirm="handleConfirm"
+                    @close="handleCancel"
                     @cancel="handleCancel"
     >
         <template #body>
-            <p-data-table :fields="tableState.fields"
-                          :items="tableState.filteredItems"
-            >
-                <template #col-service-format="{value}">
-                    <div v-if="value.length > 0">
-                        <span v-for="(service, i) in value"
-                              :key="i"
-                              class="mr-2"
+            <div class="flex flex-col gap-8">
+                <p-scoped-notification v-if="state.isVisibleScopedNotification"
+                                       type="danger"
+                                       layout="in-section"
+                >
+                    <span>{{ $t('IAM.USER_GROUP.MODAL.DELETE.SCOPED_NOTIFICATION_DESC', { name: getServiceNames()}) }} </span>
+                    <span class="font-bold">{{ $t('IAM.USER_GROUP.MODAL.DELETE.SCOPED_NOTIFICATION_DESC_BOLD', { name: getServiceNames()}) }}</span>
+                </p-scoped-notification>
+                <p-data-table :fields="tableState.fields"
+                              :items="tableState.filteredItems"
+                >
+                    <template #col-service-format="{value}">
+                        <div v-if="value.length > 0"
+                             class="flex flex-col"
                         >
-                            <p-badge v-if="i < 3"
-                                     badge-type="gray200"
-                                     shape="square"
+                            <p-link v-for="(service, i) in value"
+                                    :key="`${service}-${i}`"
+                                    highlight
+                                    action-icon="internal-link"
+                                    new-tab
+                                    :to="getServicePageLocation(service)"
                             >
                                 {{ service }}
-                            </p-badge>
-                            <p-badge v-else-if="i === 3"
-                                     badge-type="blue700"
-                                     shape="round"
-                            >
-                                {{ service.length - i }}
-                            </p-badge>
-                        </span>
-                    </div>
-                    <div v-else />
-                </template>
-            </p-data-table>
+                            </p-link>
+                        </div>
+                        <div v-else />
+                    </template>
+                </p-data-table>
+            </div>
         </template>
     </p-button-modal>
 </template>
diff --git a/apps/web/src/services/iam/constants/role-constant.ts b/apps/web/src/services/iam/constants/role-constant.ts
index fe7f75ccd0..ab279da733 100644
--- a/apps/web/src/services/iam/constants/role-constant.ts
+++ b/apps/web/src/services/iam/constants/role-constant.ts
@@ -3,7 +3,7 @@ import type { KeyItemSet } from '@cloudforet/mirinae/types/controls/search/query
 
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 
-import { FEATURES } from '@/lib/config/global-config/constants/constants';
+import { SERVICE_FEATURES } from '@/lib/config/global-config/constants/constants';
 import type { ExcelDataField } from '@/lib/helper/file-download-helper/type';
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -92,12 +92,12 @@ export const MANAGED_PAGE_ACCESS = [
 ] as const;
 
 export const DEFAULT_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[] = [
-    { id: MENU_ID.DASHBOARDS, key: FEATURES.DASHBOARDS },
-    { id: MENU_ID.SERVICE_ACCOUNT, key: FEATURES.SERVICE_ACCOUNT },
-    { id: MENU_ID.PROJECT, key: FEATURES.PROJECT },
+    { id: MENU_ID.DASHBOARDS, key: SERVICE_FEATURES.DASHBOARDS },
+    { id: MENU_ID.SERVICE_ACCOUNT, key: SERVICE_FEATURES.SERVICE_ACCOUNT },
+    { id: MENU_ID.PROJECT, key: SERVICE_FEATURES.PROJECT },
     {
         id: MENU_ID.ASSET_INVENTORY,
-        key: FEATURES.ASSET_INVENTORY,
+        key: SERVICE_FEATURES.ASSET_INVENTORY,
         subMenuList: [
             { id: MENU_ID.CLOUD_SERVICE },
             { id: MENU_ID.SERVER },
@@ -108,7 +108,7 @@ export const DEFAULT_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[] =
     },
     {
         id: MENU_ID.COST_EXPLORER,
-        key: FEATURES.COST_EXPLORER,
+        key: SERVICE_FEATURES.COST_EXPLORER,
         subMenuList: [
             { id: MENU_ID.COST_ANALYSIS },
             { id: MENU_ID.BUDGET },
@@ -117,7 +117,7 @@ export const DEFAULT_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[] =
     },
     {
         id: MENU_ID.OPS_FLOW,
-        key: FEATURES.OPS_FLOW,
+        key: SERVICE_FEATURES.OPS_FLOW,
         subMenuList: [
             { id: MENU_ID.OPS_FLOW_LANDING },
             { id: MENU_ID.TASK_BOARD },
@@ -127,7 +127,7 @@ export const DEFAULT_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[] =
 export const ALERT_V2_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[] = [
     {
         id: MENU_ID.ALERT_MANAGER,
-        key: FEATURES.ALERT_MANAGER,
+        key: SERVICE_FEATURES.ALERT_MANAGER,
         subMenuList: [
             { id: MENU_ID.SERVICE },
             { id: MENU_ID.ALERTS },
@@ -135,7 +135,7 @@ export const ALERT_V2_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[]
     },
     {
         id: MENU_ID.IAM,
-        key: FEATURES.IAM,
+        key: SERVICE_FEATURES.IAM,
         subMenuList: [
             { id: MENU_ID.USER },
             { id: MENU_ID.USER_GROUP },
@@ -147,7 +147,7 @@ export const ALERT_V2_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[]
 export const ALERT_V1_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[] = [
     {
         id: MENU_ID.ALERT_MANAGER,
-        key: FEATURES.ALERT_MANAGER,
+        key: SERVICE_FEATURES.ALERT_MANAGER,
         subMenuList: [
             { id: MENU_ID.ALERT_MANAGER_DASHBOARD },
             { id: MENU_ID.ALERTS },
@@ -156,7 +156,7 @@ export const ALERT_V1_WORKSPACE_PAGE_ACCESS_MENU_LIST: PageAccessMenuByConfig[]
     },
     {
         id: MENU_ID.IAM,
-        key: FEATURES.IAM,
+        key: SERVICE_FEATURES.IAM,
         subMenuList: [
             { id: MENU_ID.USER },
             { id: MENU_ID.APP },
diff --git a/apps/web/src/services/iam/pages/UserMainPage.vue b/apps/web/src/services/iam/pages/UserMainPage.vue
index a1dcd64288..4d0b978897 100644
--- a/apps/web/src/services/iam/pages/UserMainPage.vue
+++ b/apps/web/src/services/iam/pages/UserMainPage.vue
@@ -7,7 +7,7 @@ import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
 import { PHorizontalLayout } from '@cloudforet/mirinae';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { useGrantScopeGuard } from '@/common/composables/grant-scope-guard';
 import { usePageEditableStatus } from '@/common/composables/page-editable-status';
@@ -28,14 +28,14 @@ import { useUserPageStore } from '@/services/iam/store/user-page-store';
 const appContextStore = useAppContextStore();
 const userPageStore = useUserPageStore();
 const userPageState = userPageStore.state;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const { hasReadWriteAccess } = usePageEditableStatus();
 
 const storeState = reactive({
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
     globalGrantLoading: computed(() => appContextStore.getters.globalGrantLoading),
-    grantInfo: computed(() => userStore.state.currentGrantInfo),
+    grantInfo: computed(() => authorizationStore.state.currentGrantInfo),
 });
 
 const userListApiQueryHelper = new ApiQueryHelper()
diff --git a/apps/web/src/services/iam/routes/routes.ts b/apps/web/src/services/iam/routes/routes.ts
index 3217d92cb9..dafc64fb34 100644
--- a/apps/web/src/services/iam/routes/routes.ts
+++ b/apps/web/src/services/iam/routes/routes.ts
@@ -1,8 +1,5 @@
 import type { RouteConfig } from 'vue-router';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -62,10 +59,7 @@ const iamRoutes: RouteConfig = {
         menuId: MENU_ID.IAM,
         translationId: MENU_INFO_MAP[MENU_ID.IAM].translationId,
     },
-    redirect: (to) => {
-        const userStore = useUserStore(pinia);
-        return getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap);
-    },
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: IamContainer,
     children: iamRoutesChildren,
 };
diff --git a/apps/web/src/services/iam/store/user-page-store.ts b/apps/web/src/services/iam/store/user-page-store.ts
index eaf2add9a6..75eed15da5 100644
--- a/apps/web/src/services/iam/store/user-page-store.ts
+++ b/apps/web/src/services/iam/store/user-page-store.ts
@@ -22,14 +22,14 @@ import type { WorkspaceUserGetParameters } from '@/api-clients/identity/workspac
 import type { WorkspaceUserListParameters } from '@/api-clients/identity/workspace-user/schema/api-verbs/list';
 import type { WorkspaceUserModel, SummaryWorkspaceUserModel } from '@/api-clients/identity/workspace-user/schema/model';
 
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
 import type { UserListItemType, ModalSettingState, ModalState } from '@/services/iam/types/user-type';
 
 export const useUserPageStore = defineStore('page-user', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const state = reactive({
         isAdminMode: false,
@@ -53,7 +53,7 @@ export const useUserPageStore = defineStore('page-user', () => {
         } as ModalState,
     });
     const getters = reactive({
-        isWorkspaceOwner: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
+        isWorkspaceOwner: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
         selectedUsers: computed(():UserListItemType[] => {
             if (state.selectedIndices.length === 1 && !isEmpty(state.selectedUser)) return [state.selectedUser];
             const users: UserListItemType[] = [];
diff --git a/apps/web/src/services/info/components/NoticeDetail.vue b/apps/web/src/services/info/components/NoticeDetail.vue
index 1b478cc026..a5e9f3fb9d 100644
--- a/apps/web/src/services/info/components/NoticeDetail.vue
+++ b/apps/web/src/services/info/components/NoticeDetail.vue
@@ -20,7 +20,7 @@ import type { PostModel } from '@/schema/board/post/model';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useNoticeStore } from '@/store/notice';
+import { useNoticeStore } from '@/store/notice/notice-store';
 import { useUserStore } from '@/store/user/user-store';
 
 import TextEditorViewer from '@/common/components/editor/TextEditorViewer.vue';
diff --git a/apps/web/src/services/info/components/NoticeList.vue b/apps/web/src/services/info/components/NoticeList.vue
index c6c783c6a4..e0b96e7eb5 100644
--- a/apps/web/src/services/info/components/NoticeList.vue
+++ b/apps/web/src/services/info/components/NoticeList.vue
@@ -21,7 +21,7 @@ import type { PostModel } from '@/schema/board/post/model';
 import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useNoticeStore } from '@/store/notice';
+import { useNoticeStore } from '@/store/notice/notice-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
diff --git a/apps/web/src/services/info/routes/routes.ts b/apps/web/src/services/info/routes/routes.ts
index a7f67b9c21..8028016b9c 100644
--- a/apps/web/src/services/info/routes/routes.ts
+++ b/apps/web/src/services/info/routes/routes.ts
@@ -1,8 +1,5 @@
 import type { RouteConfig } from 'vue-router';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -22,10 +19,7 @@ const infoRoutes: RouteConfig = {
         menuId: MENU_ID.INFO,
         translationId: MENU_INFO_MAP[MENU_ID.INFO].translationId,
     },
-    redirect: (to) => {
-        const userStore = useUserStore(pinia);
-        return getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap);
-    },
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: InfoContainer,
     children: [
         {
diff --git a/apps/web/src/services/landing/components/DomainLandingStartBanner.vue b/apps/web/src/services/landing/components/DomainLandingStartBanner.vue
index fad60f0b05..435b4f806b 100644
--- a/apps/web/src/services/landing/components/DomainLandingStartBanner.vue
+++ b/apps/web/src/services/landing/components/DomainLandingStartBanner.vue
@@ -8,22 +8,16 @@ import { screens, PTextButton } from '@cloudforet/mirinae';
 import type { WorkspaceModel } from '@/api-clients/identity/workspace/schema/model';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useUserStore } from '@/store/user/user-store';
-
-import type { PageAccessMap } from '@/lib/access-control/config';
 
 import { LANDING_ROUTE } from '@/services/landing/routes/route-constant';
 
 const userWorkspaceStore = useUserWorkspaceStore();
 const userWorkspaceGetters = userWorkspaceStore.getters;
-const userStore = useUserStore();
-
 const router = useRouter();
 
 const { width } = useWindowSize();
 
 const storeState = reactive({
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
     workspaceList: computed<WorkspaceModel[]>(() => userWorkspaceGetters.workspaceList),
 });
 const state = reactive({
diff --git a/apps/web/src/services/my-page/components/NotificationAddForm.vue b/apps/web/src/services/my-page/components/NotificationAddForm.vue
index a55012ccf6..d1aa6f4ec5 100644
--- a/apps/web/src/services/my-page/components/NotificationAddForm.vue
+++ b/apps/web/src/services/my-page/components/NotificationAddForm.vue
@@ -15,8 +15,7 @@ import type { ChannelSchedule } from '@/schema/notification/type';
 import type { UserChannelCreateParameters as UserChannelCreateParametersV1 } from '@/schema/notification/user-channel/api-verbs/create';
 import { i18n } from '@/translations';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
-
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
 import type { ScheduleSettingFormType } from '@/common/components/schedule-setting-form/schedule-setting-form';
@@ -38,10 +37,10 @@ const props = withDefaults(defineProps<{
 });
 
 const router = useRouter();
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
 
 const state = reactive({
-    visibleUserNotification: computed<boolean>(() => globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleUserNotification ?? false),
+    visibleUserNotification: computed<boolean>(() => alertManagerUiAffectsSchema.value?.visibleUserNotification ?? false),
     isDataValid: false,
     notificationLevel: 'LV1' as NotificationLevel,
     //
diff --git a/apps/web/src/services/my-page/components/NotificationChannelItemSchedule.vue b/apps/web/src/services/my-page/components/NotificationChannelItemSchedule.vue
index 21034ab726..4343665a7d 100644
--- a/apps/web/src/services/my-page/components/NotificationChannelItemSchedule.vue
+++ b/apps/web/src/services/my-page/components/NotificationChannelItemSchedule.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-nocheck
 import {
     computed, reactive,
 } from 'vue';
diff --git a/apps/web/src/services/my-page/components/NotificationChannelList.vue b/apps/web/src/services/my-page/components/NotificationChannelList.vue
index d0731b24f3..5374395222 100644
--- a/apps/web/src/services/my-page/components/NotificationChannelList.vue
+++ b/apps/web/src/services/my-page/components/NotificationChannelList.vue
@@ -27,11 +27,11 @@ import type { UserChannelListParameters as UserChannelListParametersV1 } from '@
 import type { UserChannelModel as UserChannelModelV1 } from '@/schema/notification/user-channel/model';
 import { i18n } from '@/translations';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { PluginReferenceMap } from '@/store/reference/plugin-reference-store';
 import { useUserStore } from '@/store/user/user-store';
 
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
@@ -51,7 +51,8 @@ interface EnrichedProtocolItem extends ProtocolModel {
 }
 const allReferenceStore = useAllReferenceStore();
 const userStore = useUserStore();
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
+
 
 const props = withDefaults(defineProps<{
     projectId?: string;
@@ -62,7 +63,7 @@ const props = withDefaults(defineProps<{
 });
 const route = useRoute();
 const state = reactive({
-    visibleUserNotification: computed<boolean>(() => globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleUserNotification ?? false),
+    visibleUserNotification: computed<boolean>(() => alertManagerUiAffectsSchema.value?.visibleUserNotification ?? false),
     loading: true,
     channelLoading: true,
     userId: computed<string|undefined>(() => (route.params.userId ? decodeURIComponent(route.params.userId) : userStore.state.userId)),
diff --git a/apps/web/src/services/my-page/composables/notification-item.ts b/apps/web/src/services/my-page/composables/notification-item.ts
index 58c79a1211..81f8345b56 100644
--- a/apps/web/src/services/my-page/composables/notification-item.ts
+++ b/apps/web/src/services/my-page/composables/notification-item.ts
@@ -13,8 +13,7 @@ import type { ProjectChannelUpdateParameters } from '@/schema/notification/proje
 import type { UserChannelUpdateParameters as UserChannelUpdateParametersV1 } from '@/schema/notification/user-channel/api-verbs/update';
 import { i18n } from '@/translations';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
-
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
@@ -31,10 +30,10 @@ type Emit<Data> = {
 };
 
 export const useNotificationItem = <Data>(_state: NotificationItemState<Data>, emit: Emit<Data>) => {
-    const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+    const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
 
     const state = reactive({
-        visibleUserNotification: computed<boolean>(() => globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleUserNotification ?? false),
+        visibleUserNotification: computed<boolean>(() => alertManagerUiAffectsSchema.value?.visibleUserNotification ?? false),
         isEditMode: _state.isEditMode,
         dataForEdit: _state.dataForEdit,
         userChannelId: _state.userChannelId,
diff --git a/apps/web/src/services/my-page/pages/UserAccountPage.vue b/apps/web/src/services/my-page/pages/UserAccountPage.vue
index 268aecf9bd..542beaae41 100644
--- a/apps/web/src/services/my-page/pages/UserAccountPage.vue
+++ b/apps/web/src/services/my-page/pages/UserAccountPage.vue
@@ -19,6 +19,7 @@ import WorkspaceMemberImage from '@/assets/images/role/img_avatar_workspace-memb
 import WorkspaceOwnerImage from '@/assets/images/role/img_avatar_workspace-owner.png';
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useDomainStore } from '@/store/domain/domain-store';
 import { useUserStore } from '@/store/user/user-store';
 
@@ -32,13 +33,13 @@ import UserAccountNotificationEmail from '@/services/my-page/components/UserAcco
 
 
 
-
 const domainStore = useDomainStore();
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 const storeState = reactive({
     authType: computed<AuthType|undefined>(() => userStore.state.authType),
     baseRoleType: computed<RoleType|undefined>(() => userStore.state.roleType),
-    currentRoleType: computed(() => userStore.state.currentRoleInfo?.roleType),
+    currentRoleType: computed(() => authorizationStore.state.currentRoleInfo?.roleType),
     userId: computed<string|undefined>(() => userStore.state.userId),
 });
 const state = reactive({
diff --git a/apps/web/src/services/my-page/routes/routes.ts b/apps/web/src/services/my-page/routes/routes.ts
index 4d4ccce9e8..93a6094bcc 100644
--- a/apps/web/src/services/my-page/routes/routes.ts
+++ b/apps/web/src/services/my-page/routes/routes.ts
@@ -2,9 +2,6 @@ import type { RouteConfig } from 'vue-router';
 
 import { ROUTE_SCOPE } from '@/router/constant';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -26,10 +23,7 @@ const myPageRoutes: RouteConfig = {
         translationId: MENU_INFO_MAP[MENU_ID.MY_PAGE].translationId,
         scope: ROUTE_SCOPE.USER,
     },
-    redirect: (to) => {
-        const userStore = useUserStore(pinia);
-        return getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap);
-    },
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: MyPageContainer,
     children: [
         {
diff --git a/apps/web/src/services/ops-flow/components/BoardTaskComment.vue b/apps/web/src/services/ops-flow/components/BoardTaskComment.vue
index fca1974dbe..b3b5777b67 100644
--- a/apps/web/src/services/ops-flow/components/BoardTaskComment.vue
+++ b/apps/web/src/services/ops-flow/components/BoardTaskComment.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue';
 
-import type { QueryKey } from '@tanstack/vue-query';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/vue-query';
 
 import {
@@ -11,6 +10,7 @@ import type { CollapsibleItem } from '@cloudforet/mirinae/types/data-display/col
 
 import { useCommentApi } from '@/api-clients/opsflow/comment/composables/use-comment-api';
 import type { CommentModel } from '@/api-clients/opsflow/comment/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { useUserReferenceStore } from '@/store/reference/user-reference-store';
@@ -50,16 +50,20 @@ const { getTimezoneDate } = useTimezoneDate();
 
 /* comments */
 const queryClient = useQueryClient();
-const { commentAPI, commentListQueryKey } = useCommentApi();
+const { commentAPI } = useCommentApi();
+const { key: commentListQueryKey, params: commentListParams } = useServiceQueryKey('opsflow', 'comment', 'list', {
+    contextKey: props.taskId,
+    params: computed(() => ({
+        task_id: props.taskId,
+        query: {
+            sort: [{ key: 'created_at', desc: true }],
+        },
+    })),
+});
 const { data: comments } = useQuery({
-    queryKey: computed<QueryKey>(() => [...commentListQueryKey.value, props.taskId]),
+    queryKey: commentListQueryKey,
     queryFn: async () => {
-        const response = await commentAPI.list({
-            task_id: props.taskId,
-            query: {
-                sort: [{ key: 'created_at', desc: true }],
-            },
-        });
+        const response = await commentAPI.list(commentListParams.value);
         return response.results ?? [];
     },
     staleTime: 1000 * 60 * 5, // 5 minutes
@@ -80,7 +84,7 @@ const { refetch: refetchEvents } = useTaskEventsQuery({
 const { mutateAsync: createComment, isPending: isCreating } = useMutation({
     mutationFn: commentAPI.create,
     onSuccess: () => {
-        queryClient.invalidateQueries({ queryKey: [...commentListQueryKey.value, props.taskId] });
+        queryClient.invalidateQueries({ queryKey: commentListQueryKey.value });
         showSuccessMessage(i18n.t('OPSFLOW.ALT_S_ADD_TARGET', { target: i18n.t('OPSFLOW.TASK_BOARD.COMMENT') }) as string, '');
     },
     onError: (error) => {
diff --git a/apps/web/src/services/ops-flow/components/BoardTaskTable.vue b/apps/web/src/services/ops-flow/components/BoardTaskTable.vue
index 8e4c6ee832..222558fdc1 100644
--- a/apps/web/src/services/ops-flow/components/BoardTaskTable.vue
+++ b/apps/web/src/services/ops-flow/components/BoardTaskTable.vue
@@ -19,6 +19,7 @@ import type { DataTableField } from '@cloudforet/mirinae/types/data-display/tabl
 import type { TaskCategoryModel } from '@/api-clients/opsflow/task-category/schema/model';
 import type { TaskTypeModel } from '@/api-clients/opsflow/task-type/schema/model';
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { useUserReferenceStore } from '@/store/reference/user-reference-store';
@@ -106,7 +107,7 @@ const categoriesById = computed<Record<string, TaskCategoryModel>>(() => {
 
 /* task types */
 const { taskTypes, isLoading: isLoadingTaskTypes } = useTaskTypesQuery({
-    queryKey: computed(() => ({
+    params: computed(() => ({
         query: {
             filter: [{ k: 'category_id', v: categories.value?.map((c) => c.category_id) ?? [], o: 'in' }],
         },
@@ -123,19 +124,19 @@ const taskTypesById = computed<Record<string, TaskTypeModel>>(() => {
 });
 
 /* tasks */
-const { taskListQueryKey, taskAPI } = useTaskApi();
+const { taskAPI } = useTaskApi();
+const { key: taskListQueryKey, params: taskListQueryParams } = useServiceQueryKey('opsflow', 'task', 'list', {
+    contextKey: props.categoryId ?? 'all',
+    params: computed(() => ({
+        query: taskListApiQuery.value,
+    })),
+});
 const {
     data, error, refetch, isLoading,
 } = useQuery({
-    queryKey: computed(() => [
-        ...taskListQueryKey.value,
-        props.categoryId ?? 'all',
-        taskListApiQuery.value,
-    ]),
+    queryKey: taskListQueryKey.value,
     queryFn: async () => {
-        const res = await taskAPI.list({
-            query: taskListApiQuery.value,
-        });
+        const res = await taskAPI.list(taskListQueryParams.value);
         return {
             results: res.results ?? [],
             totalCount: res.total_count,
diff --git a/apps/web/src/services/ops-flow/components/CommentDeleteModal.vue b/apps/web/src/services/ops-flow/components/CommentDeleteModal.vue
index 9b2cd8515d..9332f4e8a2 100644
--- a/apps/web/src/services/ops-flow/components/CommentDeleteModal.vue
+++ b/apps/web/src/services/ops-flow/components/CommentDeleteModal.vue
@@ -4,6 +4,7 @@ import { computed } from 'vue';
 import { useMutation, useQueryClient } from '@tanstack/vue-query';
 
 import { useCommentApi } from '@/api-clients/opsflow/comment/composables/use-comment-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { getParticle, i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -25,12 +26,14 @@ const { refetch: refetchEvents } = useTaskEventsQuery({
 
 /* delete comment */
 const queryClient = useQueryClient();
-const { commentAPI, commentListQueryKey } = useCommentApi();
+const { commentAPI } = useCommentApi();
+const { withSuffix: withCommentListQueryKeySuffix } = useServiceQueryKey('opsflow', 'comment', 'list');
+
 const { mutateAsync: deleteComment, isPending: isDeleting } = useMutation({
     mutationFn: ({ commentId }: {commentId: string; taskId: string}) => commentAPI.delete({ comment_id: commentId }),
     onSuccess: (data, { taskId }) => {
         queryClient.invalidateQueries({
-            queryKey: [...commentListQueryKey.value, taskId],
+            queryKey: withCommentListQueryKeySuffix(taskId),
         });
         showSuccessMessage(i18n.t('OPSFLOW.ALT_S_DELETE_TARGET', { target: i18n.t('OPSFLOW.TASK_BOARD.COMMENT') }) as string, '');
         refetchEvents();
diff --git a/apps/web/src/services/ops-flow/components/TaskAssignModal.vue b/apps/web/src/services/ops-flow/components/TaskAssignModal.vue
index 3e9f228b4a..30f1736c48 100644
--- a/apps/web/src/services/ops-flow/components/TaskAssignModal.vue
+++ b/apps/web/src/services/ops-flow/components/TaskAssignModal.vue
@@ -12,6 +12,7 @@ import type { ToolboxTableOptions } from '@cloudforet/mirinae/types/data-display
 
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
 import type { TaskModel } from '@/api-clients/opsflow/task/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import type { UserReferenceItem } from '@/store/reference/user-reference-store';
@@ -94,7 +95,8 @@ interface AssignVariables {
     taskId?: string;
     assignee?: string;
 }
-const { taskAPI, taskListQueryKey } = useTaskApi();
+const { taskAPI } = useTaskApi();
+const { key: taskListQueryKey } = useServiceQueryKey('opsflow', 'task', 'list');
 const queryClient = useQueryClient();
 const { mutate: updateTaskAssignee, isPending: updating } = useMutation({
     mutationFn: async ({ taskId, assignee }: AssignVariables) => {
diff --git a/apps/web/src/services/ops-flow/components/TaskCategoryDeleteModal.vue b/apps/web/src/services/ops-flow/components/TaskCategoryDeleteModal.vue
index a9bb1662b3..8052c17270 100644
--- a/apps/web/src/services/ops-flow/components/TaskCategoryDeleteModal.vue
+++ b/apps/web/src/services/ops-flow/components/TaskCategoryDeleteModal.vue
@@ -7,6 +7,7 @@ import { PButtonModal } from '@cloudforet/mirinae/';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
 import type { TaskModel } from '@/api-clients/opsflow/task/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { getParticle, i18n as _i18n } from '@/translations';
 
 import type { WorkspaceItem } from '@/store/reference/workspace-reference-store';
@@ -54,7 +55,9 @@ const { categories } = useCategoriesQuery({ enabled });
 const targetCategory = computed(() => categories.value?.find((c) => c.category_id === taskManagementPageState.targetCategoryId));
 
 /* delete category */
-const { taskCategoryAPI, taskCategoryListQueryKey } = useTaskCategoryApi();
+const { taskCategoryAPI } = useTaskCategoryApi();
+const { key: taskCategoryListQueryKey } = useServiceQueryKey('opsflow', 'task-category', 'list');
+
 const queryClient = useQueryClient();
 const { mutate: deleteCategory, isPending: isDeleting } = useMutation({
     mutationFn: ({ categoryId }: {categoryId?: string}) => {
@@ -89,7 +92,7 @@ const handleClosed = () => {
 const {
     tasks, isLoading,
 } = useAssociatedTasksQuery({
-    queryKey: computed(() => ({ category_id: taskManagementPageState.targetCategoryId })),
+    params: computed(() => ({ category_id: taskManagementPageState.targetCategoryId })),
     enabled: computed(() => !!taskManagementPageState.visibleDeleteCategoryModal && !!taskManagementPageState.targetCategoryId),
 });
 
diff --git a/apps/web/src/services/ops-flow/components/TaskCategoryForm.vue b/apps/web/src/services/ops-flow/components/TaskCategoryForm.vue
index affca6402b..fa4d96893e 100644
--- a/apps/web/src/services/ops-flow/components/TaskCategoryForm.vue
+++ b/apps/web/src/services/ops-flow/components/TaskCategoryForm.vue
@@ -8,6 +8,7 @@ import {
 } from '@cloudforet/mirinae';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n, getParticle } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -70,7 +71,10 @@ const {
 });
 
 /* task category mutations */
-const { taskCategoryAPI, taskCategoryListQueryKey, taskCategoryQueryKey } = useTaskCategoryApi();
+const { taskCategoryAPI } = useTaskCategoryApi();
+const { key: taskCategoryListQueryKey } = useServiceQueryKey('opsflow', 'task-category', 'list');
+const { withSuffix: withTaskCategoryQueryKeySuffix } = useServiceQueryKey('opsflow', 'task-category', 'get');
+
 const queryClient = useQueryClient();
 interface UpdateVariables {
     categoryId: string;
@@ -85,9 +89,9 @@ const { mutateAsync: updateCategory, isPending: isUpdating } = useMutation({
         name: form.name,
         description: form.description,
     }),
-    onSuccess: () => {
+    onSuccess: (data) => {
         queryClient.invalidateQueries({ queryKey: taskCategoryListQueryKey.value });
-        queryClient.invalidateQueries({ queryKey: taskCategoryQueryKey.value });
+        queryClient.invalidateQueries({ queryKey: withTaskCategoryQueryKeySuffix(data.category_id) });
         showSuccessMessage(i18n.t('OPSFLOW.ALT_S_EDIT_TARGET', { target: i18n.t('OPSFLOW.CATEGORY') }), '');
         taskManagementPageStore.closeCategoryForm();
     },
diff --git a/apps/web/src/services/ops-flow/components/TaskContentBaseForm.vue b/apps/web/src/services/ops-flow/components/TaskContentBaseForm.vue
index d9048fd131..3023054eed 100644
--- a/apps/web/src/services/ops-flow/components/TaskContentBaseForm.vue
+++ b/apps/web/src/services/ops-flow/components/TaskContentBaseForm.vue
@@ -12,6 +12,7 @@ import type { SelectDropdownMenuItem } from '@cloudforet/mirinae/types/controls/
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
 import type { TaskModel } from '@/api-clients/opsflow/task/schema/model';
 import type { TaskStatusType } from '@/api-clients/opsflow/task/schema/type';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { useUserReferenceStore } from '@/store/reference/user-reference-store';
@@ -149,7 +150,8 @@ const {
     categoryId: computed(() => currentCategory.value?.category_id),
 });
 const getStatusTypeLabel = (statusType?: TaskStatusType) => (statusType ? TASK_STATUS_LABELS[statusType] : '--');
-const { taskAPI, taskListQueryKey } = useTaskApi();
+const { taskAPI } = useTaskApi();
+const { key: taskListQueryKey } = useServiceQueryKey('opsflow', 'task', 'list');
 const queryClient = useQueryClient();
 const { mutateAsync: changeStatus } = useMutation({
     mutationFn: ({ taskId, statusId }: {
diff --git a/apps/web/src/services/ops-flow/components/TaskDeleteModal.vue b/apps/web/src/services/ops-flow/components/TaskDeleteModal.vue
index 98bc610647..bc231a040f 100644
--- a/apps/web/src/services/ops-flow/components/TaskDeleteModal.vue
+++ b/apps/web/src/services/ops-flow/components/TaskDeleteModal.vue
@@ -4,6 +4,7 @@ import { computed } from 'vue';
 import { useMutation, useQueryClient } from '@tanstack/vue-query';
 
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { getParticle, i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -23,7 +24,8 @@ const emit = defineEmits<{(event: 'deleted'): void;
 const taskDetailPageStore = useTaskDetailPageStore();
 const taskManagementTemplateStore = useTaskManagementTemplateStore();
 
-const { taskAPI, taskListQueryKey } = useTaskApi();
+const { taskAPI } = useTaskApi();
+const { key: taskListQueryKey } = useServiceQueryKey('opsflow', 'task', 'list');
 const queryClient = useQueryClient();
 const { mutate: deleteTask, isSuccess: hasDeleted, isPending } = useMutation({
     mutationFn: ({ taskId }: { taskId: string }) => taskAPI.delete({ task_id: taskId }),
diff --git a/apps/web/src/services/ops-flow/components/TaskProgressEventView.vue b/apps/web/src/services/ops-flow/components/TaskProgressEventView.vue
index ac478e2b2a..93789e92fa 100644
--- a/apps/web/src/services/ops-flow/components/TaskProgressEventView.vue
+++ b/apps/web/src/services/ops-flow/components/TaskProgressEventView.vue
@@ -27,7 +27,8 @@ const taskFieldMetadataStore = useTaskFieldMetadataStore();
 
 /* task type */
 const { taskType } = useTaskTypeQuery({
-    queryKey: computed(() => ({ task_type_id: props.taskTypeId as string, include_category_fields: true })),
+    taskTypeId: computed(() => props.taskTypeId),
+    params: computed(() => ({ task_type_id: props.taskTypeId as string, include_category_fields: true })),
     enabled: computed(() => !!props.taskTypeId),
 });
 
diff --git a/apps/web/src/services/ops-flow/components/TaskStatusDeleteModal.vue b/apps/web/src/services/ops-flow/components/TaskStatusDeleteModal.vue
index 8cc3de9ba3..0136382d26 100644
--- a/apps/web/src/services/ops-flow/components/TaskStatusDeleteModal.vue
+++ b/apps/web/src/services/ops-flow/components/TaskStatusDeleteModal.vue
@@ -7,6 +7,7 @@ import { cloneDeep } from 'lodash';
 import { PButtonModal } from '@cloudforet/mirinae';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { getParticle, i18n as _i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -34,7 +35,8 @@ const { categoryStatusOptions } = useCategoryStatusOptions({ categoryId });
 const { defaultStatusOption } = useDefaultStatusOption({ categoryStatusOptions, targetStatusType });
 
 /* delete status option */
-const { taskCategoryAPI, taskCategoryListQueryKey } = useTaskCategoryApi();
+const { taskCategoryAPI } = useTaskCategoryApi();
+const { key: taskCategoryListQueryKey } = useServiceQueryKey('opsflow', 'task-category', 'list');
 const queryClient = useQueryClient();
 const { mutateAsync: deleteStatusOption, isPending: isDeleting } = useMutation({
     mutationFn: () => {
diff --git a/apps/web/src/services/ops-flow/components/TaskStatusForm.vue b/apps/web/src/services/ops-flow/components/TaskStatusForm.vue
index c39b788066..89513fcb8f 100644
--- a/apps/web/src/services/ops-flow/components/TaskStatusForm.vue
+++ b/apps/web/src/services/ops-flow/components/TaskStatusForm.vue
@@ -33,7 +33,7 @@ const targetStatusId = computed(() => taskCategoryPageState.targetStatus?.status
 const { targetStatusOption } = useTargetStatusOption({ categoryStatusOptions, targetStatusType, targetStatusId });
 
 /* status types */
-const statusIdAndNames = computed<[id: string, name: string][]>(() => Object.values(categoryStatusOptions.value).flat().map((p) => [p.status_id, p.name]));
+const statusIdAndNames = computed<[id: string, name: string][]>(() => Object.values(categoryStatusOptions?.value ?? {}).flat().map((p) => [p.status_id, p.name]));
 const { statusTypeItems } = useStatusTypeDropdownItems();
 
 /* form */
diff --git a/apps/web/src/services/ops-flow/components/TaskStatusSetDefaultModal.vue b/apps/web/src/services/ops-flow/components/TaskStatusSetDefaultModal.vue
index 2c200beb1c..caedfb3c6f 100644
--- a/apps/web/src/services/ops-flow/components/TaskStatusSetDefaultModal.vue
+++ b/apps/web/src/services/ops-flow/components/TaskStatusSetDefaultModal.vue
@@ -8,6 +8,7 @@ import { PButtonModal } from '@cloudforet/mirinae';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
 import type { TaskStatusType } from '@/api-clients/opsflow/task/schema/type';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n as _i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -36,11 +37,14 @@ const { targetStatusOption } = useTargetStatusOption({ categoryStatusOptions, ta
 const name = computed(() => targetStatusOption.value?.name ?? '');
 
 /* set default status */
-const { taskCategoryAPI, taskCategoryListQueryKey, taskCategoryQueryKey } = useTaskCategoryApi();
+const { taskCategoryAPI } = useTaskCategoryApi();
+const { key: taskCategoryListQueryKey } = useServiceQueryKey('opsflow', 'task-category', 'list');
+const { withSuffix: taskCategoryWithSuffix } = useServiceQueryKey('opsflow', 'task-category', 'get');
 const queryClient = useQueryClient();
 const { mutate: setAsDefaultStatus, isPending } = useMutation({
     mutationFn: ({ categoryId, statusType, statusId }: { categoryId: string; statusType: TaskStatusType; statusId: string }) => {
         const newStatusOptions = cloneDeep(categoryStatusOptions.value);
+        if (!newStatusOptions) throw new Error('Status options not found');
         const prevDefault = newStatusOptions[statusType].find((p) => p.is_default);
         if (prevDefault) prevDefault.is_default = false;
         const newDefault = newStatusOptions[statusType].find((p) => p.status_id === statusId);
@@ -55,12 +59,7 @@ const { mutate: setAsDefaultStatus, isPending } = useMutation({
     },
     onSuccess: (data) => {
         queryClient.invalidateQueries({ queryKey: taskCategoryListQueryKey.value });
-        queryClient.invalidateQueries({
-            queryKey: [
-                ...taskCategoryQueryKey.value,
-                { category_id: data.category_id },
-            ],
-        });
+        queryClient.invalidateQueries({ queryKey: taskCategoryWithSuffix(data.category_id) });
         showSuccessMessage(_i18n.t('OPSFLOW.ALT_S_EDIT_TARGET', { target: _i18n.t('OPSFLOW.STATUS') }), '');
         taskCategoryPageStore.closeSetDefaultStatusModal();
     },
diff --git a/apps/web/src/services/ops-flow/components/TaskStatusTree.vue b/apps/web/src/services/ops-flow/components/TaskStatusTree.vue
index 703de1fd34..75187b8682 100644
--- a/apps/web/src/services/ops-flow/components/TaskStatusTree.vue
+++ b/apps/web/src/services/ops-flow/components/TaskStatusTree.vue
@@ -5,6 +5,7 @@ import { useMutation, useQueryClient } from '@tanstack/vue-query';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
 import type { TaskStatusOption, TaskStatusType } from '@/api-clients/opsflow/task/schema/type';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -16,7 +17,6 @@ import { useCategoryStatusOptions } from '@/services/ops-flow/composables/use-ca
 import { TASK_STATUS_LABELS } from '@/services/ops-flow/constants/task-status-label-constant';
 import { useTaskCategoryPageStore } from '@/services/ops-flow/stores/admin/task-category-page-store';
 
-
 const taskCategoryPageStore = useTaskCategoryPageStore();
 
 const taskStatusTree = computed<{
@@ -33,11 +33,14 @@ const categoryId = computed(() => taskCategoryPageStore.state.currentCategoryId)
 const { categoryStatusOptions } = useCategoryStatusOptions({ categoryId });
 
 /* update status options */
-const { taskCategoryAPI, taskCategoryListQueryKey, taskCategoryQueryKey } = useTaskCategoryApi();
+const { taskCategoryAPI } = useTaskCategoryApi();
+const { key: taskCategoryListQueryKey } = useServiceQueryKey('opsflow', 'task-category', 'list');
+const { withSuffix: taskCategoryWithSuffix } = useServiceQueryKey('opsflow', 'task-category', 'get');
 const queryClient = useQueryClient();
 const { mutate } = useMutation({
     mutationFn: ({ statusType, items }: {statusType: TaskStatusType; items: TaskStatusOption[]}) => {
         if (!categoryId.value) throw new Error('Category ID is required');
+        if (!categoryStatusOptions.value) throw new Error('Category status options are required');
         return taskCategoryAPI.update({
             category_id: categoryId.value,
             status_options: {
@@ -49,12 +52,7 @@ const { mutate } = useMutation({
     },
     onSuccess: (data) => {
         queryClient.invalidateQueries({ queryKey: taskCategoryListQueryKey.value });
-        queryClient.invalidateQueries({
-            queryKey: [
-                ...taskCategoryQueryKey.value,
-                { category_id: data.category_id },
-            ],
-        });
+        queryClient.invalidateQueries({ queryKey: taskCategoryWithSuffix(data.category_id) });
         showSuccessMessage(i18n.t('OPSFLOW.ALT_S_EDIT_TARGET', { target: i18n.t('OPSFLOW.STATUS') }), '');
     },
     onError: (e) => {
@@ -73,7 +71,7 @@ const handleUpdateItems = async (statusType: TaskStatusType, items: TaskStatusOp
             <task-status-list :key="taskStatus.key"
                               :type="taskStatus.key"
                               :header="taskStatus.name"
-                              :items="categoryStatusOptions[taskStatus.key]"
+                              :items="categoryStatusOptions?.[taskStatus.key]"
                               @update:items="handleUpdateItems(taskStatus.key, $event)"
             />
         </template>
diff --git a/apps/web/src/services/ops-flow/components/TaskTypeDeleteModal.vue b/apps/web/src/services/ops-flow/components/TaskTypeDeleteModal.vue
index dc5a73be0b..2d7fbb679b 100644
--- a/apps/web/src/services/ops-flow/components/TaskTypeDeleteModal.vue
+++ b/apps/web/src/services/ops-flow/components/TaskTypeDeleteModal.vue
@@ -6,6 +6,7 @@ import { useMutation, useQueryClient } from '@tanstack/vue-query';
 import { PButtonModal, PIconButton } from '@cloudforet/mirinae';
 
 import { useTaskTypeApi } from '@/api-clients/opsflow/task-type/composables/use-task-type-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { getParticle, i18n as _i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -28,7 +29,7 @@ const taskManagementTemplateStore = useTaskManagementTemplateStore();
 const {
     tasks, isLoading, refetch,
 } = useAssociatedTasksQuery({
-    queryKey: computed(() => ({ task_type_id: taskCategoryPageState.targetTaskTypeId })),
+    params: computed(() => ({ task_type_id: taskCategoryPageState.targetTaskTypeId })),
     enabled: computed(() => !!taskCategoryPageState.visibleTaskTypeDeleteModal && !!taskCategoryPageState.targetTaskTypeId),
 });
 
@@ -45,7 +46,8 @@ const headerTitle = computed(() => {
 });
 
 /* delete task type */
-const { taskTypeAPI, taskTypeListQueryKey } = useTaskTypeApi();
+const { taskTypeAPI } = useTaskTypeApi();
+const { key: taskTypeListQueryKey } = useServiceQueryKey('opsflow', 'task-type', 'list');
 const queryClient = useQueryClient();
 const { mutateAsync: deleteTaskType, isPending: isDeleting } = useMutation({
     mutationFn: async () => {
diff --git a/apps/web/src/services/ops-flow/components/TaskTypeForm.vue b/apps/web/src/services/ops-flow/components/TaskTypeForm.vue
index 94702590a9..4664fdb123 100644
--- a/apps/web/src/services/ops-flow/components/TaskTypeForm.vue
+++ b/apps/web/src/services/ops-flow/components/TaskTypeForm.vue
@@ -40,7 +40,8 @@ const visibleForm = computed(() => taskCategoryPageState.visibleTaskTypeForm);
 
 /* task type */
 const { taskType } = useTaskTypeQuery({
-    queryKey: computed(() => ({ task_type_id: targetTaskTypeId.value as string })),
+    taskTypeId: computed(() => targetTaskTypeId.value),
+    params: computed(() => ({ task_type_id: targetTaskTypeId.value as string })),
     enabled: computed(() => visibleForm.value && !!targetTaskTypeId.value),
 });
 
@@ -72,7 +73,7 @@ const {
 
 /* task types */
 const { taskTypes } = useTaskTypesQuery({
-    queryKey: computed(() => ({
+    params: computed(() => ({
         query: {
             filter: [{ k: 'category_id', v: currentCategoryId.value, o: 'eq' }],
         },
diff --git a/apps/web/src/services/ops-flow/composables/use-associated-tasks-query.ts b/apps/web/src/services/ops-flow/composables/use-associated-tasks-query.ts
index e3184588b4..9dc9d16107 100644
--- a/apps/web/src/services/ops-flow/composables/use-associated-tasks-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-associated-tasks-query.ts
@@ -1,30 +1,31 @@
-import type { Ref } from 'vue';
-import { computed, watch } from 'vue';
+import type { ComputedRef } from 'vue';
+import { watch } from 'vue';
 
 import { useQuery } from '@tanstack/vue-query';
 
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
 import type { TaskListParameters } from '@/api-clients/opsflow/task/schema/api-verbs/list';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
 export const useAssociatedTasksQuery = ({
-    queryKey,
+    params,
     enabled,
 }: {
-  queryKey: Ref<TaskListParameters>;
-  enabled: Ref<boolean>;
+    params: ComputedRef<TaskListParameters>;
+    enabled: ComputedRef<boolean>;
 }) => {
-    const { taskListQueryKey, taskAPI } = useTaskApi();
+    const { taskAPI } = useTaskApi();
+    const { key: taskListQueryKey, params: taskListParams } = useServiceQueryKey('opsflow', 'task', 'list', {
+        params,
+    });
     const {
         data: tasks, isLoading, isError, refetch,
     } = useQuery({
-        queryKey: computed(() => [
-            ...taskListQueryKey.value,
-            queryKey.value,
-        ]),
+        queryKey: taskListQueryKey,
         queryFn: async () => {
-            const { results } = await taskAPI.list(queryKey.value);
+            const { results } = await taskAPI.list(taskListParams.value);
             return results ?? [];
         },
         enabled,
diff --git a/apps/web/src/services/ops-flow/composables/use-categories-query.ts b/apps/web/src/services/ops-flow/composables/use-categories-query.ts
index 0d69307cb3..3e82cff5c4 100644
--- a/apps/web/src/services/ops-flow/composables/use-categories-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-categories-query.ts
@@ -1,21 +1,25 @@
 
-import type { Ref } from 'vue';
+import { computed, type Ref } from 'vue';
 
 import { useQuery } from '@tanstack/vue-query';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 export const useCategoriesQuery = (ops?: {
   enabled?: Ref<boolean>;
 }) => {
     const { enabled } = ops ?? {};
-    const { taskCategoryAPI, taskCategoryListQueryKey } = useTaskCategoryApi();
+    const { taskCategoryAPI } = useTaskCategoryApi();
+    const { key: taskCategoryListQueryKey, params: taskCategoryListParams } = useServiceQueryKey('opsflow', 'task-category', 'list', {
+        params: computed(() => ({ include_deleted: true })),
+    });
     const {
         data: categories, isLoading, refetch, error,
     } = useQuery({
         queryKey: taskCategoryListQueryKey,
         queryFn: async () => {
-            const { results } = await taskCategoryAPI.list({ include_deleted: true });
+            const { results } = await taskCategoryAPI.list(taskCategoryListParams.value);
             return results ?? [];
         },
         enabled,
diff --git a/apps/web/src/services/ops-flow/composables/use-category-field.ts b/apps/web/src/services/ops-flow/composables/use-category-field.ts
index 6f9f849529..77ce1c3a03 100644
--- a/apps/web/src/services/ops-flow/composables/use-category-field.ts
+++ b/apps/web/src/services/ops-flow/composables/use-category-field.ts
@@ -42,7 +42,7 @@ export const useCategoryField = ({
     };
 
     const { taskTypes } = useTaskTypesQuery({
-        queryKey: computed(() => ({
+        params: computed(() => ({
             query: { filter: [{ k: 'category_id', v: categories.value?.map((c) => c.category_id), o: 'in' }] },
         })),
         enabled: computed(() => !!categories.value),
diff --git a/apps/web/src/services/ops-flow/composables/use-current-category.ts b/apps/web/src/services/ops-flow/composables/use-current-category.ts
index 822871b648..d9b105f174 100644
--- a/apps/web/src/services/ops-flow/composables/use-current-category.ts
+++ b/apps/web/src/services/ops-flow/composables/use-current-category.ts
@@ -4,17 +4,19 @@ import { computed } from 'vue';
 import { useQuery } from '@tanstack/vue-query';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 export const useCategoryQuery = ({ categoryId }: {
   categoryId: Ref<string | undefined>;
 }) => {
-    const { taskCategoryAPI, taskCategoryQueryKey } = useTaskCategoryApi();
+    const { taskCategoryAPI } = useTaskCategoryApi();
+    const { key: taskCategoryQueryKey, params: taskCategoryParams } = useServiceQueryKey('opsflow', 'task-category', 'get', {
+        contextKey: categoryId,
+        params: computed(() => ({ category_id: categoryId.value as string })),
+    });
     const { data, isLoading, error } = useQuery({
-        queryKey: computed(() => [
-            ...taskCategoryQueryKey.value,
-            categoryId.value,
-        ]),
-        queryFn: () => taskCategoryAPI.get({ category_id: categoryId.value as string }),
+        queryKey: taskCategoryQueryKey,
+        queryFn: () => taskCategoryAPI.get(taskCategoryParams.value),
         enabled: computed(() => !!categoryId.value),
         staleTime: 1000 * 60 * 5, // 5 minutes
         gcTime: 1000 * 60, // 1 minute
diff --git a/apps/web/src/services/ops-flow/composables/use-current-task-type.ts b/apps/web/src/services/ops-flow/composables/use-current-task-type.ts
index 42c0918218..fd9c3a0576 100644
--- a/apps/web/src/services/ops-flow/composables/use-current-task-type.ts
+++ b/apps/web/src/services/ops-flow/composables/use-current-task-type.ts
@@ -9,7 +9,8 @@ export const useCurrentTaskType = ({ taskTypeId }: {
 
 }) => {
     const { taskType, error, isLoading } = useTaskTypeQuery({
-        queryKey: computed(() => ({
+        taskTypeId: computed(() => taskTypeId.value),
+        params: computed(() => ({
             task_type_id: taskTypeId.value as string,
             include_category_fields: true,
         })),
diff --git a/apps/web/src/services/ops-flow/composables/use-package-category-bind.ts b/apps/web/src/services/ops-flow/composables/use-package-category-bind.ts
index a1bea76a87..6897e82206 100644
--- a/apps/web/src/services/ops-flow/composables/use-package-category-bind.ts
+++ b/apps/web/src/services/ops-flow/composables/use-package-category-bind.ts
@@ -1,24 +1,27 @@
 import { useMutation, useQueryClient } from '@tanstack/vue-query';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
 import { useDefaultPackage } from '@/services/ops-flow/composables/use-default-package';
 
 const useTaskCategoryMutations = () => {
-    const { taskCategoryAPI, taskCategoryQueryKey, taskCategoryListQueryKey } = useTaskCategoryApi();
+    const { taskCategoryAPI } = useTaskCategoryApi();
+    const { withSuffix: taskCategoryQueryKeyWithSuffix } = useServiceQueryKey('opsflow', 'task-category', 'get');
+    const { key: taskCategoryListQueryKey } = useServiceQueryKey('opsflow', 'task-category', 'list');
     const queryClient = useQueryClient();
     const { mutateAsync: updateTaskCategory } = useMutation({
         mutationFn: taskCategoryAPI.update,
         onSuccess: (updatedCategory) => {
-            queryClient.setQueryData([...taskCategoryQueryKey.value, { category_id: updatedCategory.category_id }], updatedCategory);
+            queryClient.setQueryData(taskCategoryQueryKeyWithSuffix(updatedCategory.category_id), updatedCategory);
         },
         onError: (error) => {
             ErrorHandler.handleError(error);
         },
     });
-    return { updateTaskCategory, taskCategoryQueryKey, taskCategoryListQueryKey };
+    return { updateTaskCategory, taskCategoryListQueryKey };
 };
 
 export const usePackageCategoryBind = () => {
diff --git a/apps/web/src/services/ops-flow/composables/use-package-query.ts b/apps/web/src/services/ops-flow/composables/use-package-query.ts
index a2283b26fc..c37ecaac67 100644
--- a/apps/web/src/services/ops-flow/composables/use-package-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-package-query.ts
@@ -4,6 +4,7 @@ import { useQuery, useQueryClient } from '@tanstack/vue-query';
 
 import { usePackageApi } from '@/api-clients/identity/package/composables/use-package-api';
 import type { PackageModel } from '@/api-clients/identity/package/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 
 export const usePackageQuery = ({
@@ -12,13 +13,16 @@ export const usePackageQuery = ({
     packageId: Ref<string|undefined>;
     enabled?: Ref<boolean>|boolean;
 }) => {
-    const { packageAPI, packageQueryKey } = usePackageApi();
-    const queryKey = computed(() => [...packageQueryKey.value, packageId.value]);
+    const { packageAPI } = usePackageApi();
+    const { key: packageQueryKey, params: packageParams } = useServiceQueryKey('identity', 'package', 'get', {
+        contextKey: packageId,
+        params: computed(() => ({ package_id: packageId.value as string })),
+    });
 
     const { data, isLoading, refetch } = useQuery({
-        queryKey,
+        queryKey: packageQueryKey,
         queryFn: async () => {
-            const res = await packageAPI.get({ package_id: packageId.value as string });
+            const res = await packageAPI.get(packageParams.value);
             return res;
         },
         enabled: computed(() => {
@@ -31,13 +35,13 @@ export const usePackageQuery = ({
     });
     const queryClient = useQueryClient();
     const setQueryData = (newData: PackageModel) => {
-        queryClient.setQueryData(queryKey.value, newData);
+        queryClient.setQueryData(packageQueryKey.value, newData);
     };
     return {
         data,
         isLoading,
         refetch,
-        queryKey,
+        queryKey: packageQueryKey,
         setQueryData,
     };
 };
diff --git a/apps/web/src/services/ops-flow/composables/use-package-workspace-bind.ts b/apps/web/src/services/ops-flow/composables/use-package-workspace-bind.ts
index f093d22632..27cd8ea11b 100644
--- a/apps/web/src/services/ops-flow/composables/use-package-workspace-bind.ts
+++ b/apps/web/src/services/ops-flow/composables/use-package-workspace-bind.ts
@@ -1,17 +1,20 @@
 import { useMutation, useQueryClient } from '@tanstack/vue-query';
 
 import { useWorkspaceApi } from '@/api-clients/identity/workspace/composables/use-workspace-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
 
 const useWorkspaceMutations = () => {
-    const { workspaceAPI, workspaceQueryKey, workspaceListQueryKey } = useWorkspaceApi();
+    const { workspaceAPI } = useWorkspaceApi();
+    const { key: workspaceListQueryKey } = useServiceQueryKey('identity', 'workspace', 'list');
+    const { withSuffix: workspaceWithSuffix } = useServiceQueryKey('identity', 'workspace', 'get');
     const queryClient = useQueryClient();
     const { mutateAsync: addPackageToWorkspace } = useMutation({
         mutationFn: workspaceAPI.addPackage,
         onSuccess: (updatedWorkspace) => {
-            queryClient.setQueryData([...workspaceQueryKey.value, { workspace_id: updatedWorkspace.workspace_id }], updatedWorkspace);
+            queryClient.setQueryData(workspaceWithSuffix(updatedWorkspace.workspace_id), updatedWorkspace);
         },
         onError: (error) => {
             ErrorHandler.handleError(error);
@@ -21,14 +24,14 @@ const useWorkspaceMutations = () => {
     const { mutateAsync: removePackageFromWorkspace } = useMutation({
         mutationFn: workspaceAPI.removePackage,
         onSuccess: (updatedWorkspace) => {
-            queryClient.setQueryData([...workspaceQueryKey.value, { workspace_id: updatedWorkspace.workspace_id }], updatedWorkspace);
+            queryClient.setQueryData(workspaceWithSuffix(updatedWorkspace.workspace_id), updatedWorkspace);
         },
         onError: (error) => {
             ErrorHandler.handleError(error);
         },
     });
     return {
-        addPackageToWorkspace, removePackageFromWorkspace, workspaceQueryKey, workspaceListQueryKey,
+        addPackageToWorkspace, removePackageFromWorkspace, workspaceListQueryKey,
     };
 };
 
diff --git a/apps/web/src/services/ops-flow/composables/use-packages-query.ts b/apps/web/src/services/ops-flow/composables/use-packages-query.ts
index af4b870ea8..b3a46b668e 100644
--- a/apps/web/src/services/ops-flow/composables/use-packages-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-packages-query.ts
@@ -1,20 +1,26 @@
-import type { Ref } from 'vue';
+import { computed, type Ref } from 'vue';
 
 import { useQuery, useQueryClient } from '@tanstack/vue-query';
 
 import { usePackageApi } from '@/api-clients/identity/package/composables/use-package-api';
 import type { PackageModel } from '@/api-clients/identity/package/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 
 export const usePackagesQuery = (ops?: {
     enabled?: Ref<boolean>;
 }) => {
     const { enabled } = ops ?? {};
-    const { packageAPI, packageListQueryKey } = usePackageApi();
+    const { packageAPI } = usePackageApi();
+
+    const { key: packageListQueryKey, params: packageListParams } = useServiceQueryKey('identity', 'package', 'list', {
+        params: computed(() => ({})),
+    });
+
     const { data: packages, isLoading, refetch } = useQuery({
         queryKey: packageListQueryKey,
         queryFn: async () => {
-            const { results } = await packageAPI.list({});
+            const { results } = await packageAPI.list(packageListParams.value);
             return results as PackageModel[]|undefined;
         },
         enabled,
diff --git a/apps/web/src/services/ops-flow/composables/use-status-option-form-mutations.ts b/apps/web/src/services/ops-flow/composables/use-status-option-form-mutations.ts
index 40351b531d..bf1b4b02c1 100644
--- a/apps/web/src/services/ops-flow/composables/use-status-option-form-mutations.ts
+++ b/apps/web/src/services/ops-flow/composables/use-status-option-form-mutations.ts
@@ -6,6 +6,7 @@ import { cloneDeep } from 'lodash';
 
 import { useTaskCategoryApi } from '@/api-clients/opsflow/task-category/composables/use-task-category-api';
 import type { TaskStatusOption, TaskStatusOptions, TaskStatusType } from '@/api-clients/opsflow/task/schema/type';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
@@ -33,8 +34,10 @@ export const useStatusOptionFormMutations = ({
 }) => {
     const { categoryStatusOptions } = useCategoryStatusOptions({ categoryId });
 
-    const { taskCategoryAPI, taskCategoryListQueryKey, taskCategoryQueryKey } = useTaskCategoryApi();
+    const { taskCategoryAPI } = useTaskCategoryApi();
     const queryClient = useQueryClient();
+    const { key: taskCategoryListQueryKey } = useServiceQueryKey('opsflow', 'task-category', 'list');
+    const { withSuffix: taskCategoryWithSuffix } = useServiceQueryKey('opsflow', 'task-category', 'get');
 
     /* create status options */
     const { mutateAsync: createStatusOptions, isPending: isCreating } = useMutation({
@@ -97,12 +100,7 @@ export const useStatusOptionFormMutations = ({
         },
         onSuccess: (data) => {
             queryClient.invalidateQueries({ queryKey: taskCategoryListQueryKey.value });
-            queryClient.invalidateQueries({
-                queryKey: [
-                    ...taskCategoryQueryKey.value,
-                    { category_id: data.category_id },
-                ],
-            });
+            queryClient.invalidateQueries({ queryKey: taskCategoryWithSuffix(data.category_id) });
             showSuccessMessage('Task status option updated successfully', '');
         },
         onError: (e) => {
diff --git a/apps/web/src/services/ops-flow/composables/use-task-events-query.ts b/apps/web/src/services/ops-flow/composables/use-task-events-query.ts
index 64d843a3e7..6699d1e742 100644
--- a/apps/web/src/services/ops-flow/composables/use-task-events-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-task-events-query.ts
@@ -6,6 +6,7 @@ import { useInfiniteQuery } from '@tanstack/vue-query';
 import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
 
 import { useEventApi } from '@/api-clients/opsflow/event/composables/use-event-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
@@ -16,10 +17,18 @@ export const useTaskEventsQuery = ({
   taskId: Ref<string|undefined>;
   fetchOnCreation: boolean;
 }) => {
-    const { eventAPI, eventListQueryKey } = useEventApi();
+    const { eventAPI } = useEventApi();
     const listEventsQueryHelper = new ApiQueryHelper()
         .setMultiSortV2([{ key: 'created_at', desc: true }]);
 
+    const { key: taskEventsQueryKey, params: taskEventsParams } = useServiceQueryKey('opsflow', 'event', 'list', {
+        contextKey: taskId,
+        params: computed(() => ({
+            task_id: taskId.value as string,
+            query: listEventsQueryHelper.dataV2,
+        })),
+    });
+
     const {
         data,
         fetchNextPage,
@@ -28,17 +37,11 @@ export const useTaskEventsQuery = ({
         isLoading,
         refetch,
     } = useInfiniteQuery({
-        queryKey: computed(() => [
-            ...eventListQueryKey.value,
-            taskId.value,
-        ]),
+        queryKey: taskEventsQueryKey,
         queryFn: async ({ pageParam = 1 }) => {
             try {
                 listEventsQueryHelper.setPage((pageParam - 1) * EVENT_PAGE_SIZE + 1, EVENT_PAGE_SIZE);
-                const res = await eventAPI.list({
-                    task_id: taskId.value,
-                    query: listEventsQueryHelper.dataV2,
-                });
+                const res = await eventAPI.list(taskEventsParams.value);
                 return {
                     results: res.results ?? [],
                     totalCount: res.total_count ?? 0,
diff --git a/apps/web/src/services/ops-flow/composables/use-task-ids-field.ts b/apps/web/src/services/ops-flow/composables/use-task-ids-field.ts
index b7f9a23e69..c38ce5f735 100644
--- a/apps/web/src/services/ops-flow/composables/use-task-ids-field.ts
+++ b/apps/web/src/services/ops-flow/composables/use-task-ids-field.ts
@@ -43,7 +43,7 @@ export const useTaskIdsField = ({
     };
 
     const { tasks } = useAssociatedTasksQuery({
-        queryKey: computed(() => ({
+        params: computed(() => ({
             query: { filter: [{ k: 'category_id', v: categoryId.value, o: 'eq' }] },
         })),
         enabled: computed(() => !!categoryId.value),
diff --git a/apps/web/src/services/ops-flow/composables/use-task-query.ts b/apps/web/src/services/ops-flow/composables/use-task-query.ts
index 18b7d51f5a..a4abcc84b4 100644
--- a/apps/web/src/services/ops-flow/composables/use-task-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-task-query.ts
@@ -7,6 +7,7 @@ import type { APIError } from '@cloudforet/core-lib/space-connector/error';
 
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
 import type { TaskModel } from '@/api-clients/opsflow/task/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 export const useTaskQuery = ({
     taskId, enabled,
@@ -14,12 +15,17 @@ export const useTaskQuery = ({
   taskId: Ref<string|undefined>;
   enabled?: Ref<boolean>;
 }) => {
-    const { taskQueryKey, taskAPI } = useTaskApi();
-    const queryKey = computed(() => [...taskQueryKey.value, taskId.value]);
+    const { taskAPI } = useTaskApi();
+
+    const { key: taskQueryKey, params: taskParams } = useServiceQueryKey('opsflow', 'task', 'get', {
+        contextKey: taskId,
+        params: computed(() => ({ task_id: taskId.value as string })),
+    });
+
     const { data, isLoading, error } = useQuery({
-        queryKey,
+        queryKey: taskQueryKey,
         queryFn: async () => {
-            const result = await taskAPI.get({ task_id: taskId.value as string });
+            const result = await taskAPI.get(taskParams.value);
             return result;
         },
         enabled: computed(() => (enabled ? (enabled.value && !!taskId.value) : !!taskId.value)),
@@ -35,15 +41,15 @@ export const useTaskQuery = ({
 
     const queryClient = useQueryClient();
     const setQueryData = (newTask: TaskModel) => {
-        queryClient.setQueryData(queryKey.value, newTask);
+        queryClient.setQueryData(taskQueryKey.value, newTask);
     };
     const removeQuery = () => {
-        queryClient.removeQueries({ queryKey: queryKey.value });
+        queryClient.removeQueries({ queryKey: taskQueryKey.value });
     };
     return {
         data,
         isLoading,
-        queryKey,
+        queryKey: taskQueryKey,
         setQueryData,
         error,
         removeQuery,
diff --git a/apps/web/src/services/ops-flow/composables/use-task-type-field.ts b/apps/web/src/services/ops-flow/composables/use-task-type-field.ts
index cb3c808232..2044de1d61 100644
--- a/apps/web/src/services/ops-flow/composables/use-task-type-field.ts
+++ b/apps/web/src/services/ops-flow/composables/use-task-type-field.ts
@@ -44,7 +44,7 @@ export const useTaskTypeField = ({
     };
 
     const { taskTypes } = useTaskTypesQuery({
-        queryKey: computed(() => ({
+        params: computed(() => ({
             query: { filter: [{ k: 'category_id', v: categoryId.value, o: 'eq' }] },
         })),
         enabled: computed(() => !!categoryId.value),
diff --git a/apps/web/src/services/ops-flow/composables/use-task-type-form-mutations.ts b/apps/web/src/services/ops-flow/composables/use-task-type-form-mutations.ts
index 7e1e5d529d..8898f14e9a 100644
--- a/apps/web/src/services/ops-flow/composables/use-task-type-form-mutations.ts
+++ b/apps/web/src/services/ops-flow/composables/use-task-type-form-mutations.ts
@@ -5,6 +5,7 @@ import { isEqual } from 'lodash';
 
 import { useTaskTypeApi } from '@/api-clients/opsflow/task-type/composables/use-task-type-api';
 import type { TaskTypeModel } from '@/api-clients/opsflow/task-type/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -39,8 +40,12 @@ interface TaskTypeFormUpdateVariables {
 
 export const useTaskTypeFormMutations = () => {
     const taskManagementTemplateStore = useTaskManagementTemplateStore();
-    const { taskTypeAPI, taskTypeListQueryKey, taskTypeQueryKey } = useTaskTypeApi();
+    const { taskTypeAPI } = useTaskTypeApi();
     const queryClient = useQueryClient();
+
+    const { key: taskTypeListQueryKey } = useServiceQueryKey('opsflow', 'task-type', 'list');
+    const { withSuffix: taskTypeWithSuffix } = useServiceQueryKey('opsflow', 'task-type', 'get');
+
     /* create task type */
     const { mutateAsync: createTaskType, isPending: isCreating } = useMutation({
         mutationFn: ({ categoryId, form, fields }: TaskTypeFormCreateVariables) => taskTypeAPI.create({
@@ -64,18 +69,18 @@ export const useTaskTypeFormMutations = () => {
     /* update task type */
     const { mutateAsync: updateTaskTypeMutation, isPending: isUpdating } = useMutation({
         mutationFn: taskTypeAPI.update,
-        onSuccess: () => {
+        onSuccess: (data) => {
             // Invalidate task type detail and list queries
-            queryClient.invalidateQueries({ queryKey: taskTypeQueryKey.value });
+            queryClient.invalidateQueries({ queryKey: taskTypeWithSuffix(data.task_type_id) });
             queryClient.invalidateQueries({ queryKey: taskTypeListQueryKey.value });
         },
         throwOnError: true,
     });
     const { mutateAsync: updateTaskTypeFieldsMutation } = useMutation({
         mutationFn: taskTypeAPI.updateFields,
-        onSuccess: () => {
+        onSuccess: (data) => {
             // Only invalidate task type detail query
-            queryClient.invalidateQueries({ queryKey: taskTypeQueryKey.value });
+            queryClient.invalidateQueries({ queryKey: taskTypeWithSuffix(data.task_type_id) });
         },
         throwOnError: true,
     });
diff --git a/apps/web/src/services/ops-flow/composables/use-task-type-query.ts b/apps/web/src/services/ops-flow/composables/use-task-type-query.ts
index a89d7513c1..a4afb43ff1 100644
--- a/apps/web/src/services/ops-flow/composables/use-task-type-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-task-type-query.ts
@@ -5,20 +5,24 @@ import { useQuery } from '@tanstack/vue-query';
 
 import { useTaskTypeApi } from '@/api-clients/opsflow/task-type/composables/use-task-type-api';
 import type { TaskTypeGetParameters } from '@/api-clients/opsflow/task-type/schema/api-verbs/get';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 export const useTaskTypeQuery = ({
-    queryKey, enabled,
+    taskTypeId, params, enabled,
 }: {
-  queryKey: Ref<TaskTypeGetParameters>;
+  taskTypeId: Ref<string | undefined>;
+  params: Ref<TaskTypeGetParameters>;
   enabled?: Ref<boolean>;
 }) => {
-    const { taskTypeAPI, taskTypeQueryKey } = useTaskTypeApi();
+    const { taskTypeAPI } = useTaskTypeApi();
+    const { key: taskTypeQueryKey, params: taskTypeParams } = useServiceQueryKey('opsflow', 'task-type', 'get', {
+        contextKey: taskTypeId,
+        params: computed(() => params.value),
+    });
+
     const { data: taskType, error, isLoading } = useQuery({
-        queryKey: computed(() => [
-            ...taskTypeQueryKey.value,
-            queryKey.value,
-        ]),
-        queryFn: () => taskTypeAPI.get(queryKey.value),
+        queryKey: taskTypeQueryKey,
+        queryFn: () => taskTypeAPI.get(taskTypeParams.value),
         enabled,
         staleTime: 1000 * 60 * 5, // 5 minutes
         gcTime: 1000 * 60, // 1 minute
diff --git a/apps/web/src/services/ops-flow/composables/use-task-types-query.ts b/apps/web/src/services/ops-flow/composables/use-task-types-query.ts
index bba3a15c0f..6928b839b5 100644
--- a/apps/web/src/services/ops-flow/composables/use-task-types-query.ts
+++ b/apps/web/src/services/ops-flow/composables/use-task-types-query.ts
@@ -5,19 +5,24 @@ import { useQuery } from '@tanstack/vue-query';
 
 import { useTaskTypeApi } from '@/api-clients/opsflow/task-type/composables/use-task-type-api';
 import type { TaskTypeListParameters } from '@/api-clients/opsflow/task-type/schema/api-verbs/list';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 
 export const useTaskTypesQuery = ({
-    queryKey,
+    params,
     enabled,
 }: {
-  queryKey: Ref<TaskTypeListParameters>;
+  params: Ref<TaskTypeListParameters>;
   enabled?: Ref<boolean>;
 }) => {
-    const { taskTypeAPI, taskTypeListQueryKey } = useTaskTypeApi();
+    const { taskTypeAPI } = useTaskTypeApi();
+    const { key: taskTypeListQueryKey, params: taskTypeListParams } = useServiceQueryKey('opsflow', 'task-type', 'list', {
+        params: computed(() => params.value),
+    });
+
     const { data: taskTypes, isLoading, refetch } = useQuery({
-        queryKey: computed(() => [...taskTypeListQueryKey.value, queryKey.value]),
+        queryKey: taskTypeListQueryKey,
         queryFn: async () => {
-            const { results } = await taskTypeAPI.list(queryKey.value);
+            const { results } = await taskTypeAPI.list(taskTypeListParams.value);
             return results ?? [];
         },
         enabled,
diff --git a/apps/web/src/services/ops-flow/configurator.ts b/apps/web/src/services/ops-flow/configurator.ts
index 50575c6016..dc568c40b6 100644
--- a/apps/web/src/services/ops-flow/configurator.ts
+++ b/apps/web/src/services/ops-flow/configurator.ts
@@ -9,7 +9,6 @@ import type {
 } from '@/lib/config/global-config/types/type';
 import type { Menu } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
-import { initTaskManagementTemplate } from '@/lib/site-initializer/initTaskManagementTemplate';
 
 import adminOpsFlowRoutes from '@/services/ops-flow/routes/admin/routes';
 import opsFlowRoutes from '@/services/ops-flow/routes/routes';
@@ -34,8 +33,6 @@ class OpsFlowConfigurator implements FeatureConfigurator {
     }
 
     getMenu(): GeneratedMenuConfig {
-        initTaskManagementTemplate();
-
         const baseMenu: Menu = {
             id: MENU_ID.OPS_FLOW,
             needPermissionByRole: true,
diff --git a/apps/web/src/services/ops-flow/pages/OpsFlowLandingPage.vue b/apps/web/src/services/ops-flow/pages/OpsFlowLandingPage.vue
index 3b0cfa14f7..5df153f7dc 100644
--- a/apps/web/src/services/ops-flow/pages/OpsFlowLandingPage.vue
+++ b/apps/web/src/services/ops-flow/pages/OpsFlowLandingPage.vue
@@ -35,7 +35,7 @@ const categoriesWithTaskType = computed(() => {
 
 /* task types */
 const { taskTypes, isLoading: isLoadingTaskTypes } = useTaskTypesQuery({
-    queryKey: computed(() => ({
+    params: computed(() => ({
         query: {
             filter: [{ k: 'category_id', v: availableCategories.value?.map((c) => c.category_id), o: 'in' }],
         },
diff --git a/apps/web/src/services/ops-flow/pages/TaskCreatePage.vue b/apps/web/src/services/ops-flow/pages/TaskCreatePage.vue
index 7acfbc84b5..f54e7450c3 100644
--- a/apps/web/src/services/ops-flow/pages/TaskCreatePage.vue
+++ b/apps/web/src/services/ops-flow/pages/TaskCreatePage.vue
@@ -25,6 +25,7 @@ import {
 } from 'vue';
 import { useRouter, useRoute, onBeforeRouteLeave } from 'vue-router/composables';
 
+
 import { useMutation, useQueryClient } from '@tanstack/vue-query';
 import { isEmpty } from 'lodash';
 
@@ -33,6 +34,7 @@ import {
 } from '@cloudforet/mirinae';
 
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n as _i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -103,7 +105,8 @@ const { currentTaskType, isLoading } = useCurrentTaskType({
 });
 
 /* create task */
-const { taskAPI, taskListQueryKey } = useTaskApi();
+const { taskAPI } = useTaskApi();
+const { key: taskListQueryKey } = useServiceQueryKey('opsflow', 'task', 'list');
 const queryClient = useQueryClient();
 interface CreateTaskVariables {
     taskTypeId: string;
diff --git a/apps/web/src/services/ops-flow/pages/TaskDetailPage.vue b/apps/web/src/services/ops-flow/pages/TaskDetailPage.vue
index 99c8d5f76b..fb7d5fa01c 100644
--- a/apps/web/src/services/ops-flow/pages/TaskDetailPage.vue
+++ b/apps/web/src/services/ops-flow/pages/TaskDetailPage.vue
@@ -30,6 +30,7 @@ import {
 } from 'vue';
 import { useRoute, useRouter, onBeforeRouteLeave } from 'vue-router/composables';
 
+
 import { useMutation, useQueryClient } from '@tanstack/vue-query';
 import { isEqual } from 'lodash';
 
@@ -41,6 +42,7 @@ import type { TabItem } from '@cloudforet/mirinae/types/hooks/use-tab/type';
 
 import { useTaskApi } from '@/api-clients/opsflow/task/composables/use-task-api';
 import type { TaskModel } from '@/api-clients/opsflow/task/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { getParticle, i18n as _i18n } from '@/translations';
 
 import { useUserStore } from '@/store/user/user-store';
@@ -97,7 +99,8 @@ const {
 });
 
 /* task */
-const { taskListQueryKey, taskAPI } = useTaskApi();
+const { taskAPI } = useTaskApi();
+const { key: taskListQueryKey } = useServiceQueryKey('opsflow', 'task', 'list');
 const {
     data: task, queryKey: taskDetailQueryKey, isLoading: isLoadingTask, error: errorOnTask,
 } = useTaskQuery({
diff --git a/apps/web/src/services/ops-flow/pages/admin/AdminTaskCategoryDetailPageTaskTypeTab.vue b/apps/web/src/services/ops-flow/pages/admin/AdminTaskCategoryDetailPageTaskTypeTab.vue
index 7055e80751..01e870e027 100644
--- a/apps/web/src/services/ops-flow/pages/admin/AdminTaskCategoryDetailPageTaskTypeTab.vue
+++ b/apps/web/src/services/ops-flow/pages/admin/AdminTaskCategoryDetailPageTaskTypeTab.vue
@@ -42,7 +42,7 @@ const taskTypeFields = computed<DataTableField[]>(() => [
 ]);
 
 const { taskTypes, isLoading, refetch } = useTaskTypesQuery({
-    queryKey: computed(() => ({
+    params: computed(() => ({
         query: {
             filter: [{ k: 'category_id', v: taskCategoryPageStore.state.currentCategoryId, o: 'eq' }],
         },
diff --git a/apps/web/src/services/ops-flow/routes/routes.ts b/apps/web/src/services/ops-flow/routes/routes.ts
index a7a8455df9..0dee0f2288 100644
--- a/apps/web/src/services/ops-flow/routes/routes.ts
+++ b/apps/web/src/services/ops-flow/routes/routes.ts
@@ -1,16 +1,14 @@
 import type { RouteConfig } from 'vue-router';
 
 import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
+
 
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
 
 import { OPS_FLOW_ROUTE } from '@/services/ops-flow/routes/route-constant';
-import {
-    useTaskManagementTemplateStore,
-} from '@/services/ops-flow/task-management-templates/stores/use-task-management-template-store';
+import { useTaskManagementTemplateStore } from '@/services/ops-flow/task-management-templates/stores/use-task-management-template-store';
 
 const OpsFlowContainer = () => import('@/services/ops-flow/OpsFlowContainer.vue');
 
@@ -19,7 +17,6 @@ const BoardPage = () => import('@/services/ops-flow/pages/BoardPage.vue');
 const TaskDetailPage = () => import('@/services/ops-flow/pages/TaskDetailPage.vue');
 const TaskCreatePage = () => import('@/services/ops-flow/pages/TaskCreatePage.vue');
 
-const userStore = useUserStore(pinia);
 const taskManagementTemplateStore = useTaskManagementTemplateStore(pinia);
 const opsFlowRoutes: RouteConfig = {
     path: 'ops-flow',
@@ -28,7 +25,7 @@ const opsFlowRoutes: RouteConfig = {
         menuId: MENU_ID.OPS_FLOW,
         translationId: MENU_INFO_MAP[MENU_ID.OPS_FLOW].translationId,
     },
-    redirect: (to) => getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap),
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: OpsFlowContainer,
     children: [
         {
diff --git a/apps/web/src/services/ops-flow/task-management-templates/stores/use-task-management-template-store.ts b/apps/web/src/services/ops-flow/task-management-templates/stores/use-task-management-template-store.ts
index e3d92a1bec..8b52fad6b9 100644
--- a/apps/web/src/services/ops-flow/task-management-templates/stores/use-task-management-template-store.ts
+++ b/apps/web/src/services/ops-flow/task-management-templates/stores/use-task-management-template-store.ts
@@ -1,20 +1,23 @@
 import type { Ref } from 'vue';
-import { reactive, toRef, computed } from 'vue';
+import { computed, reactive, toRef } from 'vue';
 
 import { defineStore } from 'pinia';
 
+
 import { APIError } from '@cloudforet/core-lib/space-connector/error';
 
 import { i18n, type SupportLanguage } from '@/translations';
 
 
 import { usePublicConfigStore } from '@/store/config/public-config-store';
+import { pinia } from '@/store/pinia';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
 import type {
+    TaskManagementTemplate,
     TaskManagementTemplateType,
 } from '@/services/ops-flow/task-management-templates/types/task-management-template-type';
 
@@ -22,19 +25,8 @@ import en from '../translations/en.json';
 import ja from '../translations/ja.json';
 import ko from '../translations/ko.json';
 
-interface TaskManagementTemplate {
-    TemplateName: string;
-    Task: string;
-    TaskType: string;
-    TaskBoard: string;
-    TaskCategory: string;
-    taskTypes: string;
-    taskType: string;
-    task: string;
-    tasks: string;
-    landingDescription?: string;
-}
-const messages: Record<SupportLanguage, TaskManagementTemplate> = {
+
+export const TASK_MANAGEMENT_TEMPLATE_MESSAGES: Record<SupportLanguage, TaskManagementTemplate> = {
     en: en as unknown as TaskManagementTemplate,
     ja: ja as unknown as TaskManagementTemplate,
     ko: ko as unknown as TaskManagementTemplate,
@@ -46,12 +38,16 @@ interface TemplateData {
 interface LandingData {
     enabled: boolean;
 }
+interface LandingData {
+    enabled: boolean;
+}
 interface UseTaskManagementTemplateStoreState {
     templateId: TaskManagementTemplateType;
     enableLanding: boolean;
 }
+
 export const useTaskManagementTemplateStore = defineStore('task-management-template', () => {
-    const publicConfigStore = usePublicConfigStore();
+    const publicConfigStore = usePublicConfigStore(pinia);
     const publicConfigStoreGetters = publicConfigStore.getters;
 
     const templateData = toRef(publicConfigStoreGetters, 'TASK_TEMPLATE') as unknown as Ref<TemplateData|undefined>;
@@ -62,17 +58,12 @@ export const useTaskManagementTemplateStore = defineStore('task-management-templ
         enableLanding: true,
     });
 
-    const translate = (code: keyof TaskManagementTemplate, type?: TaskManagementTemplateType) => computed(() => {
-        const lang = i18n.locale as SupportLanguage;
-        const _type = type ?? state.templateId;
-        const msg = messages[lang][_type][code] || messages.en[_type][code];
-        return msg;
-    });
     const templates = computed<TaskManagementTemplate>(() => {
         const lang = i18n.locale as SupportLanguage;
         const type = state.templateId;
-        return messages[lang][type] || messages.en[type];
+        return TASK_MANAGEMENT_TEMPLATE_MESSAGES[lang][type] || TASK_MANAGEMENT_TEMPLATE_MESSAGES.en[type];
     });
+
     const setInitialTemplateId = async () => {
         if (templateData.value?.template_id) {
             state.templateId = templateData.value.template_id;
@@ -90,17 +81,7 @@ export const useTaskManagementTemplateStore = defineStore('task-management-templ
             ErrorHandler.handleError(e);
         }
     };
-    const updateTemplateId = async (templateId: TaskManagementTemplateType) => {
-        const prev = state.templateId;
-        state.templateId = templateId;
-        try {
-            await publicConfigStore.set<TemplateData>('TASK_TEMPLATE', { template_id: templateId });
-            showSuccessMessage(i18n.t('OPSFLOW.ALT_S_EDIT_TARGET', { target: i18n.t('OPSFLOW.TASK_MANAGEMENT.TEMPLATE_TYPE') }), '');
-        } catch (e) {
-            ErrorHandler.handleRequestError(e, i18n.t('OPSFLOW.ALT_E_EDIT_TARGET', { target: i18n.t('OPSFLOW.TASK_MANAGEMENT.TEMPLATE_TYPE') }));
-            state.templateId = prev;
-        }
-    };
+
     const setInitialLandingData = async () => {
         if (landingData.value?.enabled) {
             state.enableLanding = landingData.value.enabled;
@@ -119,6 +100,25 @@ export const useTaskManagementTemplateStore = defineStore('task-management-templ
         }
     };
 
+    const translate = (code: keyof TaskManagementTemplate, type?: TaskManagementTemplateType) => computed(() => {
+        const lang = i18n.locale as SupportLanguage;
+        const _type = type ?? state.templateId;
+        const msg = TASK_MANAGEMENT_TEMPLATE_MESSAGES[lang][_type][code] || TASK_MANAGEMENT_TEMPLATE_MESSAGES.en[_type][code];
+        return msg;
+    });
+
+    const updateTemplateId = async (templateId: TaskManagementTemplateType) => {
+        const prev = state.templateId;
+        state.templateId = templateId;
+        try {
+            await publicConfigStore.set<TemplateData>('TASK_TEMPLATE', { template_id: templateId });
+            showSuccessMessage(i18n.t('OPSFLOW.ALT_S_EDIT_TARGET', { target: i18n.t('OPSFLOW.TASK_MANAGEMENT.TEMPLATE_TYPE') }), '');
+        } catch (e) {
+            ErrorHandler.handleRequestError(e, i18n.t('OPSFLOW.ALT_E_EDIT_TARGET', { target: i18n.t('OPSFLOW.TASK_MANAGEMENT.TEMPLATE_TYPE') }));
+            state.templateId = prev;
+        }
+    };
+
     const updateLandingData = async (enabled: boolean) => {
         const prev = state.enableLanding;
         state.enableLanding = enabled;
@@ -137,6 +137,7 @@ export const useTaskManagementTemplateStore = defineStore('task-management-templ
             state.enableLanding = prev;
         }
     };
+
     return {
         state,
         translate,
diff --git a/apps/web/src/services/ops-flow/task-management-templates/types/task-management-template-type.ts b/apps/web/src/services/ops-flow/task-management-templates/types/task-management-template-type.ts
index ab473f6b07..08a1053c79 100644
--- a/apps/web/src/services/ops-flow/task-management-templates/types/task-management-template-type.ts
+++ b/apps/web/src/services/ops-flow/task-management-templates/types/task-management-template-type.ts
@@ -3,3 +3,16 @@ import type {
 } from '@/services/ops-flow/task-management-templates/constants/task-management-template-constant';
 
 export type TaskManagementTemplateType = typeof TASK_MANAGEMENT_TEMPLATE_TYPES[number];
+
+export interface TaskManagementTemplate {
+    TemplateName: string;
+    Task: string;
+    TaskType: string;
+    TaskBoard: string;
+    TaskCategory: string;
+    taskTypes: string;
+    taskType: string;
+    task: string;
+    tasks: string;
+    landingDescription?: string;
+}
diff --git a/apps/web/src/services/project/v1/components/ProjectDetailTabHeader.vue b/apps/web/src/services/project/v1/components/ProjectDetailTabHeader.vue
index a46aee7ad3..05e37a912a 100644
--- a/apps/web/src/services/project/v1/components/ProjectDetailTabHeader.vue
+++ b/apps/web/src/services/project/v1/components/ProjectDetailTabHeader.vue
@@ -34,11 +34,11 @@ import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
 import type { UserReferenceMap } from '@/store/reference/user-reference-store';
 
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { arrayToQueryString } from '@/lib/router-query-string';
@@ -62,7 +62,6 @@ import { useProjectDetailPageStore } from '@/services/project/v1/stores/project-
 import { useProjectTreeStore } from '@/services/project/v1/stores/project-tree-store';
 import { SERVICE_ACCOUNT_ROUTE } from '@/services/service-account/routes/route-constant';
 
-
 const ROLE_INFO_MAP = {
     [ROLE_TYPE.SYSTEM_ADMIN]: { icon: SystemAdminImage, label: 'System Admin' },
     [ROLE_TYPE.DOMAIN_ADMIN]: { icon: DomainAdminImage, label: 'Domain Admin' },
@@ -85,7 +84,7 @@ const projectDetailPageStore = useProjectDetailPageStore();
 const projectDetailPageState = projectDetailPageStore.state;
 const projectDetailPageGetters = projectDetailPageStore.getters;
 const projectTreeStore = useProjectTreeStore();
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
 
 const userWorkspaceStore = useUserWorkspaceStore();
 const allReferenceStore = useAllReferenceStore();
@@ -98,7 +97,7 @@ const queryHelper = new QueryHelper();
 const storeState = reactive({
     users: computed<UserReferenceMap>(() => allReferenceStore.getters.user),
     projects: computed(() => allReferenceStore.getters.project),
-    visibleAlertTab: computed<boolean>(() => visibleContents.value && (globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleProjectAlertTab ?? false)),
+    visibleAlertTab: computed<boolean>(() => visibleContents.value && (alertManagerUiAffectsSchema.value?.visibleProjectAlertTab ?? false)),
     costDataSource: computed<CostDataSourceReferenceMap>(() => allReferenceStore.getters.costDataSource),
 });
 const state = reactive({
diff --git a/apps/web/src/services/project/v1/components/ProjectMainProjectGroupFormModal.vue b/apps/web/src/services/project/v1/components/ProjectMainProjectGroupFormModal.vue
index 62fd0f1b4f..ed84a6396c 100644
--- a/apps/web/src/services/project/v1/components/ProjectMainProjectGroupFormModal.vue
+++ b/apps/web/src/services/project/v1/components/ProjectMainProjectGroupFormModal.vue
@@ -9,6 +9,7 @@ import { PButtonModal, PFieldGroup, PTextInput } from '@cloudforet/mirinae';
 
 import { useProjectGroupApi } from '@/api-clients/identity/project-group/composables/use-project-group-api';
 import type { ProjectGroupModel } from '@/api-clients/identity/project-group/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -86,7 +87,9 @@ watch(() => props.projectGroupId, async (after) => {
 }, { immediate: true });
 
 
-const { projectGroupAPI, projectGroupQueryKey, projectGroupListQueryKey } = useProjectGroupApi();
+const { projectGroupAPI } = useProjectGroupApi();
+const { key: projectGroupListQueryKey } = useServiceQueryKey('identity', 'project-group', 'list');
+const { withSuffix: projectGroupQueryKeyWithSuffix } = useServiceQueryKey('identity', 'project-group', 'get');
 const queryClient = useQueryClient();
 const { mutateAsync: createProjectGroup, isPending: isCreating } = useMutation({
     mutationFn: projectGroupAPI.create,
@@ -103,7 +106,7 @@ const { mutateAsync: updateProjectGroup, isPending: isUpdating } = useMutation({
     mutationFn: projectGroupAPI.update,
     onSuccess: (data) => {
         showSuccessMessage(i18n.t('PROJECT.LANDING.ALT_S_UPDATE_PROJECT_GROUP'), '');
-        queryClient.invalidateQueries({ queryKey: [...projectGroupQueryKey.value, data.project_group_id] });
+        queryClient.invalidateQueries({ queryKey: projectGroupQueryKeyWithSuffix(data.project_group_id) });
         queryClient.invalidateQueries({ queryKey: projectGroupListQueryKey.value });
     },
     onError: (e) => {
diff --git a/apps/web/src/services/project/v1/pages/ProjectDetailTabPage.vue b/apps/web/src/services/project/v1/pages/ProjectDetailTabPage.vue
index eed386b158..43fdcb9133 100644
--- a/apps/web/src/services/project/v1/pages/ProjectDetailTabPage.vue
+++ b/apps/web/src/services/project/v1/pages/ProjectDetailTabPage.vue
@@ -19,12 +19,11 @@ import { useReferenceRouter } from '@/router/composables/use-reference-router';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useDashboardStore } from '@/store/dashboard/dashboard-store';
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { ProjectGroupReferenceItem, ProjectGroupReferenceMap } from '@/store/reference/project-group-reference-store';
 import { useUserStore } from '@/store/user/user-store';
 
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
 import { MENU_ID } from '@/lib/menu/config';
 
 import { useContentsAccessibility } from '@/common/composables/contents-accessibility';
@@ -54,9 +53,8 @@ const allReferenceStore = useAllReferenceStore();
 const projectDetailPageStore = useProjectDetailPageStore();
 const projectDetailPageState = projectDetailPageStore.state;
 const userWorkspaceStore = useUserWorkspaceStore();
-const dashboardStore = useDashboardStore();
 const userStore = useUserStore();
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
 
 const { visibleContents } = useContentsAccessibility(MENU_ID.ALERT_MANAGER);
 const { getReferenceLocation } = useReferenceRouter();
@@ -70,7 +68,7 @@ const {
 } = useDashboardFolderQuery();
 
 const storeState = reactive({
-    visibleAlertTab: computed<boolean>(() => visibleContents.value && (globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleProjectAlertTab ?? false)),
+    visibleAlertTab: computed<boolean>(() => visibleContents.value && (alertManagerUiAffectsSchema.value?.visibleProjectAlertTab ?? false)),
     projectGroups: computed<ProjectGroupReferenceMap>(() => allReferenceStore.getters.projectGroup),
     currentWorkspaceId: computed(() => userWorkspaceStore.getters.currentWorkspaceId),
     language: computed<string|undefined>(() => userStore.state.language),
@@ -206,7 +204,6 @@ watch(() => state.favoriteOptions, (favoriteOptions) => {
 
 onUnmounted(() => {
     projectDetailPageStore.reset();
-    dashboardStore.reset();
 });
 </script>
 
diff --git a/apps/web/src/services/project/v1/pages/ProjectSummaryPage.vue b/apps/web/src/services/project/v1/pages/ProjectSummaryPage.vue
index 87446ccd1d..fdb83e4bee 100644
--- a/apps/web/src/services/project/v1/pages/ProjectSummaryPage.vue
+++ b/apps/web/src/services/project/v1/pages/ProjectSummaryPage.vue
@@ -11,8 +11,7 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ProjectAlertConfigListParameters } from '@/schema/monitoring/project-alert-config/api-verbs/list';
 import type { ProjectAlertConfigModel } from '@/schema/monitoring/project-alert-config/model';
 
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
-
+import { useGlobalConfigUiAffectsSchema } from '@/lib/config/global-config/composables/use-global-config-ui-affects-schema';
 import { MENU_ID } from '@/lib/menu/config';
 
 import { useContentsAccessibility } from '@/common/composables/contents-accessibility';
@@ -34,13 +33,13 @@ interface Props {
 }
 const props = defineProps<Props>();
 
-const globalConfigSchemaStore = useGlobalConfigSchemaStore();
+const alertManagerUiAffectsSchema = useGlobalConfigUiAffectsSchema('ALERT_MANAGER');
 
 const { visibleContents: visibleAssetContents } = useContentsAccessibility(MENU_ID.ASSET_INVENTORY);
 const { visibleContents: visibleAlertContents } = useContentsAccessibility(MENU_ID.ALERT_MANAGER);
 
 const state = reactive({
-    visibleAlertTab: computed<boolean>(() => visibleAlertContents.value && (globalConfigSchemaStore.state.uiAffectsSchema.ALERT_MANAGER?.visibleProjectAlertTab ?? false)),
+    visibleAlertTab: computed<boolean>(() => visibleAlertContents.value && (alertManagerUiAffectsSchema.value?.visibleProjectAlertTab ?? false)),
     hasAlertConfig: false,
     deprecatedNotiVisible: true,
 });
diff --git a/apps/web/src/services/project/v1/stores/project-page-store.ts b/apps/web/src/services/project/v1/stores/project-page-store.ts
index e9315e43f7..0774c56f7f 100644
--- a/apps/web/src/services/project/v1/stores/project-page-store.ts
+++ b/apps/web/src/services/project/v1/stores/project-page-store.ts
@@ -14,7 +14,7 @@ import type { ProjectUpdateParameters } from '@/api-clients/identity/project/sch
 import type { ProjectUpdateProjectTypeParameters } from '@/api-clients/identity/project/schema/api-verbs/update-project-type';
 import type { ProjectModel } from '@/api-clients/identity/project/schema/model';
 
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import getRandomId from '@/lib/random-id-generator';
 
@@ -24,13 +24,12 @@ import type {
 } from '@/common/modules/project/project-tree-type';
 import { useProjectTree } from '@/common/modules/project/use-project-tree';
 
-
 const projectTreeHelper = useProjectTree();
 export const useProjectPageStore = defineStore('page-project', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const _state = reactive({
-        currentRoleType: computed(() => userStore.state.currentRoleInfo?.roleType),
+        currentRoleType: computed(() => authorizationStore.state.currentRoleInfo?.roleType),
     });
     const state = reactive({
         projectTreeKey: getRandomId(),
diff --git a/apps/web/src/services/project/v2/components/ProjectDeleteModal.vue b/apps/web/src/services/project/v2/components/ProjectDeleteModal.vue
index 7fed8ddac8..6b37e69bf9 100644
--- a/apps/web/src/services/project/v2/components/ProjectDeleteModal.vue
+++ b/apps/web/src/services/project/v2/components/ProjectDeleteModal.vue
@@ -7,6 +7,7 @@ import { useQueryClient } from '@tanstack/vue-query';
 
 import { useProjectGroupApi } from '@/api-clients/identity/project-group/composables/use-project-group-api';
 import { useProjectApi } from '@/api-clients/identity/project/composables/use-project-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n as _i18n } from '@/translations';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
@@ -65,13 +66,16 @@ const handleConfirmDelete = async () => {
 };
 
 const queryClient = useQueryClient();
-const { projectAPI, projectListQueryKey, projectQueryKey } = useProjectApi();
+const { projectAPI } = useProjectApi();
+const { key: projectListQueryKey } = useServiceQueryKey('identity', 'project', 'list');
+const { withSuffix: projectQueryKeyWithSuffix } = useServiceQueryKey('identity', 'project', 'get');
+
 const deleteProject = async (projectId: string) => {
     await projectAPI.delete({
         project_id: projectId,
     });
     queryClient.invalidateQueries({ queryKey: projectListQueryKey.value });
-    queryClient.removeQueries({ queryKey: [...projectQueryKey.value, projectId] });
+    queryClient.removeQueries({ queryKey: projectQueryKeyWithSuffix(projectId) });
     await recentStore.deleteRecent({
         type: RECENT_TYPE.PROJECT,
         itemId: projectId,
@@ -86,13 +90,15 @@ const deleteProject = async (projectId: string) => {
         });
     }
 };
-const { projectGroupAPI, projectGroupListQueryKey, projectGroupQueryKey } = useProjectGroupApi();
+const { projectGroupAPI } = useProjectGroupApi();
+const { key: projectGroupListQueryKey } = useServiceQueryKey('identity', 'project-group', 'list');
+const { withSuffix: projectGroupQueryKeyWithSuffix } = useServiceQueryKey('identity', 'project-group', 'get');
 const deleteProjectGroup = async (projectGroupId: string) => {
     await projectGroupAPI.delete({
         project_group_id: projectGroupId,
     });
     queryClient.invalidateQueries({ queryKey: projectGroupListQueryKey.value });
-    queryClient.removeQueries({ queryKey: [...projectGroupQueryKey.value, projectGroupId] });
+    queryClient.removeQueries({ queryKey: projectGroupQueryKeyWithSuffix(projectGroupId) });
     showSuccessMessage(_i18n.t('PROJECT.LANDING.ALT_S_DELETE_PROJECT_GROUP'), '');
     const isFavoriteItem = favoriteGetters.projectGroupItems.find((item) => item.itemId === projectGroupId);
     if (isFavoriteItem) {
diff --git a/apps/web/src/services/project/v2/components/ProjectGroupCreateModal.vue b/apps/web/src/services/project/v2/components/ProjectGroupCreateModal.vue
index 7edba46885..777638b1e2 100644
--- a/apps/web/src/services/project/v2/components/ProjectGroupCreateModal.vue
+++ b/apps/web/src/services/project/v2/components/ProjectGroupCreateModal.vue
@@ -8,6 +8,7 @@ import { useMutation, useQueryClient } from '@tanstack/vue-query';
 import { PButtonModal, PFieldGroup, PTextInput } from '@cloudforet/mirinae';
 
 import { useProjectGroupApi } from '@/api-clients/identity/project-group/composables/use-project-group-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -56,7 +57,8 @@ watch(visible, (v) => {
 
 
 /* mutations */
-const { projectGroupAPI, projectGroupListQueryKey } = useProjectGroupApi();
+const { projectGroupAPI } = useProjectGroupApi();
+const { key: projectGroupListQueryKey } = useServiceQueryKey('identity', 'project-group', 'list');
 const queryClient = useQueryClient();
 
 const { mutateAsync: createProjectGroup, isPending: isCreating } = useMutation({
diff --git a/apps/web/src/services/project/v2/components/ProjectGroupMemberManagementModal.vue b/apps/web/src/services/project/v2/components/ProjectGroupMemberManagementModal.vue
index 0aa0d15051..d86555394b 100644
--- a/apps/web/src/services/project/v2/components/ProjectGroupMemberManagementModal.vue
+++ b/apps/web/src/services/project/v2/components/ProjectGroupMemberManagementModal.vue
@@ -13,10 +13,11 @@ import type { SelectDropdownMenuItem } from '@cloudforet/mirinae/types/controls/
 
 import { useProjectGroupApi } from '@/api-clients/identity/project-group/composables/use-project-group-api';
 import type { ProjectGroupRemoveUsersParameters } from '@/api-clients/identity/project-group/schema/api-verbs/remove-users';
+import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useUserReferenceStore } from '@/store/reference/user-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
@@ -31,8 +32,8 @@ const visible = computed(() => projectPageModalStore.state.projectGroupMemberMod
 const targetId = computed(() => projectPageModalStore.state.targetId);
 
 /* mode */
-const userStore = useUserStore();
-const readonlyMode = computed<boolean>(() => userStore.state.currentRoleInfo?.roleType !== 'WORKSPACE_OWNER');
+const authorizationStore = useAuthorizationStore();
+const readonlyMode = computed<boolean>(() => authorizationStore.state.currentRoleInfo?.roleType !== ROLE_TYPE.WORKSPACE_OWNER);
 
 /* project group users */
 const { projectGroupAPI } = useProjectGroupApi();
diff --git a/apps/web/src/services/project/v2/components/ProjectGroupRenameModal.vue b/apps/web/src/services/project/v2/components/ProjectGroupRenameModal.vue
index 30009af577..50103f140f 100644
--- a/apps/web/src/services/project/v2/components/ProjectGroupRenameModal.vue
+++ b/apps/web/src/services/project/v2/components/ProjectGroupRenameModal.vue
@@ -8,6 +8,7 @@ import { useMutation, useQueryClient } from '@tanstack/vue-query';
 import { PButtonModal, PFieldGroup, PTextInput } from '@cloudforet/mirinae';
 
 import { useProjectGroupApi } from '@/api-clients/identity/project-group/composables/use-project-group-api';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
@@ -66,7 +67,8 @@ watch([visible, projectGroup], async ([v, pg]) => {
 
 
 /* mutations */
-const { projectGroupAPI, projectGroupListQueryKey } = useProjectGroupApi();
+const { projectGroupAPI } = useProjectGroupApi();
+const { key: projectGroupListQueryKey } = useServiceQueryKey('identity', 'project-group', 'list');
 const queryClient = useQueryClient();
 
 const { mutateAsync: updateProjectGroup, isPending: isUpdating } = useMutation({
diff --git a/apps/web/src/services/project/v2/components/ProjectMoveModal.vue b/apps/web/src/services/project/v2/components/ProjectMoveModal.vue
index b94237a42c..f5931a1111 100644
--- a/apps/web/src/services/project/v2/components/ProjectMoveModal.vue
+++ b/apps/web/src/services/project/v2/components/ProjectMoveModal.vue
@@ -6,10 +6,12 @@ import { useMutation, useQueryClient } from '@tanstack/vue-query';
 import { PButtonModal, PRadio, PRadioGroup } from '@cloudforet/mirinae';
 
 import { useProjectGroupApi } from '@/api-clients/identity/project-group/composables/use-project-group-api';
+import type { ProjectGroupModel } from '@/api-clients/identity/project-group/schema/model';
 import { useProjectApi } from '@/api-clients/identity/project/composables/use-project-api';
+import type { ProjectModel } from '@/api-clients/identity/project/schema/model';
+import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
-
 import { showSuccessMessage } from '@/lib/helper/notice-alert-helper';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
@@ -59,8 +61,12 @@ const getIsValid = (_isProject: boolean, selectProjectGroup: boolean, selectedPr
 };
 
 /* mutations */
-const { projectAPI, projectListQueryKey, projectQueryKey } = useProjectApi();
-const { projectGroupAPI, projectGroupListQueryKey, projectGroupQueryKey } = useProjectGroupApi();
+const { projectAPI } = useProjectApi();
+const { key: projectListQueryKey } = useServiceQueryKey('identity', 'project', 'list');
+const { withSuffix: projectQueryKeyWithSuffix } = useServiceQueryKey('identity', 'project', 'get');
+const { projectGroupAPI } = useProjectGroupApi();
+const { key: projectGroupListQueryKey } = useServiceQueryKey('identity', 'project-group', 'list');
+const { withSuffix: projectGroupQueryKeyWithSuffix } = useServiceQueryKey('identity', 'project-group', 'get');
 const queryClient = useQueryClient();
 
 const { mutateAsync: changeProjectGroup } = useMutation({
@@ -68,25 +74,26 @@ const { mutateAsync: changeProjectGroup } = useMutation({
         if (!targetId.value) throw new Error('No target id');
         const _projectGroupId = state.selectProjectGroup ? state.selectedProjectGroupIdList[0] : null;
         if (isProject.value) {
-            await projectAPI.changeProjectGroup({
+            return projectAPI.changeProjectGroup({
                 project_id: targetId.value,
                 project_group_id: _projectGroupId,
             });
-        } else {
-            await projectGroupAPI.changeParentGroup({
-                project_group_id: targetId.value,
-                parent_group_id: _projectGroupId,
-            });
         }
+        return projectGroupAPI.changeParentGroup({
+            project_group_id: targetId.value,
+            parent_group_id: _projectGroupId,
+        });
     },
-    onSuccess: () => {
+    onSuccess: (data) => {
         showSuccessMessage(i18n.t('PROJECT.LANDING.ALT_S_UPDATE_PROJECT_GROUP'), '');
         if (isProject.value) {
+            const _project = data as ProjectModel;
             queryClient.invalidateQueries({ queryKey: projectListQueryKey.value });
-            queryClient.invalidateQueries({ queryKey: [...projectQueryKey.value, targetId.value] });
+            queryClient.invalidateQueries({ queryKey: projectQueryKeyWithSuffix(_project.project_id) });
         } else {
+            const _projectGroup = data as ProjectGroupModel;
             queryClient.invalidateQueries({ queryKey: projectGroupListQueryKey.value });
-            queryClient.invalidateQueries({ queryKey: [...projectGroupQueryKey.value, targetId.value] });
+            queryClient.invalidateQueries({ queryKey: projectGroupQueryKeyWithSuffix(_projectGroup.project_group_id) });
         }
     },
     onError: (e) => {
diff --git a/apps/web/src/services/project/v2/composables/queries/use-project-query.ts b/apps/web/src/services/project/v2/composables/queries/use-project-query.ts
index b05b3a6af5..ec5578186e 100644
--- a/apps/web/src/services/project/v2/composables/queries/use-project-query.ts
+++ b/apps/web/src/services/project/v2/composables/queries/use-project-query.ts
@@ -18,6 +18,7 @@ enabled?: Ref<boolean>|boolean;
 }) => {
     const { projectAPI } = useProjectApi();
     const { key: projectQueryKey, params } = useServiceQueryKey('identity', 'project', 'get', {
+        contextKey: projectId,
         params: computed<ProjectGetParameters>(() => ({ project_id: projectId.value as string })),
     });
 
diff --git a/apps/web/src/services/service-account/pages/ServiceAccountDetailPage.vue b/apps/web/src/services/service-account/pages/ServiceAccountDetailPage.vue
index be0610068c..19317e2daa 100644
--- a/apps/web/src/services/service-account/pages/ServiceAccountDetailPage.vue
+++ b/apps/web/src/services/service-account/pages/ServiceAccountDetailPage.vue
@@ -20,12 +20,11 @@ import type { TrustedAccountGetParameters } from '@/api-clients/identity/trusted
 import type { TrustedAccountModel } from '@/api-clients/identity/trusted-account/schema/model';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { ProjectReferenceMap } from '@/store/reference/project-reference-store';
 import type { ProviderReferenceMap } from '@/store/reference/provider-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import type { MenuId } from '@/lib/menu/config';
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -58,7 +57,7 @@ const serviceAccountSchemaStore = useServiceAccountSchemaStore();
 const serviceAccountPageStore = useServiceAccountPageStore();
 const allReferenceStore = useAllReferenceStore();
 const appContextStore = useAppContextStore();
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const route = useRoute();
 
@@ -69,8 +68,7 @@ const storeState = reactive({
         ? serviceAccountSchemaStore.getters.trustedAccountSchema?.options?.external_link
         : serviceAccountSchemaStore.getters.generalAccountSchema?.options?.external_link)),
     isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-    isWorkspaceMember: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
+    isWorkspaceMember: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 });
 const state = reactive({
     loading: true,
@@ -83,7 +81,7 @@ const state = reactive({
         }
         return targetMenuId;
     }),
-    hasReadWriteAccess: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[state.selectedMenuId]?.write),
+    hasReadWriteAccess: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[state.selectedMenuId]?.write),
     originServiceAccountItem: computed(() => serviceAccountPageStore.state.originServiceAccountItem),
     serviceAccountType: computed(() => serviceAccountPageStore.state.serviceAccountType),
     isTrustedAccount: computed(() => state.serviceAccountType === ACCOUNT_TYPE.TRUSTED),
diff --git a/apps/web/src/services/service-account/pages/ServiceAccountPage.vue b/apps/web/src/services/service-account/pages/ServiceAccountPage.vue
index 263aff2a68..b7fb65daf7 100644
--- a/apps/web/src/services/service-account/pages/ServiceAccountPage.vue
+++ b/apps/web/src/services/service-account/pages/ServiceAccountPage.vue
@@ -33,13 +33,13 @@ import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { CURRENCY_SYMBOL } from '@/store/display/constant';
 import type { Currency } from '@/store/display/type';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { ProviderReferenceMap, ProviderItem } from '@/store/reference/provider-reference-store';
 import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { dynamicFieldsToExcelDataFields } from '@/lib/excel-export';
 import { FILE_NAME_PREFIX } from '@/lib/excel-export/constant';
 import { downloadExcel } from '@/lib/helper/file-download-helper';
@@ -83,6 +83,7 @@ const userWorkspaceStore = useUserWorkspaceStore();
 const appContextStore = useAppContextStore();
 const allReferenceStore = useAllReferenceStore();
 const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 
 const { hasReadWriteAccess } = usePageEditableStatus();
@@ -90,7 +91,6 @@ const { referenceFieldFormatter } = useReferenceFieldFormatter();
 
 
 const storeState = reactive({
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
     currency: computed<Currency|undefined>(() => serviceAccountPageGetters.currency),
 });
 const state = reactive({
@@ -107,7 +107,7 @@ const state = reactive({
     selectedProviderName: computed(() => state.providers[state.selectedProvider]?.label),
     timezone: computed<string>(() => userStore.state.timezone || 'UTC'),
     grantLoading: computed(() => appContextStore.getters.globalGrantLoading),
-    currentGrantInfo: computed(() => userStore.state.currentGrantInfo),
+    currentGrantInfo: computed(() => authorizationStore.state.currentGrantInfo),
     isAgentModeAccount: computed(() => state.selectedProvider === 'kubernetes'),
 });
 
@@ -130,7 +130,7 @@ const typeOptionState = reactive({
 });
 
 const tableState = reactive({
-    isWorkspaceMember: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
     items: [] as ServiceAccountModel[] | TrustedAccountModel[],
     schema: computed<QuerySearchTableLayout|undefined>(() => (tableState.isTrustedAccount
         ? serviceAccountSchemaState.trustedAccountTableSchema : serviceAccountSchemaState.generalAccountTableSchema)),
diff --git a/apps/web/src/services/service-account/routes/routes.ts b/apps/web/src/services/service-account/routes/routes.ts
index 23dffa3474..f4b4827da1 100644
--- a/apps/web/src/services/service-account/routes/routes.ts
+++ b/apps/web/src/services/service-account/routes/routes.ts
@@ -1,8 +1,5 @@
 import type { RouteConfig } from 'vue-router';
 
-import { pinia } from '@/store/pinia';
-import { useUserStore } from '@/store/user/user-store';
-
 import { getRedirectRouteByPagePermission } from '@/lib/access-control/redirect-route-helper';
 import { MENU_ID } from '@/lib/menu/config';
 import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
@@ -18,11 +15,10 @@ const ServiceAccountDetailPage = () => import('@/services/service-account/pages/
 const ServiceAccountAddPage = () => import('@/services/service-account/pages/ServiceAccountAddPage.vue');
 
 
-const userStore = useUserStore(pinia);
 const serviceAccountRoute: RouteConfig = {
     path: 'service-account',
     meta: { menuId: MENU_ID.SERVICE_ACCOUNT, translationId: MENU_INFO_MAP[MENU_ID.SERVICE_ACCOUNT].translationId },
-    redirect: (to) => getRedirectRouteByPagePermission(to, userStore.getters.pageAccessPermissionMap),
+    redirect: (to) => getRedirectRouteByPagePermission(to),
     component: ServiceAccountContainer,
     children: [
         {
diff --git a/apps/web/src/services/workspace-home/components/BookmarkBoard.vue b/apps/web/src/services/workspace-home/components/BookmarkBoard.vue
index 780465e3ee..df56488e71 100644
--- a/apps/web/src/services/workspace-home/components/BookmarkBoard.vue
+++ b/apps/web/src/services/workspace-home/components/BookmarkBoard.vue
@@ -13,7 +13,7 @@ import type { UserConfigModel } from '@/api-clients/config/user-config/schema/mo
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 
@@ -46,10 +46,10 @@ const bookmarkState = bookmarkStore.state;
 const workspaceHomePageStore = useWorkspaceHomePageStore();
 const workspaceHomePageState = workspaceHomePageStore.state;
 const workspaceHomePageGetters = workspaceHomePageStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const storeState = reactive({
-    isWorkspaceMember: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 
     selectedBookmarks: computed<BookmarkItem[]>(() => bookmarkState.selectedBookmarks),
     bookmarkType: computed<BookmarkType|undefined>(() => bookmarkState.bookmarkType),
diff --git a/apps/web/src/services/workspace-home/components/BookmarkFullMode.vue b/apps/web/src/services/workspace-home/components/BookmarkFullMode.vue
index 0270eb6583..d4b03ec7c6 100644
--- a/apps/web/src/services/workspace-home/components/BookmarkFullMode.vue
+++ b/apps/web/src/services/workspace-home/components/BookmarkFullMode.vue
@@ -3,7 +3,7 @@ import { computed, reactive } from 'vue';
 
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
 import { useBookmarkStore } from '@/common/components/bookmark/store/bookmark-store';
 import type { BookmarkItem } from '@/common/components/bookmark/type/type';
@@ -26,13 +26,13 @@ const bookmarkStore = useBookmarkStore();
 const bookmarkState = bookmarkStore.state;
 const workspaceHomePageStore = useWorkspaceHomePageStore();
 const workspaceHomePageState = workspaceHomePageStore.state;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const storeState = reactive({
     bookmarkType: computed<BookmarkType|undefined>(() => bookmarkState.bookmarkType),
 
     isFileFullMode: computed<boolean>(() => workspaceHomePageState.isFileFullMode),
-    isWorkspaceMember: computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
+    isWorkspaceMember: computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
 });
 </script>
 
diff --git a/apps/web/src/services/workspace-home/components/UserConfigRecent.vue b/apps/web/src/services/workspace-home/components/UserConfigRecent.vue
index 829775d414..a9eadc905e 100644
--- a/apps/web/src/services/workspace-home/components/UserConfigRecent.vue
+++ b/apps/web/src/services/workspace-home/components/UserConfigRecent.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed, reactive } from 'vue';
-import { useRoute } from 'vue-router/composables';
+import { useRoute, useRouter } from 'vue-router/composables';
 
 import { PFieldTitle } from '@cloudforet/mirinae';
 
@@ -8,7 +8,6 @@ import type { UserConfigModel } from '@/api-clients/config/user-config/schema/mo
 import type { CostQuerySetModel } from '@/api-clients/cost-analysis/cost-query-set/schema/model';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useDisplayStore } from '@/store/display/display-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CloudServiceTypeReferenceMap } from '@/store/reference/cloud-service-type-reference-store';
 import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
@@ -26,15 +25,17 @@ import {
     convertProjectConfigToReferenceData,
     convertProjectGroupConfigToReferenceData,
 } from '@/lib/helper/config-data-helper';
+import { useAllMenuList } from '@/lib/menu/use-all-menu-list';
 
+import { useGlobalDashboardQuery } from '@/common/composables/global-dashboard/use-global-dashboard-query';
 import { useGnbStore } from '@/common/modules/navigations/stores/gnb-store';
 import { RECENT_TYPE } from '@/common/modules/navigations/type';
 
-import { useDashboardQuery } from '@/services/dashboards/composables/use-dashboard-query';
 import UserConfigsItem from '@/services/workspace-home/components/UserConfigsItem.vue';
 import { useWorkspaceHomePageStore } from '@/services/workspace-home/store/workspace-home-page-store';
 
 const route = useRoute();
+const router = useRouter();
 
 const userWorkspaceStore = useUserWorkspaceStore();
 const userWorkspaceStoreGetters = userWorkspaceStore.getters;
@@ -44,15 +45,15 @@ const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
 const workspaceHomePageStore = useWorkspaceHomePageStore();
 const workspaceHomePageState = workspaceHomePageStore.state;
-const displayStore = useDisplayStore();
+const { getAllMenuList } = useAllMenuList();
 
 /* Query */
 const {
-    publicDashboardList,
-    privateDashboardList,
-} = useDashboardQuery();
+    publicDashboardListQuery,
+    privateDashboardListQuery,
+} = useGlobalDashboardQuery();
 
-const dashboardList = computed(() => [...publicDashboardList.value, ...privateDashboardList.value]);
+const dashboardList = computed(() => [...(publicDashboardListQuery?.data?.value ?? []), ...(privateDashboardListQuery?.data?.value ?? [])]);
 const storeState = reactive({
     currentWorkspaceId: computed<string|undefined>(() => userWorkspaceStoreGetters.currentWorkspaceId),
     costQuerySets: computed<CostQuerySetModel[]>(() => gnbStoreGetters.costQuerySets),
@@ -88,7 +89,7 @@ const convertRecentToReferenceData = (recentConfig: ConfigData): ReferenceData =
     if (itemType === RECENT_TYPE.COST_ANALYSIS) {
         return convertCostAnalysisConfigToReferenceData([recentConfig], storeState.costQuerySets, storeState.costDataSource)[0];
     }
-    const allMenuList = displayStore.getAllMenuList(route);
+    const allMenuList = getAllMenuList(route, router);
     return convertMenuConfigToReferenceData([recentConfig], allMenuList)[0];
 };
 </script>
diff --git a/apps/web/src/services/workspace-home/components/WorkspaceInfo.vue b/apps/web/src/services/workspace-home/components/WorkspaceInfo.vue
index b2c8a4ff1c..8d8e95d990 100644
--- a/apps/web/src/services/workspace-home/components/WorkspaceInfo.vue
+++ b/apps/web/src/services/workspace-home/components/WorkspaceInfo.vue
@@ -15,9 +15,8 @@ import { i18n } from '@/translations';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { MENU_ID } from '@/lib/menu/config';
 
 import FavoriteButton from '@/common/modules/favorites/favorite-button/FavoriteButton.vue';
@@ -51,7 +50,7 @@ const appPageStore = useAppPageStore();
 const appContextStore = useAppContextStore();
 const workspaceHomePageStore = useWorkspaceHomePageStore();
 const workspaceHomePageState = workspaceHomePageStore.state;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const router = useRouter();
 
@@ -61,7 +60,6 @@ const storeState = reactive({
     workspaceList: computed<WorkspaceModel[]>(() => userWorkspaceGetters.workspaceList),
     workspaceUserTotalCount: computed<number|undefined>(() => workspaceHomePageState.workspaceUserTotalCount),
     appsTotalCount: computed<number|undefined>(() => workspaceHomePageState.appsTotalCount),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 const state = reactive({
     selectedWorkspace: computed<WorkspaceModel>(() => storeState.workspaceList.find((workspace) => workspace.workspace_id === storeState.currentWorkspace?.workspace_id) || {} as WorkspaceModel),
@@ -183,7 +181,7 @@ const routerToWorkspaceUser = (isOpenModal: boolean) => {
                         </div>
                     </div>
                 </template>
-                <template v-if="props.accessUserMenu && storeState.pageAccessPermissionMap[MENU_ID.USER].write"
+                <template v-if="props.accessUserMenu && authorizationStore.getters.pageAccessPermissionMap[MENU_ID.USER]?.write"
                           #extra
                 >
                     <p-button style-type="tertiary"
diff --git a/apps/web/src/services/workspace-home/pages/WorkspaceHomePage.vue b/apps/web/src/services/workspace-home/pages/WorkspaceHomePage.vue
index 543033ad4a..9768fcc2f1 100644
--- a/apps/web/src/services/workspace-home/pages/WorkspaceHomePage.vue
+++ b/apps/web/src/services/workspace-home/pages/WorkspaceHomePage.vue
@@ -9,13 +9,12 @@ import type { UserConfigModel } from '@/api-clients/config/user-config/schema/mo
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
+import type { RoleInfo } from '@/store/authorization/type';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CollectorReferenceMap } from '@/store/reference/collector-reference-store';
 import type { ServiceAccountReferenceMap } from '@/store/reference/service-account-reference-store';
-import type { RoleInfo } from '@/store/user/type';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { MENU_ID } from '@/lib/menu/config';
 
 import GeneralPageLayout from '@/common/modules/page-layouts/GeneralPageLayout.vue';
@@ -34,26 +33,25 @@ const workspaceHomePageStore = useWorkspaceHomePageStore();
 const workspaceHomePageState = workspaceHomePageStore.state;
 const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const { dataSource } = useCostDataSourceQuery({
     enabled: computed(() => !!userWorkspaceGetters.currentWorkspaceId),
 });
 
 const storeState = reactive({
-    getCurrentRoleInfo: computed<RoleInfo|undefined>(() => userStore.state.currentRoleInfo),
+    getCurrentRoleInfo: computed<RoleInfo|undefined>(() => authorizationStore.state.currentRoleInfo),
     currentWorkspaceId: computed<string|undefined>(() => userWorkspaceGetters.currentWorkspaceId),
     recentList: computed<UserConfigModel[]>(() => workspaceHomePageState.recentList),
     collectors: computed<CollectorReferenceMap>(() => allReferenceGetters.collector),
     serviceAccounts: computed<ServiceAccountReferenceMap>(() => allReferenceGetters.serviceAccount),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 const state = reactive({
     loading: false,
     isWorkspaceOwner: computed<boolean>(() => storeState.getCurrentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_OWNER),
     isWorkspaceMember: computed<boolean>(() => storeState.getCurrentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER),
-    accessUserMenu: computed<boolean>(() => !isEmpty(storeState.pageAccessPermissionMap[MENU_ID.USER]) && state.isWorkspaceOwner),
-    accessAppMenu: computed<boolean>(() => !isEmpty(storeState.pageAccessPermissionMap[MENU_ID.APP]) && state.isWorkspaceOwner),
+    accessUserMenu: computed<boolean>(() => !isEmpty(authorizationStore.getters.pageAccessPermissionMap[MENU_ID.USER]) && state.isWorkspaceOwner),
+    accessAppMenu: computed<boolean>(() => !isEmpty(authorizationStore.getters.pageAccessPermissionMap[MENU_ID.APP]) && state.isWorkspaceOwner),
     isNoServiceAccounts: computed(() => !Object.keys(storeState.serviceAccounts).length),
     isNoCollectors: computed<boolean>(() => !Object.keys(storeState.collectors).length),
 });
diff --git a/apps/web/src/services/workspace-home/shared/components/AccountSummary.vue b/apps/web/src/services/workspace-home/shared/components/AccountSummary.vue
index 3bc51b8ead..a36a01a60b 100644
--- a/apps/web/src/services/workspace-home/shared/components/AccountSummary.vue
+++ b/apps/web/src/services/workspace-home/shared/components/AccountSummary.vue
@@ -22,11 +22,10 @@ import { useServiceQueryKey } from '@/query/query-key/use-service-query-key';
 import { i18n } from '@/translations';
 
 import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { ProviderReferenceMap } from '@/store/reference/provider-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -50,7 +49,7 @@ const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
 const userWorkspaceStore = useUserWorkspaceStore();
 const userWorkspaceGetters = userWorkspaceStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const totalChartContext = ref<HTMLElement|null>(null);
 const providerChartContext = ref<HTMLElement|null>(null);
@@ -58,7 +57,6 @@ const providerChartContext = ref<HTMLElement|null>(null);
 const storeState = reactive({
     currentWorkspaceId: computed<string|undefined>(() => userWorkspaceGetters.currentWorkspaceId),
     provider: computed<ProviderReferenceMap>(() => allReferenceGetters.provider),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
 });
 
 const { serviceAccountAPI } = useServiceAccountApi();
@@ -89,8 +87,8 @@ const { data: serviceAccountData, isLoading: isLoadingServiceAccount } = useScop
 }, ['WORKSPACE']);
 
 const state = reactive({
-    accessLink: computed<boolean>(() => !isEmpty(storeState.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT])),
-    writableServiceAccount: computed<boolean|undefined>(() => storeState.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT]?.write),
+    accessLink: computed<boolean>(() => !isEmpty(authorizationStore.getters.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT])),
+    writableServiceAccount: computed<boolean|undefined>(() => authorizationStore.getters.pageAccessPermissionMap[MENU_ID.SERVICE_ACCOUNT]?.write),
     emptyData: computed<EmptyData|undefined>(() => {
         let result: EmptyData|undefined;
         if (isEmpty(serviceAccountData.value?.results)) {
diff --git a/apps/web/src/services/workspace-home/shared/components/AssetSummary.vue b/apps/web/src/services/workspace-home/shared/components/AssetSummary.vue
index 58bcabe24f..e97b52b577 100644
--- a/apps/web/src/services/workspace-home/shared/components/AssetSummary.vue
+++ b/apps/web/src/services/workspace-home/shared/components/AssetSummary.vue
@@ -9,10 +9,10 @@ import {
 
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { CollectorReferenceMap } from '@/store/reference/collector-reference-store';
 import type { ServiceAccountReferenceMap } from '@/store/reference/service-account-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
 import type { PageAccessMap } from '@/lib/access-control/config';
 import { MENU_ID } from '@/lib/menu/config';
@@ -42,12 +42,12 @@ const props = withDefaults(defineProps<{
 
 const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const storeState = reactive({
     serviceAccounts: computed<ServiceAccountReferenceMap>(() => allReferenceGetters.serviceAccount),
     collectors: computed<CollectorReferenceMap>(() => allReferenceGetters.collector),
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
+    pageAccessPermissionMap: computed<PageAccessMap>(() => authorizationStore.getters.pageAccessPermissionMap),
 });
 const state = reactive({
     isNoCollectors: computed<boolean>(() => !Object.keys(storeState.collectors).length),
diff --git a/apps/web/src/services/workspace-home/shared/components/AssetSummaryDailyUpdateItem.vue b/apps/web/src/services/workspace-home/shared/components/AssetSummaryDailyUpdateItem.vue
index 3b6e9108e5..6bedd8008f 100644
--- a/apps/web/src/services/workspace-home/shared/components/AssetSummaryDailyUpdateItem.vue
+++ b/apps/web/src/services/workspace-home/shared/components/AssetSummaryDailyUpdateItem.vue
@@ -5,9 +5,8 @@ import { isEmpty } from 'lodash';
 
 import { PLazyImg, PI } from '@cloudforet/mirinae';
 
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -23,13 +22,10 @@ interface Props extends DailyUpdateItem {
 
 const props = defineProps<Props>();
 
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
-const storeState = reactive({
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
-});
 const state = reactive({
-    accessLink: computed<boolean>(() => !isEmpty(storeState.pageAccessPermissionMap[MENU_ID.METRIC_EXPLORER])),
+    accessLink: computed<boolean>(() => !isEmpty(authorizationStore.getters.pageAccessPermissionMap[MENU_ID.METRIC_EXPLORER])),
     // dailyUpdateItem: computed<CloudServiceItem>(() => ({
     //     cloudServiceGroup: props.item.cloudServiceGroup,
     //     cloudServiceType: props.item.cloudServiceType,
diff --git a/apps/web/src/services/workspace-home/shared/components/AssetSummaryProviderItem.vue b/apps/web/src/services/workspace-home/shared/components/AssetSummaryProviderItem.vue
index d8b4cba1b8..60dc0e9a1d 100644
--- a/apps/web/src/services/workspace-home/shared/components/AssetSummaryProviderItem.vue
+++ b/apps/web/src/services/workspace-home/shared/components/AssetSummaryProviderItem.vue
@@ -7,9 +7,8 @@ import { isEmpty } from 'lodash';
 import { PLazyImg, PTextButton } from '@cloudforet/mirinae';
 import { byteFormatter, numberFormatter } from '@cloudforet/utils';
 
-import { useUserStore } from '@/store/user/user-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 import { MENU_ID } from '@/lib/menu/config';
 
@@ -27,12 +26,10 @@ const props = defineProps<AssetProviderItem>();
 
 const router = useRouter();
 
-const userStore = useUserStore();
-const storeState = reactive({
-    pageAccessPermissionMap: computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap),
-});
+const authorizationStore = useAuthorizationStore();
+
 const state = reactive({
-    accessLink: computed<boolean>(() => !isEmpty(storeState.pageAccessPermissionMap[MENU_ID.METRIC_EXPLORER])),
+    accessLink: computed<boolean>(() => !isEmpty(authorizationStore.getters.pageAccessPermissionMap[MENU_ID.METRIC_EXPLORER])),
 });
 const handleClickButton = (type: string) => {
     if (!state.accessLink) return;
diff --git a/apps/web/src/services/workspace-home/shared/components/CostSummary.vue b/apps/web/src/services/workspace-home/shared/components/CostSummary.vue
index ca56f34b29..d866ea870e 100644
--- a/apps/web/src/services/workspace-home/shared/components/CostSummary.vue
+++ b/apps/web/src/services/workspace-home/shared/components/CostSummary.vue
@@ -15,10 +15,10 @@ import {
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 import { i18n } from '@/translations';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import { CURRENCY, CURRENCY_SYMBOL } from '@/store/display/constant';
 import type { Currency } from '@/store/display/type';
 import { useProjectReferenceStore, type ProjectReferenceMap } from '@/store/reference/project-reference-store';
-import { useUserStore } from '@/store/user/user-store';
 
 import type { PageAccessMap } from '@/lib/access-control/config';
 import { currencyMoneyFormatter } from '@/lib/helper/currency-helper';
@@ -64,9 +64,9 @@ const period = computed<Period>(() => {
 });
 
 /* permission */
-const userStore = useUserStore();
-const isWorkspaceMember = computed(() => userStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER);
-const pageAccessPermissionMap = computed<PageAccessMap>(() => userStore.getters.pageAccessPermissionMap);
+const authorizationStore = useAuthorizationStore();
+const isWorkspaceMember = computed(() => authorizationStore.state.currentRoleInfo?.roleType === ROLE_TYPE.WORKSPACE_MEMBER);
+const pageAccessPermissionMap = computed<PageAccessMap>(() => authorizationStore.getters.pageAccessPermissionMap);
 
 /* project select dropdown */
 const showProjectSelectDropdown = computed(() => {
@@ -204,17 +204,16 @@ const currentDateRangeText = computed<string>(() => {
                            size="lg"
                            class="main-title"
             />
-            <project-select-dropdown
-                v-if="showProjectSelectDropdown && !isEmpty(projects)"
-                class="project-select-dropdown"
-                :selected-project-ids="selectedProjects"
-                :use-fixed-menu-style="false"
-                project-selectable
-                position="right"
-                hide-create-button
-                :selection-label="$t('HOME.COST_SUMMARY_BY_PROJECT')"
-                :project-group-selectable="false"
-                @update:selected-project-ids="handleSelectedProject"
+            <project-select-dropdown v-if="showProjectSelectDropdown && !isEmpty(projects)"
+                                     class="project-select-dropdown"
+                                     :selected-project-ids="selectedProjects"
+                                     :use-fixed-menu-style="false"
+                                     project-selectable
+                                     position="right"
+                                     hide-create-button
+                                     :selection-label="$t('HOME.COST_SUMMARY_BY_PROJECT')"
+                                     :project-group-selectable="false"
+                                     @update:selected-project-ids="handleSelectedProject"
             />
         </div>
         <div v-if="isLoading"
diff --git a/apps/web/src/services/workspace-home/shared/components/EmptySummaryData.vue b/apps/web/src/services/workspace-home/shared/components/EmptySummaryData.vue
index 34cc551984..947081f77a 100644
--- a/apps/web/src/services/workspace-home/shared/components/EmptySummaryData.vue
+++ b/apps/web/src/services/workspace-home/shared/components/EmptySummaryData.vue
@@ -8,10 +8,10 @@ import { PI, PTextButton } from '@cloudforet/mirinae';
 
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
+import type { RoleInfo } from '@/store/authorization/type';
 import { useAllReferenceStore } from '@/store/reference/all-reference-store';
 import type { ProjectReferenceMap } from '@/store/reference/project-reference-store';
-import type { RoleInfo } from '@/store/user/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import {
     green, indigo, peacock, violet,
@@ -39,12 +39,12 @@ const props = withDefaults(defineProps<Props>(), {
 
 const allReferenceStore = useAllReferenceStore();
 const allReferenceGetters = allReferenceStore.getters;
-const userStore = useUserStore();
+const authorizationStore = useAuthorizationStore();
 
 const router = useRouter();
 
 const storeState = reactive({
-    getCurrentRoleInfo: computed<RoleInfo|undefined>(() => userStore.state.currentRoleInfo),
+    getCurrentRoleInfo: computed<RoleInfo|undefined>(() => authorizationStore.state.currentRoleInfo),
     projects: computed<ProjectReferenceMap>(() => allReferenceGetters.project),
 });
 const state = reactive({
diff --git a/apps/web/src/services/workspace-home/shared/composables/use-asset-daily-updates.ts b/apps/web/src/services/workspace-home/shared/composables/use-asset-daily-updates.ts
index 54d6da927d..5dfb626214 100644
--- a/apps/web/src/services/workspace-home/shared/composables/use-asset-daily-updates.ts
+++ b/apps/web/src/services/workspace-home/shared/composables/use-asset-daily-updates.ts
@@ -41,6 +41,7 @@ const useDailyUpdateAnalyzeQuery = (label: UpdateLabel, opts: {
     const metricId = `metric-managed-${label}-count`;
 
     const { key, params } = useServiceQueryKey('inventory', 'metric-data', 'analyze', {
+        contextKey: [mode?.value, metricId],
         params: computed(() => {
             const today = dayjs.utc().format('YYYY-MM-DD');
             const filter = projectIds?.value?.length ? [{
@@ -66,16 +67,15 @@ const useDailyUpdateAnalyzeQuery = (label: UpdateLabel, opts: {
                 },
             };
         }),
-        contextKey: [mode?.value, metricId],
     });
 
 
     const { data, isLoading } = useScopedQuery({
         queryKey: key,
-        queryFn: () => metricDataAPI.analyze<AnalyzeResult>(params.value),
+        queryFn: () => metricDataAPI.analyze(params.value),
         select: (response): SelectResult[] => {
             const results = response.results ?? [];
-            return results.map((i) => ({
+            return results.map((i: AnalyzeResult) => ({
                 cloudServiceGroup: i['Cloud Service Group'],
                 cloudServiceType: i['Cloud Service Type'],
                 provider: i.Provider,
diff --git a/apps/web/src/services/workspace-home/shared/composables/use-asset-summary-providers.ts b/apps/web/src/services/workspace-home/shared/composables/use-asset-summary-providers.ts
index e1b399c85c..a05b5f9ea5 100644
--- a/apps/web/src/services/workspace-home/shared/composables/use-asset-summary-providers.ts
+++ b/apps/web/src/services/workspace-home/shared/composables/use-asset-summary-providers.ts
@@ -34,6 +34,7 @@ const useResourceMetricQuery = (resourceType: ResourceLabel, opts: {
     const metricId = `metric-managed-${resourceType}-${metricType}`;
 
     const { key, params } = useServiceQueryKey('inventory', 'metric-data', 'analyze', {
+        contextKey: [mode.value, metricId],
         params: computed(() => {
             const today = dayjs.utc().format('YYYY-MM-DD');
             const filter = projectIds?.value?.length ? [{
@@ -59,7 +60,6 @@ const useResourceMetricQuery = (resourceType: ResourceLabel, opts: {
                 },
             };
         }),
-        contextKey: [mode.value, metricId],
     });
 
     return useScopedQuery({
diff --git a/apps/web/src/services/workspace-home/shared/composables/use-cost-chart-data.ts b/apps/web/src/services/workspace-home/shared/composables/use-cost-chart-data.ts
index 55264d9347..a8ae015d8e 100644
--- a/apps/web/src/services/workspace-home/shared/composables/use-cost-chart-data.ts
+++ b/apps/web/src/services/workspace-home/shared/composables/use-cost-chart-data.ts
@@ -61,6 +61,7 @@ export const useCostChartData = ({
 
     // Use service query key for analyze
     const { key, params } = useServiceQueryKey('cost-analysis', 'unified-cost', 'analyze', {
+        contextKey: mode,
         params: computed<UnifiedCostAnalyzeParameters>(() => ({
             query: {
                 start: period.value.start,
@@ -79,7 +80,6 @@ export const useCostChartData = ({
                 ] : undefined,
             },
         })),
-        contextKey: mode,
     });
 
     const {
diff --git a/apps/web/src/store/authorization/authorization-store.ts b/apps/web/src/store/authorization/authorization-store.ts
new file mode 100644
index 0000000000..93926803b6
--- /dev/null
+++ b/apps/web/src/store/authorization/authorization-store.ts
@@ -0,0 +1,296 @@
+import { computed, reactive } from 'vue';
+
+import type { AxiosRequestConfig } from 'axios';
+import { jwtDecode } from 'jwt-decode';
+import { isEmpty } from 'lodash';
+import { defineStore } from 'pinia';
+
+import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
+import { getCancellableFetcher } from '@cloudforet/core-lib/space-connector/cancellable-fetcher';
+import { isInstanceOfAPIError } from '@cloudforet/core-lib/space-connector/error';
+
+import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
+import type { RoleGetParameters } from '@/api-clients/identity/role/schema/api-verbs/get';
+import type { RoleModel } from '@/api-clients/identity/role/schema/model';
+import type { RoleType } from '@/api-clients/identity/role/type';
+import type { TokenGrantParameters } from '@/api-clients/identity/token/schema/api-verbs/grant';
+import type { TokenIssueParameters } from '@/api-clients/identity/token/schema/api-verbs/issue';
+import type { TokenGrantModel, TokenIssueModel } from '@/api-clients/identity/token/schema/model';
+
+import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
+import { MANAGED_ROLES } from '@/store/authorization/constant';
+import type {
+    RoleInfo, JWTPayload, GrantInfo, SignInRequest,
+} from '@/store/authorization/type';
+import { useMenuStore } from '@/store/menu/menu-store';
+import { pinia } from '@/store/pinia';
+
+import type { PageAccessMap } from '@/lib/access-control/config';
+import {
+    checkAllMenuReadonly,
+    getDefaultPageAccessPermissionList,
+    getMinimalPageAccessPermissionList,
+    getPageAccessMapFromRawData,
+} from '@/lib/access-control/page-access-helper';
+import type { MenuId } from '@/lib/menu/config';
+import { setCurrentAccessedWorkspaceId } from '@/lib/site-initializer/last-accessed-workspace';
+
+
+interface AuthorizationStoreState {
+    currentRoleInfo?: RoleInfo;
+    currentGrantInfo?: GrantInfo;
+    grantAccessFailStatus: boolean;
+}
+
+export const useAuthorizationStore = defineStore('authorization', () => {
+    const appContextStore = useAppContextStore(pinia);
+    const userWorkspaceStore = useUserWorkspaceStore(pinia);
+    const menuStore = useMenuStore(pinia);
+
+    const state = reactive<AuthorizationStoreState>({
+        currentRoleInfo: undefined,
+        currentGrantInfo: undefined,
+        grantAccessFailStatus: false,
+    });
+
+    const getters = reactive({
+        isNoRoleUser: computed<boolean>(() => !state.currentRoleInfo),
+        hasPermission: computed<boolean>(() => !!state.currentRoleInfo),
+        pageAccessPermissionList: computed<MenuId[]>(() => {
+            const roleType = state.currentRoleInfo?.roleType ?? 'USER';
+            const roleBasePagePermissions = state.currentRoleInfo?.pageAccess ?? ['my_page.*'];
+            const pagePermissionMap = getPageAccessMapFromRawData({
+                pageAccessPermissions: roleBasePagePermissions,
+                menuList: menuStore.getters.menuList,
+            });
+            const minimalPagePermissionList = getMinimalPageAccessPermissionList(roleType);
+            const defaultPagePermissionList = getDefaultPageAccessPermissionList(roleType);
+
+            Object.keys(pagePermissionMap).forEach((menuId) => {
+                if (minimalPagePermissionList.includes(menuId as MenuId)) pagePermissionMap[menuId] = { read: true, write: true, access: true };
+            });
+            let result = [...minimalPagePermissionList];
+            Object.keys(pagePermissionMap).forEach((menuId) => {
+                const _menuId = menuId as MenuId;
+                if (defaultPagePermissionList.includes(_menuId) && !minimalPagePermissionList.includes(_menuId) && pagePermissionMap[_menuId].access) result = [...result, _menuId];
+            });
+
+            return result;
+        }),
+        pageAccessPermissionMap: computed<PageAccessMap>(() => {
+            const result: PageAccessMap = {};
+
+            const roleType = state.currentRoleInfo?.roleType ?? 'USER';
+            const roleBasePagePermissions = state.currentRoleInfo?.pageAccess ?? ['my_page.*'];
+            const pagePermissionMap = getPageAccessMapFromRawData({
+                pageAccessPermissions: roleBasePagePermissions,
+                menuList: menuStore.getters.menuList,
+            });
+            const minimalPagePermissionList = getMinimalPageAccessPermissionList(roleType);
+
+            const isAllReadOnly = checkAllMenuReadonly(roleBasePagePermissions);
+
+            getters.pageAccessPermissionList.forEach((menuId) => {
+                if (!result[menuId]) {
+                    if (roleType === ROLE_TYPE.DOMAIN_ADMIN) {
+                        result[menuId] = {
+                            write: !isAllReadOnly,
+                        };
+                    } else {
+                        result[menuId] = {
+                            write: minimalPagePermissionList.includes(menuId) ? true : pagePermissionMap[menuId]?.write,
+                        };
+                    }
+                }
+            });
+            return result;
+        }),
+    });
+
+    const mutations = {
+        setCurrentRoleInfo: (roleInfo?: RoleInfo) => {
+            state.currentRoleInfo = roleInfo;
+        },
+        setCurrentGrantInfo: (grantInfo?: GrantInfo) => {
+            state.currentGrantInfo = grantInfo;
+        },
+        setGrantAccessFailStatus: (status: boolean) => {
+            state.grantAccessFailStatus = status;
+        },
+    };
+
+    const signIn = async (signInRequest: SignInRequest): Promise<void> => {
+        const domainId = signInRequest.domainId;
+        let response;
+
+        if (signInRequest.authType === 'SAML') {
+            response = await SpaceConnector.clientV2.identity.token.grant<TokenGrantParameters, TokenGrantModel>({
+                grant_type: 'REFRESH_TOKEN',
+                scope: 'USER',
+                token: signInRequest.credentials.refreshToken,
+            }, { skipAuthRefresh: true });
+            SpaceConnector.setToken(response.access_token, signInRequest.credentials.refreshToken);
+        } else {
+            response = await SpaceConnector.clientV2.identity.token.issue<TokenIssueParameters, TokenIssueModel>({
+                domain_id: domainId,
+                auth_type: signInRequest.authType,
+                credentials: signInRequest.credentials,
+                verify_code: signInRequest.verify_code,
+            }, { skipAuthRefresh: true });
+            SpaceConnector.setToken(response.access_token, response.refresh_token);
+        }
+
+        if (isEmpty(response)) {
+            throw new Error();
+        }
+    };
+    const signOut = () => {
+        SpaceConnector.flushToken();
+        state.currentGrantInfo = undefined;
+        state.currentRoleInfo = undefined;
+    };
+
+    const grantRole = async (grantRequest: Omit<TokenGrantParameters, 'grant_type'>): Promise<boolean> => {
+        const fetcher = getCancellableFetcher(SpaceConnector.clientV2.identity.token.grant)<TokenGrantParameters, TokenGrantModel>;
+        let isGranted = false;
+
+        try {
+            // This is for not-triggered CASE, such as when user use browser back button.
+            appContextStore.setGlobalGrantLoading(true);
+            const { status, response } = await fetcher({
+                grant_type: 'REFRESH_TOKEN',
+                scope: grantRequest.scope,
+                token: grantRequest.token,
+                workspace_id: grantRequest.workspace_id,
+            }, { skipAuthRefresh: true } as AxiosRequestConfig);
+            if (status === 'succeed') {
+                SpaceConnector.setToken(response.access_token);
+                const currentRoleType = _getRoleTypeFromToken(response.access_token);
+
+                const rootRoleInfo = await _getGrantedRole(response.role_id, currentRoleType);
+                state.currentGrantInfo = {
+                    scope: grantRequest.scope,
+                    workspaceId: grantRequest.workspace_id,
+                    pageAccess: rootRoleInfo?.pageAccess || undefined,
+                };
+
+                const currentRoleInfo = await _getGrantedRole(response.role_id, currentRoleType, response.role_type);
+                state.currentRoleInfo = currentRoleInfo;
+
+                if (grantRequest.scope === 'DOMAIN') {
+                    appContextStore.enterAdminMode();
+                } else appContextStore.exitAdminMode();
+                if (grantRequest.scope === 'WORKSPACE' && grantRequest.workspace_id) {
+                    userWorkspaceStore.setCurrentWorkspace(grantRequest.workspace_id);
+                    await setCurrentAccessedWorkspaceId(grantRequest.workspace_id);
+                }
+                if (grantRequest.scope === 'USER') userWorkspaceStore.setCurrentWorkspace();
+
+                if (currentRoleInfo) {
+                    isGranted = true;
+                }
+                state.grantAccessFailStatus = false;
+            }
+        } catch (error) {
+            console.error(error);
+            /*
+            * Unlike other cases where the ErrorHandler is used for error handling,
+            * in the grant logic scenario, there can be instances where the Router
+            * has not been initialized yet. Using the ErrorHandler in such situations
+            * can lead to issues since it internally relies on the router.
+            * Therefore, in this specific case, errors are simply logged to the console
+            * and not further processed, to avoid complications with uninitialized Router instances.
+            * */
+            state.currentGrantInfo = undefined;
+            state.currentRoleInfo = undefined;
+            userWorkspaceStore.setCurrentWorkspace();
+            appContextStore.exitAdminMode();
+
+            if (isInstanceOfAPIError(error)) {
+                if (error.code === 'ERROR_WORKSPACE_STATE') {
+                    state.grantAccessFailStatus = true;
+                } else if (error.code === 'ERROR_NOT_FOUND') {
+                    state.grantAccessFailStatus = true;
+                } else if (error.code === 'ERROR_PERMISSION_DENIED') {
+                    state.grantAccessFailStatus = true;
+                } else if (error.code === 'ERROR_AUTHENTICATE_FAILURE') {
+                    SpaceConnector.flushToken();
+                } else {
+                    SpaceConnector.flushToken();
+                }
+            } else {
+                SpaceConnector.flushToken();
+            }
+        } finally {
+            /*
+            * Implemented a global loading with a minimum duration of 500 milliseconds
+            * during the grant process to prevent rendering of services until the process is complete.
+            * */
+            setTimeout(() => {
+                appContextStore.setGlobalGrantLoading(false);
+            }, 500);
+        }
+        return isGranted;
+    };
+
+    const actions = {
+        grantRole,
+        signIn,
+        signOut,
+    };
+
+    return {
+        state,
+        getters,
+        ...mutations,
+        ...actions,
+    };
+});
+
+
+const _getGrantedRole = async (roleId: string, currentRoleType: RoleType, baseRoleType?: RoleType): Promise<RoleInfo|undefined> => {
+    // DOMAIN_ADMIN -> enter workspace case
+    if (baseRoleType === ROLE_TYPE.DOMAIN_ADMIN && currentRoleType === ROLE_TYPE.WORKSPACE_OWNER) {
+        return {
+            roleType: ROLE_TYPE.WORKSPACE_OWNER,
+            roleId: 'managed-workspace-owner',
+            pageAccess: ['*'],
+        };
+    }
+    // USER -> grant USER case
+    if (currentRoleType === ROLE_TYPE.USER) {
+        return undefined;
+    }
+
+    // MANAGED_ROLE case
+    const MANAGED_ROLE_IDS: string[] = Object.keys(MANAGED_ROLES);
+    const isManagedRole = MANAGED_ROLE_IDS.includes(roleId);
+    if (isManagedRole) {
+        return {
+            roleType: MANAGED_ROLES[roleId],
+            roleId,
+            pageAccess: ['*'],
+        };
+    }
+
+    // normal case
+    try {
+        const response = await SpaceConnector.clientV2.identity.role.get<RoleGetParameters, RoleModel>({
+            role_id: roleId,
+        });
+
+        return {
+            roleType: response.role_type,
+            roleId: response.role_id,
+            pageAccess: response.page_access,
+        };
+    } catch (e) {
+        console.error(`Role Load Error: ${e}`);
+        return undefined;
+    }
+};
+const _getRoleTypeFromToken = (token: string): RoleType => {
+    const decodedToken = jwtDecode<JWTPayload>(token);
+    return decodedToken.rol;
+};
diff --git a/apps/web/src/store/authorization/constant.ts b/apps/web/src/store/authorization/constant.ts
new file mode 100644
index 0000000000..4d1ffa504a
--- /dev/null
+++ b/apps/web/src/store/authorization/constant.ts
@@ -0,0 +1,8 @@
+import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
+
+export const MANAGED_ROLES = {
+    'managed-system-admin': ROLE_TYPE.SYSTEM_ADMIN,
+    'managed-domain-admin': ROLE_TYPE.DOMAIN_ADMIN,
+    'managed-workspace-owner': ROLE_TYPE.WORKSPACE_OWNER,
+    'managed-workspace-member': ROLE_TYPE.WORKSPACE_MEMBER,
+} as const;
diff --git a/apps/web/src/store/authorization/type.ts b/apps/web/src/store/authorization/type.ts
new file mode 100644
index 0000000000..39fb7a4a26
--- /dev/null
+++ b/apps/web/src/store/authorization/type.ts
@@ -0,0 +1,29 @@
+import type { RoleType } from '@/api-clients/identity/role/type';
+import type { GrantScope } from '@/api-clients/identity/token/schema/type';
+import type { AuthType } from '@/api-clients/identity/user/schema/type';
+
+export interface RoleInfo {
+    roleType: RoleType;
+    roleId: string;
+    pageAccess: string[];
+}
+
+export interface GrantInfo {
+    scope: GrantScope;
+    workspaceId?: string;
+    pageAccess?: string[];
+}
+
+export interface SignInRequest {
+    credentials: Record<string, any>;
+    authType: AuthType | 'SAML';
+    timeout?: number;
+    refresh_count?: number;
+    verify_code?: string;
+    domainId: string;
+}
+
+export interface JWTPayload {
+    rol: RoleType;
+}
+
diff --git a/apps/web/src/store/config/public-config-store.ts b/apps/web/src/store/config/public-config-store.ts
index 7a2b324f23..3de31718c1 100644
--- a/apps/web/src/store/config/public-config-store.ts
+++ b/apps/web/src/store/config/public-config-store.ts
@@ -13,7 +13,7 @@ import type { PublicConfigModel } from '@/api-clients/config/public-config/schem
 import type { PublicConfigKey } from '@/api-clients/config/public-config/schema/type';
 
 import { useDomainStore } from '@/store/domain/domain-store';
-
+import { pinia } from '@/store/pinia';
 
 
 interface UsePublicConfigStoreState {
@@ -22,7 +22,7 @@ interface UsePublicConfigStoreState {
 type UsePublicConfigStoreGetters = Record<PublicConfigKey, Ref<PublicConfigModel|undefined>>;
 
 export const usePublicConfigStore = defineStore('public-config', () => {
-    const domainStore = useDomainStore();
+    const domainStore = useDomainStore(pinia);
     const state = reactive<UsePublicConfigStoreState>({
         publicConfigMap: {},
     });
diff --git a/apps/web/src/store/dashboard/dashboard-store.ts b/apps/web/src/store/dashboard/dashboard-store.ts
deleted file mode 100644
index b4420384f7..0000000000
--- a/apps/web/src/store/dashboard/dashboard-store.ts
+++ /dev/null
@@ -1,192 +0,0 @@
-import { computed, reactive } from 'vue';
-
-import { cloneDeep } from 'lodash';
-import { defineStore } from 'pinia';
-
-import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
-import { getCancellableFetcher } from '@cloudforet/core-lib/space-connector/cancellable-fetcher';
-import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
-
-import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
-import type {
-    DashboardType,
-    DashboardFolderType,
-    DashboardModel,
-    DashboardListParams,
-    DashboardUpdateParams,
-} from '@/api-clients/dashboard/_types/dashboard-type';
-import type { FolderModel } from '@/api-clients/dashboard/_types/folder-type';
-import type { PrivateDashboardModel } from '@/api-clients/dashboard/private-dashboard/schema/model';
-import type { PrivateFolderModel } from '@/api-clients/dashboard/private-folder/schema/model';
-import type { PublicDashboardModel } from '@/api-clients/dashboard/public-dashboard/schema/model';
-import type { PublicFolderModel } from '@/api-clients/dashboard/public-folder/schema/model';
-
-import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useAllReferenceStore } from '@/store/reference/all-reference-store';
-import type { CostDataSourceReferenceMap } from '@/store/reference/cost-data-source-reference-store';
-import { useUserStore } from '@/store/user/user-store';
-
-import ErrorHandler from '@/common/composables/error/errorHandler';
-
-
-export const useDashboardStore = defineStore('dashboard', () => {
-    const appContextStore = useAppContextStore();
-    const userWorkspaceStore = useUserWorkspaceStore();
-    const allReferenceStore = useAllReferenceStore();
-    const userStore = useUserStore();
-
-    const _state = reactive({
-        isAdminMode: computed(() => appContextStore.getters.isAdminMode),
-        currentWorkspace: computed(() => userWorkspaceStore.getters.currentWorkspace),
-        currentWorkspaceId: computed(() => userWorkspaceStore.getters.currentWorkspaceId),
-        costDataSource: computed<CostDataSourceReferenceMap>(() => allReferenceStore.getters.costDataSource),
-        userId: computed<string|undefined>(() => userStore.state.userId),
-    });
-    const state = reactive({
-        publicDashboardItems: [] as PublicDashboardModel[],
-        privateDashboardItems: [] as PrivateDashboardModel[],
-        publicFolderItems: [] as PublicFolderModel[],
-        privateFolderItems: [] as PrivateFolderModel[],
-        loading: true,
-    });
-
-    /* Mutations */
-    const reset = () => {
-        state.publicDashboardItems = [];
-        state.privateDashboardItems = [];
-        state.publicFolderItems = [];
-        state.privateFolderItems = [];
-        state.loading = true;
-    };
-
-    /* Actions */
-    const fetchApiQueryHelper = new ApiQueryHelper();
-    const privateDashboardListFetcher = getCancellableFetcher<DashboardListParams, ListResponse<DashboardModel>>(SpaceConnector.clientV2.dashboard.privateDashboard.list);
-    const publicDashboardListFetcher = getCancellableFetcher<DashboardListParams, ListResponse<DashboardModel>>(SpaceConnector.clientV2.dashboard.publicDashboard.list);
-    const _fetchDashboard = async (dashboardType: DashboardType) => {
-        const fetcher = dashboardType === 'PRIVATE' ? privateDashboardListFetcher : publicDashboardListFetcher;
-        try {
-            fetchApiQueryHelper.setFilters([]);
-            if (dashboardType === 'PUBLIC') {
-                if (_state.isAdminMode) {
-                    fetchApiQueryHelper.addFilter({ k: 'resource_group', v: 'DOMAIN', o: '=' });
-                } else {
-                    fetchApiQueryHelper.addFilter({ k: 'resource_group', v: ['WORKSPACE', 'DOMAIN'], o: '=' });
-                }
-            }
-            const { status, response } = await fetcher({
-                query: {
-                    ...fetchApiQueryHelper.data,
-                    sort: [{ key: 'name', desc: false }],
-                },
-            });
-            if (status === 'succeed') {
-                const results = response.results || [];
-                if (dashboardType === 'PRIVATE') {
-                    state.privateDashboardItems = results as PrivateDashboardModel[];
-                } else {
-                    state.publicDashboardItems = results as PublicDashboardModel[];
-                }
-            }
-        } catch (e) {
-            ErrorHandler.handleError(e);
-            if (dashboardType === 'PRIVATE') {
-                state.privateDashboardItems = [];
-            } else {
-                state.publicDashboardItems = [];
-            }
-        }
-    };
-    const folderApiQueryHelper = new ApiQueryHelper();
-    const _fetchFolder = async (folderType: DashboardFolderType) => {
-        const fetcher = folderType === 'PRIVATE'
-            ? SpaceConnector.clientV2.dashboard.privateFolder.list
-            : SpaceConnector.clientV2.dashboard.publicFolder.list;
-        folderApiQueryHelper.setFilters([]);
-        try {
-            if (folderType === 'PUBLIC') {
-                if (_state.isAdminMode) {
-                    folderApiQueryHelper.addFilter({ k: 'resource_group', v: 'DOMAIN', o: '=' });
-                } else {
-                    folderApiQueryHelper.addFilter({ k: 'resource_group', v: ['WORKSPACE', 'DOMAIN'], o: '=' });
-                }
-            }
-            const res: ListResponse<FolderModel> = await fetcher({
-                query: {
-                    ...folderApiQueryHelper.data,
-                    sort: [{ key: 'name', desc: false }],
-                },
-            });
-            const results = res.results || [];
-            if (folderType === 'PRIVATE') {
-                state.privateFolderItems = results as PrivateFolderModel[];
-            } else {
-                state.publicFolderItems = results as PublicFolderModel[];
-            }
-        } catch (e) {
-            ErrorHandler.handleError(e);
-            if (folderType === 'PRIVATE') {
-                state.privateDashboardItems = [];
-            } else {
-                state.publicDashboardItems = [];
-            }
-        }
-    };
-    const load = async () => {
-        state.loading = true;
-        if (_state.isAdminMode) {
-            await Promise.all([
-                _fetchDashboard('PUBLIC'),
-                _fetchFolder('PUBLIC'),
-            ]);
-        } else {
-            await Promise.allSettled([
-                _fetchDashboard('PRIVATE'),
-                _fetchDashboard('PUBLIC'),
-                _fetchFolder('PRIVATE'),
-                _fetchFolder('PUBLIC'),
-            ]);
-        }
-        state.loading = false;
-    };
-
-    // dashboard
-    const updateDashboard = async (dashboardId: string, params: DashboardUpdateParams): Promise<DashboardModel> => {
-        const isPrivate = dashboardId?.startsWith('private');
-        const fetcher = isPrivate
-            ? SpaceConnector.clientV2.dashboard.privateDashboard.update
-            : SpaceConnector.clientV2.dashboard.publicDashboard.update;
-        try {
-            const result = await fetcher<DashboardUpdateParams, DashboardModel>({
-                ...params,
-                dashboard_id: dashboardId,
-            });
-            if (isPrivate) {
-                const targetIndex = state.privateDashboardItems.findIndex((item) => item.dashboard_id === dashboardId);
-                if (targetIndex !== -1) state.privateDashboardItems.splice(targetIndex, 1, result as PrivateDashboardModel);
-                state.privateDashboardItems = cloneDeep(state.privateDashboardItems);
-            } else {
-                const targetIndex = state.publicDashboardItems.findIndex((item) => item.dashboard_id === dashboardId);
-                if (targetIndex !== -1) state.publicDashboardItems.splice(targetIndex, 1, result as PublicDashboardModel);
-                state.publicDashboardItems = cloneDeep(state.publicDashboardItems);
-            }
-            return result;
-        } catch (e) {
-            ErrorHandler.handleError(e);
-            throw e;
-        }
-    };
-
-
-    const actions = {
-        load,
-        updateDashboard,
-        reset,
-    };
-
-    return {
-        state,
-        ...actions,
-    };
-});
diff --git a/apps/web/src/store/display/composables/use-advanced-menu-display.ts b/apps/web/src/store/display/composables/use-advanced-menu-display.ts
deleted file mode 100644
index a1f989a275..0000000000
--- a/apps/web/src/store/display/composables/use-advanced-menu-display.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-import type { DisplayMenu } from '@/store/display/type';
-
-import type { MenuId } from '@/lib/menu/config';
-import { MENU_ID } from '@/lib/menu/config';
-
-import { useContentsAccessibility } from '@/common/composables/contents-accessibility';
-
-import {
-    useTaskManagementTemplateStore,
-} from '@/services/ops-flow/task-management-templates/stores/use-task-management-template-store';
-
-const ADVANCED_SERVICE_NAMES: MenuId[] = [MENU_ID.OPS_FLOW];
-export const useAdvancedMenuDisplay = () => {
-    const taskManagementTemplateStore = useTaskManagementTemplateStore();
-
-    const isMenuDisplayable = (menuId: MenuId): boolean => {
-        if (!ADVANCED_SERVICE_NAMES.includes(menuId)) return true;
-        const { visibleContents } = useContentsAccessibility(menuId);
-        return !!visibleContents;
-    };
-
-    const refineOpsflowSubMenu = (menu: DisplayMenu): DisplayMenu[]|undefined => {
-        const sub = menu.subMenuList;
-        if (!sub) return undefined;
-        const refined: DisplayMenu[] = sub.map((s) => {
-            if (s.id === MENU_ID.OPS_FLOW_LANDING) {
-                const label = taskManagementTemplateStore.templates.TemplateName;
-                const hideOnGNB = taskManagementTemplateStore.state.templateId === 'default' || !taskManagementTemplateStore.state.enableLanding;
-                const hideOnSiteMap = taskManagementTemplateStore.state.templateId === 'default' || !taskManagementTemplateStore.state.enableLanding;
-                return {
-                    ...s,
-                    label,
-                    hideOnGNB,
-                    hideOnSiteMap,
-                };
-            }
-            if (s.id === MENU_ID.TASK_BOARD) {
-                const label = taskManagementTemplateStore.templates.TaskBoard;
-                return { ...s, label };
-            }
-            return s;
-        });
-
-        return refined;
-    };
-
-    const refineGNBMenuList = (allGNBMenuList: DisplayMenu[]): DisplayMenu[] => allGNBMenuList.filter((menu) => isMenuDisplayable(menu.id)).map((menu) => {
-        if (menu.id === MENU_ID.OPS_FLOW) {
-            return {
-                ...menu,
-                subMenuList: refineOpsflowSubMenu(menu),
-            };
-        }
-        return menu;
-    });
-    return {
-        refineGNBMenuList,
-    };
-};
diff --git a/apps/web/src/store/display/display-store.ts b/apps/web/src/store/display/display-store.ts
index 63bd0fc2f7..8256dbdf13 100644
--- a/apps/web/src/store/display/display-store.ts
+++ b/apps/web/src/store/display/display-store.ts
@@ -1,6 +1,4 @@
 import { computed, reactive } from 'vue';
-import type { RawLocation, Route } from 'vue-router';
-import type VueRouter from 'vue-router';
 
 import type { CancelTokenSource } from 'axios';
 import axios from 'axios';
@@ -14,86 +12,25 @@ import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
 import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
 
 import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
-import { SpaceRouter } from '@/router';
 import type { NotificationListParameters } from '@/schema/notification/notification/api-verbs/list';
 import type { NotificationModel } from '@/schema/notification/notification/model';
-import { i18n } from '@/translations';
 
-import { makeAdminRouteName } from '@/router/helpers/route-helper';
-
-import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useAdvancedMenuDisplay } from '@/store/display/composables/use-advanced-menu-display';
 import { SIDEBAR_TYPE } from '@/store/display/constant';
 import type {
-    DisplayMenu, DisplayStoreState, SidebarProps, SidebarType,
+    DisplayStoreState, SidebarProps, SidebarType,
     DisplayStoreGetters,
 } from '@/store/display/type';
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
+import { pinia } from '@/store/pinia';
 import { useUserStore } from '@/store/user/user-store';
 
-import type { Menu, MenuId, MenuInfo } from '@/lib/menu/config';
-import { MENU_ID } from '@/lib/menu/config';
-import { MENU_INFO_MAP } from '@/lib/menu/menu-info';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-const verbose = false;
-const filterMenuByRoute = (menuList: DisplayMenu[], router: VueRouter): DisplayMenu[] => menuList.reduce((results, _menu) => {
-    const userWorkspaceStore = useUserWorkspaceStore();
-    const targetWorkspaceId = userWorkspaceStore.getters.currentWorkspaceId;
-    const menu = { ..._menu };
-    if (menu.subMenuList) {
-        menu.subMenuList = filterMenuByRoute(menu.subMenuList, router);
-        if (menu.subMenuList.length) {
-            results.push(menu);
-            return results;
-        }
-    }
-
-    const to: RawLocation = {
-        name: menu.to.name,
-        params: targetWorkspaceId ? { workspaceId: targetWorkspaceId } : {},
-    };
-    const link = router.resolve(to);
-    if (link?.href !== '/') results.push(menu);
-
-    return results;
-}, [] as DisplayMenu[]);
-const filterMenuByAccessPermission = (menuList: DisplayMenu[], pagePermissionList: MenuId[]): DisplayMenu[] => menuList.reduce((results, _menu) => {
-    const menu = { ..._menu };
-
-    if (menu.subMenuList) {
-        menu.subMenuList = filterMenuByAccessPermission(menu.subMenuList, pagePermissionList);
-    }
-
-    if (menu.subMenuList?.length) results.push(menu);
-    else {
-        const hasPermission = pagePermissionList.some((menuId) => menuId === menu.id);
-        if (hasPermission) results.push(menu);
-    }
-
-    return results;
-}, [] as DisplayMenu[]);
-
-const getDisplayMenuList = (menuList: Menu[], isAdminMode?: boolean, currentWorkspaceId?: string): DisplayMenu[] => menuList.map((d) => {
-    const menuInfo: MenuInfo = MENU_INFO_MAP[d.id];
-    const routeName = isAdminMode ? makeAdminRouteName(MENU_INFO_MAP[d.id].routeName) : MENU_INFO_MAP[d.id].routeName;
-    const label = i18n.t(menuInfo.translationId);
 
-    return {
-        ...d,
-        id: d.id,
-        label,
-        icon: menuInfo.icon,
-        highlightTag: menuInfo.highlightTag,
-        to: { name: routeName, params: { workspaceId: currentWorkspaceId } },
-        subMenuList: d.subMenuList ? getDisplayMenuList(d.subMenuList, isAdminMode, currentWorkspaceId) : [],
-    } as DisplayMenu;
-});
+const verbose = false;
 
 export const useDisplayStore = defineStore('display-store', () => {
-    const userStore = useUserStore();
+    const userStore = useUserStore(pinia);
 
     const state = reactive<DisplayStoreState>({
         visibleSidebar: false,
@@ -107,7 +44,6 @@ export const useDisplayStore = defineStore('display-store', () => {
         gnbNotificationLastReadTime: '',
     });
 
-    const advancedMenuDisplay = useAdvancedMenuDisplay();
     const getters = reactive<DisplayStoreGetters>({
         hasUncheckedNotifications: computed<boolean>(() => !!(state.uncheckedNotificationCount && state.uncheckedNotificationCount > 0)),
         isHandbookVisible: computed<boolean>(() => state.visibleSidebar && (state.sidebarType === SIDEBAR_TYPE.handbook)),
@@ -305,35 +241,6 @@ export const useDisplayStore = defineStore('display-store', () => {
         }
     };
 
-    const getAllMenuList = (route?: Route): DisplayMenu[] => {
-        const isMyPage = route?.path.startsWith('/my-page');
-        const appContextStore = useAppContextStore();
-        const globalConfigSchemaStore = useGlobalConfigSchemaStore();
-        const appContextState = appContextStore.$state;
-        const userWorkspaceStore = useUserWorkspaceStore();
-        const isAdminMode = appContextState.getters.isAdminMode;
-        const currentWorkspaceId = userWorkspaceStore.getters.currentWorkspaceId;
-        const menuList = globalConfigSchemaStore.getters.menuList;
-        let _allGnbMenuList: DisplayMenu[];
-
-        _allGnbMenuList = getDisplayMenuList(menuList, isAdminMode, currentWorkspaceId);
-        _allGnbMenuList = filterMenuByRoute(_allGnbMenuList, SpaceRouter.router);
-        if (!isAdminMode) {
-            _allGnbMenuList = filterMenuByAccessPermission(_allGnbMenuList, userStore.getters.pageAccessPermissionList);
-        }
-
-        if (!isMyPage) {
-            _allGnbMenuList.forEach((menu) => {
-                if (menu.id === MENU_ID.MY_PAGE) {
-                    menu.hideOnGNB = true;
-                }
-            });
-        }
-
-        // advanced service menu display
-        _allGnbMenuList = advancedMenuDisplay.refineGNBMenuList(_allGnbMenuList);
-        return _allGnbMenuList;
-    };
 
     const actions = {
         showHandbook,
@@ -343,7 +250,6 @@ export const useDisplayStore = defineStore('display-store', () => {
         stopCheckNotification,
         startCheckNotification,
         updateGnbNotificationLastReadTime,
-        getAllMenuList,
     };
 
     return {
diff --git a/apps/web/src/store/display/type.ts b/apps/web/src/store/display/type.ts
index ac7722e93f..d238b125ec 100644
--- a/apps/web/src/store/display/type.ts
+++ b/apps/web/src/store/display/type.ts
@@ -1,26 +1,12 @@
 import type { ComputedRef } from 'vue';
-import type { TranslateResult } from 'vue-i18n';
-import type { Location } from 'vue-router';
 
 import type { SIDEBAR_TYPE, CURRENCY, CURRENCY_SYMBOL } from '@/store/display/constant';
 
-import type { Menu } from '@/lib/menu/config';
-
 
 export type SidebarType = typeof SIDEBAR_TYPE[keyof typeof SIDEBAR_TYPE];
-export type HighlightTagType = 'new' | 'beta' | 'update';
 export type Currency = typeof CURRENCY[keyof typeof CURRENCY];
 export type CurrencySymbol = typeof CURRENCY_SYMBOL[keyof typeof CURRENCY_SYMBOL];
 
-export interface DisplayMenu extends Menu {
-    show?: boolean;
-    label: TranslateResult;
-    icon?: string;
-    highlightTag?: HighlightTagType;
-    to: Location;
-    subMenuList?: DisplayMenu[];
-    href?: string;
-}
 
 export interface DisplayStoreState {
     visibleSidebar: boolean;
diff --git a/apps/web/src/store/error/error-store.ts b/apps/web/src/store/error/error-store.ts
index 8a864caae7..fbd243b404 100644
--- a/apps/web/src/store/error/error-store.ts
+++ b/apps/web/src/store/error/error-store.ts
@@ -7,7 +7,6 @@ export const useErrorStore = defineStore('error-store', () => {
     const state = reactive({
         visibleSessionExpiredError: false,
         visibleAuthorizationError: false,
-        grantAccessFailStatus: false,
     });
 
     /* Mutation */
@@ -17,15 +16,11 @@ export const useErrorStore = defineStore('error-store', () => {
     const setVisibleAuthorizationError = (val: boolean) => {
         state.visibleAuthorizationError = val;
     };
-    const setGrantAccessFailStatus = (val: boolean) => {
-        state.grantAccessFailStatus = val;
-    };
 
     /* Action */
     const reset = () => {
         state.visibleSessionExpiredError = false;
         state.visibleAuthorizationError = false;
-        state.grantAccessFailStatus = false;
     };
     const showSessionExpiredError = (): void => {
         state.visibleSessionExpiredError = true;
@@ -37,7 +32,6 @@ export const useErrorStore = defineStore('error-store', () => {
     const mutations = {
         setVisibleSessionExpiredError,
         setVisibleAuthorizationError,
-        setGrantAccessFailStatus,
     };
     const actions = {
         reset,
diff --git a/apps/web/src/store/global-config-schema/global-config-schema-store.ts b/apps/web/src/store/global-config-schema/global-config-schema-store.ts
index 6cb2939fe4..015e566f1c 100644
--- a/apps/web/src/store/global-config-schema/global-config-schema-store.ts
+++ b/apps/web/src/store/global-config-schema/global-config-schema-store.ts
@@ -1,16 +1,12 @@
-import { computed, reactive } from 'vue';
+import { reactive } from 'vue';
 
-import { orderBy } from 'lodash';
 import { defineStore } from 'pinia';
 
-import { useAppContextStore } from '@/store/app-context/app-context-store';
 
 import type {
     GeneratedRouteSchema,
     GeneratedMenuSchema, GeneratedRouteMetadataSchema, GeneratedUiAffectSchema,
 } from '@/lib/config/global-config/types/type';
-import type { Menu, MenuId } from '@/lib/menu/config';
-import { DEFAULT_MENU_LIST, DEFAULT_ADMIN_MENU_LIST } from '@/lib/menu/menu-architecture';
 
 interface GlobalConfigSchemaStoreState {
     uiAffectsSchema: GeneratedUiAffectSchema;
@@ -18,11 +14,8 @@ interface GlobalConfigSchemaStoreState {
     routeMetadataSchema: GeneratedRouteMetadataSchema;
     routeSchema: GeneratedRouteSchema;
 }
-export type FlattenedMenuMap = Partial<Record<MenuId, MenuId[]>>;
 
 export const useGlobalConfigSchemaStore = defineStore('global-config-schema-store', () => {
-    const appContextStore = useAppContextStore();
-
     const state = reactive<GlobalConfigSchemaStoreState>({
         uiAffectsSchema: {} as GeneratedUiAffectSchema,
         menuSchema: {} as GeneratedMenuSchema,
@@ -30,56 +23,6 @@ export const useGlobalConfigSchemaStore = defineStore('global-config-schema-stor
         routeSchema: {} as GeneratedRouteSchema,
     });
 
-    const _getters = reactive({
-        isAdminMode: computed<boolean>(() => appContextStore.getters.isAdminMode),
-    });
-
-    const getters = reactive({
-        menuList: computed<Menu[]>(() => {
-            const menuList: Menu[] = _getters.isAdminMode ? [] : DEFAULT_MENU_LIST;
-
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
-            Object.entries(state.menuSchema).forEach(([_, featureSetting]) => {
-                if (featureSetting) {
-                    const menu = _getters.isAdminMode ? featureSetting.adminMenu : featureSetting.menu;
-                    if (menu && !menuList.some((existingMenu) => existingMenu.id === menu.id)) {
-                        menuList.push(menu);
-                    }
-                }
-            });
-
-            if (_getters.isAdminMode) {
-                menuList.push(...DEFAULT_ADMIN_MENU_LIST);
-            }
-
-            const orderedMenus = menuList.filter((menu) => menu.order !== undefined);
-            const unorderedMenus = menuList.filter((menu) => menu.order === undefined);
-
-            return [...orderBy(orderedMenus, ['order'], ['asc']), ...unorderedMenus];
-        }),
-        generateFlattenedMenuMap: computed<FlattenedMenuMap>(() => {
-            const map: FlattenedMenuMap = {};
-
-            const getSubMenuIdsToMap = (menu: Menu, flattenedMenuMap: FlattenedMenuMap) => {
-                let results: MenuId[] = [];
-                const subMenuList = menu.subMenuList;
-                if (subMenuList) {
-                    results = subMenuList.map((d) => d.id);
-                    subMenuList.forEach((subMenu) => {
-                        getSubMenuIdsToMap(subMenu, flattenedMenuMap);
-                    });
-                }
-                flattenedMenuMap[menu.id] = results;
-            };
-
-            getters.menuList.forEach((menu) => {
-                getSubMenuIdsToMap(menu, map);
-            });
-
-            return map;
-        }),
-    });
-
     const actions = {
         setMenuSchema(menuSchema: GeneratedMenuSchema) {
             state.menuSchema = menuSchema;
@@ -97,7 +40,6 @@ export const useGlobalConfigSchemaStore = defineStore('global-config-schema-stor
 
     return {
         state,
-        getters,
         ...actions,
     };
 });
diff --git a/apps/web/src/store/menu/menu-store.ts b/apps/web/src/store/menu/menu-store.ts
new file mode 100644
index 0000000000..fd1a7a2ab8
--- /dev/null
+++ b/apps/web/src/store/menu/menu-store.ts
@@ -0,0 +1,137 @@
+import { computed, reactive } from 'vue';
+
+import { orderBy } from 'lodash';
+import { defineStore } from 'pinia';
+
+import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
+import type { DisplayMenu } from '@/store/menu/type';
+import { pinia } from '@/store/pinia';
+
+import { MENU_ID } from '@/lib/menu/config';
+import type { Menu, MenuId } from '@/lib/menu/config';
+import { DEFAULT_ADMIN_MENU_LIST, DEFAULT_MENU_LIST } from '@/lib/menu/menu-architecture';
+
+import { useTaskManagementTemplateStore } from '@/services/ops-flow/task-management-templates/stores/use-task-management-template-store';
+
+export type FlattenedMenuMap = Partial<Record<MenuId, MenuId[]>>;
+
+interface MenuContext {
+    templateName: string;
+    taskBoardName: string;
+    templateId: string;
+    enableLanding: boolean;
+}
+interface MenuCustomization {
+    menuId: MenuId;
+    applyLabel: (menu: DisplayMenu, context: MenuContext) => Partial<DisplayMenu>;
+    shouldShow?: (context: MenuContext) => boolean;
+}
+
+const MENU_CUSTOMIZATIONS = new Map<MenuId, MenuCustomization>([
+    [MENU_ID.OPS_FLOW_LANDING, {
+        menuId: MENU_ID.OPS_FLOW_LANDING,
+        applyLabel: (menu, ctx) => ({ label: ctx.templateName }),
+        shouldShow: (ctx) => ctx.templateId !== 'default' && ctx.enableLanding,
+    }],
+    [MENU_ID.TASK_BOARD, {
+        menuId: MENU_ID.TASK_BOARD,
+        applyLabel: (menu, ctx) => ({ label: ctx.taskBoardName }),
+    }],
+]);
+
+export const useMenuStore = defineStore('derived-menu', () => {
+    const globalConfigSchemaStore = useGlobalConfigSchemaStore(pinia);
+    const appContextStore = useAppContextStore(pinia);
+
+    const _isAdminMode = computed(() => appContextStore.getters.isAdminMode);
+
+    const taskManagementTemplateStore = useTaskManagementTemplateStore(pinia);
+    const _menuContext = computed<MenuContext>(() => ({
+        templateName: taskManagementTemplateStore.templates.TemplateName,
+        taskBoardName: taskManagementTemplateStore.templates.TaskBoard,
+        templateId: taskManagementTemplateStore.state.templateId,
+        enableLanding: taskManagementTemplateStore.state.enableLanding,
+    }));
+    const _baseMenuList = computed<Menu[]>(() => {
+        const menuList: Menu[] = _isAdminMode.value ? [] : [...DEFAULT_MENU_LIST];
+
+        Object.values(globalConfigSchemaStore.state.menuSchema).forEach((featureSetting) => {
+            if (featureSetting) {
+                const menu = _isAdminMode.value ? featureSetting.adminMenu : featureSetting.menu;
+                if (menu && !menuList.some((existingMenu) => existingMenu.id === menu.id)) {
+                    menuList.push(menu);
+                }
+            }
+        });
+
+        if (_isAdminMode.value) {
+            menuList.push(...DEFAULT_ADMIN_MENU_LIST);
+        }
+
+        return menuList;
+    });
+
+
+    const getters = reactive({
+        menuList: computed(() => {
+            const refinedMenuList = _baseMenuList.value
+                .map((menu) => _applyCustomizations(menu as DisplayMenu, _menuContext.value));
+
+            const orderedMenus = refinedMenuList.filter((menu) => menu.order !== undefined);
+            const unorderedMenus = refinedMenuList.filter((menu) => menu.order === undefined);
+
+            return [...orderBy(orderedMenus, ['order'], ['asc']), ...unorderedMenus];
+        }),
+        generateFlattenedMenuMap: computed<FlattenedMenuMap>(() => {
+            const map: FlattenedMenuMap = {};
+
+            getters.menuList.forEach((menu) => {
+                _getSubMenuIdsToMap(menu, map);
+            });
+
+            return map;
+        }),
+    });
+
+    return {
+        getters,
+    };
+});
+
+/* menu list utils */
+const _applyCustomizations = (menu: DisplayMenu, context: MenuContext): DisplayMenu => {
+    const transformedSubMenus = (menu.subMenuList ?? [])
+        .map((sub) => _customizeSubMenu(sub, context))
+        .filter((sub): sub is DisplayMenu => sub !== null);
+
+    return {
+        ...menu,
+        subMenuList: transformedSubMenus,
+    };
+};
+
+const _customizeSubMenu = (subMenu: DisplayMenu, context: MenuContext): DisplayMenu | null => {
+    const customizer = MENU_CUSTOMIZATIONS.get(subMenu.id);
+    if (!customizer) return subMenu;
+
+    if (customizer.shouldShow && !customizer.shouldShow(context)) return null;
+
+    return {
+        ...subMenu,
+        ...customizer.applyLabel(subMenu, context),
+    };
+};
+
+/* menu flattened map utils */
+const _getSubMenuIdsToMap = (menu: Menu, flattenedMenuMap: FlattenedMenuMap) => {
+    let results: MenuId[] = [];
+    const subMenuList = menu.subMenuList;
+    if (subMenuList) {
+        results = subMenuList.map((d) => d.id);
+        subMenuList.forEach((subMenu) => {
+            _getSubMenuIdsToMap(subMenu, flattenedMenuMap);
+        });
+    }
+    flattenedMenuMap[menu.id] = results;
+};
diff --git a/apps/web/src/store/menu/type.ts b/apps/web/src/store/menu/type.ts
new file mode 100644
index 0000000000..951ed27f95
--- /dev/null
+++ b/apps/web/src/store/menu/type.ts
@@ -0,0 +1,15 @@
+import type { TranslateResult } from 'vue-i18n';
+import type { Location } from 'vue-router';
+
+import type { Menu } from '@/lib/menu/config';
+
+export interface DisplayMenu extends Menu {
+    show?: boolean;
+    label: TranslateResult;
+    icon?: string;
+    highlightTag?: HighlightTagType;
+    to: Location;
+    subMenuList?: DisplayMenu[];
+    href?: string;
+}
+export type HighlightTagType = 'new' | 'beta' | 'update';
diff --git a/apps/web/src/store/notice/index.ts b/apps/web/src/store/notice/notice-store.ts
similarity index 100%
rename from apps/web/src/store/notice/index.ts
rename to apps/web/src/store/notice/notice-store.ts
diff --git a/apps/web/src/store/reference/all-reference-store.ts b/apps/web/src/store/reference/all-reference-store.ts
index 9070b279b2..d24d8508a2 100644
--- a/apps/web/src/store/reference/all-reference-store.ts
+++ b/apps/web/src/store/reference/all-reference-store.ts
@@ -34,6 +34,7 @@ import { useRegionReferenceStore } from '@/store/reference/region-reference-stor
 import { useRoleReferenceStore } from '@/store/reference/role-reference-store';
 import { useSecretReferenceStore } from '@/store/reference/secret-reference-store';
 import { useServiceAccountReferenceStore } from '@/store/reference/service-account-reference-store';
+import type { ServiceReferenceMap } from '@/store/reference/service-reference-store';
 import { useServiceReferenceStore } from '@/store/reference/service-reference-store';
 import { useTrustedAccountReferenceStore } from '@/store/reference/trusted-account-reference-store';
 import type { ReferenceLoadOptions } from '@/store/reference/type';
@@ -140,7 +141,7 @@ export const useAllReferenceStore = defineStore('all-reference-store', () => {
         namespace: computed(() => namespaceReferenceStore.getters.namespaceItems),
         metric: computed<MetricReferenceMap>(() => metricReferenceStore.getters.metricItems),
         role: computed(() => roleReferenceStore.getters.roleItems),
-        service: computed(() => serviceReferenceStore.getters.serviceItems),
+        service: computed<ServiceReferenceMap>(() => serviceReferenceStore.getters.serviceItems),
         app: computed(() => appReferenceStore.getters.appItems),
     };
 
diff --git a/apps/web/src/store/reference/app-reference-store.ts b/apps/web/src/store/reference/app-reference-store.ts
index e557eb5414..53cdcd671a 100644
--- a/apps/web/src/store/reference/app-reference-store.ts
+++ b/apps/web/src/store/reference/app-reference-store.ts
@@ -13,10 +13,11 @@ import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap,
     ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
+import { useAuthorizationStore } from '../authorization/authorization-store';
+
 export type AppItem = Required<Pick<ReferenceItem<AppModel>, 'key'|'label'|'name'|'data'>>;
 export type AppReferenceMap = ReferenceMap<AppItem>;
 
@@ -24,7 +25,7 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useAppReferenceStore = defineStore('reference-app', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const state = reactive({
         items: null as AppReferenceMap | null,
@@ -32,7 +33,7 @@ export const useAppReferenceStore = defineStore('reference-app', () => {
 
     const getters = reactive({
         appItems: asyncComputed<AppReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/cloud-service-type-reference-store.ts b/apps/web/src/store/reference/cloud-service-type-reference-store.ts
index 1d8a3345c5..8638fbef28 100644
--- a/apps/web/src/store/reference/cloud-service-type-reference-store.ts
+++ b/apps/web/src/store/reference/cloud-service-type-reference-store.ts
@@ -12,13 +12,14 @@ import type { CloudServiceTypeModel } from '@/schema/inventory/cloud-service-typ
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
+import { useAuthorizationStore } from '../authorization/authorization-store';
+
 
 type PickedCloudServiceTypeModel = Pick<CloudServiceTypeModel, 'provider'|'group'|'cloud_service_type_key'>;
 export type CloudServiceTypeItem = Required<Pick<ReferenceItem<PickedCloudServiceTypeModel>, 'key'|'label'|'name'|'icon'|'data'>>;
@@ -29,14 +30,14 @@ let lastLoadedTime = 0;
 
 
 export const useCloudServiceTypeReferenceStore = defineStore('reference-cloud-service-type', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as CloudServiceTypeReferenceMap | null,
     });
 
     const getters = reactive({
         cloudServiceTypeItems: asyncComputed<CloudServiceTypeReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/cloue-service-query-set-reference-store.ts b/apps/web/src/store/reference/cloue-service-query-set-reference-store.ts
index 1d5524a0ae..cfb8b487f4 100644
--- a/apps/web/src/store/reference/cloue-service-query-set-reference-store.ts
+++ b/apps/web/src/store/reference/cloue-service-query-set-reference-store.ts
@@ -16,12 +16,13 @@ import type {
     ReferenceMap,
     ReferenceLoadOptions, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
+import { useAuthorizationStore } from '../authorization/authorization-store';
+
 
 type PickedQuerySetModel = Pick<CloudServiceQuerySetModel, 'query_set_id'|'name'|'provider'|'cloud_service_group'|'cloud_service_type'>;
 export type QuerySetItems = Required<Pick<ReferenceItem<PickedQuerySetModel>, 'key'|'label'|'name'|'data'>>;
@@ -31,14 +32,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useCloudServiceQuerySetReferenceStore = defineStore('reference-cloud-service-query-set', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as CloudServiceQuerySetReferenceMap|null,
     });
 
     const getters = reactive({
         cloudServiceQuerySetItems: asyncComputed<CloudServiceQuerySetReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await actions.load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/collector-reference-store.ts b/apps/web/src/store/reference/collector-reference-store.ts
index 05cfd877bb..931d562f28 100644
--- a/apps/web/src/store/reference/collector-reference-store.ts
+++ b/apps/web/src/store/reference/collector-reference-store.ts
@@ -12,13 +12,13 @@ import type { CollectorModel } from '@/schema/inventory/collector/model';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
+import { useAuthorizationStore } from '../authorization/authorization-store';
 
 
 export type CollectorItem = Required<Pick<ReferenceItem<CollectorModel>, 'key'|'label'|'name'|'icon'>>;
@@ -28,7 +28,7 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useCollectorReferenceStore = defineStore('reference-collector', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const state = reactive({
         items: null as CollectorReferenceMap | null,
@@ -36,7 +36,7 @@ export const useCollectorReferenceStore = defineStore('reference-collector', ()
 
     const getters = reactive({
         collectorItems: asyncComputed<CollectorReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/cost-data-source-reference-store.ts b/apps/web/src/store/reference/cost-data-source-reference-store.ts
index f2bc7fb3c4..f6b0804236 100644
--- a/apps/web/src/store/reference/cost-data-source-reference-store.ts
+++ b/apps/web/src/store/reference/cost-data-source-reference-store.ts
@@ -12,13 +12,13 @@ import type { CostDataSourceListParameters } from '@/api-clients/cost-analysis/d
 import type { CostDataSourceModel } from '@/api-clients/cost-analysis/data-source/schema/model';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem,
     ReferenceMap,
     ReferenceLoadOptions,
     ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
@@ -34,7 +34,7 @@ let lastLoadedTime = 0;
 
 export const useCostDataSourceReferenceStore = defineStore('reference-cost-data-source', () => {
     const appContextStore = useAppContextStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const _state = reactive({
         isAdminMode: computed(() => appContextStore.getters.isAdminMode),
     });
@@ -44,7 +44,7 @@ export const useCostDataSourceReferenceStore = defineStore('reference-cost-data-
 
     const getters = reactive({
         costDataSourceItems: asyncComputed<CostDataSourceReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await actions.load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/escalation-policy-reference-store.ts b/apps/web/src/store/reference/escalation-policy-reference-store.ts
index e9f33bac29..c7578cebb0 100644
--- a/apps/web/src/store/reference/escalation-policy-reference-store.ts
+++ b/apps/web/src/store/reference/escalation-policy-reference-store.ts
@@ -1,37 +1,38 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
 import { asyncComputed } from '@vueuse/core';
 import { computed, reactive } from 'vue';
 
 import { defineStore } from 'pinia';
 
-import APIClientManager from '@/api-clients/api-client-manager';
 import type { EscalationPolicyModel } from '@/schema/alert-manager/escalation-policy/model';
 import type { EscalationPolicyModel as EscalationPolicyModelV1 } from '@/schema/monitoring/escalation-policy/model';
 
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
+import APIClientManager from '@/lib/config/global-config/api-client-manager';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-export type EscalationPolicyItem = Required<Pick<ReferenceItem<EscalationPolicyModel>, 'key'|'label'|'name'|'data'>>;
+import { useAuthorizationStore } from '../authorization/authorization-store';
+
+
+export type EscalationPolicyItem = Required<Pick<ReferenceItem<EscalationPolicyModel|EscalationPolicyModelV1>, 'key'|'label'|'name'|'data'>>;
 export type EscalationPolicyReferenceMap = ReferenceMap<EscalationPolicyItem>;
 
 const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useEscalationPolicyReferenceStore = defineStore('reference-escalation-policy', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
+
     const state = reactive({
         items: null as EscalationPolicyReferenceMap | null,
     });
 
     const getters = reactive({
         escalationPolicyItems: asyncComputed<EscalationPolicyReferenceMap>(async () => {
-            if (userStore.state.currentGrantInfo?.scope !== 'WORKSPACE') return {};
+            if (authorizationStore.state.currentGrantInfo?.scope !== 'WORKSPACE') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/metric-reference-store.ts b/apps/web/src/store/reference/metric-reference-store.ts
index 4a881bfefe..e476e1b385 100644
--- a/apps/web/src/store/reference/metric-reference-store.ts
+++ b/apps/web/src/store/reference/metric-reference-store.ts
@@ -9,15 +9,16 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { MetricListParameters } from '@/schema/inventory/metric/api-verbs/list';
 import type { MetricModel } from '@/schema/inventory/metric/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap,
     ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
 
+
 export type MetricReferenceItem = Required<Pick<ReferenceItem<Partial<MetricModel>>, 'key'|'label'|'name'|'data'>>;
 export type MetricReferenceMap = ReferenceMap<MetricReferenceItem>;
 
@@ -25,14 +26,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useMetricReferenceStore = defineStore('reference-metric', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as MetricReferenceMap | null,
     });
 
     const getters = reactive({
         metricItems: asyncComputed<MetricReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/namespace-reference-store.ts b/apps/web/src/store/reference/namespace-reference-store.ts
index ddc98294fe..dfbb48ad75 100644
--- a/apps/web/src/store/reference/namespace-reference-store.ts
+++ b/apps/web/src/store/reference/namespace-reference-store.ts
@@ -13,10 +13,10 @@ import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap,
     ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
+import { useAuthorizationStore } from '../authorization/authorization-store';
 
 export type NamespaceReferenceItem = Required<Pick<ReferenceItem<Partial<NamespaceModel>>, 'key'|'label'|'name'|'data'>>;
 export type NamespaceReferenceMap = ReferenceMap<NamespaceReferenceItem>;
@@ -25,14 +25,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useNamespaceReferenceStore = defineStore('reference-namespace', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as NamespaceReferenceMap | null,
     });
 
     const getters = reactive({
         namespaceItems: asyncComputed<NamespaceReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/project-group-reference-store.ts b/apps/web/src/store/reference/project-group-reference-store.ts
index cdb2e45708..4f4747affd 100644
--- a/apps/web/src/store/reference/project-group-reference-store.ts
+++ b/apps/web/src/store/reference/project-group-reference-store.ts
@@ -9,16 +9,15 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ProjectGroupListParameters } from '@/api-clients/identity/project-group/schema/api-verbs/list';
 import type { ProjectGroupModel } from '@/api-clients/identity/project-group/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-
 interface ProjectGroupResourceItemData {
     parentGroupInfo?: {
         id: string;
@@ -34,7 +33,8 @@ let lastLoadedTime = 0;
 
 
 export const useProjectGroupReferenceStore = defineStore('reference-project-group', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
+
     const state = reactive({
         items: null as ProjectGroupReferenceMap | null,
     });
@@ -104,7 +104,7 @@ export const useProjectGroupReferenceStore = defineStore('reference-project-grou
 
     const getters = reactive({
         projectGroupItems: asyncComputed<ProjectGroupReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/project-reference-store.ts b/apps/web/src/store/reference/project-reference-store.ts
index 17399f59fa..712ba21d2e 100644
--- a/apps/web/src/store/reference/project-reference-store.ts
+++ b/apps/web/src/store/reference/project-reference-store.ts
@@ -10,17 +10,16 @@ import type { ProjectListParameters } from '@/api-clients/identity/project/schem
 import type { ProjectModel } from '@/api-clients/identity/project/schema/model';
 import type { ProjectType } from '@/api-clients/identity/project/schema/type';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type { ProjectGroupReferenceMap } from '@/store/reference/project-group-reference-store';
 import { useProjectGroupReferenceStore } from '@/store/reference/project-group-reference-store';
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 
-
 interface ProjectResourceItemData {
     groupInfo?: {
         id: string;
@@ -38,7 +37,7 @@ let lastLoadedTime = 0;
 
 export const useProjectReferenceStore = defineStore('reference-project', () => {
     const projectGroupReferenceStore = useProjectGroupReferenceStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as ProjectReferenceMap | null,
     });
@@ -49,7 +48,7 @@ export const useProjectReferenceStore = defineStore('reference-project', () => {
 
     const getters = reactive({
         projectItems: asyncComputed<ProjectReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/protocol-reference-store.ts b/apps/web/src/store/reference/protocol-reference-store.ts
index ef3453ab5c..33cb30b81d 100644
--- a/apps/web/src/store/reference/protocol-reference-store.ts
+++ b/apps/web/src/store/reference/protocol-reference-store.ts
@@ -9,10 +9,10 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ProtocolListParameters } from '@/schema/notification/protocol/api-verbs/list';
 import type { ProtocolModel } from '@/schema/notification/protocol/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
@@ -24,14 +24,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useProtocolReferenceStore = defineStore('reference-protocol', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as ProtocolReferenceMap | null,
     });
 
     const getters = reactive({
         protocolItems: asyncComputed<ProtocolReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/provider-reference-store.ts b/apps/web/src/store/reference/provider-reference-store.ts
index 96c5cc2275..9074c6cfa7 100644
--- a/apps/web/src/store/reference/provider-reference-store.ts
+++ b/apps/web/src/store/reference/provider-reference-store.ts
@@ -9,10 +9,10 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ProviderListParameters } from '@/api-clients/identity/provider/schema/api-verbs/list';
 import type { ProviderModel } from '@/api-clients/identity/provider/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { assetUrlConverter } from '@/lib/helper/asset-helper';
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
@@ -21,7 +21,6 @@ import ErrorHandler from '@/common/composables/error/errorHandler';
 
 import { indigo } from '@/styles/colors';
 
-
 export type ProviderItem = Required<Pick<ReferenceItem<ProviderModel>, 'key'|'label'|'name'|'icon'|'color'|'data'>>;
 export type ProviderReferenceMap = ReferenceMap<ProviderItem>;
 
@@ -29,14 +28,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useProviderReferenceStore = defineStore('reference-provider', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as ProviderReferenceMap | null,
     });
 
     const getters = reactive({
         providerItems: asyncComputed<ProviderReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/public-dashboard-reference-store.ts b/apps/web/src/store/reference/public-dashboard-reference-store.ts
index a6fa4c16f5..95305a734f 100644
--- a/apps/web/src/store/reference/public-dashboard-reference-store.ts
+++ b/apps/web/src/store/reference/public-dashboard-reference-store.ts
@@ -9,11 +9,10 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { PublicDashboardListParameters } from '@/api-clients/dashboard/public-dashboard/schema/api-verbs/list';
 import type { PublicDashboardModel } from '@/api-clients/dashboard/public-dashboard/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
-
 
 interface PublicDashboardResourceItemData {
     resourceGroup?: PublicDashboardModel['resource_group'];
@@ -29,14 +28,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const usePublicDashboardReferenceStore = defineStore('reference-dashboard', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as PublicDashboardReferenceMap | null,
     });
 
     const getters = reactive({
         publicDashboardItems: asyncComputed<PublicDashboardReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/public-folder-reference-store.ts b/apps/web/src/store/reference/public-folder-reference-store.ts
index 6b850d5b5e..20945a4813 100644
--- a/apps/web/src/store/reference/public-folder-reference-store.ts
+++ b/apps/web/src/store/reference/public-folder-reference-store.ts
@@ -9,11 +9,10 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { PublicFolderListParameters } from '@/api-clients/dashboard/public-folder/schema/api-verbs/list';
 import type { PublicFolderModel } from '@/api-clients/dashboard/public-folder/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
-
 
 interface PublicFolderResourceItemData {
     resourceGroup?: PublicFolderModel['resource_group'];
@@ -28,14 +27,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const usePublicFolderReferenceStore = defineStore('reference-folder', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as PublicFolderReferenceMap | null,
     });
 
     const getters = reactive({
         publicFolderItems: asyncComputed<PublicFolderReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/region-reference-store.ts b/apps/web/src/store/reference/region-reference-store.ts
index bfc61b386a..02bb34e2d3 100644
--- a/apps/web/src/store/reference/region-reference-store.ts
+++ b/apps/web/src/store/reference/region-reference-store.ts
@@ -9,16 +9,15 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { RegionListParameters } from '@/schema/inventory/region/api-verbs/list';
 import type { RegionModel } from '@/schema/inventory/region/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-
 const CONTINENT_LABEL_MAP = {
     africa: 'Africa',
     europe: 'Europe',
@@ -36,7 +35,7 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useRegionReferenceStore = defineStore('reference-region', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const state = reactive({
         items: null as RegionReferenceMap | null,
@@ -44,7 +43,7 @@ export const useRegionReferenceStore = defineStore('reference-region', () => {
 
     const getters = reactive({
         regionItems: asyncComputed<RegionReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/secret-reference-store.ts b/apps/web/src/store/reference/secret-reference-store.ts
index d595de5168..6f1061e91a 100644
--- a/apps/web/src/store/reference/secret-reference-store.ts
+++ b/apps/web/src/store/reference/secret-reference-store.ts
@@ -9,16 +9,15 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { SecretListParameters } from '@/schema/secret/secret/api-verbs/list';
 import type { SecretModel } from '@/schema/secret/secret/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-
 export type SecretItem = Required<Pick<ReferenceItem<SecretModel>, 'key'|'label'|'name'>>;
 export type SecretReferenceMap = ReferenceMap<SecretItem>;
 
@@ -26,14 +25,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useSecretReferenceStore = defineStore('reference-secret', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as SecretReferenceMap | null,
     });
 
     const getters = reactive({
         secretItems: asyncComputed<SecretReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/service-account-reference-store.ts b/apps/web/src/store/reference/service-account-reference-store.ts
index 99e917114e..20134def11 100644
--- a/apps/web/src/store/reference/service-account-reference-store.ts
+++ b/apps/web/src/store/reference/service-account-reference-store.ts
@@ -9,16 +9,15 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { ServiceAccountListParameters } from '@/api-clients/identity/service-account/schema/api-verbs/list';
 import type { ServiceAccountModel } from '@/api-clients/identity/service-account/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-
 export type ServiceAccountItem = Required<Pick<ReferenceItem<{
     account_id?: string;
     subscription_id?: string;
@@ -30,14 +29,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useServiceAccountReferenceStore = defineStore('reference-service-account', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as ServiceAccountReferenceMap | null,
     });
 
     const getters = reactive({
         serviceAccountItems: asyncComputed<ServiceAccountReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/service-reference-store.ts b/apps/web/src/store/reference/service-reference-store.ts
index dd7672f7b9..a554941ce4 100644
--- a/apps/web/src/store/reference/service-reference-store.ts
+++ b/apps/web/src/store/reference/service-reference-store.ts
@@ -3,16 +3,16 @@ import { computed, reactive } from 'vue';
 
 import { defineStore } from 'pinia';
 
-import APIClientManager from '@/api-clients/api-client-manager';
 import type { ServiceListParameters } from '@/schema/alert-manager/service/api-verbs/list';
 import type { ServiceModel } from '@/schema/alert-manager/service/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap,
     ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
+import APIClientManager from '@/lib/config/global-config/api-client-manager';
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
@@ -24,7 +24,7 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useServiceReferenceStore = defineStore('reference-service', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const state = reactive({
         items: null as ServiceReferenceMap | null,
@@ -32,7 +32,7 @@ export const useServiceReferenceStore = defineStore('reference-service', () => {
 
     const getters = reactive({
         serviceItems: asyncComputed<ServiceReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/trusted-account-reference-store.ts b/apps/web/src/store/reference/trusted-account-reference-store.ts
index cddb4faf64..4f41a030fb 100644
--- a/apps/web/src/store/reference/trusted-account-reference-store.ts
+++ b/apps/web/src/store/reference/trusted-account-reference-store.ts
@@ -9,10 +9,10 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { TrustedAccountListParameters } from '@/api-clients/identity/trusted-account/schema/api-verbs/list';
 import type { TrustedAccountModel } from '@/api-clients/identity/trusted-account/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
@@ -24,14 +24,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useTrustedAccountReferenceStore = defineStore('reference-trusted-account', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as TrustedAccountReferenceMap | null,
     });
 
     const getters = reactive({
         trustedAccountItems: asyncComputed<TrustedAccountReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/user-group-reference-store.ts b/apps/web/src/store/reference/user-group-reference-store.ts
index 62e9431d6d..501b7f0ff1 100644
--- a/apps/web/src/store/reference/user-group-reference-store.ts
+++ b/apps/web/src/store/reference/user-group-reference-store.ts
@@ -9,10 +9,10 @@ import type { ListResponse } from '@/api-clients/_common/schema/api-verbs/list';
 import type { UserGroupListParameters } from '@/api-clients/identity/user-group/schema/api-verbs/list';
 import type { UserGroupModel } from '@/api-clients/identity/user-group/schema/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
@@ -23,7 +23,7 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useUserGroupReferenceStore = defineStore('reference-user-group', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
 
     const state = reactive({
         items: null as UserGroupReferenceMap | null,
@@ -31,7 +31,7 @@ export const useUserGroupReferenceStore = defineStore('reference-user-group', ()
 
     const getters = reactive({
         userGroupItems: asyncComputed<UserGroupReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/user-reference-store.ts b/apps/web/src/store/reference/user-reference-store.ts
index bdbd0c4f68..1301dede92 100644
--- a/apps/web/src/store/reference/user-reference-store.ts
+++ b/apps/web/src/store/reference/user-reference-store.ts
@@ -16,16 +16,15 @@ import type { WorkspaceUserListParameters } from '@/api-clients/identity/workspa
 import type { WorkspaceUserModel } from '@/api-clients/identity/workspace-user/schema/model';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-
 interface UserResourceItemData {
     roleInfo?: Partial<RoleModel>;
 }
@@ -60,7 +59,7 @@ const _listRole = async (roleIdList: string[]): Promise<RoleModel[]> => {
 };
 export const useUserReferenceStore = defineStore('reference-user', () => {
     const appContextStore = useAppContextStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const _state = reactive({
         isAdminMode: computed(() => appContextStore.getters.isAdminMode),
         roleList: [] as RoleModel[],
@@ -72,7 +71,7 @@ export const useUserReferenceStore = defineStore('reference-user', () => {
     const getters = reactive({
         loading: computed<boolean>(() => state.items === null),
         userItems: asyncComputed<UserReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/webhook-reference-store.ts b/apps/web/src/store/reference/webhook-reference-store.ts
index a08534c669..1703fc0aa7 100644
--- a/apps/web/src/store/reference/webhook-reference-store.ts
+++ b/apps/web/src/store/reference/webhook-reference-store.ts
@@ -3,15 +3,15 @@ import { computed, reactive } from 'vue';
 
 import { defineStore } from 'pinia';
 
-import APIClientManager from '@/api-clients/api-client-manager';
 import type { WebhookModel } from '@/schema/alert-manager/webhook/model';
 import type { WebhookModel as WebhookModelV1 } from '@/schema/monitoring/webhook/model';
 
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceItem, ReferenceLoadOptions, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
+import APIClientManager from '@/lib/config/global-config/api-client-manager';
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
@@ -23,14 +23,14 @@ const LOAD_TTL = 1000 * 60 * 60 * 3; // 3 hours
 let lastLoadedTime = 0;
 
 export const useWebhookReferenceStore = defineStore('reference-webhook', () => {
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const state = reactive({
         items: null as WebhookReferenceMap | null,
     });
 
     const getters = reactive({
         webhookItems: asyncComputed<WebhookReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/workspace-group-reference-store.ts b/apps/web/src/store/reference/workspace-group-reference-store.ts
index faedf4ae16..fda38838ac 100644
--- a/apps/web/src/store/reference/workspace-group-reference-store.ts
+++ b/apps/web/src/store/reference/workspace-group-reference-store.ts
@@ -10,16 +10,15 @@ import type { WorkspaceGroupListParameters } from '@/api-clients/identity/worksp
 import type { WorkspaceGroupModel } from '@/api-clients/identity/workspace-group/schema/model';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
 import ErrorHandler from '@/common/composables/error/errorHandler';
 
-
 type PickedWorkspaceGroupModel = Pick<WorkspaceGroupModel, 'tags'>;
 export type WorkspaceGroupItem = Required<Pick<ReferenceItem<PickedWorkspaceGroupModel>, 'key'|'label'|'name'|'data'>>;
 export type WorkspaceGroupReferenceMap = ReferenceMap<WorkspaceGroupItem>;
@@ -29,7 +28,7 @@ let lastLoadedTime = 0;
 
 export const useWorkspaceGroupReferenceStore = defineStore('reference-workspace-group', () => {
     const appContextStore = useAppContextStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const _state = reactive({
         isAdminMode: computed(() => appContextStore.getters.isAdminMode),
     });
@@ -39,7 +38,7 @@ export const useWorkspaceGroupReferenceStore = defineStore('reference-workspace-
 
     const getters = reactive({
         workspaceGroupItems: asyncComputed<WorkspaceGroupReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/reference/workspace-reference-store.ts b/apps/web/src/store/reference/workspace-reference-store.ts
index 6bee3265c3..c816a260d5 100644
--- a/apps/web/src/store/reference/workspace-reference-store.ts
+++ b/apps/web/src/store/reference/workspace-reference-store.ts
@@ -10,10 +10,10 @@ import type { WorkspaceListParameters } from '@/api-clients/identity/workspace/s
 import type { WorkspaceModel } from '@/api-clients/identity/workspace/schema/model';
 
 import { useAppContextStore } from '@/store/app-context/app-context-store';
+import { useAuthorizationStore } from '@/store/authorization/authorization-store';
 import type {
     ReferenceLoadOptions, ReferenceItem, ReferenceMap, ReferenceTypeInfo,
 } from '@/store/reference/type';
-import { useUserStore } from '@/store/user/user-store';
 
 import { MANAGED_VARIABLE_MODELS } from '@/lib/variable-models/managed-model-config/base-managed-model-config';
 
@@ -27,7 +27,7 @@ let lastLoadedTime = 0;
 
 export const useWorkspaceReferenceStore = defineStore('reference-workspace', () => {
     const appContextStore = useAppContextStore();
-    const userStore = useUserStore();
+    const authorizationStore = useAuthorizationStore();
     const _state = reactive({
         isAdminMode: computed(() => appContextStore.getters.isAdminMode),
     });
@@ -37,7 +37,7 @@ export const useWorkspaceReferenceStore = defineStore('reference-workspace', ()
 
     const getters = reactive({
         workspaceItems: asyncComputed<WorkspaceReferenceMap>(async () => {
-            if (!userStore.state.currentGrantInfo?.scope || userStore.state.currentGrantInfo?.scope === 'USER') return {};
+            if (!authorizationStore.state.currentGrantInfo?.scope || authorizationStore.state.currentGrantInfo?.scope === 'USER') return {};
             if (state.items === null) await load();
             return state.items ?? {};
         }, {}, { lazy: true }),
diff --git a/apps/web/src/store/user/constant.ts b/apps/web/src/store/user/constant.ts
index 57a9a28b93..bcf4400e9d 100644
--- a/apps/web/src/store/user/constant.ts
+++ b/apps/web/src/store/user/constant.ts
@@ -1,8 +1,5 @@
 import { timeZonesNames } from '@vvo/tzdb';
 
-import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
-
-
 
 export const USER_STORAGE_KEY = 'store/user';
 
@@ -13,10 +10,3 @@ export const languages = {
     ko: '한국어',
     ja: '日本語',
 };
-
-export const MANAGED_ROLES = {
-    'managed-system-admin': ROLE_TYPE.SYSTEM_ADMIN,
-    'managed-domain-admin': ROLE_TYPE.DOMAIN_ADMIN,
-    'managed-workspace-owner': ROLE_TYPE.WORKSPACE_OWNER,
-    'managed-workspace-member': ROLE_TYPE.WORKSPACE_MEMBER,
-} as const;
diff --git a/apps/web/src/store/user/type.ts b/apps/web/src/store/user/type.ts
index 1bf0e3b444..4ab06f9427 100644
--- a/apps/web/src/store/user/type.ts
+++ b/apps/web/src/store/user/type.ts
@@ -1,30 +1,13 @@
 import type { ComputedRef } from 'vue';
 
 import type { RoleType } from '@/api-clients/identity/role/type';
-import type { GrantScope } from '@/api-clients/identity/token/schema/type';
 import type { UserMfa } from '@/api-clients/identity/user/schema/model';
 import type { AuthType, UserType } from '@/api-clients/identity/user/schema/type';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
-import type { MenuId } from '@/lib/menu/config';
-
-
 
 export type LanguageCode = 'ko' | 'en' | string;
 // export type Timezone = 'UTC' | 'Asia/Seoul' | string;
 
-export interface RoleInfo {
-    roleType: RoleType;
-    roleId: string;
-    pageAccess: string[];
-}
-
-export interface GrantInfo {
-    scope: GrantScope;
-    workspaceId?: string;
-    pageAccess?: string[];
-}
-
 export interface UserStoreState {
     isSessionExpired?: boolean;
     userId?: string;
@@ -35,8 +18,6 @@ export interface UserStoreState {
     email?: string;
     language?: string;
     timezone?: string;
-    currentGrantInfo?: GrantInfo;
-    currentRoleInfo?: RoleInfo;
     requiredActions?: string[];
     emailVerified?: boolean;
     isSignInLoading?: boolean;
@@ -46,25 +27,6 @@ export interface UserStoreState {
 export interface UserStoreGetters {
     isDomainAdmin: ComputedRef<boolean>;
     isSystemAdmin: ComputedRef<boolean>;
-    domainId: ComputedRef<string>;
     languageLabel: ComputedRef<string>;
-    isNoRoleUser: ComputedRef<boolean>;
     hasAdminOrWorkspaceOwnerRole: ComputedRef<boolean>;
-    hasPermission: ComputedRef<boolean>;
-    pageAccessPermissionList: ComputedRef<MenuId[]>;
-    pageAccessPermissionMap: ComputedRef<PageAccessMap>;
 }
-
-export interface SignInRequest {
-    credentials: Record<string, any>;
-    authType: AuthType | 'SAML';
-    timeout?: number;
-    refresh_count?: number;
-    verify_code?: string;
-    domainId: string;
-}
-
-export interface JWTPayload {
-    rol: RoleType;
-}
-
diff --git a/apps/web/src/store/user/user-store.ts b/apps/web/src/store/user/user-store.ts
index 4a2687257c..528c37b27c 100644
--- a/apps/web/src/store/user/user-store.ts
+++ b/apps/web/src/store/user/user-store.ts
@@ -1,123 +1,23 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
 import { computed, reactive, watch } from 'vue';
 
-import { jwtDecode } from 'jwt-decode';
-import { isEmpty } from 'lodash';
 import { defineStore } from 'pinia';
 
 import { LocalStorageAccessor } from '@cloudforet/core-lib/local-storage-accessor';
 import { SpaceConnector } from '@cloudforet/core-lib/space-connector';
-import { getCancellableFetcher } from '@cloudforet/core-lib/space-connector/cancellable-fetcher';
-import { isInstanceOfAPIError } from '@cloudforet/core-lib/space-connector/error';
 
 import { ROLE_TYPE } from '@/api-clients/identity/role/constant';
-import type { RoleGetParameters } from '@/api-clients/identity/role/schema/api-verbs/get';
-import type { RoleModel } from '@/api-clients/identity/role/schema/model';
-import type { RoleType } from '@/api-clients/identity/role/type';
-import type { TokenGrantParameters } from '@/api-clients/identity/token/schema/api-verbs/grant';
-import type { TokenIssueParameters } from '@/api-clients/identity/token/schema/api-verbs/issue';
-import type {
-    TokenGrantModel,
-    TokenIssueModel,
-} from '@/api-clients/identity/token/schema/model';
 import type { UserProfileUpdateParameters } from '@/api-clients/identity/user-profile/schema/api-verbs/update';
 import type { UserModel, UserMfa } from '@/api-clients/identity/user/schema/model';
 import { setI18nLocale } from '@/translations';
 
-import { useAppContextStore } from '@/store/app-context/app-context-store';
-import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
-import { useDomainStore } from '@/store/domain/domain-store';
-import { useErrorStore } from '@/store/error/error-store';
-import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
-import { languages, MANAGED_ROLES, USER_STORAGE_KEY } from '@/store/user/constant';
+import { languages, USER_STORAGE_KEY } from '@/store/user/constant';
 import type {
-    RoleInfo,
-    SignInRequest,
-    JWTPayload,
     UserStoreGetters,
     UserStoreState,
 } from '@/store/user/type';
 
-import type { PageAccessMap } from '@/lib/access-control/config';
-import {
-    checkAllMenuReadonly,
-    getDefaultPageAccessPermissionList,
-    getMinimalPageAccessPermissionList,
-    getPageAccessMapFromRawData,
-} from '@/lib/access-control/page-access-helper';
-import type { Menu, MenuId } from '@/lib/menu/config';
-import { setCurrentAccessedWorkspaceId } from '@/lib/site-initializer/last-accessed-workspace';
-
-const getUserInfo = async (): Promise<Partial<UserStoreState>> => {
-    const response = await SpaceConnector.clientV2.identity.userProfile.get<
-    undefined,
-    UserModel
-  >();
-    return {
-        userId: response.user_id,
-        roleType: response.role_type,
-        authType: response.auth_type,
-        name: response.name,
-        email: response.email,
-        language: response.language,
-        timezone: response.timezone,
-        requiredActions: response.required_actions,
-        emailVerified: !!response.email_verified,
-        mfa: response.mfa,
-    };
-};
-
-const getGrantedRole = async (roleId: string, currentRoleType: RoleType, baseRoleType?: RoleType): Promise<RoleInfo|undefined> => {
-    // DOMAIN_ADMIN -> enter workspace case
-    if (baseRoleType === ROLE_TYPE.DOMAIN_ADMIN && currentRoleType === ROLE_TYPE.WORKSPACE_OWNER) {
-        return {
-            roleType: ROLE_TYPE.WORKSPACE_OWNER,
-            roleId: 'managed-workspace-owner',
-            pageAccess: ['*'],
-        };
-    }
-    // USER -> grant USER case
-    if (currentRoleType === ROLE_TYPE.USER) {
-        return undefined;
-    }
-
-    // MANAGED_ROLE case
-    const MANAGED_ROLE_IDS: string[] = Object.keys(MANAGED_ROLES);
-    const isManagedRole = MANAGED_ROLE_IDS.includes(roleId);
-    if (isManagedRole) {
-        return {
-            roleType: MANAGED_ROLES[roleId],
-            roleId,
-            pageAccess: ['*'],
-        };
-    }
-
-    // normal case
-    try {
-        const response = await SpaceConnector.clientV2.identity.role.get<RoleGetParameters, RoleModel>({
-            role_id: roleId,
-        });
-
-        return {
-            roleType: response.role_type,
-            roleId: response.role_id,
-            pageAccess: response.page_access,
-        };
-    } catch (e) {
-        console.error(`Role Load Error: ${e}`);
-        return undefined;
-    }
-};
-const getRoleTypeFromToken = (token: string): RoleType => {
-    const decodedToken = jwtDecode<JWTPayload>(token);
-    return decodedToken.rol;
-};
 
 export const useUserStore = defineStore('user-store', () => {
-    const domainStore = useDomainStore();
-    const globalConfigSchemaStore = useGlobalConfigSchemaStore();
-
     let storedUserState: Partial<UserStoreState> = {};
     try {
         storedUserState = LocalStorageAccessor.getItem(USER_STORAGE_KEY) ?? {};
@@ -135,81 +35,22 @@ export const useUserStore = defineStore('user-store', () => {
         email: storedUserState.email,
         language: (storedUserState.language && languages[storedUserState.language]) ? storedUserState.language : 'en',
         timezone: storedUserState.timezone,
-        currentGrantInfo: undefined, // "currentGrantInfo" is for optimization of grant API call
-        currentRoleInfo: storedUserState.currentRoleInfo,
         requiredActions: storedUserState.requiredActions,
         emailVerified: storedUserState.emailVerified,
         isSignInLoading: false,
         mfa: storedUserState.mfa,
     });
-    const _getters = reactive({
-        menuList: computed<Menu[]>(() => globalConfigSchemaStore.getters.menuList),
-    });
     const getters = reactive<UserStoreGetters>({
         isDomainAdmin: computed<boolean>(() => state.roleType === ROLE_TYPE.DOMAIN_ADMIN),
         isSystemAdmin: computed<boolean>(() => state.roleType === ROLE_TYPE.SYSTEM_ADMIN),
-        domainId: computed<string>(() => domainStore.state.domainId),
         languageLabel: computed<string>(() => languages[state.language as string] || state.language),
-        isNoRoleUser: computed<boolean>(() => !state.currentRoleInfo),
         hasAdminOrWorkspaceOwnerRole: computed<boolean>(() => state.roleType === 'DOMAIN_ADMIN' || state.roleType === 'WORKSPACE_OWNER'),
-        hasPermission: computed<boolean>(() => !!state.currentRoleInfo),
-        pageAccessPermissionList: computed<MenuId[]>(() => {
-            const roleType = state.currentRoleInfo?.roleType ?? 'USER';
-            const roleBasePagePermissions = state.currentRoleInfo?.pageAccess ?? ['my_page.*'];
-            const pagePermissionMap = getPageAccessMapFromRawData({
-                pageAccessPermissions: roleBasePagePermissions,
-                menuList: _getters.menuList,
-            });
-            const minimalPagePermissionList = getMinimalPageAccessPermissionList(roleType);
-            const defaultPagePermissionList = getDefaultPageAccessPermissionList(roleType);
-
-            Object.keys(pagePermissionMap).forEach((menuId) => {
-                if (minimalPagePermissionList.includes(menuId as MenuId)) pagePermissionMap[menuId] = { read: true, write: true, access: true };
-            });
-            let result = [...minimalPagePermissionList];
-            Object.keys(pagePermissionMap).forEach((menuId) => {
-                const _menuId = menuId as MenuId;
-                if (defaultPagePermissionList.includes(_menuId) && !minimalPagePermissionList.includes(_menuId) && pagePermissionMap[_menuId].access) result = [...result, _menuId];
-            });
-
-            return result;
-        }),
-        pageAccessPermissionMap: computed<PageAccessMap>(() => {
-            const result: PageAccessMap = {};
-
-            const roleType = state.currentRoleInfo?.roleType ?? 'USER';
-            const roleBasePagePermissions = state.currentRoleInfo?.pageAccess ?? ['my_page.*'];
-            const pagePermissionMap = getPageAccessMapFromRawData({
-                pageAccessPermissions: roleBasePagePermissions,
-                menuList: _getters.menuList,
-            });
-            const minimalPagePermissionList = getMinimalPageAccessPermissionList(roleType);
-
-            const isAllReadOnly = checkAllMenuReadonly(roleBasePagePermissions);
-
-            getters.pageAccessPermissionList?.forEach((menuId) => {
-                if (!result[menuId]) {
-                    if (roleType === ROLE_TYPE.DOMAIN_ADMIN) {
-                        result[menuId] = {
-                            write: !isAllReadOnly,
-                        };
-                    } else {
-                        result[menuId] = {
-                            write: minimalPagePermissionList.includes(menuId) ? true : pagePermissionMap[menuId]?.write,
-                        };
-                    }
-                }
-            });
-            return result;
-        }),
     });
 
     /* Mutations */
     const setIsSessionExpired = (val: boolean) => { state.isSessionExpired = val; };
     const setLanguage = (val: string) => { state.language = val; };
     const setTimezone = (val: string) => { state.timezone = val; };
-    const setCurrentGrantInfo = (val: any) => { state.currentGrantInfo = val; };
-    const setCurrentRoleInfo = (val: any) => { state.currentRoleInfo = val; };
     const setIsSignInLoading = (val: boolean) => { state.isSignInLoading = val; };
     const setEmailVerified = (val: boolean) => { state.emailVerified = val; };
     const setMfa = (val: UserMfa) => { state.mfa = val; };
@@ -219,8 +60,6 @@ export const useUserStore = defineStore('user-store', () => {
         setIsSessionExpired,
         setLanguage,
         setTimezone,
-        setCurrentGrantInfo,
-        setCurrentRoleInfo,
         setIsSignInLoading,
         setEmailVerified,
         setMfa,
@@ -240,133 +79,29 @@ export const useUserStore = defineStore('user-store', () => {
         state.requiredActions = userInfo.requiredActions;
         state.emailVerified = userInfo.emailVerified;
         state.mfa = userInfo.mfa;
-        state.currentRoleInfo = userInfo.currentRoleInfo;
 
         if (userInfo.language) {
             await setI18nLocale(userInfo.language);
         }
     };
-    const signIn = async (signInRequest: SignInRequest): Promise<void> => {
-        const domainId = signInRequest.domainId;
-        let response;
-
-        if (signInRequest.authType === 'SAML') {
-            response = await SpaceConnector.clientV2.identity.token.grant<TokenGrantParameters, TokenGrantModel>({
-                grant_type: 'REFRESH_TOKEN',
-                scope: 'USER',
-                token: signInRequest.credentials.refreshToken,
-            }, { skipAuthRefresh: true });
-            SpaceConnector.setToken(response.access_token, signInRequest.credentials.refreshToken);
-        } else {
-            response = await SpaceConnector.clientV2.identity.token.issue<TokenIssueParameters, TokenIssueModel>({
-                domain_id: domainId,
-                auth_type: signInRequest.authType,
-                credentials: signInRequest.credentials,
-                verify_code: signInRequest.verify_code,
-            }, { skipAuthRefresh: true });
-            SpaceConnector.setToken(response.access_token, response.refresh_token);
-        }
-
-        if (isEmpty(response)) {
-            throw new Error();
-        }
-
-        const userInfo = await getUserInfo();
-        await setUserInfo(userInfo);
-        state.isSessionExpired = false;
-    };
-    const signOut = () => {
-        SpaceConnector.flushToken();
-        state.currentGrantInfo = undefined;
-        state.currentRoleInfo = undefined;
-    };
-    /*
-     * @returns { Promise<boolean> } isGranted
-     */
-    const grantRole = async (grantRequest: Omit<TokenGrantParameters, 'grant_type'>): Promise<boolean> => {
-        const appContextStore = useAppContextStore();
-        const userWorkspaceStore = useUserWorkspaceStore();
-        const errorStore = useErrorStore();
-        const fetcher = getCancellableFetcher(SpaceConnector.clientV2.identity.token.grant)<TokenGrantParameters, TokenGrantModel>;
-        let isGranted = false;
-
-        try {
-            // This is for not-triggered CASE, such as when user use browser back button.
-            appContextStore.setGlobalGrantLoading(true);
-            const { status, response } = await fetcher({
-                grant_type: 'REFRESH_TOKEN',
-                scope: grantRequest.scope,
-                token: grantRequest.token,
-                workspace_id: grantRequest.workspace_id,
-            }, { skipAuthRefresh: true });
-            if (status === 'succeed') {
-                SpaceConnector.setToken(response.access_token);
-                const currentRoleType = getRoleTypeFromToken(response.access_token);
-
-                const rootRoleInfo = await getGrantedRole(response.role_id, currentRoleType);
-                state.currentGrantInfo = {
-                    scope: grantRequest.scope,
-                    workspaceId: grantRequest.workspace_id,
-                    pageAccess: rootRoleInfo?.pageAccess || undefined,
-                };
-
-                const currentRoleInfo = await getGrantedRole(response.role_id, currentRoleType, response.role_type);
-                state.currentRoleInfo = currentRoleInfo;
-
-                if (grantRequest.scope === 'DOMAIN') {
-                    appContextStore.enterAdminMode();
-                } else appContextStore.exitAdminMode();
-                if (grantRequest.scope === 'WORKSPACE' && grantRequest.workspace_id) {
-                    userWorkspaceStore.setCurrentWorkspace(grantRequest.workspace_id);
-                    await setCurrentAccessedWorkspaceId(grantRequest.workspace_id);
-                }
-                if (grantRequest.scope === 'USER') userWorkspaceStore.setCurrentWorkspace();
-
-                if (currentRoleInfo) {
-                    isGranted = true;
-                }
-                errorStore.setGrantAccessFailStatus(false);
-            }
-        } catch (error) {
-            console.error(error);
-            /*
-            * Unlike other cases where the ErrorHandler is used for error handling,
-            * in the grant logic scenario, there can be instances where the Router
-            * has not been initialized yet. Using the ErrorHandler in such situations
-            * can lead to issues since it internally relies on the router.
-            * Therefore, in this specific case, errors are simply logged to the console
-            * and not further processed, to avoid complications with uninitialized Router instances.
-            * */
-            state.currentGrantInfo = undefined;
-            state.currentRoleInfo = undefined;
-            userWorkspaceStore.setCurrentWorkspace();
-            appContextStore.exitAdminMode();
-
-            if (isInstanceOfAPIError(error)) {
-                if (error.code === 'ERROR_WORKSPACE_STATE') {
-                    errorStore.setGrantAccessFailStatus(true);
-                } else if (error.code === 'ERROR_NOT_FOUND') {
-                    errorStore.setGrantAccessFailStatus(true);
-                } else if (error.code === 'ERROR_PERMISSION_DENIED') {
-                    errorStore.setGrantAccessFailStatus(true);
-                } else if (error.code === 'ERROR_AUTHENTICATE_FAILURE') {
-                    SpaceConnector.flushToken();
-                } else {
-                    SpaceConnector.flushToken();
-                }
-            } else {
-                SpaceConnector.flushToken();
-            }
-        } finally {
-            /*
-            * Implemented a global loading with a minimum duration of 500 milliseconds
-            * during the grant process to prevent rendering of services until the process is complete.
-            * */
-            setTimeout(() => {
-                appContextStore.setGlobalGrantLoading(false);
-            }, 500);
-        }
-        return isGranted;
+    const getUserInfo = async (): Promise<void> => {
+        const response = await SpaceConnector.clientV2.identity.userProfile.get<
+        undefined,
+        UserModel
+      >();
+        setUserInfo({
+            userId: response.user_id,
+            roleType: response.role_type,
+            authType: response.auth_type,
+            name: response.name,
+            email: response.email,
+            language: response.language,
+            timezone: response.timezone,
+            requiredActions: response.required_actions,
+            emailVerified: !!response.email_verified,
+            mfa: response.mfa,
+            isSessionExpired: false,
+        });
     };
 
     const updateUser = async (userRequest: UserProfileUpdateParameters): Promise<void> => {
@@ -392,9 +127,7 @@ export const useUserStore = defineStore('user-store', () => {
 
     const actions = {
         setUserInfo,
-        signIn,
-        signOut,
-        grantRole,
+        getUserInfo,
         updateUser,
     };
 
diff --git a/package-lock.json b/package-lock.json
index ef00fa0568..12ec91b36c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -149,6 +149,7 @@
         "bytes": "^3.1.2",
         "cashify": "^2.5.0",
         "color": "^3.1.2",
+        "console-vue-query-devtools-sdk": "^0.0.16",
         "currency.js": "^2.0.4",
         "dayjs": "^1.11.7",
         "diff-match-patch": "^1.0.5",
@@ -209,7 +210,7 @@
         "postcss-config-custom": "*",
         "rollup-plugin-visualizer": "^5.9.0",
         "tsconfig": "*",
-        "vite": "^4.5.13",
+        "vite": "^4.5.14",
         "vite-plugin-stylelint": "^3.3.3",
         "vite-plugin-vue-type-imports": "^0.2.4",
         "vitest": "^3.0.8",
@@ -12845,6 +12846,15 @@
         "node": "^14.18.0 || >=16.10.0"
       }
     },
+    "node_modules/console-vue-query-devtools-sdk": {
+      "version": "0.0.16",
+      "resolved": "https://registry.npmjs.org/console-vue-query-devtools-sdk/-/console-vue-query-devtools-sdk-0.0.16.tgz",
+      "integrity": "sha512-vxwoYCkQGxHy7xrQcIyaV6c6N50c9dNhXyBnXUojg3V+JrFMC1NIjvw+eMMJFR2IpH3py1dSJTfGk21g8YpsjQ==",
+      "peerDependencies": {
+        "@tanstack/vue-query": "^5.0.0",
+        "vue": ">=2.7.0 <3.0.0"
+      }
+    },
     "node_modules/constantinople": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/constantinople/-/constantinople-4.0.1.tgz",
@@ -32279,9 +32289,9 @@
       }
     },
     "node_modules/vite": {
-      "version": "4.5.13",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.13.tgz",
-      "integrity": "sha512-Hgp8IF/yZDzKsN1hQWOuQZbrKiaFsbQud+07jJ8h9m9PaHWkpvZ5u55Xw5yYjWRXwRQ4jwFlJvY7T7FUJG9MCA==",
+      "version": "4.5.14",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.14.tgz",
+      "integrity": "sha512-+v57oAaoYNnO3hIu5Z/tJRZjq5aHM2zDve9YZ8HngVHbhk66RStobhb1sqPMIPEleV6cNKYK4eGrAbE9Ulbl2g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -34890,7 +34900,7 @@
         "tsc-alias": "^1.6.11",
         "tsc-watch": "^6.0.0",
         "tsconfig": "*",
-        "vite": "^4.5.13"
+        "vite": "^4.5.14"
       }
     },
     "packages/core-lib/node_modules/@types/node": {
@@ -34907,7 +34917,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 +35013,7 @@
         "tsc-alias": "^1.6.11",
         "tsc-watch": "^6.0.0",
         "tsconfig": "*",
-        "vite": "^4.5.13",
+        "vite": "^4.5.14",
         "vite-plugin-stylelint": "^3.3.3",
         "vue-router": "^3.6.5",
         "vue-tsc": "^2.2.8"
@@ -35298,7 +35308,7 @@
         "tsc-alias": "^1.6.11",
         "tsc-watch": "^6.0.0",
         "tsconfig": "*",
-        "vite": "^4.5.13"
+        "vite": "^4.5.14"
       }
     },
     "packages/utils/node_modules/@types/node": {
@@ -36853,7 +36863,7 @@
         "tsc-alias": "^1.6.11",
         "tsc-watch": "^6.0.0",
         "tsconfig": "*",
-        "vite": "^4.5.13"
+        "vite": "^4.5.14"
       },
       "dependencies": {
         "@types/node": {
@@ -36922,7 +36932,7 @@
         "v-click-outside": "^3.0.1",
         "v-tooltip": "^2.0.3",
         "velocity-animate": "^1.5.2",
-        "vite": "^4.5.13",
+        "vite": "^4.5.14",
         "vite-plugin-stylelint": "^3.3.3",
         "vue": "2.7.16",
         "vue-filepond": "^6.0.3",
@@ -37010,7 +37020,7 @@
         "tsc-alias": "^1.6.11",
         "tsc-watch": "^6.0.0",
         "tsconfig": "*",
-        "vite": "^4.5.13"
+        "vite": "^4.5.14"
       },
       "dependencies": {
         "@types/node": {
@@ -44342,6 +44352,12 @@
       "integrity": "sha512-I5qxpzLv+sJhTVEoLYNcTW+bThDCPsit0vLNKShZx6rLtpilNpmmeTPaeqJb9ZE9dV3DGaeby6Vuhrw38WjeyQ==",
       "dev": true
     },
+    "console-vue-query-devtools-sdk": {
+      "version": "0.0.16",
+      "resolved": "https://registry.npmjs.org/console-vue-query-devtools-sdk/-/console-vue-query-devtools-sdk-0.0.16.tgz",
+      "integrity": "sha512-vxwoYCkQGxHy7xrQcIyaV6c6N50c9dNhXyBnXUojg3V+JrFMC1NIjvw+eMMJFR2IpH3py1dSJTfGk21g8YpsjQ==",
+      "requires": {}
+    },
     "constantinople": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/constantinople/-/constantinople-4.0.1.tgz",
@@ -46314,7 +46330,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 +59151,9 @@
       }
     },
     "vite": {
-      "version": "4.5.13",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.13.tgz",
-      "integrity": "sha512-Hgp8IF/yZDzKsN1hQWOuQZbrKiaFsbQud+07jJ8h9m9PaHWkpvZ5u55Xw5yYjWRXwRQ4jwFlJvY7T7FUJG9MCA==",
+      "version": "4.5.14",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.14.tgz",
+      "integrity": "sha512-+v57oAaoYNnO3hIu5Z/tJRZjq5aHM2zDve9YZ8HngVHbhk66RStobhb1sqPMIPEleV6cNKYK4eGrAbE9Ulbl2g==",
       "dev": true,
       "requires": {
         "esbuild": "^0.18.10",
@@ -60350,6 +60366,7 @@
         "bytes": "^3.1.2",
         "cashify": "^2.5.0",
         "color": "^3.1.2",
+        "console-vue-query-devtools-sdk": "^0.0.16",
         "currency.js": "^2.0.4",
         "dayjs": "^1.11.7",
         "diff-match-patch": "^1.0.5",
@@ -60385,7 +60402,7 @@
         "uuid": "^8.3.2",
         "v-click-outside": "^3.0.1",
         "v-tooltip": "^2.0.3",
-        "vite": "^4.5.13",
+        "vite": "^4.5.14",
         "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 aff6740a75..7e916c88a8 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.13"
+    "vite": "^4.5.14"
   },
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
diff --git a/packages/core-lib/src/space-connector/index.ts b/packages/core-lib/src/space-connector/index.ts
index 455c3451f4..a33c937af3 100644
--- a/packages/core-lib/src/space-connector/index.ts
+++ b/packages/core-lib/src/space-connector/index.ts
@@ -59,23 +59,19 @@ export class SpaceConnector {
 
     private static interceptorIds: number[] = []; // [v1 id, v2 id]
 
-    private readonly serviceConfig: Record<string, any> = {};
-
     constructor(
         endpoints: string[],
         tokenApi: TokenAPI,
         apiSettings: CreateAxiosDefaults[],
         devConfig: DevConfig|undefined,
         afterCallApiMap: AfterCallApiMap,
-        serviceConfig: Record<string, any>,
     ) {
         SpaceConnector.mockConfig = devConfig?.mockConfig ?? {};
         SpaceConnector.authConfig = devConfig?.authConfig ?? {};
         SpaceConnector.isDevMode = devConfig?.enabled ?? false;
-        this.serviceConfig = serviceConfig;
         this.tokenApi = tokenApi;
-        this.serviceApi = new ServiceAPI(endpoints[0], this.tokenApi, apiSettings[0], this.serviceConfig);
-        const serviceApiV2 = new ServiceAPI(endpoints[1], this.tokenApi, apiSettings[1], this.serviceConfig);
+        this.serviceApi = new ServiceAPI(endpoints[0], this.tokenApi, apiSettings[0]);
+        const serviceApiV2 = new ServiceAPI(endpoints[1], this.tokenApi, apiSettings[1]);
         this.serviceApiV2 = serviceApiV2;
         this.afterCallApiMap = afterCallApiMap;
         this._restClient = serviceApiV2.instance;
@@ -99,10 +95,9 @@ export class SpaceConnector {
         apiSettings: CreateAxiosDefaults[] = [],
         devConfig: DevConfig = {},
         afterCallApiMap: AfterCallApiMap = {},
-        serviceConfig: Record<string, any> = {},
     ): Promise<void> {
         if (!SpaceConnector.instance) {
-            SpaceConnector.instance = new SpaceConnector(endpoints, tokenApi, apiSettings, devConfig, afterCallApiMap, serviceConfig);
+            SpaceConnector.instance = new SpaceConnector(endpoints, tokenApi, apiSettings, devConfig, afterCallApiMap);
             await Promise.allSettled([
                 SpaceConnector.instance.loadAPI(1),
                 SpaceConnector.instance.loadAPI(2),
@@ -151,6 +146,15 @@ export class SpaceConnector {
         SpaceConnector.instance.tokenApi.flushToken();
     }
 
+    static setServiceConfig(serviceConfig: Record<string, any>): void {
+        if (SpaceConnector.instance) {
+            SpaceConnector.instance.serviceApi.updateServiceConfig(serviceConfig);
+            SpaceConnector.instance.serviceApiV2.updateServiceConfig(serviceConfig);
+        } else {
+            throw new Error('Not initialized client!');
+        }
+    }
+
     static async refreshAccessToken(executeSessionTimeoutCallback: boolean): Promise<boolean|undefined> {
         return SpaceConnector.instance.tokenApi.refreshAccessToken(executeSessionTimeoutCallback);
     }
diff --git a/packages/core-lib/src/space-connector/service-api.ts b/packages/core-lib/src/space-connector/service-api.ts
index 7e5ef823d0..d0477253f9 100644
--- a/packages/core-lib/src/space-connector/service-api.ts
+++ b/packages/core-lib/src/space-connector/service-api.ts
@@ -17,7 +17,7 @@ export default class ServiceAPI {
 
     serviceConfig: Record<string, any> = {};
 
-    constructor(baseURL: string, tokenApi: TokenAPI, settings: CreateAxiosDefaults = {}, serviceConfig: Record<string, any> = {}) {
+    constructor(baseURL: string, tokenApi: TokenAPI, settings: CreateAxiosDefaults = {}) {
         this.instance = axios.create({
             ...settings,
             headers: {
@@ -26,7 +26,6 @@ export default class ServiceAPI {
             baseURL,
         });
         this.tokenApi = tokenApi;
-        this.serviceConfig = serviceConfig;
         tokenApi.loadToken();
         this.setAxiosInterceptors();
     }
@@ -60,7 +59,7 @@ export default class ServiceAPI {
             // Check if the service is enabled
             const serviceName = ServiceAPI.extractServiceNameFromEndpoint(request.url || '');
             const serviceInfo = this.serviceConfig[serviceName];
-            if (serviceInfo && serviceInfo.ENABLED === false) {
+            if (serviceInfo && serviceInfo.enabled === false) {
                 throw new Error(`[ServiceAPI] ${serviceName} service is disabled.`);
             }
 
@@ -76,7 +75,11 @@ export default class ServiceAPI {
 
     private static extractServiceNameFromEndpoint(url: string): string {
         const service = url.split('/')[1];
-        if (service) return service.replace(/-/g, '_').toUpperCase();
+        if (service) return service;
         return '';
     }
+
+    updateServiceConfig(serviceConfig: Record<string, any>): void {
+        this.serviceConfig = serviceConfig;
+    }
 }
diff --git a/packages/language-pack/console-translation-2.8.babel b/packages/language-pack/console-translation-2.8.babel
index 47d87f1e24..e6222317ab 100644
--- a/packages/language-pack/console-translation-2.8.babel
+++ b/packages/language-pack/console-translation-2.8.babel
@@ -5691,6 +5691,200 @@
                                     </translation>
                                 </translations>
                             </concept_node>
+                            <folder_node>
+                                <name>MODAL</name>
+                                <children>
+                                    <concept_node>
+                                        <name>DELETE_MEMBER_DESC</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>DELETE_MEMBER_DESC_BOLD</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>DELETE_MEMBER_TITLE</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>DELETE_NOTIFICATION_DESC</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>DELETE_NOTIFICATION_DESC_BOLD</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>DELETE_NOTIFICATION_TITLE</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>ESCALATION_LINK_TEXT</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>NOTIFICATION_LINK_TEXT</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>REMOVE</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description/>
+                                        <comment/>
+                                        <default_text/>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>true</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ja-JP</language>
+                                                <approved>true</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>ko-KR</language>
+                                                <approved>true</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                </children>
+                            </folder_node>
                             <concept_node>
                                 <name>MODAL_DELETE_DESC</name>
                                 <definition_loaded>false</definition_loaded>
@@ -6365,6 +6559,27 @@
                             </translation>
                         </translations>
                     </concept_node>
+                    <concept_node>
+                        <name>TIMEZONE</name>
+                        <definition_loaded>false</definition_loaded>
+                        <description/>
+                        <comment/>
+                        <default_text/>
+                        <translations>
+                            <translation>
+                                <language>en-US</language>
+                                <approved>true</approved>
+                            </translation>
+                            <translation>
+                                <language>ja-JP</language>
+                                <approved>true</approved>
+                            </translation>
+                            <translation>
+                                <language>ko-KR</language>
+                                <approved>true</approved>
+                            </translation>
+                        </translations>
+                    </concept_node>
                     <concept_node>
                         <name>UPDATE</name>
                         <definition_loaded>false</definition_loaded>
@@ -28891,6 +29106,27 @@
                                     </translation>
                                 </translations>
                             </concept_node>
+                            <concept_node>
+                                <name>SET_TIMEZONE</name>
+                                <definition_loaded>false</definition_loaded>
+                                <description/>
+                                <comment/>
+                                <default_text/>
+                                <translations>
+                                    <translation>
+                                        <language>en-US</language>
+                                        <approved>false</approved>
+                                    </translation>
+                                    <translation>
+                                        <language>ja-JP</language>
+                                        <approved>false</approved>
+                                    </translation>
+                                    <translation>
+                                        <language>ko-KR</language>
+                                        <approved>false</approved>
+                                    </translation>
+                                </translations>
+                            </concept_node>
                             <concept_node>
                                 <name>SUN</name>
                                 <definition_loaded>false</definition_loaded>
@@ -62496,6 +62732,48 @@
                                     <folder_node>
                                         <name>DELETE</name>
                                         <children>
+                                            <concept_node>
+                                                <name>SCOPED_NOTIFICATION_DESC</name>
+                                                <definition_loaded>false</definition_loaded>
+                                                <description/>
+                                                <comment/>
+                                                <default_text/>
+                                                <translations>
+                                                    <translation>
+                                                        <language>en-US</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                    <translation>
+                                                        <language>ja-JP</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                    <translation>
+                                                        <language>ko-KR</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                </translations>
+                                            </concept_node>
+                                            <concept_node>
+                                                <name>SCOPED_NOTIFICATION_DESC_BOLD</name>
+                                                <definition_loaded>false</definition_loaded>
+                                                <description/>
+                                                <comment/>
+                                                <default_text/>
+                                                <translations>
+                                                    <translation>
+                                                        <language>en-US</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                    <translation>
+                                                        <language>ja-JP</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                    <translation>
+                                                        <language>ko-KR</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                </translations>
+                                            </concept_node>
                                             <concept_node>
                                                 <name>SHOW_SUCCESS_MESSAGE</name>
                                                 <definition_loaded>false</definition_loaded>
diff --git a/packages/language-pack/en.json b/packages/language-pack/en.json
index 2ba3b7cee5..56a35adf1f 100644
--- a/packages/language-pack/en.json
+++ b/packages/language-pack/en.json
@@ -278,6 +278,17 @@
 			"LABEL_SERVICE_NAME": "Service Name",
 			"MEMBER": "Member",
 			"MEMBERS": "Members",
+			"MODAL": {
+				"DELETE_MEMBER_DESC": "You must first disconnect each connected 'Notification' before deleting the [{name}] Member.",
+				"DELETE_MEMBER_DESC_BOLD": "Please remove all [{name}] Members from the 'Notification' and try again.",
+				"DELETE_MEMBER_TITLE": "Remove Service Member",
+				"DELETE_NOTIFICATION_DESC": "You must first disconnect each connected 'Escalation Policy' before deleting the [{name}] Notification.",
+				"DELETE_NOTIFICATION_DESC_BOLD": "Please remove all [{name}] Notifications from the 'Escalation Policy' and try again.",
+				"DELETE_NOTIFICATION_TITLE": "Delete Notification Channel",
+				"ESCALATION_LINK_TEXT": "Go to Escalation Policy",
+				"NOTIFICATION_LINK_TEXT": "Go to Connected Notifications",
+				"REMOVE": "Remove"
+			},
 			"MODAL_DELETE_DESC": "Check the connected webhooks and alerts of the service.",
 			"MODAL_DELETE_NO_DATA": "Are you sure you want to delete this service?",
 			"MODAL_DELETE_TITLE": "Are you sure you want to delete this service?",
@@ -311,6 +322,7 @@
 		"SET_UP": "Set Up",
 		"SHOW_MORE": "show more",
 		"STATUS": "Status",
+		"TIMEZONE": "Time Zone",
 		"UPDATE": "Update",
 		"WEBHOOK": {
 			"ALT_S_CREATE_WEBHOOK": "Webhook successfully created",
@@ -1566,6 +1578,7 @@
 			"MON": "Mon",
 			"SAT": "Sat",
 			"SCHEDULE_SETTING": "Schedule Setting",
+			"SET_TIMEZONE": "Set Time Zone",
 			"SUN": "Sun",
 			"THU": "Thu",
 			"TO": "to",
@@ -3397,8 +3410,10 @@
 					"UPDATE_TITLE": "Update User Group"
 				},
 				"DELETE": {
+					"SCOPED_NOTIFICATION_DESC": "You must first disconnect each connected ‘Service' before deleting the [{name}] User Group.",
+					"SCOPED_NOTIFICATION_DESC_BOLD": "Please remove all [{name}] User Group from the each 'Service' Page and try again.",
 					"SHOW_SUCCESS_MESSAGE": "User Group successfully Deleted",
-					"TITLE": "Are you sure you want to Delete User Group?"
+					"TITLE": "Delete User Group"
 				},
 				"DELETE_CHANNEL": {
 					"DELETE": "Delete",
diff --git a/packages/language-pack/ja.json b/packages/language-pack/ja.json
index df95db30a1..51830c3efe 100644
--- a/packages/language-pack/ja.json
+++ b/packages/language-pack/ja.json
@@ -278,6 +278,17 @@
 			"LABEL_SERVICE_NAME": "サービス名",
 			"MEMBER": "構成員",
 			"MEMBERS": "構成員",
+			"MODAL": {
+				"DELETE_MEMBER_DESC": "[{name}]メンバーを削除する前に、接続されている各「通知」の接続を解除する必要があります。",
+				"DELETE_MEMBER_DESC_BOLD": "Please remove all [{name}] Members from the 'Notification' and try again.\" → \"「通知」から[{name}]メンバーをすべて削除してから、もう一度お試しください。",
+				"DELETE_MEMBER_TITLE": "サービスメンバー削除",
+				"DELETE_NOTIFICATION_DESC": "[{name}]通知を削除する前に、接続されている各「エスカレーションポリシー」の接続を解除する必要があります。",
+				"DELETE_NOTIFICATION_DESC_BOLD": "「エスカレーションポリシー」から[{name}]通知をすべて削除してから、もう一度お試しください。",
+				"DELETE_NOTIFICATION_TITLE": "通知チャネル削除",
+				"ESCALATION_LINK_TEXT": "エスカレーションポリシーへ移動",
+				"NOTIFICATION_LINK_TEXT": "接続された通知へ移動",
+				"REMOVE": "削除"
+			},
 			"MODAL_DELETE_DESC": "サービスの接続されたウェブフックとアラートを確認してください。",
 			"MODAL_DELETE_NO_DATA": "このサービスを削除してもよろしいですか？",
 			"MODAL_DELETE_TITLE": "このサービスを削除してもよろしいですか？",
@@ -311,6 +322,7 @@
 		"SET_UP": "設定",
 		"SHOW_MORE": "もっと見る",
 		"STATUS": "ステータス",
+		"TIMEZONE": "タイムゾーン",
 		"UPDATE": "編集",
 		"WEBHOOK": {
 			"ALT_S_CREATE_WEBHOOK": "ウェプフク追加に成功",
@@ -1566,6 +1578,7 @@
 			"MON": "月",
 			"SAT": "土",
 			"SCHEDULE_SETTING": "スケジュール設定",
+			"SET_TIMEZONE": "タイムゾーン設定",
 			"SUN": "日",
 			"THU": "木",
 			"TO": "から",
@@ -3397,8 +3410,10 @@
 					"UPDATE_TITLE": "ユーザーグループの編集"
 				},
 				"DELETE": {
+					"SCOPED_NOTIFICATION_DESC": "[{name}]ユーザーグループを削除する前に、接続されている各「サービス」の接続を解除する必要があります。",
+					"SCOPED_NOTIFICATION_DESC_BOLD": "각 '서비스' 페이지에서 [{name}] 사용자 그룹을 모두 제거한 후 다시 시도해주세요.",
 					"SHOW_SUCCESS_MESSAGE": "ユーザーグループの削除が完了しました",
-					"TITLE": "ユーザーグループを削除してもよろしいですか？"
+					"TITLE": "ユーザーグループ削除"
 				},
 				"DELETE_CHANNEL": {
 					"DELETE": "削除",
diff --git a/packages/language-pack/ko.json b/packages/language-pack/ko.json
index c0fdd969e8..ab92a79b0a 100644
--- a/packages/language-pack/ko.json
+++ b/packages/language-pack/ko.json
@@ -278,6 +278,17 @@
 			"LABEL_SERVICE_NAME": "서비스 이름",
 			"MEMBER": "멤버",
 			"MEMBERS": "멤버",
+			"MODAL": {
+				"DELETE_MEMBER_DESC": "[{name}] 멤버를 삭제하기 전에 연결된 각 '알림'의 연결을 해제해야 합니다.",
+				"DELETE_MEMBER_DESC_BOLD": "'알림'에서 [{name}] 멤버를 모두 제거한 후 다시 시도해주세요.",
+				"DELETE_MEMBER_TITLE": "서비스 멤버 제거",
+				"DELETE_NOTIFICATION_DESC": "[{name}] 알림을 삭제하기 전에 연결된 각 '에스컬레이션 정책'의 연결을 해제해야 합니다.",
+				"DELETE_NOTIFICATION_DESC_BOLD": "에스컬레이션 정책'에서 [{name}] 알림을 모두 제거한 후 다시 시도해주세요.",
+				"DELETE_NOTIFICATION_TITLE": "알림 채널 삭제",
+				"ESCALATION_LINK_TEXT": "에스컬레이션 정책으로 이동",
+				"NOTIFICATION_LINK_TEXT": "연결된 알림으로 이동",
+				"REMOVE": "제거"
+			},
 			"MODAL_DELETE_DESC": "서비스의 연결된 웹훅과 알림을 확인하세요.",
 			"MODAL_DELETE_NO_DATA": "이 서비스를 삭제하시겠습니까?",
 			"MODAL_DELETE_TITLE": "이 서비스를 삭제하시겠습니까?",
@@ -311,6 +322,7 @@
 		"SET_UP": "설정",
 		"SHOW_MORE": "더보기",
 		"STATUS": "상태",
+		"TIMEZONE": "타임존",
 		"UPDATE": "수정",
 		"WEBHOOK": {
 			"ALT_S_CREATE_WEBHOOK": "웹훅 생성 완료",
@@ -1566,6 +1578,7 @@
 			"MON": "월",
 			"SAT": "토",
 			"SCHEDULE_SETTING": "스케줄 설정",
+			"SET_TIMEZONE": "시간대 설정",
 			"SUN": "일",
 			"THU": "목",
 			"TO": "부터",
@@ -3397,8 +3410,10 @@
 					"UPDATE_TITLE": "사용자 그룹 수정"
 				},
 				"DELETE": {
+					"SCOPED_NOTIFICATION_DESC": "[{name}] 사용자 그룹을 삭제하기 전에 연결된 각 '서비스'의 연결을 해제해야 합니다.",
+					"SCOPED_NOTIFICATION_DESC_BOLD": "각 '서비스' 페이지에서 [{name}] 사용자 그룹을 모두 제거한 후 다시 시도해주세요.",
 					"SHOW_SUCCESS_MESSAGE": "사용자 그룹 삭제 완료",
-					"TITLE": "이 사용자 그룹을 삭제하시겠습니까? "
+					"TITLE": "사용자 그룹 삭제"
 				},
 				"DELETE_CHANNEL": {
 					"DELETE": "삭제",
diff --git a/packages/mirinae/package.json b/packages/mirinae/package.json
index 55bbcfe303..d93f36dc58 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.13",
+    "vite": "^4.5.14",
     "vite-plugin-stylelint": "^3.3.3",
     "vue-router": "^3.6.5",
     "vue-tsc": "^2.2.8"
diff --git a/packages/mirinae/src/data-display/tables/definition-table/PDefinitionTable.vue b/packages/mirinae/src/data-display/tables/definition-table/PDefinitionTable.vue
index e445f74f0e..5dc2a4e2ff 100644
--- a/packages/mirinae/src/data-display/tables/definition-table/PDefinitionTable.vue
+++ b/packages/mirinae/src/data-display/tables/definition-table/PDefinitionTable.vue
@@ -80,12 +80,12 @@ import type {
 } from '@/data-display/tables/definition-table/type';
 import PDataLoader from '@/feedbacks/loading/data-loader/PDataLoader.vue';
 
-const makeDefItems = (fields: DefinitionField[], data?: DefinitionData|DefinitionData[]): DefinitionProps[] => fields.map((field) => {
+const makeDefItems = (fields: DefinitionField[], data?: DefinitionData|DefinitionData[], disableCopy?: boolean): DefinitionProps[] => fields.map((field) => {
     const dataValue = get(data, field.name) ?? getValueByPath(data, field.name) ?? '';
     return {
         ...field,
         data: dataValue,
-        copyValue: field.disableCopy ? undefined : dataValue,
+        copyValue: (disableCopy || field.disableCopy) ? undefined : dataValue,
     };
 });
 
@@ -138,7 +138,7 @@ export default defineComponent({
                 return !def.data;
             })),
             skeletons: computed(() => range(props.skeletonRows ?? 5)),
-            items: computed(() => makeDefItems(props.fields, props.data)),
+            items: computed(() => makeDefItems(props.fields, props.data, props.disableCopy)),
         });
 
         watch([() => props.data, () => props.fields], () => {
diff --git a/packages/utils/package.json b/packages/utils/package.json
index 30779b5974..f9e5ad79d9 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.13"
+    "vite": "^4.5.14"
   },
   "main": "dist/index.js",
   "types": "dist/index.d.ts",