All files Lect.jsx

100% Statements 15/15
100% Branches 11/11
100% Functions 4/4
100% Lines 12/12

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36      1x 6x 6x 6x           1x 3x 1x     2x 2x 2x   2x   2x                        
import React from 'react';
import './Lect.css';
 
export const ENDING_PUNCTUATION = ['.', '!', '?'];
export const getSpacer = text => (ENDING_PUNCTUATION.includes(text?.slice(-1)) ? '  ' : ' ');
export const getHasModalInformation = lect => !!lect.explanation || !!lect.translation;
export const getClassName = (shouldHighlight, hasModalInformation) => [
  'Lect',
  shouldHighlight ? 'highlighted' : 'unHighlighted',
  hasModalInformation ? 'clickable' : '',
].join(' ');
 
const Lect = ({ lect, shouldHighlight, showModal }) => {
  if (!lect) {
    return null;
  }
 
  const hasModalInformation = getHasModalInformation(lect);
  const className = getClassName(shouldHighlight, hasModalInformation);
  const spacer = getSpacer(lect.text);
 
  const handleClick = hasModalInformation && /* istanbul ignore next */ (() => showModal(lect));
 
  return (
    <span
      className={ className }
      onClick={ handleClick }
      aria-hidden='true'
    >
      { `${lect.text}${spacer}` }
    </span>
  );
};
 
export default Lect;