import type { TabsProps } from 'antd';
import { Tabs } from 'antd';
import React from 'react';
import { OrderStatusLabels } from '@/constants/trade';
import styles from './index.module.less';
import OrderListItem from './list';

// const onChange = (key: string) => {
//   console.log(key);
// };

const OrderList: React.FC = () => {
  const items: TabsProps['items'] = Object.entries(OrderStatusLabels).map(
    ([value, list]) => ({
      key: value,
      label: list.label,
      children: <OrderListItem orderStatus={Number(value)} />,
    }),
  );

  return (
    <div className={`${styles['trade-order']} "page-container" `}>
      <Tabs defaultActiveKey="1" items={items} destroyOnHidden />
    </div>
  );
};

export default OrderList;