summaryrefslogtreecommitdiffstats
path: root/devtools/client/jsonview/components/MainTabbedArea.js
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /devtools/client/jsonview/components/MainTabbedArea.js
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'devtools/client/jsonview/components/MainTabbedArea.js')
-rw-r--r--devtools/client/jsonview/components/MainTabbedArea.js124
1 files changed, 124 insertions, 0 deletions
diff --git a/devtools/client/jsonview/components/MainTabbedArea.js b/devtools/client/jsonview/components/MainTabbedArea.js
new file mode 100644
index 0000000000..5341e590ce
--- /dev/null
+++ b/devtools/client/jsonview/components/MainTabbedArea.js
@@ -0,0 +1,124 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+define(function (require, exports, module) {
+ const { Component } = require("devtools/client/shared/vendor/react");
+ const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
+ const { createFactories } = require("devtools/client/shared/react-utils");
+ const { JsonPanel } = createFactories(
+ require("devtools/client/jsonview/components/JsonPanel")
+ );
+ const { TextPanel } = createFactories(
+ require("devtools/client/jsonview/components/TextPanel")
+ );
+ const { HeadersPanel } = createFactories(
+ require("devtools/client/jsonview/components/HeadersPanel")
+ );
+ const { Tabs, TabPanel } = createFactories(
+ require("devtools/client/shared/components/tabs/Tabs")
+ );
+
+ /**
+ * This object represents the root application template
+ * responsible for rendering the basic tab layout.
+ */
+ class MainTabbedArea extends Component {
+ static get propTypes() {
+ return {
+ jsonText: PropTypes.instanceOf(Text),
+ activeTab: PropTypes.number,
+ actions: PropTypes.object,
+ headers: PropTypes.object,
+ searchFilter: PropTypes.string,
+ json: PropTypes.oneOfType([
+ PropTypes.string,
+ PropTypes.object,
+ PropTypes.array,
+ PropTypes.bool,
+ PropTypes.number,
+ ]),
+ expandedNodes: PropTypes.instanceOf(Set),
+ };
+ }
+
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ json: props.json,
+ expandedNodes: props.expandedNodes,
+ jsonText: props.jsonText,
+ activeTab: props.activeTab,
+ };
+
+ this.onTabChanged = this.onTabChanged.bind(this);
+ }
+
+ onTabChanged(index) {
+ this.setState({ activeTab: index });
+
+ // Send notification event to the window. This is useful for tests.
+ window.dispatchEvent(
+ new CustomEvent("TabChanged", { detail: { index } })
+ );
+ }
+
+ render() {
+ return Tabs(
+ {
+ activeTab: this.state.activeTab,
+ onAfterChange: this.onTabChanged,
+ tall: true,
+ },
+ TabPanel(
+ {
+ id: "json",
+ className: "json",
+ title: JSONView.Locale["jsonViewer.tab.JSON"],
+ },
+ JsonPanel({
+ data: this.state.json,
+ expandedNodes: this.state.expandedNodes,
+ actions: this.props.actions,
+ searchFilter: this.state.searchFilter,
+ dataSize: this.state.jsonText.length,
+ })
+ ),
+ TabPanel(
+ {
+ id: "rawdata",
+ className: "rawdata",
+ title: JSONView.Locale["jsonViewer.tab.RawData"],
+ },
+ TextPanel({
+ isValidJson:
+ !(this.state.json instanceof Error) &&
+ document.readyState != "loading",
+ data: this.state.jsonText,
+ errorMessage:
+ this.state.json instanceof Error ? this.state.json + "" : null,
+ actions: this.props.actions,
+ })
+ ),
+ TabPanel(
+ {
+ id: "headers",
+ className: "headers",
+ title: JSONView.Locale["jsonViewer.tab.Headers"],
+ },
+ HeadersPanel({
+ data: this.props.headers,
+ actions: this.props.actions,
+ searchFilter: this.props.searchFilter,
+ })
+ )
+ );
+ }
+ }
+
+ // Exports from this module
+ exports.MainTabbedArea = MainTabbedArea;
+});