import { Tabs } from "antd";
import { FC, useState } from "react";
import TabOfferOptions from "./TabOfferOptions";
const { TabPane } = Tabs;
import cx from "classnames";
import styles from "./offersTabs.module.scss";
const OfferTabs:FC<any>= ({offerData}) => {
  const [activeTab, setActiveTab] = useState("1");

  const changeTab = (activeKey: any) => {
    console.log(activeKey);
    setActiveTab(activeKey);
  };
  return (
    <>
      <div className={cx("container my-10", styles.home__offer__tabs_head)}>
        <h2 className={cx("mb-0 sectionSubTitle")}>Offers</h2>
        <Tabs activeKey={activeTab} onChange={changeTab} centered>
          <TabPane tab="Top New" key="1">
            <TabOfferOptions offerData={offerData}/>
          </TabPane>
          <TabPane tab="Featured" key="2">
            <TabOfferOptions  offerData={offerData}/>
          </TabPane>
          <TabPane tab="Special" key="3">
            <TabOfferOptions  offerData={offerData}/>
          </TabPane>
        </Tabs>
      </div>
    </>
  );
};
export default OfferTabs;