tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

DebugTargetItem.js (2348B)

      1 /* This Source Code Form is subject to the terms of the Mozilla Public
      2 * License, v. 2.0. If a copy of the MPL was not distributed with this
      3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
      4 
      5 "use strict";
      6 
      7 const {
      8  PureComponent,
      9 } = require("resource://devtools/client/shared/vendor/react.mjs");
     10 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
     11 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs");
     12 
     13 const Types = require("resource://devtools/client/aboutdebugging/src/types/index.js");
     14 
     15 /**
     16 * This component displays debug target.
     17 */
     18 class DebugTargetItem extends PureComponent {
     19  static get propTypes() {
     20    return {
     21      actionComponent: PropTypes.any.isRequired,
     22      additionalActionsComponent: PropTypes.any,
     23      detailComponent: PropTypes.any.isRequired,
     24      dispatch: PropTypes.func.isRequired,
     25      target: Types.debugTarget.isRequired,
     26    };
     27  }
     28 
     29  renderAction() {
     30    const { actionComponent, dispatch, target } = this.props;
     31    return dom.div(
     32      {
     33        className: "debug-target-item__action",
     34      },
     35      actionComponent({ dispatch, target })
     36    );
     37  }
     38 
     39  renderAdditionalActions() {
     40    const { additionalActionsComponent, dispatch, target } = this.props;
     41 
     42    if (!additionalActionsComponent) {
     43      return null;
     44    }
     45 
     46    return dom.section(
     47      {
     48        className: "debug-target-item__additional_actions",
     49      },
     50      additionalActionsComponent({ dispatch, target })
     51    );
     52  }
     53 
     54  renderDetail() {
     55    const { detailComponent, target } = this.props;
     56    return detailComponent({ target });
     57  }
     58 
     59  renderIcon() {
     60    return dom.img({
     61      className: "debug-target-item__icon qa-debug-target-item-icon",
     62      src: this.props.target.icon,
     63    });
     64  }
     65 
     66  renderName() {
     67    return dom.span(
     68      {
     69        className: "debug-target-item__name ellipsis-text",
     70        title: this.props.target.name,
     71      },
     72      this.props.target.name
     73    );
     74  }
     75 
     76  render() {
     77    return dom.li(
     78      {
     79        className: "card debug-target-item qa-debug-target-item",
     80        "data-qa-target-type": this.props.target.type,
     81      },
     82      this.renderIcon(),
     83      this.renderName(),
     84      this.renderAction(),
     85      this.renderDetail(),
     86      this.renderAdditionalActions()
     87    );
     88  }
     89 }
     90 
     91 module.exports = DebugTargetItem;