How to use the third-party-web.entities function in third-party-web

import * as color from 'color'
import _ from 'lodash'
import * as thirdPartyWeb from 'third-party-web'
import * as d3plus from 'd3plus/build/d3plus.js'

const categories = _.uniq(thirdPartyWeb.entities.map(e => e.categories[0])).map((category, idx) => {
  return {
    id: category,
    displayName: _.startCase(category),
    color: color(`hsl(175, 75%, ${15 + idx * 5}%)`)
      .rgb()
      .string(),
  }
})

const data = thirdPartyWeb.entities
  .filter(entity => entity.totalOccurrences)
  .sort((a, b) => b.totalExecutionTime - a.totalExecutionTime)
  .slice(0, 100)
  .sort((a, b) => a.name.localeCompare(b.name))
  .map(entity => {
    const category = categories.find(c => c.id === entity.categories[0])

    return {
      ...entity,
      id: entity.name,
      category: category.displayName,
      color: category.color,
    }
  })

const tooltipConfig = {

import React, {useEffect, useState, useRef} from 'react'
import PropTypes from 'prop-types'
import * as color from 'color'
import _ from 'lodash'
import * as thirdPartyWeb from 'third-party-web'
import * as d3plus from 'd3plus/build/d3plus.js'

const categories = _.uniq(thirdPartyWeb.entities.map(e => e.categories[0])).map((category, idx) => {
  return {
    id: category,
    displayName: _.startCase(category),
    color: color(`hsl(175, 75%, ${15 + idx * 5}%)`)
      .rgb()
      .string(),
  }
})

const data = thirdPartyWeb.entities
  .filter(entity => entity.totalOccurrences)
  .sort((a, b) => b.totalExecutionTime - a.totalExecutionTime)
  .slice(0, 100)
  .sort((a, b) => a.name.localeCompare(b.name))
  .map(entity => {
    const category = categories.find(c => c.id === entity.categories[0])