tor-browser

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

ManifestLoader.js (2858B)

      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  createFactory,
      9  PureComponent,
     10 } = require("resource://devtools/client/shared/vendor/react.mjs");
     11 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs");
     12 
     13 const {
     14  aside,
     15  h1,
     16  p,
     17 } = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
     18 
     19 const FluentReact = require("resource://devtools/client/shared/vendor/fluent-react.js");
     20 const Localized = createFactory(FluentReact.Localized);
     21 
     22 const {
     23  connect,
     24 } = require("resource://devtools/client/shared/vendor/react-redux.js");
     25 
     26 const {
     27  fetchManifest,
     28 } = require("resource://devtools/client/application/src/actions/manifest.js");
     29 
     30 class ManifestLoader extends PureComponent {
     31  static get propTypes() {
     32    return {
     33      // these props get automatically injected via `connect`
     34      dispatch: PropTypes.func.isRequired,
     35      error: PropTypes.string,
     36      hasFetchedManifest: PropTypes.bool.isRequired,
     37      isLoading: PropTypes.bool.isRequired,
     38    };
     39  }
     40 
     41  componentDidMount() {
     42    this.loadManifestIfNeeded();
     43  }
     44 
     45  componentDidUpdate() {
     46    this.loadManifestIfNeeded();
     47  }
     48 
     49  loadManifestIfNeeded() {
     50    const { isLoading, hasFetchedManifest } = this.props;
     51    const shallLoad = !isLoading && !hasFetchedManifest;
     52    if (shallLoad) {
     53      this.props.dispatch(fetchManifest());
     54    }
     55  }
     56 
     57  renderResult() {
     58    return Localized(
     59      { id: "manifest-loaded-ok" },
     60      p({ className: "js-manifest-loaded-ok" })
     61    );
     62  }
     63 
     64  renderError() {
     65    const { error } = this.props;
     66 
     67    return [
     68      Localized(
     69        {
     70          id: "manifest-loaded-error",
     71          key: "manifest-error-label",
     72        },
     73        h1({ className: "js-manifest-loaded-error app-page__title" })
     74      ),
     75      p({ className: "technical-text", key: "manifest-error-message" }, error),
     76    ];
     77  }
     78 
     79  render() {
     80    const { error, isLoading } = this.props;
     81 
     82    const loadingDOM = isLoading
     83      ? Localized(
     84          { id: "manifest-loading" },
     85          p({ className: "manifest-loader__load js-manifest-loading" })
     86        )
     87      : null;
     88 
     89    const errorDOM = error ? this.renderError() : null;
     90    const resultDOM = !isLoading && !error ? this.renderResult() : null;
     91 
     92    return aside(
     93      { className: "manifest-loader" },
     94      loadingDOM,
     95      errorDOM,
     96      resultDOM
     97    );
     98  }
     99 }
    100 
    101 const mapDispatchToProps = dispatch => ({ dispatch });
    102 const mapStateToProps = state => ({
    103  error: state.manifest.errorMessage,
    104  hasFetchedManifest: typeof state.manifest.manifest !== "undefined",
    105  isLoading: state.manifest.isLoading,
    106 });
    107 
    108 module.exports = connect(mapStateToProps, mapDispatchToProps)(ManifestLoader);