feat(dop): project release create form releases list add latest filter

shell/app/common/components/list-select/index.tsx

@@ -48,6 +48,7 @@ interface IProps<T extends object = any> {
   renderItem?: (item: T) => React.ReactNode;
   list: T[];
   menus: Array<{ title: string }>;
+  rightSlot?: React.ReactNode;
 }
 
 function ListSelect<T extends object = any>(props: IProps<T>) {
@@ -176,6 +177,7 @@ interface ListSelectOverlayProps<T> {
   parentKey: string;
   value?: T[];
   onChange?: (values: T[]) => void;
+  rightSlot?: React.ReactNode;
 }
 
 const defaultRenderItem = (item: { title: string }) => {
@@ -204,6 +206,7 @@ function ListSelectOverlay<T extends object = any>({
   rowKey,
   menuRowKey,
   parentKey,
+  rightSlot,
 }: ListSelectOverlayProps<T>) {
   const defaultSelectMenu = React.useMemo(
     () => ({ [menuRowKey]: 0, title: i18n.t('dop:all {name}', { name: i18n.t('App') }) }),
@@ -215,7 +218,7 @@ function ListSelectOverlay<T extends object = any>({
 
   useUpdateEffect(() => {
     onMenuChange && onMenuChange(selectedMenu);
-  }, [selectedMenu, menus, onMenuChange, menuRowKey]);
+  }, [selectedMenu, menus, menuRowKey]);
 
   return (
     <Row className="erda-list-select-overlay text-white rounded">
@@ -261,7 +264,7 @@ function ListSelectOverlay<T extends object = any>({
         </div>
       </Col>
       <Col span={12} className="px-2 h-full bg-white-08">
-        <div className="py-3 px-2 flex items-center justify-between">
+        <div className="py-3 px-2 flex items-center">
           <Dropdown
             trigger={['click']}
             getPopupContainer={(triggerNode) => triggerNode.parentElement as HTMLElement}
@@ -317,6 +320,7 @@ function ListSelectOverlay<T extends object = any>({
               {selectedMenu.title} <ErdaIcon size={16} type="caret-down" className="ml-1 text-white-3" />
             </div>
           </Dropdown>
+          <div className="pl-4">{rightSlot}</div>
         </div>
         <div className="erda-list-select-right-content flex">
           <div className="flex-1 pl-2 min-w-0">

shell/app/locales/en.json

@@ -940,6 +940,7 @@
     "addon info": "addon info",
     "addon setting": "addon setting",
     "address": "address",
+    "aggregate by branch": "aggregate by branch",
     "all": "all",
     "all issues": "all issues",
     "all iterations": "all iterations",

shell/app/locales/zh.json

@@ -940,6 +940,7 @@
     "addon info": "服务信息",
     "addon setting": "服务设置",
     "address": "地址",
+    "aggregate by branch": "按分支聚合",
     "all": "全部",
     "all issues": "全部事项",
     "all iterations": "所有迭代",

shell/app/modules/project/pages/release/components/form.tsx

@@ -12,7 +12,7 @@
 // along with this program. If not, see <http://www.gnu.org/licenses/>.
 
 import React from 'react';
-import { Button, Upload, Spin, Progress } from 'antd';
+import { Button, Upload, Spin, Progress, Checkbox } from 'antd';
 import moment from 'moment';
 import { RenderForm, ListSelect, MarkdownEditor, ErdaIcon } from 'common';
 import i18n from 'i18n';
@@ -21,6 +21,7 @@ import { goTo, insertWhen } from 'common/utils';
 import { getUploadProps } from 'common/utils/upload-props';
 import releaseStore from 'project/stores/release';
 import routeInfoStore from 'core/stores/route';
+import { CheckboxChangeEvent } from 'antd/lib/checkbox';
 import orgStore from 'app/org-home/stores/org';
 import userStore from 'user/stores';
 import ReactMarkdown from 'react-markdown';
@@ -73,6 +74,7 @@ const ReleaseForm = ({ readyOnly = false }: { readyOnly?: boolean }) => {
   const [pageNo, setPageNo] = React.useState(1);
   const [appId, setAppId] = React.useState<number | undefined>();
   const [query, setQuery] = React.useState<string>('');
+  const [isLatest, setIsLatest] = React.useState(false);
   const [loading] = useLoading(releaseStore, ['getAppList']);
 
   const [releaseList, setReleaseList] = React.useState<RELEASE.ReleaseDetail[]>([] as RELEASE.ReleaseDetail[]);
@@ -113,6 +115,7 @@ const ReleaseForm = ({ readyOnly = false }: { readyOnly?: boolean }) => {
         pageSize: PAGINATION.pageSize,
         isStable: true,
         q: query,
+        latest: isLatest,
       });
       const { data } = res;
       if (data) {
@@ -121,7 +124,7 @@ const ReleaseForm = ({ readyOnly = false }: { readyOnly?: boolean }) => {
         setReleaseTotal(total);
       }
     },
-    [projectId, query],
+    [projectId, query, isLatest],
   );
 
   React.useEffect(() => {
@@ -256,6 +259,11 @@ const ReleaseForm = ({ readyOnly = false }: { readyOnly?: boolean }) => {
                 getReleases(_pageNo, appId);
               },
             },
+            rightSlot: (
+              <Checkbox checked={isLatest} onChange={(e: CheckboxChangeEvent) => setIsLatest(e.target.checked)}>
+                <span className="text-white">{i18n.t('dop:aggregate by branch')}</span>
+              </Checkbox>
+            ),
           },
           readOnlyRender: (value: RELEASE.ReleaseDetail[]) => {
             return (value || []).map((item: RELEASE.ReleaseDetail) => (

shell/app/modules/project/services/release.ts

@@ -22,6 +22,7 @@ interface ReleaseListQuery {
   pageSize: number;
   pageNo: number;
   q?: string;
+  latest?: boolean;
 }
 
 interface AddReleaseParams {