feat: support simple route such as /applications/-/app1/-/detail

Signed-off-by: xu.zhu <[email protected]>

src/app.tsx

@@ -34,6 +34,7 @@ import { queryResource } from '@/services/core';
 import { routes } from '../config/routes';
 import { ResourceType } from '@/const';
 import { queryRoles, querySelfMember } from '@/services/members/members';
+import { getApplicationV2 } from './services/applications/applications';
 
 const loginPath = '/user/login';
 const callbackPath = '/user/login/callback';
@@ -116,6 +117,13 @@ export async function getInitialState(): Promise<API.InitialState> {
   }
 
   if (!pathnameInStaticRoutes()) {
+    const appName = Utils.getAppNameIfSimpleRoute();
+    if (appName) {
+      const { data: app } = await getApplicationV2(appName);
+      const appFullPath = app.fullPath;
+      const groupFullPath = appFullPath.substring(0, appFullPath.lastIndexOf('/'));
+      history.push(Utils.fillSimpleRoute(groupFullPath));
+    }
     const path = Utils.getResourcePath();
     try {
       const isReleasePath = /\/templates(.*)\/-\/releases\/.*?(?:\/edit)?\/?/;

src/services/applications/applications.ts

@@ -54,7 +54,7 @@ export async function getApplication(id: number) {
   });
 }
 
-export async function getApplicationV2(id: number) {
+export async function getApplicationV2(id: number | string) {
   return request<{
     data: API.GetApplicationResponseV2
   }>(`/apis/core/v2/applications/${id}`, { method: 'GET' });

src/utils.tsx

@@ -32,6 +32,30 @@ const getResourcePath = () => {
   return path;
 };
 
+const getAppNameIfSimpleRoute = () => {
+  // simple route is defined as a route without group full path, such as /applications/-/app1/-/detail
+  const { pathname } = history.location;
+  if (pathname.startsWith('/applications/-/') || pathname.startsWith('/instances/-/')) {
+    const filteredPath = pathname.split('/').filter((item) => item !== '');
+    if (filteredPath.length < 3) {
+      return '';
+    }
+    return filteredPath[2];
+  }
+  return '';
+};
+
+const fillSimpleRoute = (groupFullPath: string) => {
+  const { pathname } = history.location;
+  let res = pathname;
+  if (pathname.startsWith('/applications/-/') || pathname.startsWith('/instances/-/')) {
+    // groupFullPath: /group1/subgroup2
+    // replace /applications/-/ with /applications/group1/subgroup2/
+    res = res.replace(/\/-\//, `${groupFullPath}/`);
+  }
+  return res;
+};
+
 const getBreadcrumbs = (fullName: string) => {
   const result = [];
   const { pathname } = history.location;
@@ -350,6 +374,8 @@ export const difference = (object: any, other: any) => {
 
 export default {
   getResourcePath,
+  getAppNameIfSimpleRoute,
+  fillSimpleRoute,
   getBreadcrumbs,
   getAvatarColorIndex,
   timeFromNow,