import cn from 'classnames'
import { h, type FunctionComponent } from 'preact'
import styles from './object_table.module.scss'

const ObjectTable: FunctionComponent<{ styles?: Record<string, string>; object: Record<string, any> }> = ({
  styles: s = styles,
  object,
}) => (
  <table className={s.base}>
    <tbody>
      {Object.entries(object).map(([key, value]) => (
        <tr key={key} className={s.row}>
          <td className={cn(s.cell, s.key)}>{key}</td>
          <td className={cn(s.cell, s.value)}>{value}</td>
        </tr>
      ))}
    </tbody>
  </table>
)

export default ObjectTable