Skip to content

Commit ef12ec3

Browse files
skdud4659skdud4659
committed
feat: service router applied (project)
Signed-off-by: NaYeong,Kim <[email protected]>
1 parent ac45004 commit ef12ec3

File tree

20 files changed

+159
-99
lines changed

20 files changed

+159
-99
lines changed

Diff for: ‎apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/helper.ts

-6
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import type { SearchTab } from '@/common/modules/navigations/top-bar/modules/top
77

88
import { ASSET_INVENTORY_ROUTE } from '@/services/asset-inventory/routes/route-constant';
99
import { DASHBOARDS_ROUTE } from '@/services/dashboards/routes/route-constant';
10-
import { PROJECT_ROUTE_V1 } from '@/services/project/v1/routes/route-constant';
1110
import { SERVICE_ACCOUNT_ROUTE } from '@/services/service-account/routes/route-constant';
1211

1312
const queryHelper = new QueryHelper();
@@ -19,11 +18,6 @@ export const topBarSearchReferenceRouter = (type: Exclude<SearchTab, 'service'>,
1918
name: SERVICE_ACCOUNT_ROUTE.DETAIL._NAME,
2019
params: { serviceAccountId: resourceId, workspaceId },
2120
};
22-
case SEARCH_TAB.PROJECT:
23-
return {
24-
name: PROJECT_ROUTE_V1.DETAIL._NAME,
25-
params: { id: resourceId, workspaceId },
26-
};
2721
case SEARCH_TAB.DASHBOARD:
2822
return {
2923
name: DASHBOARDS_ROUTE.DETAIL._NAME,

Diff for: ‎apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/TopBarSearchDropdown.vue

+8-2
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { useUserStore } from '@/store/user/user-store';
1616
1717
import type { PageAccessMap } from '@/lib/access-control/config';
1818
import { MENU_ID } from '@/lib/menu/config';
19+
import { referenceRouter } from '@/lib/reference/referenceRouter';
1920
2021
import { useRecentStore } from '@/common/modules/navigations/stores/recent-store';
2122
import { SEARCH_TAB } from '@/common/modules/navigations/top-bar/modules/top-bar-search/config';
@@ -32,7 +33,6 @@ import { useTopBarSearchStore } from '@/common/modules/navigations/top-bar/modul
3233
import type { SearchTab } from '@/common/modules/navigations/top-bar/modules/top-bar-search/type';
3334
import { RECENT_TYPE } from '@/common/modules/navigations/type';
3435
35-
3636
interface Props {
3737
isFocused: boolean;
3838
focusingDirection: string;
@@ -133,7 +133,13 @@ const handleSelect = (item) => {
133133
label: item?.name,
134134
},
135135
});
136-
} else if (topBarSearchStore.state.activeTab !== SEARCH_TAB.SERVICE) router.push(topBarSearchReferenceRouter(topBarSearchStore.state.activeTab, item.resource_id, item.workspace_id));
136+
} else if (topBarSearchStore.state.activeTab !== SEARCH_TAB.SERVICE) {
137+
if (topBarSearchStore.state.activeTab === SEARCH_TAB.PROJECT) {
138+
router.push(referenceRouter(item.resource_id, { resource_type: 'identity.Project' })).catch(() => {});
139+
} else {
140+
router.push(topBarSearchReferenceRouter(topBarSearchStore.state.activeTab, item.resource_id, item.workspace_id));
141+
}
142+
}
137143
138144
topBarSearchStore.setIsActivated(false);
139145
};

Diff for: ‎apps/web/src/common/modules/navigations/top-bar/modules/top-bar-search/modules/top-bar-search-dropdown/modules/TopBarSearchRecentListItem.vue

