import styles from './external.module.css';

import Grid from './grid.jsx';

/**
 * External inventory.
 */
export default function External({
  isInventoryOpen,
  onActivate,
  slots,
}) {
  return (
    <div
      className={styles.external}
      style={isInventoryOpen ? {transition: 'opacity 50ms'} : {opacity: 0, top: '450px'}}
    >
      <Grid
        color="rgba(57, 02, 02, 0.6)"
        columns={10}
        label="Chest"
        onActivate={onActivate}
        slots={slots}
      />
    </div>
  );
}