/**

 * Copyright (c) Meta Platforms, Inc. and affiliates.

 *

 * This source code is licensed under the MIT license found in the

 * LICENSE file in the root directory of this source tree.

 *

 * @flow

 */

import * as React from 'react';

import styles from './HocBadges.css';

import type {Element} from 'react-devtools-shared/src/frontend/types';

type Props = {

  element: Element,

};

export default function HocBadges({element}: Props): React.Node {

  const {hocDisplayNames} = ((element: any): Element);

  if (hocDisplayNames === null) {

    return null;

  }

  return (

    <div className={styles.HocBadges}>

      {hocDisplayNames !== null &&

        hocDisplayNames.map(hocDisplayName => (

          <div key={hocDisplayName} className={styles.Badge}>

            {hocDisplayName}

          </div>

        ))}

    </div>

  );

}