import React, { FC, useMemo } from "react";
import { PlaceSelect } from "@components/PlaceOrder/PlaceSelect";
import { OrderTypeEnum } from "@shared/types";

export interface PriceTypeProps {
  /** 价格类型，默认最新 */
  value?: OrderTypeEnum;
  onTriggerTypeChange?: (triggerType: OrderTypeEnum) => void;
}

export const LimitMarketSelect: FC<PriceTypeProps> = props => {
  const list = useMemo(() => {
    return [
      { value: OrderTypeEnum.TriggerLimit, label: "限价" },
      { value: OrderTypeEnum.TriggerMarket, label: "市价" }
    ];
  }, []);
  return (
    <div className="nts-price-source-root cursor-pointer  text-gray-16 text-[14px]">
      <PlaceSelect
        list={list}
        value={props.value}
        optionWidth={80}
        onChange={(val: OrderTypeEnum) => props.onTriggerTypeChange?.(val)}
        classes={{
          customizeSelect: "pr-[12px]"
        }}
      />
    </div>
  );
};
