import styles from "./footer.module.scss";
import cx from "classnames";
import React, { FC } from "react";
import Router from "next/router";
import Link from "next/link";
const FooterOption: FC<any> = (props) => {
  const { title, links } = props;
  const NavigatePage = (page: any) => {
    if (page === "Terms and Conditions") {
      Router.push("/termsAndConditions");
    } else if (page === "Copyright") {
      Router.push("/copyRight");
    } else if (
      page === "Returns, Refunds and Cancellation" ||
      page === "Refund"
    ) {
      Router.push("/refundAndCancellation");
    } else if (page === "Payment Options") {
      Router.push("/paymentOptions");
    } else if (page === "Report Infringement") {
      Router.push("/reportInfringement");
    } else if (page === "Privacy Policy" || page === "Compliance") {
      Router.push("/privacyAndPolicy");
      // window.open("/PrivacyPolicy.pdf ")
    } else if (page === "Contact Us") {
      Router.push("/contactUs");
    } else if (page === "About Us") {
      Router.push("/aboutUs");
    } else if (page === "Become a Seller") {
      Router.push(`/seller/sellerLogin/signup`);
    }
  };
  return (
    <>
      <div>
        <h5 className={styles.fotterTitle}>{title}</h5>
        <ul className={styles.home__footer__links_list}>
          {links.map((name: any, idx: any) => {
            return (
              <React.Fragment key={idx}>
                {name == "Customer Support" ? (
                  <Link
                    key={idx}
                    href="https://meetnow.centedge.io/meetnow/2225b32c-7bdf-460b-b060-b37e19ca031e/1/Indispare"
                    passHref
                  >
                    <a key={idx} target="_blank">
                      <li key={idx} className={styles.home__footer__links_item}>
                        {name}
                      </li>
                    </a>
                  </Link>
                ) : (
                  <li key={idx} className={styles.home__footer__links_item}>
                    <button
                      type="button"
                      onClick={() => {
                        NavigatePage(name);
                      }}
                      className={cx(styles.home__footer__links_button)}
                      style={{
                        background: "none",
                        border: "none",
                        padding: 0,
                        margin: 0,
                        color: "inherit",
                        font: "inherit",
                        cursor: "pointer",
                      }}
                    >
                      {name}
                    </button>
                  </li>
                )}
              </React.Fragment>
            );
          })}
        </ul>
      </div>
    </>
  );
};
export default FooterOption;