From 6bf0a5cb5034a7e684dcc3500e841785237ce2dd Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Sun, 7 Apr 2024 19:32:43 +0200 Subject: Adding upstream version 1:115.7.0. Signed-off-by: Daniel Baumann --- .../src/components/debugtarget/WorkerDetail.js | 120 +++++++++++++++++++++ 1 file changed, 120 insertions(+) create mode 100644 devtools/client/aboutdebugging/src/components/debugtarget/WorkerDetail.js (limited to 'devtools/client/aboutdebugging/src/components/debugtarget/WorkerDetail.js') diff --git a/devtools/client/aboutdebugging/src/components/debugtarget/WorkerDetail.js b/devtools/client/aboutdebugging/src/components/debugtarget/WorkerDetail.js new file mode 100644 index 0000000000..b69252c430 --- /dev/null +++ b/devtools/client/aboutdebugging/src/components/debugtarget/WorkerDetail.js @@ -0,0 +1,120 @@ +/* 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"; + +const { + createFactory, + PureComponent, +} = require("resource://devtools/client/shared/vendor/react.js"); +const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js"); +const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.js"); + +const FluentReact = require("resource://devtools/client/shared/vendor/fluent-react.js"); +const Localized = createFactory(FluentReact.Localized); + +const { + SERVICE_WORKER_FETCH_STATES, +} = require("resource://devtools/client/aboutdebugging/src/constants.js"); + +const FieldPair = createFactory( + require("resource://devtools/client/aboutdebugging/src/components/debugtarget/FieldPair.js") +); + +const Types = require("resource://devtools/client/aboutdebugging/src/types/index.js"); + +/** + * This component displays detail information for worker. + */ +class WorkerDetail extends PureComponent { + static get propTypes() { + return { + // Provided by wrapping the component with FluentReact.withLocalization. + getString: PropTypes.func.isRequired, + target: Types.debugTarget.isRequired, + }; + } + + renderFetch() { + const { fetch } = this.props.target.details; + const isListening = fetch === SERVICE_WORKER_FETCH_STATES.LISTENING; + const localizationId = isListening + ? "about-debugging-worker-fetch-listening" + : "about-debugging-worker-fetch-not-listening"; + + return Localized( + { + id: localizationId, + attrs: { + label: true, + value: true, + }, + }, + FieldPair({ + className: isListening + ? "qa-worker-fetch-listening" + : "qa-worker-fetch-not-listening", + label: "Fetch", + slug: "fetch", + value: "about-debugging-worker-fetch-value", + }) + ); + } + + renderPushService() { + const { pushServiceEndpoint } = this.props.target.details; + + return Localized( + { + id: "about-debugging-worker-push-service", + attrs: { label: true }, + }, + FieldPair({ + slug: "push-service", + label: "Push Service", + value: dom.span( + { + className: "qa-worker-push-service-value", + }, + pushServiceEndpoint + ), + }) + ); + } + + renderScope() { + const { scope } = this.props.target.details; + + return Localized( + { + id: "about-debugging-worker-scope", + attrs: { label: true }, + }, + FieldPair({ + slug: "scope", + label: "Scope", + value: scope, + }) + ); + } + + render() { + const { fetch, pushServiceEndpoint, scope } = this.props.target.details; + + const isEmptyList = !pushServiceEndpoint && !fetch && !scope && !status; + + return dom.dl( + { + className: + "debug-target-item__detail" + + (isEmptyList ? " debug-target-item__detail--empty" : ""), + }, + pushServiceEndpoint ? this.renderPushService() : null, + fetch ? this.renderFetch() : null, + scope ? this.renderScope() : null + ); + } +} + +module.exports = FluentReact.withLocalization(WorkerDetail); -- cgit v1.2.3