/* eslint-disable react/forbid-prop-types */
import React from 'react';
import PropTypes from 'prop-types';
import { getBonus } from 'gatsby-core-theme/src/helpers/getters';
import styles from './bonusTable.module.scss';

const Bonus = ({ item, tracker = 'main' }) => {
  const oneLiner = getBonus(tracker, item);

  if (!oneLiner) {
    return <></>;
  }

  const onelinerSplitted = oneLiner.one_liner;

  return <div className={styles?.bonus || ''}>{onelinerSplitted}</div>;
};

Bonus.propTypes = {
  tracker: PropTypes.string,
  item: PropTypes.shape({
    bonus: PropTypes.object,
  }),
};

export default Bonus;
