feat: Do not drill down at the application level and change the menu to tabs

locales/en.json

@@ -37,14 +37,12 @@
     "Chengdu": "Chengdu",
     "China": "China",
     "Cloud management": "Cloud management",
-    "Code": "Code",
     "Config": "Config",
     "Contact your organization administrator to invite you to join": "Contact your organization administrator to invite you to join",
     "DB error": "DB error",
     "Dashboard": "Dashboard",
     "Data source: API call management": "Data source: API call management",
     "December": "December",
-    "Deploy": "Deploy",
     "Deployment not allowed in {env} in network block period.": "during the period of network closure, deployment is prohibited in the {env}!",
     "DingTalk": "DingTalk",
     "DingTalk address": "DingTalk address",
@@ -81,13 +79,11 @@
     "London": "London",
     "Malaysia": "Malaysia",
     "March": "March",
-    "Market": "Market",
     "May": "May",
     "Members under the project/application associated with the current API can view it.": "members under the project/application associated with the current API can view",
     "Memory quota": "Memory quota",
     "Middle-east & India": "Middle-east & India",
     "Mobile": "Mobile",
-    "Model": "Model",
     "Mon": "Mon",
     "Mumbai": "Mumbai",
     "New version available": "New version available",
@@ -116,7 +112,6 @@
     "Please enter version number, such as x.y.z.": "please enter version number, such as x.y.z",
     "Project": "Project",
     "Qingdao": "Qingdao",
-    "Quality": "Quality",
     "Release": "Release",
     "Report": "Report",
     "Resource": "Resource",
@@ -145,7 +140,6 @@
     "Supported Android package versions": "Supported Android package versions",
     "Supported iOS package versions": "Supported iOS package versions",
     "Sydney": "Sydney",
-    "Task": "Task",
     "Test": "Test",
     "Test Management": "Test Management",
     "The administrator has received your request. Please go to": "the administrator has received your request. please come to ",

locales/zh.json

@@ -37,14 +37,12 @@
     "Chengdu": "成都",
     "China": "中国",
     "Cloud management": "多云管理平台",
-    "Code": "代码",
     "Config": "配置",
     "Contact your organization administrator to invite you to join": "联系组织管理员，邀请您加入",
     "DB error": "数据库错误",
     "Dashboard": "大盘",
     "Data source: API call management": "数据来源：我的 API 申请调用管理",
     "December": "12月",
-    "Deploy": "部署",
     "Deployment not allowed in {env} in network block period.": "组织处于封网期间，{env}禁止部署！",
     "DingTalk": "钉钉群",
     "DingTalk address": "钉钉地址",
@@ -81,13 +79,11 @@
     "London": "伦敦",
     "Malaysia": "马来西亚",
     "March": "3月",
-    "Market": "集市",
     "May": "5月",
     "Members under the project/application associated with the current API can view it.": "当前API关联的项目/应用下的成员可以查看",
     "Memory quota": "内存配额",
     "Middle-east & India": "中东与印度",
     "Mobile": "移动",
-    "Model": "模型",
     "Mon": "一",
     "Mumbai": "孟买",
     "New version available": "新版本可用",
@@ -116,7 +112,6 @@
     "Please enter version number, such as x.y.z.": "请输入版本号，如：x.y.z",
     "Project": "项目",
     "Qingdao": "青岛",
-    "Quality": "质量",
     "Release": "发布",
     "Report": "报告",
     "Resource": "资源",
@@ -145,7 +140,6 @@
     "Supported Android package versions": "支持的 Android 包版本",
     "Supported iOS package versions": "支持的 iOS 包版本",
     "Sydney": "悉尼",
-    "Task": "任务",
     "Test": "测试",
     "Test Management": "测试管理",
     "The administrator has received your request. Please go to": "管理员已收到您的请求。请稍后到",

shell/app/common/components/configurable-filter/config-selector.tsx

