tor-browser

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

MainFrame.js (1958B)


      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 /* globals DomProvider */
      5 
      6 "use strict";
      7 
      8 // React & Redux
      9 const {
     10  Component,
     11  createFactory,
     12 } = require("resource://devtools/client/shared/vendor/react.mjs");
     13 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
     14 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs");
     15 
     16 const {
     17  connect,
     18 } = require("resource://devtools/client/shared/vendor/react-redux.js");
     19 // DOM Panel
     20 const DomTree = createFactory(
     21  require("resource://devtools/client/dom/content/components/DomTree.js")
     22 );
     23 
     24 const MainToolbar = createFactory(
     25  require("resource://devtools/client/dom/content/components/MainToolbar.js")
     26 );
     27 // Shortcuts
     28 const { div } = dom;
     29 
     30 /**
     31 * Renders basic layout of the DOM panel. The DOM panel content consists
     32 * from two main parts: toolbar and tree.
     33 */
     34 class MainFrame extends Component {
     35  static get propTypes() {
     36    return {
     37      dispatch: PropTypes.func.isRequired,
     38      filter: PropTypes.string,
     39      object: PropTypes.any,
     40    };
     41  }
     42 
     43  /**
     44   * Render DOM panel content
     45   */
     46  render() {
     47    const { filter, object } = this.props;
     48 
     49    return div(
     50      { className: "mainFrame" },
     51      MainToolbar({
     52        dispatch: this.props.dispatch,
     53        object: this.props.object,
     54      }),
     55      div(
     56        { className: "treeTableBox devtools-monospace" },
     57        DomTree({
     58          filter,
     59          object,
     60          openLink: url => DomProvider.openLink(url),
     61        })
     62      )
     63    );
     64  }
     65 }
     66 
     67 // Transform state into props
     68 // Note: use https://github.com/faassen/reselect for better performance.
     69 const mapStateToProps = state => {
     70  return {
     71    filter: state.filter,
     72  };
     73 };
     74 
     75 // Exports from this module
     76 module.exports = connect(mapStateToProps)(MainFrame);