"use client";

import React, { useEffect, useState } from "react";
import Breadcrumb_comp from "../common-components/breadcrumb-comp/Breadcrumb_comp";
import "./Terms_Conditions.css";
import { useDispatch, useSelector } from "react-redux";
import parse from "html-react-parser";
import { getTerms_and_Conditions } from "../../features/terms_conditions.js/Slice";
import Light_Gray_Outline_Btn from "../common-components/common_btn/gray_outline_btn/Light_Gray_Outline_Btn";
import Green_Outline_Btn from "../common-components/common_btn/green_outline_btn/Green_Outline_Btn";
import Green_round_btn from "../common-components/common_btn/green_round_btn/Green_round_btn";
import Gray_Btn from "../common-components/common_btn/gray_btn/Gray_Btn";
import { Container } from "react-bootstrap";
import Success_Modal from "../common-components/common_modal/success_modal/Success_Modal";
import { useRouter } from "next/navigation";
const Terms_Conditions = () => {
  const router = useRouter();
  const [showSuccessModal, setShowSuccessModal] = useState(false);
  const termsconditions = useSelector(
    (state) => state.termsconditions.termsconditions,
  );
  const dispatch = useDispatch();
  useEffect(() => {
    dispatch(getTerms_and_Conditions());
  }, []);

  return (
    <>
      <section className="Privacy_Policy Terms_Conditions">
        <div className="bg_img_div">
          <div className="bg_div">
            <Container>
              <h1>Terms and Conditions</h1>
            </Container>
          </div>
        </div>
        <div className="container">
          <div className="main_content_div">
            {termsconditions?.map((terms) => (
              <p className="dark_black_text">{parse(terms.content)}</p>
            ))}
            {/* <div className="btns_holder">
              <Green_round_btn
                btnText={"Accept"}
                onClick={() => {
                  setShowSuccessModal(true);
                }}
              />{" "}
              <Gray_Btn
                btnText={"  Decline"}
                onClick={() => {
                  router.push("/");
                }}
              />{" "}
            </div> */}
          </div>
        </div>
      </section>

      {/* <Stay_Connected /> */}
      {/* <Success_Modal
        show={showSuccessModal}
        onHide={() => {
          setShowSuccessModal(false);
          router.push("/");
        }}
        successText="Terms & Conditions accepted successfully!"
      /> */}
    </>
  );
};

export default Terms_Conditions;