@@ -22,9 +22,8 @@ export interface IProps {
   list: ConfigData[];
   value?: number | string;
   isNew: boolean;
-  defaultValue: number | string;
-  onDeleteFilter: (config: ConfigData) => void;
-  onSaveFilter: (label: string) => void;
+  defaultValue?: number | string;
+  onDeleteFilter?: (config: ConfigData) => void;
   onChange: (config: ConfigData) => void;
   className?: string;
 }
@@ -50,7 +49,7 @@ const ConfigSelector = ({ className = '', list, defaultValue, value, onChange, o
       zIndex: 9999,
       getContainer: configSelectorRef.current,
       onOk() {
-        onDeleteFilter(item);
+        onDeleteFilter?.(item);
       },
     });
   };

shell/app/common/components/configurable-filter/index.tsx

@@ -24,11 +24,11 @@ import './index.scss';
 
 export interface IProps {
   fieldsList: Field[];
-  configList: ConfigData[];
-  defaultConfig: number | string;
+  configList?: ConfigData[];
+  defaultConfig?: number | string;
   onFilter: (data: Obj) => void;
-  onDeleteFilter: (data: Obj) => void;
-  onSaveFilter: (label: string, values: Obj) => void;
+  onDeleteFilter?: (data: Obj) => void;
+  onSaveFilter?: (label: string, values: Obj) => void;
   value?: Obj;
   onConfigChange?: (config: ConfigData) => void;
   processField?: (field: Field) => IFormItem;
@@ -46,11 +46,11 @@ export interface Field {
   key: string;
   mode?: string;
   outside?: boolean;
-  value: number | string;
+  value?: number | string;
   label: string;
   children?: Field[];
   placeholder?: string;
-  options: Option[];
+  options?: Option[];
   haveFilter?: boolean;
   required?: boolean;
   emptyText?: string;
@@ -152,7 +152,7 @@ const convertValue = (value: Obj, fieldList: Field[]) => {
 
 const ConfigurableFilter = ({
   fieldsList,
-  configList,
+  configList = [],
   defaultConfig,
   value,
   onFilter: onFilterProps,
@@ -212,7 +212,7 @@ const ConfigurableFilter = ({
   };
 
   const saveFilter = (label: string) => {
-    onSaveFilter(label, form.getFieldsValue());
+    onSaveFilter?.(label, form.getFieldsValue());
   };
 
   const setAllOpen = () => {

shell/app/common/components/erda-alert/index.tsx

@@ -24,7 +24,7 @@ interface IProps {
   className?: string;
   type?: AlertProps['type'];
   theme?: 'light' | 'dark';
-  closeable: boolean;
+  closeable?: boolean;
 }
 
 const iconMap = {

shell/app/common/components/markdown-render/index.tsx

@@ -21,7 +21,6 @@ import { gfm, gfmHtml } from 'micromark-extension-gfm';
 import remarkGfm from 'remark-gfm';
 import remarkBreaks from 'remark-breaks';
 import { Light as SyntaxHighlighter } from 'react-syntax-highlighter';
-import { CodeComponent } from 'react-markdown/lib/ast-to-react';
 import github from 'react-syntax-highlighter/dist/esm/styles/hljs/googlecode.js';
 import './index.scss';
 

shell/app/common/components/menu/index.tsx

@@ -24,6 +24,7 @@ interface IMenuItem {
   disabled?: boolean;
   split?: boolean;
   isActive?: (v: string) => boolean;
+  className?: string;
 }
 
 interface IMenu {
@@ -115,20 +116,21 @@ const PureMenu = (props: IMenu) => {
     <div className={tabClass}>
       <ul className="tab-item-wraps">
         {finalMenus.map((menu: Merge<IMenuItem, { hrefType: 'back' }>) => {
-          const { disabled, key, name, hrefType, split, isActive } = menu;
+          const { disabled, key, name, hrefType, split, isActive, className: itemClass = '' } = menu;
           const menuItemClass = classnames({
             'tab-menu-item': true,
             'tab-menu-disabled': disabled,
             'tab-split-line-before': split,
             active: isActive ? isActive(activeKey) : activeKey === key,
+            [itemClass]: !!itemClass,
           });
           return (
             <li
               key={key}
               className={menuItemClass}
               onClick={() => {
                 if (!disabled && activeKey !== key) {
-                  // 点击当前，不响应
+                  // click current not trigger
                   handleClick(activeKey, key, hrefType);
                 }
               }}

shell/app/common/components/radio-tabs/index.tsx

@@ -24,10 +24,10 @@ export interface RadioTabsProps {
   className?: string;
   options: IOption[];
   value?: Value;
-  onChange?: (v: Value) => void;
+  onChange?: (v: Value, o: IOption) => void;
 }
 
-type Value = string | number | undefined;
+type Value = string | number;
 
 interface IOption {
   label: string | React.ReactElement;
@@ -51,7 +51,8 @@ const RadioTabs = (props: RadioTabsProps) => {
     propsValue && updater.value((prev: string) => (prev !== propsValue ? propsValue : prev));
   }, [propsValue, updater]);
 
-  const convertValue = (val: Value) => {
+  const convertValue = (val?: Value) => {
+    if (val === undefined) return val;
     if (options.find((o) => o.value === val)) {
       return val;
     } else {
@@ -65,13 +66,13 @@ const RadioTabs = (props: RadioTabsProps) => {
     }
   };
 
-  const valueHandle = (v: Value) => {
+  const valueHandle = (v: Value): [Value, IOption] => {
     let curVal = v;
-    const curOption = options.find((o) => o.value === curVal);
+    const curOption = options.find((o) => o.value === curVal) as IOption;
     if (curOption?.children?.length) {
       curVal = subValues[curOption.value];
     }
-    return curVal;
+    return [curVal, curOption];
   };
   return (
     <Radio.Group
@@ -81,17 +82,17 @@ const RadioTabs = (props: RadioTabsProps) => {
       size="middle"
       value={convertValue(value)}
       onChange={(e) => {
-        const curVal = valueHandle(e.target.value);
+        const [curVal, curOption] = valueHandle(e.target.value);
         updater.value(curVal);
-        onChange?.(curVal);
+        onChange?.(curVal, curOption);
       }}
     >
       {options.map((mItem) => {
         const { children, value: itemValue, icon, disabled, label, tip } = mItem;
 
         if (isArray(children) && children.length) {
           const sv = subValues[itemValue] || children[0].value;
-          const childName = children.find((c) => c.value === sv);
+          const child = children.find((c) => c.value === sv);
           const getMenu = () => {
             return (
               <Menu
@@ -100,7 +101,7 @@ const RadioTabs = (props: RadioTabsProps) => {
                     value: e.key,
                     subValues: { ...subValues, [itemValue]: e.key },
                   });
-                  onChange?.(e.key);
+                  onChange?.(e.key, child);
                 }}
               >
                 {children.map((g) => {
@@ -119,7 +120,7 @@ const RadioTabs = (props: RadioTabsProps) => {
                 <RadioItem value={itemValue} key={itemValue} disabled={disabled}>
                   <div className="inline-flex justify-between items-center">
                     {icon ? <ErdaIcon size={18} type={icon} className="mr-1" /> : null}
-                    <span className="nowrap">{childName?.label}</span>
+                    <span className="nowrap">{child?.label}</span>
                     <ErdaIcon size="18" type="caret-down" className="ml-1" />
                   </div>
                 </RadioItem>

shell/app/common/types/route.d.ts

@@ -23,7 +23,8 @@ interface IRoute {
   relativePath: string;
   breadcrumbName?: string | Function;
   _parent: IRoute;
-  mark?: string;
+  mark?: ROUTE_MARK;
+  backToUp?: string;
   layout: {
     [k: string]: any;
   };

shell/app/common/utils/go-to.tsx

@@ -194,21 +194,21 @@ export enum pages {
   repoBackup = '/{orgName}/dop/projects/{projectId}/apps/{appId}/repo/backup',
   commit = '/{orgName}/dop/projects/{projectId}/apps/{appId}/repo/commit/{commitId}',
   branches = '/{orgName}/dop/projects/{projectId}/apps/{appId}/repo/branches',
-  tags = '/{orgName}/dop/projects/{projectId}/apps/{appId}/repo/tags',
   commits = '/{orgName}/dop/projects/{projectId}/apps/{appId}/repo/commits/{branch}/{path}',
   pipeline = '/{orgName}/dop/projects/{projectId}/apps/{appId}/pipeline?caseId={caseId}&pipelineID={pipelineID}',
   dataTask = '/{orgName}/dop/projects/{projectId}/apps/{appId}/dataTask/{pipelineID}',
   dataTaskRoot = '/{orgName}/dop/projects/{projectId}/apps/{appId}/dataTask',
+  // TODO: remove
   deploy = '/{orgName}/dop/projects/{projectId}/apps/{appId}/deploy',
-  qaTicket = '/{orgName}/dop/projects/{projectId}/apps/{appId}/ticket/open?type={type}',
   release = '/{orgName}/dop/projects/{projectId}/apps/{appId}/release?q={q}',
+  // TODO: remove
   runtimeDetail = '/{orgName}/dop/projects/{projectId}/apps/{appId}/deploy/runtimes/{runtimeId}/overview?serviceName={serviceName}&jumpFrom={jumpFrom}',
   runtimeDetailRoot = '/{orgName}/dop/projects/{projectId}/apps/{appId}/deploy/runtimes/{runtimeId}/overview',
   appDataModel = '/{orgName}/dop/projects/{projectId}/apps/{appId}/dataModel',
   appDataMarket = '/{orgName}/dop/projects/{projectId}/apps/{appId}/dataMarket',
-  appCodeQuality = '/{orgName}/dop/projects/{projectId}/apps/{appId}/test',
-  appCodeQualityReports = '/{orgName}/dop/projects/{projectId}/apps/{appId}/test/quality',
-  appCodeQualityIssueOpen = '/{orgName}/dop/projects/{projectId}/apps/{appId}/ticket/open',
+  appCodeQuality = '/{orgName}/dop/projects/{projectId}/apps/{appId}/quality',
+  appCodeQualityReports = '/{orgName}/dop/projects/{projectId}/apps/{appId}/test',
+  appCodeQualityIssueOpen = '/{orgName}/dop/projects/{projectId}/apps/{appId}/ticket/open?type={type}',
   appCodeQualityIssue = '/{orgName}/dop/projects/{projectId}/apps/{appId}/ticket',
   appSetting = '/{orgName}/dop/projects/{projectId}/apps/{appId}/setting',
 

shell/app/interface/global.d.ts

@@ -309,6 +309,7 @@ type ROUTE_MARK =
   | 'addonsManage'
   | 'publisher'
   | 'project'
+  | 'projectAppList'
   | 'issues'
   | 'iterationDetail'
   | 'apiManage'
@@ -319,6 +320,8 @@ type ROUTE_MARK =
   | 'deploy'
   | 'repo'
   | 'repoTree'
+  | 'repoBranches'
+  | 'repoMr'
   | 'repoCompare'
   | 'apiDesign'
   | 'pipeline'
@@ -354,6 +357,8 @@ interface ROUTE_TABS {
   name: string | JSX.Element;
   show?: boolean;
   hrefType?: string;
+  isActive?: () => boolean;
+  [key: string]: any;
 }
 
 interface RouteConfigItem {
@@ -376,6 +381,7 @@ interface RouteConfigItem {
   ignoreTabQuery?: boolean;
   alwaysShowTabKey?: string;
   mark?: ROUTE_MARK;
+  backToUp?: ROUTE_MARK;
   toMark?: ROUTE_TO_MARK;
   routes?: RouteConfigItem[];
   wrapper?: any;

shell/app/layout/pages/page-container/components/header.scss

@@ -31,6 +31,9 @@
   }
 
   .tab-split-line-before {
+    &.tab-menu-item {
+      margin-left: 16px;
+    }
     &::before {
       position: absolute;
       content: '';
@@ -39,7 +42,7 @@
       height: 12px;
       background-color: rgba($color-default, 0.16);
       top: 10px;
-      left: -12px;
+      left: -17px;
     }
   }
 }