import Button from '@mui/material/Button';
import { useState } from 'react';
import { withTranslation } from 'react-i18next';
import RegistrationPopup from 'src/app/main/shared-components/popups/RegistrationPopup';

function PropertyPreview({ t }) {
  const [isPopupOpen, setIsPopupOpen] = useState(false);

  const openPopup = () => setIsPopupOpen(true);
  const closePopup = () => setIsPopupOpen(false);

  return (
    <>
      <div className="flex flex-col items-center">
        <Button
          variant="contained"
          color="secondary"
          className="w-384 p-20 text-2xl leading-none rounded-lg"
          aria-label={t('see_more_btn')}
          type="button"
          size="large"
          onClick={openPopup}
        >
          {t('see_more_btn')}
        </Button>
      </div>
      <RegistrationPopup open={isPopupOpen} onClose={closePopup} />
    </>
  );
}

export default withTranslation('rentAndBuyPage')(PropertyPreview);
