// LinktreePage.js
import React, { useState, useEffect } from 'react';
import styles from './Join.module.css'; // Import the module.css file

const LinktreePage = ({ handleYes }) => {
  const [captMessage, setCaptMessage] = useState('');
  const [descMessage, setDescMessage] = useState('');
  const [closeText, setCloseText] = useState('');

  useEffect(() => {
      const newQueryParams = new URLSearchParams(window.location.search);
      const r = newQueryParams.get('captMessage');
      const s = newQueryParams.get('descMessage');
      const v = newQueryParams.get('closeText') || 'Tutup';
      if (r) {
        setCaptMessage(r)
        setDescMessage(s)
        setCloseText(v)
      }
  }, []);

  return (
    <div className={styles.linktreePage}>
        <div className={styles.dashboardContainer} >
          <div className={styles.mainHeading}>{captMessage}</div>
          {descMessage && <div className={styles.descHeading}>{descMessage}</div>}
          {handleYes && <div onClick={handleYes} className={styles.button}>{closeText}</div>}
        </div>
    </div>
  );
};

export default LinktreePage;
