import { useWalletAddresses } from '@features/wallet'
import { FormField } from '@shared/ui'
import { ProfileSection } from './ProfileSection'
import styles from './fieldsGrid.module.css'

export function SecuritySection() {
  const { data: walletAddresses } = useWalletAddresses()

  return (
    <ProfileSection title="Безопасность">
      <div className={styles.grid1}>
        {walletAddresses?.map(({ chain, address }) => (
          <FormField
            key={chain}
            label={`Адрес ${chain}`}
            readOnly
            icon="lock"
            value={address}
            placeholder="—"
          />
        ))}
      </div>
    </ProfileSection>
  )
}
