tor-browser

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

SideBar.js (3141B)


      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 "use strict";
      5 
      6 const {
      7  Component,
      8  createFactory,
      9 } = require("resource://devtools/client/shared/vendor/react.mjs");
     10 const {
     11  connect,
     12 } = require("resource://devtools/client/shared/vendor/react-redux.js");
     13 
     14 const GridElementWidthResizer = createFactory(
     15  require("resource://devtools/client/shared/components/splitter/GridElementWidthResizer.js")
     16 );
     17 loader.lazyRequireGetter(
     18  this,
     19  "dom",
     20  "resource://devtools/client/shared/vendor/react-dom-factories.js"
     21 );
     22 loader.lazyRequireGetter(
     23  this,
     24  "getObjectInspector",
     25  "resource://devtools/client/webconsole/utils/object-inspector.js",
     26  true
     27 );
     28 loader.lazyRequireGetter(
     29  this,
     30  "actions",
     31  "resource://devtools/client/webconsole/actions/index.js"
     32 );
     33 loader.lazyRequireGetter(
     34  this,
     35  "PropTypes",
     36  "resource://devtools/client/shared/vendor/react-prop-types.js"
     37 );
     38 const reps = ChromeUtils.importESModule(
     39  "resource://devtools/client/shared/components/reps/index.mjs",
     40  { global: "current" }
     41 );
     42 loader.lazyRequireGetter(
     43  this,
     44  "l10n",
     45  "resource://devtools/client/webconsole/utils/messages.js",
     46  true
     47 );
     48 
     49 class SideBar extends Component {
     50  static get propTypes() {
     51    return {
     52      serviceContainer: PropTypes.object,
     53      dispatch: PropTypes.func.isRequired,
     54      front: PropTypes.object,
     55      onResized: PropTypes.func,
     56    };
     57  }
     58 
     59  constructor(props) {
     60    super(props);
     61    this.onClickSidebarClose = this.onClickSidebarClose.bind(this);
     62  }
     63 
     64  shouldComponentUpdate(nextProps) {
     65    const { front } = nextProps;
     66    return front !== this.props.front;
     67  }
     68 
     69  onClickSidebarClose() {
     70    this.props.dispatch(actions.sidebarClose());
     71  }
     72 
     73  render() {
     74    const { front, serviceContainer } = this.props;
     75 
     76    const objectInspector = getObjectInspector(front, serviceContainer, {
     77      autoExpandDepth: 1,
     78      mode: reps.MODE.SHORT,
     79      autoFocusRoot: true,
     80      pathPrefix: "WebConsoleSidebar",
     81      customFormat: false,
     82    });
     83 
     84    return [
     85      dom.aside(
     86        {
     87          className: "sidebar",
     88          key: "sidebar",
     89          ref: node => {
     90            this.node = node;
     91          },
     92        },
     93        dom.header(
     94          {
     95            className: "devtools-toolbar webconsole-sidebar-toolbar",
     96          },
     97          dom.button({
     98            className: "devtools-button sidebar-close-button",
     99            title: l10n.getStr("webconsole.closeSidebarButton.tooltip"),
    100            onClick: this.onClickSidebarClose,
    101          })
    102        ),
    103        dom.aside(
    104          {
    105            className: "sidebar-contents",
    106          },
    107          objectInspector
    108        )
    109      ),
    110      GridElementWidthResizer({
    111        key: "resizer",
    112        enabled: true,
    113        position: "start",
    114        className: "sidebar-resizer",
    115        getControlledElementNode: () => this.node,
    116      }),
    117    ];
    118  }
    119 }
    120 
    121 function mapStateToProps(state) {
    122  return {
    123    front: state.ui.frontInSidebar,
    124  };
    125 }
    126 
    127 module.exports = connect(mapStateToProps)(SideBar);