renderQuery()

in src/query-assist/query-assist.tsx [879:918]

• 33 lines of code
• 11 McCabe index (conditional complexity)

  renderQuery() {
    const {dirty, styleRanges, query} = this.state;
    const classes: string[] = [];
    const LETTER_CLASS = 'letter';
    const LETTER_DEFAULT_CLASS = styles.letterDefault;

    if (styleRanges && styleRanges.length) {
      styleRanges.forEach((item, index) => {
        if (dirty && index === styleRanges.length - 1 && item.style === 'text') {
          return;
        }
        const styleName = `${LETTER_CLASS}-${item.style.replace('_', '-')}`;

        for (let i = item.start; i < item.start + item.length; i++) {
          classes[i] = styles[styleName];
        }
      });
    }

    return (
      query &&
      Array.from(query).map((letter, index, letters) => {
        const className = classNames(styles.letter, classes[index] || LETTER_DEFAULT_CLASS);

        const dataTest = letters.length - 1 === index ? 'ring-query-assist-last-letter' : null;

        // \u00a0 === &nbsp;
        return (
          <span
            // eslint-disable-next-line react/no-array-index-key
            key={index + letter}
            className={className}
            data-test={dataTest}
          >
            {letter === ' ' ? '\u00a0' : letter}
          </span>
        );
      })
    );
  }