Revert "feat: add api for transfer (#29288)" (#29541)

This reverts commit 15580483ce.

components/transfer/__tests__/__snapshots__/demo.test.js.snap

@@ -216,7 +216,7 @@ exports[`renders ./components/transfer/demo/advanced.md correctly 1`] = `
     </button>
   </div>
   <div
-    class="ant-transfer-list"
+    class="ant-transfer-list ant-transfer-list-with-footer"
     style="width:250px;height:300px"
   >
     <div
@@ -352,6 +352,19 @@ exports[`renders ./components/transfer/demo/advanced.md correctly 1`] = `
         </div>
       </div>
     </div>
+    <div
+      class="ant-transfer-list-footer"
+    >
+      <button
+        class="ant-btn ant-btn-sm"
+        style="float:right;margin:5px"
+        type="button"
+      >
+        <span>
+          reload
+        </span>
+      </button>
+    </div>
   </div>
 </div>
 `;

components/transfer/__tests__/index.test.js

@@ -558,31 +558,3 @@ describe('immutable data', () => {
     expect(wrapper).toMatchRenderedSnapshot();
   });
 });
-
-describe('footer render source and target', () => {
-  // https://github.com/ant-design/ant-design/issues/28082
-  it('currently render footer', () => {
-    const differentFooter = () => ({
-      source: (
-        <Button size="small" className="sourceFooter">
-          reload
-        </Button>
-      ),
-      target: (
-        <Button size="small" className="targetFooter">
-          reload
-        </Button>
-      ),
-    });
-    const defaultFooter = () => (
-      <Button size="small" className="defaultFooter">
-        reload
-      </Button>
-    );
-    const wrapper = mount(<Transfer footer={differentFooter} />);
-    const wrapper2 = mount(<Transfer footer={defaultFooter} />);
-    expect(wrapper.exists('.sourceFooter')).toEqual(true);
-    expect(wrapper.exists('.targetFooter')).toEqual(true);
-    expect(wrapper2.exists('.defaultFooter')).toEqual(true);
-  });
-});

components/transfer/demo/advanced.md

@@ -50,13 +50,11 @@ class App extends React.Component {
     this.setState({ targetKeys });
   };
 
-  renderFooter = () => ({
-    source: (
-      <Button size="small" style={{ float: 'right', margin: 5 }} onClick={this.getMock}>
-        reload
-      </Button>
-    ),
-  });
+  renderFooter = () => (
+    <Button size="small" style={{ float: 'right', margin: 5 }} onClick={this.getMock}>
+      reload
+    </Button>
+  );
 
   render() {
     return (

components/transfer/index.en-US.md

@@ -24,7 +24,7 @@ One or more elements can be selected from either column, one click on the proper
 | dataSource | Used for setting the source data. The elements that are part of this array will be present the left column. Except the elements whose keys are included in `targetKeys` prop | [RecordType extends TransferItem = TransferItem](https://git.io/vMM64)\[] | \[] |  |
 | disabled | Whether disabled transfer | boolean | false |  |
 | filterOption | A function to determine whether an item should show in search result list | (inputValue, option): boolean | - |  |
-| footer | A function used for rendering the footer | (props) => ReactNode \| { source: ReactNode, target: ReactNode } | - | { source: ReactNode, target: ReactNode }: 4.12.3 |
+| footer | A function used for rendering the footer | (props) => ReactNode | - |  |
 | listStyle | A custom CSS style used for rendering the transfer columns | object \| ({direction: `left` \| `right`}) => object | - |  |
 | locale | The i18n text including filter, empty text, item unit, etc | { itemUnit: string; itemsUnit: string; searchPlaceholder: string; notFoundContent: ReactNode; } | { itemUnit: `item`, itemsUnit: `items`, notFoundContent: `The list is empty`, searchPlaceholder: `Search here` } |  |
 | oneWay | Display as single direction style | boolean | false | 4.3.0 |

components/transfer/index.tsx

@@ -58,6 +58,7 @@ export interface TransferLocale {
   removeAll: string;
   removeCurrent: string;
 }
+
 export interface TransferProps<RecordType> {
   prefixCls?: string;
   className?: string;
@@ -76,14 +77,7 @@ export interface TransferProps<RecordType> {
   showSearch?: boolean;
   filterOption?: (inputValue: string, item: RecordType) => boolean;
   locale?: Partial<TransferLocale>;
-  footer?: (
-    props: TransferListProps<RecordType>,
-  ) =>
-    | React.ReactNode
-    | {
-        source?: React.ReactNode;
-        target?: React.ReactNode;
-      };
+  footer?: (props: TransferListProps<RecordType>) => React.ReactNode;
   rowKey?: (record: RecordType) => string;
   onSearch?: (direction: TransferDirection, value: string) => void;
   onScroll?: (direction: TransferDirection, e: React.SyntheticEvent<HTMLUListElement>) => void;

components/transfer/index.zh-CN.md

@@ -27,7 +27,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/QAXskNI4G/Transfer.svg
 | dataSource | 数据源，其中的数据将会被渲染到左边一栏中，`targetKeys` 中指定的除外 | [RecordType extends TransferItem = TransferItem](https://git.io/vMM64)\[] | \[] |  |
 | disabled | 是否禁用 | boolean | false |  |
 | filterOption | 接收 `inputValue` `option` 两个参数，当 `option` 符合筛选条件时，应返回 true，反之则返回 false | (inputValue, option): boolean | - |  |
-| footer | 底部渲染函数 | (props) => ReactNode \| { source: ReactNode, target: ReactNode } | - | { source: ReactNode, target: ReactNode }: 4.12.3 |
+| footer | 底部渲染函数 | (props) => ReactNode | - |  |
 | listStyle | 两个穿梭框的自定义样式 | object\|({direction: `left` \| `right`}) => object | - |  |
 | locale | 各种语言 | { itemUnit: string; itemsUnit: string; searchPlaceholder: string; notFoundContent: ReactNode; } | { itemUnit: `项`, itemsUnit: `项`, searchPlaceholder: `请输入搜索内容` } |  |
 | oneWay | 展示为单向样式 | boolean | false | 4.3.0 |

components/transfer/list.tsx

@@ -39,10 +39,7 @@ export interface RenderedItem<RecordType> {
 }
 
 type RenderListFunction<T> = (props: TransferListBodyProps<T>) => React.ReactNode;
-type FooterRender = {
-  source?: React.ReactNode;
-  target?: React.ReactNode;
-};
+
 export interface TransferListProps<RecordType> extends TransferLocale {
   prefixCls: string;
   titleText: React.ReactNode;
@@ -62,7 +59,7 @@ export interface TransferListProps<RecordType> extends TransferLocale {
   itemUnit: string;
   itemsUnit: string;
   renderList?: RenderListFunction<RecordType>;
-  footer?: (props: TransferListProps<RecordType>) => React.ReactNode | FooterRender;
+  footer?: (props: TransferListProps<RecordType>) => React.ReactNode;
   onScroll: (e: React.UIEvent<HTMLUListElement>) => void;
   disabled?: boolean;
   direction: TransferDirection;
@@ -315,27 +312,10 @@ export default class TransferList<
       showSelectAll,
       showRemove,
       pagination,
-      direction,
     } = this.props;
 
     // Custom Layout
-    // Distinguish different footer
-    const tempDom = footer && footer(this.props);
-    let footerDom;
-    function isFooterRender(obj: any): obj is FooterRender {
-      return obj.source || obj.target;
-    }
-    if (tempDom) {
-      if (isFooterRender(tempDom)) {
-        if (direction === 'left') {
-          footerDom = tempDom.source;
-        } else {
-          footerDom = tempDom.target;
-        }
-      } else {
-        footerDom = tempDom;
-      }
-    }
+    const footerDom = footer && footer(this.props);
 
     const listCls = classNames(prefixCls, {
       [`${prefixCls}-with-pagination`]: pagination,