30 lines
991 B
TypeScript
30 lines
991 B
TypeScript
import React from 'react';
|
|
import Card from 'react-bootstrap/Card';
|
|
import { useAutoFocus, useFocusedElement } from '../FocusedElement';
|
|
|
|
export type Props = {
|
|
heading?: string,
|
|
position: string,
|
|
timerange: string,
|
|
company: string,
|
|
description: string
|
|
};
|
|
|
|
export default function JobCard(props: Props) {
|
|
const focusRef = useAutoFocus<HTMLDivElement>('position ' + [props.position, props.company].join(', '))
|
|
return (
|
|
<Card ref={focusRef} className='job-card'>
|
|
{props.heading && (
|
|
<Card.Header>{props.heading}</Card.Header>
|
|
)}
|
|
<Card.Body>
|
|
<Card.Title>{props.position}</Card.Title>
|
|
<Card.Subtitle>
|
|
<span className='company-name'>{props.company}</span>, <span className='timerange'>{props.timerange}</span>
|
|
</Card.Subtitle>
|
|
<Card.Text>{props.description}</Card.Text>
|
|
</Card.Body>
|
|
</Card>
|
|
);
|
|
}
|