_renderPage()

in website/src/components/table-of-contents.js [35:97]

• 56 lines of code
• 7 McCabe index (conditional complexity)

  _renderPage(parentRoute, page, i) {
    const {children, name, expanded} = page;
    const path = `${parentRoute}/${page.path}`;
    const indent = INDENT_BASE + page.depth * INDENT_INC;

    if (children && page.depth === 0) {
      const maxHeight = getContentHeight(page) - ITEM_HEIGHT;

      return (
        <div key={`page-${i}`}>
          <NavLink
            className={`list-header ${expanded ? 'expanded' : ''}`}
            activeClassName="active"
            key={`group-header${i}`}
            to={path}
          >
            {name}
          </NavLink>
          <div className="subpages" style={{maxHeight}}>
            <ul key={`group-list${i}`}>{children.map(this._renderPage.bind(this, path))}</ul>
          </div>
        </div>
      );
    }

    if (children) {
      return (
        <div key={`page-${i}`}>
          <h4 style={{paddingLeft: indent}}>{name}</h4>
          <ul key={`group-list${i}`}>{children.map(this._renderPage.bind(this, path))}</ul>
        </div>
      );
    }

    const tag = page.tag && <span className="badge">{page.tag}</span>;

    if (page.external) {
      // is external link
      return (
        <li key={`page-${i}`}>
          <a
            className="link"
            style={{paddingLeft: indent}}
            href={page.external}
            target="_blank"
            rel="noopener noreferrer"
          >
            {page.name}
          </a>
          {tag}
        </li>
      );
    }

    return (
      <li key={`page-${i}`}>
        <NavLink className="link" style={{paddingLeft: indent}} to={path} activeClassName="active">
          {page.name}
        </NavLink>
        {tag}
      </li>
    );
  }