import HeaderLink from '../Ui/HeaderLink'
import { InfoProps } from '../../type/InfoProps';
import Spinner from '../Utils/Loading/Spinner';
import { PrivacyData, TermsData } from '../../data/Info';

const Info = ({headerText,title,isLoading,text,isHaveText=false,isPrivacy = false}:InfoProps) => {
  const {t} = useTranslation();
  
  return (
    <div className='info'>



        {isLoading? <Spinner/> :
        <div className="info_content">
          <HeaderLink text={headerText}/>
          <h1>{t(title)}</h1>
          {isHaveText?
            <p>{text}</p>
            :""
          }
          {
            isPrivacy
              ? PrivacyData.map((item) => (
                  <div className='single_info'>
                    <h2>{item.key}</h2>
                    <p>{item.value}</p>
                  </div>
                ))
              : TermsData.map((item) => (
                  <div className='single_info'>
                    <h2>{item.key}</h2>
                    <p>{item.value}</p>
                  </div>
                ))
          }
        </div>
        }
    </div>
  )
}

export default Info