cv/src/app/components/JobsHistory.tsx

import React from 'react';
import Container from 'react-bootstrap/Container';
import Col from 'react-bootstrap/Col';
import Row from 'react-bootstrap/Row';
import JobCard from './JobCard';
import { usePersonContext } from './PersonContext';
import { partition } from '../utils';

const entriesPerRow = 2

export default function JobsHistory() {
    const person = usePersonContext()

    return (
    <Container>
        <h2>Experience</h2>
        {person.jobs.current && (
        <Row>
          <Col>
            <JobCard heading={'Current position'} {...person.jobs.current} />
          </Col>
        </Row>
        )}
        {partition(person.jobs.previous, entriesPerRow).map((jobs, index) => (
        <Row key={index}>
          {(jobs.map((job, subindex) => (
          <Col key={index + '_' + subindex}>
            <JobCard {...job} />
          </Col>
          )))}
        </Row>
        ))}
    </Container>
    )
}