+11-6
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,15 @@ import {
99
1010
import { useAllReferenceStore } from '@/store/reference/all-reference-store';
1111
12+
import { referenceRouter } from '@/lib/reference/referenceRouter';
13+
1214
import { useRecentStore } from '@/common/modules/navigations/stores/recent-store';
1315
import { SEARCH_TAB } from '@/common/modules/navigations/top-bar/modules/top-bar-search/config';
1416
import { topBarSearchReferenceRouter } from '@/common/modules/navigations/top-bar/modules/top-bar-search/helper';
1517
import { useTopBarSearchStore } from '@/common/modules/navigations/top-bar/modules/top-bar-search/store';
1618
import type { SearchTab } from '@/common/modules/navigations/top-bar/modules/top-bar-search/type';
1719
import type { RecentItem } from '@/common/modules/navigations/type';
1820
19-
2021
interface Props {
2122
recentItem?: RecentItem;
2223
}
@@ -132,11 +133,15 @@ const handleClick = () => {
132133
if (topBarSearchStore.state.activeTab === SEARCH_TAB.CLOUD_SERVICE) {
133134
router.push(topBarSearchReferenceRouter(topBarSearchStore.state.activeTab, state.convertResourceId, storeState.currentWorkspaceId, props.recentItem?.data));
134135
} else if (topBarSearchStore.state.activeTab !== SEARCH_TAB.SERVICE) {
135-
router.push(topBarSearchReferenceRouter(
136-
topBarSearchStore.state.activeTab,
137-
state.convertResourceId,
138-
storeState.currentWorkspaceId,
139-
));
136+
if (topBarSearchStore.state.activeTab === SEARCH_TAB.PROJECT) {
137+
router.push(referenceRouter(state.convertResourceId, { resource_type: 'identity.Project' })).catch(() => {});
138+
} else {
139+
router.push(topBarSearchReferenceRouter(
140+
topBarSearchStore.state.activeTab,
141+
state.convertResourceId,
142+
storeState.currentWorkspaceId,
143+
));
144+
}
140145
}
141146
topBarSearchStore.setIsActivated(false);
142147
};

Diff for: ‎apps/web/src/common/modules/navigations/top-bar/modules/top-bar-toolset/modules/top-bar-favorite/modules/TopBarFavoriteContextMenu.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ import { ASSET_INVENTORY_ROUTE } from '@/services/asset-inventory/routes/route-c
5353
import { COST_EXPLORER_ROUTE } from '@/services/cost-explorer/routes/route-constant';
5454
import { useDashboardQuery } from '@/services/dashboards/composables/use-dashboard-query';
5555
import { DASHBOARDS_ROUTE } from '@/services/dashboards/routes/route-constant';
56-
import { PROJECT_ROUTE_V1 } from '@/services/project/v1/routes/route-constant';
56+
import { PROJECT_ROUTE_V2 } from '@/services/project/v2/routes/route-constant';
5757
5858
const FAVORITE_LIMIT = 5;
5959
@@ -245,7 +245,7 @@ const handleClickMenuButton = (type: FavoriteType) => {
245245
// Dashboard and Cost Analysis are added after (Planning).
246246
if (type === FAVORITE_TYPE.PROJECT) {
247247
router.replace({
248-
name: PROJECT_ROUTE_V1._NAME,
248+
name: PROJECT_ROUTE_V2._NAME,
249249
});
250250
}
251251
emit('close');

Diff for: ‎apps/web/src/common/modules/project/ProjectLinkButton.vue

+3-11
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,10 @@ import {
66
PTextButton, PI, PLink, PSkeleton,
77
} from '@cloudforet/mirinae';
88
9-
import { useUserWorkspaceStore } from '@/store/app-context/workspace/user-workspace-store';
10-
import { useProjectReferenceStore } from '@/store/reference/project-reference-store';
119
10+
import { useProjectReferenceStore } from '@/store/reference/project-reference-store';
1211
13-
import { PROJECT_ROUTE_V1 } from '@/services/project/v1/routes/route-constant';
12+
import { referenceRouter } from '@/lib/reference/referenceRouter';
1413
1514
const props = defineProps<{
1615
projectId: string;
@@ -21,16 +20,9 @@ const props = defineProps<{
2120
const emit = defineEmits<{(event: 'click'): void;
2221
}>();
2322
const projectReferenceStore = useProjectReferenceStore();
24-
const userWorkspaceStore = useUserWorkspaceStore();
2523
2624
const hasProjectReferenceLoaded = computed<boolean>(() => !!projectReferenceStore.getters.projectItems);
27-
const projectPageLocation = computed<Location>(() => ({
28-
name: PROJECT_ROUTE_V1.DETAIL._NAME,
29-
params: {
30-
workspaceId: userWorkspaceStore.getters.currentWorkspaceId as string,
31-
id: props.projectId,
32-
},
33-
}));
25+
const projectPageLocation = computed<Location>(() => referenceRouter(props.projectId, { resource_type: 'identity.Project' }));
3426
const getProjectName = (projectId: string): string|undefined => projectReferenceStore.getters.projectItems[projectId]?.label;
3527
</script>
3628

Diff for: ‎apps/web/src/common/modules/project/ProjectSelectDropdown.vue

+3-3
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,7 @@ import { useProjectTree } from '@/common/modules/project/use-project-tree';
2727
2828
import { indigo, peacock } from '@/styles/colors';
2929
30-
31-
import { PROJECT_ROUTE_V1 } from '@/services/project/v1/routes/route-constant';
30+
import { PROJECT_ROUTE_V2 } from '@/services/project/v2/routes/route-constant';
3231
3332
interface ProjectGroupSelectOptions {
3433
id: string;
@@ -82,6 +81,7 @@ const emit = defineEmits<{(e: 'select', value: ProjectTreeNodeData[]): void;
8281
}>();
8382
8483
const allReferenceStore = useAllReferenceStore();
84+
8585
const storeState = reactive({
8686
projects: computed<ProjectReferenceMap>(() => allReferenceStore.getters.project),
8787
projectGroups: computed<ProjectGroupReferenceMap>(() => allReferenceStore.getters.projectGroup),
@@ -255,7 +255,7 @@ const refreshProjectTree = async () => {
255255
256256
const handleClickCreateButton = () => {
257257
window.open(SpaceRouter.router.resolve({
258-
name: PROJECT_ROUTE_V1._NAME,
258+
name: PROJECT_ROUTE_V2._NAME,
259259
...(props.workspaceId ? { params: { workspaceId: props.workspaceId } } : {}),
260260
}).href);
261261
state.visibleMenu = false;

Diff for: ‎apps/web/src/lib/menu/menu-info.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { INFO_ROUTE } from '@/services/info/routes/route-constant';
1414
import { MY_PAGE_ROUTE } from '@/services/my-page/routes/route-constant';
1515
import { ADMIN_OPS_FLOW_ROUTE } from '@/services/ops-flow/routes/admin/route-constant';
1616
import { OPS_FLOW_ROUTE } from '@/services/ops-flow/routes/route-constant';
17-
import { PROJECT_ROUTE_V1 } from '@/services/project/v1/routes/route-constant';
17+
import { PROJECT_ROUTE_V2 } from '@/services/project/v2/routes/route-constant';
1818
import { SERVICE_ACCOUNT_ROUTE } from '@/services/service-account/routes/route-constant';
1919
import { WORKSPACE_HOME_ROUTE } from '@/services/workspace-home/routes/route-constant';
2020

@@ -34,7 +34,7 @@ export const MENU_INFO_MAP: Record<MenuId, MenuInfo> = Object.freeze({
3434
},
3535
[MENU_ID.PROJECT]: {
3636
menuId: MENU_ID.PROJECT,
37-
routeName: PROJECT_ROUTE_V1._NAME,
37+
routeName: PROJECT_ROUTE_V2._NAME,
3838
translationId: 'MENU.PROJECT',
3939
icon: 'ic_service_project',
4040
},

Diff for: ‎apps/web/src/lib/reference/referenceRouter.ts

+26-17
Original file line numberDiff line numberDiff line change
@@ -5,18 +5,24 @@ import { concat } from 'lodash';
55

66
import { QueryHelper } from '@cloudforet/core-lib/query';
77

8+
import { useServiceRouter } from '@/router/helpers/use-service-router';
9+
810
import type { Reference, ResourceType } from '@/lib/reference/type';
911

1012
import { ADMIN_ASSET_INVENTORY_ROUTE } from '@/services/asset-inventory/routes/admin/route-constant';
1113
import { ASSET_INVENTORY_ROUTE } from '@/services/asset-inventory/routes/route-constant';
12-
import { PROJECT_ROUTE_V1 } from '@/services/project/v1/routes/route-constant';
14+
import { PROJECT_ROUTE_V2 } from '@/services/project/v2/routes/route-constant';
1315
import { ADMIN_SERVICE_ACCOUNT_ROUTE } from '@/services/service-account/routes/admin/route-constant';
1416
import { SERVICE_ACCOUNT_ROUTE } from '@/services/service-account/routes/route-constant';
1517

18+
import { MENU_ID } from '../menu/config';
19+
1620
interface LinkFormatter {
1721
(baseUrl: string, data: string, reference: Reference, query: Location['query']): Location;
1822
}
1923

24+
const serviceRouter = useServiceRouter();
25+
2026
const queryHelper = new QueryHelper();
2127

2228
const serverLinkFormatter: LinkFormatter = (name, data, reference, query) => {
@@ -34,27 +40,24 @@ const serverLinkFormatter: LinkFormatter = (name, data, reference, query) => {
3440
};
3541

3642
const projectLinkFormatter: LinkFormatter = (name, data, reference, query) => {
43+
const location = serviceRouter.getLocation({
44+
feature: MENU_ID.PROJECT,
45+
routeKey: 'detail',
46+
params: { id: data },
47+
});
3748
if (data) {
3849
return {
39-
name,
50+
...location,
4051
query,
41-
params: data ? {
42-
id: data,
43-
...(reference.workspace_id ? { workspaceId: reference.workspace_id } : {}),
44-
} : undefined,
4552
};
4653
} return {};
4754
};
4855

49-
const projectGroupLinkFormatter: LinkFormatter = (name, data) => {
50-
const location = {
51-
name,
52-
params: {
53-
projectGroupId: data,
54-
},
55-
};
56-
return location;
57-
};
56+
const projectGroupLinkFormatter: LinkFormatter = (name, data) => serviceRouter.getLocation({
57+
feature: MENU_ID.PROJECT,
58+
routeKey: 'projectGroup',
59+
params: { id: data },
60+
});
5861

5962
const collectorLinkFormatter: LinkFormatter = (name, data, reference, query) => {
6063
const location = { name, query };
@@ -110,12 +113,18 @@ const routerMap = (isAdminMode?: boolean): RouterMap => ({
110113
},
111114
'identity.Project':
112115
{
113-
name: PROJECT_ROUTE_V1.DETAIL.TAB.SUMMARY._NAME,
116+
name: serviceRouter.getLocation({
117+
feature: MENU_ID.PROJECT,
118+
routeKey: 'detail',
119+
}).name || PROJECT_ROUTE_V2._NAME,
114120
formatter: projectLinkFormatter,
115121
},
116122
'identity.ProjectGroup':
117123
{
118-
name: PROJECT_ROUTE_V1._NAME,
124+
name: serviceRouter.getLocation({
125+
feature: MENU_ID.PROJECT,
126+
routeKey: 'projectGroup',
127+
}).name || PROJECT_ROUTE_V2._NAME,
119128
formatter: projectGroupLinkFormatter,
120129
},
121130
'inventory.Collector':

Diff for: ‎apps/web/src/router/helpers/route-helper.ts

+1-3
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,7 @@ import type { WorkspaceModel } from '@/api-clients/identity/workspace/schema/mod
1010
import {
1111
ERROR_ROUTE, EXTERNAL_PAGES, ROOT_ROUTE, ROUTE_SCOPE,
1212
} from '@/router/constant';
13-
import type { RouteScopeType } from '@/router/type';
14-
15-
13+
import type { RouteScopeType } from '@/router/types';
1614

1715
import { calculateIsAccessibleRoute } from '@/lib/access-control';
1816
import type { MenuId } from '@/lib/menu/config';

Diff for: ‎apps/web/src/router/helpers/use-service-router.ts

+35-20
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useRouter } from 'vue-router/composables';
2-
2+
import type { Location } from 'vue-router/types/router';
33

44
import { useGlobalConfigSchemaStore } from '@/store/global-config-schema/global-config-schema-store';
55

@@ -16,51 +16,66 @@ type NavigateOptionsType = RouterOptionsType & {
1616
};
1717

1818
export const useServiceRouter = () => {
19-
const router = useRouter();
2019
const globalConfigSchemaStore = useGlobalConfigSchemaStore();
2120
const globalConfigSchemaState = globalConfigSchemaStore.state;
2221

23-
const navigate = async (options: NavigateOptionsType) => {
22+
const transformParams = (
23+
paramConfig: Record<string, any>,
24+
sourceParams: Record<string, any>,
25+
): Record<string, any> => {
26+
const result: Record<string, any> = {};
27+
28+
Object.entries(paramConfig).forEach(([key, targetKey]) => {
29+
if (sourceParams[key] !== undefined) {
30+
result[targetKey] = sourceParams[key];
31+
}
32+
});
33+
34+
return result;
35+
};
36+
37+
const getLocation = (options: RouterOptionsType): Location => {
2438
const {
25-
feature, routeKey, params, method,
39+
feature, routeKey, params,
2640
} = options;
2741

2842
const featureMetadata = globalConfigSchemaState.routeMetadataSchema[feature.toUpperCase()];
2943
const convertedParams = params ? transformParams(featureMetadata[routeKey].params || {}, params) : undefined;
3044

3145
if (!featureMetadata) {
32-
return router[method]({ name: feature, params: convertedParams });
46+
return { name: feature, params: convertedParams };
3347
}
3448

3549
const routeConfig = featureMetadata[routeKey];
3650
if (!routeConfig) {
37-
return router[method]({ name: feature, params: convertedParams });
51+
return { name: feature, params: convertedParams };
3852
}
3953

40-
const navigationOptions = {
54+
return {
4155
name: routeConfig.name,
4256
params: convertedParams,
4357
};
44-
return router[method](navigationOptions);
4558
};
4659

47-
const transformParams = (
48-
paramConfig: Record<string, any>,
49-
sourceParams: Record<string, any>,
50-
): Record<string, any> => {
51-
const result: Record<string, any> = {};
52-
53-
Object.entries(paramConfig).forEach(([key, targetKey]) => {
54-
if (sourceParams[key] !== undefined) {
55-
result[targetKey] = sourceParams[key];
56-
}
57-
});
60+
const navigate = async (options: NavigateOptionsType) => {
61+
const router = useRouter();
62+
const { method } = options;
63+
const location = getLocation(options);
64+
return router[method](location);
65+
};
5866

59-
return result;
67+
const resolve = (options: RouterOptionsType) => {
68+
const router = useRouter();
69+
const location = getLocation(options);
70+
return router.resolve(location);
6071
};
6172

6273
return {
6374
push: (options: RouterOptionsType) => navigate({ ...options, method: 'push' }),
6475
replace: (options: RouterOptionsType) => navigate({ ...options, method: 'replace' }),
76+
getLocation,
77+
78+
resolve,
6579
};
6680
};
81+

Diff for: ‎apps/web/src/router/types.ts

+13
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
import type { MenuId } from '@/lib/menu/config';
2+
3+
import type { ROUTE_SCOPE } from './constant';
4+
5+
export type RouteScopeType = typeof ROUTE_SCOPE[keyof typeof ROUTE_SCOPE];
6+
17
export interface RouteVersionInfo {
28
name: string;
39
params?: Record<string, any>;
@@ -40,3 +46,10 @@ export class ServiceNavigationError extends Error implements ServiceRouteError {
4046
this.name = 'ServiceNavigationError';
4147
}
4248
}
49+
50+
export type RouterOptionsType = {
51+
feature: MenuId;
52+
routeKey: string;
53+
name?: string;
54+
params?: Record<string, any>;
55+
};

0 commit comments

Comments
 (0)