import React, { memo } from "react";

import classNames from "classnames";

import IcWhiteCall from "../../../assets/icon/ic-wh-call.svg";
import IcCallToOrder from "../../../assets/icon/tag/tag-calltoorder.svg";
import css from "./VideoOverlayWithPhoneNumber.module.less";

const CALL_TO_ORDER_STRING = "Call To Order";
const PHONE_STRING = "Phone";

/**
 *  default, position: absolute;
 *  top, right, bottom, left 중 필요한 위치 설정
 *  @param {string} className
 *  @param {boolean} show
 */

export default memo(function VideoOverlayWithPhoneNumber({ className, show }) {
  return (
    <>
      {show && (
        <div className={classNames(className && className, css.container)}>
          <img src={IcCallToOrder} alt={CALL_TO_ORDER_STRING} />
          <div>
            <img src={IcWhiteCall} alt={PHONE_STRING} />
            {/* @@pyh Todo, 임시적 번호 기재, 추후 Lg 전용번호로 변경 */}
            <span>{"080-284-3001"}</span>
          </div>
        </div>
      )}
    </>
  );
});
