diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 17:32:43 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 17:32:43 +0000 |
commit | 6bf0a5cb5034a7e684dcc3500e841785237ce2dd (patch) | |
tree | a68f146d7fa01f0134297619fbe7e33db084e0aa /browser/components/newtab/content-src/components/ErrorBoundary | |
parent | Initial commit. (diff) | |
download | thunderbird-upstream.tar.xz thunderbird-upstream.zip |
Adding upstream version 1:115.7.0.upstream/1%115.7.0upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'browser/components/newtab/content-src/components/ErrorBoundary')
-rw-r--r-- | browser/components/newtab/content-src/components/ErrorBoundary/ErrorBoundary.jsx | 68 | ||||
-rw-r--r-- | browser/components/newtab/content-src/components/ErrorBoundary/_ErrorBoundary.scss | 21 |
2 files changed, 89 insertions, 0 deletions
diff --git a/browser/components/newtab/content-src/components/ErrorBoundary/ErrorBoundary.jsx b/browser/components/newtab/content-src/components/ErrorBoundary/ErrorBoundary.jsx new file mode 100644 index 0000000000..1834a0a521 --- /dev/null +++ b/browser/components/newtab/content-src/components/ErrorBoundary/ErrorBoundary.jsx @@ -0,0 +1,68 @@ +/* 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/. */ + +import { A11yLinkButton } from "content-src/components/A11yLinkButton/A11yLinkButton"; +import React from "react"; + +export class ErrorBoundaryFallback extends React.PureComponent { + constructor(props) { + super(props); + this.windowObj = this.props.windowObj || window; + this.onClick = this.onClick.bind(this); + } + + /** + * Since we only get here if part of the page has crashed, do a + * forced reload to give us the best chance at recovering. + */ + onClick() { + this.windowObj.location.reload(true); + } + + render() { + const defaultClass = "as-error-fallback"; + let className; + if ("className" in this.props) { + className = `${this.props.className} ${defaultClass}`; + } else { + className = defaultClass; + } + + // "A11yLinkButton" to force normal link styling stuff (eg cursor on hover) + return ( + <div className={className}> + <div data-l10n-id="newtab-error-fallback-info" /> + <span> + <A11yLinkButton + className="reload-button" + onClick={this.onClick} + data-l10n-id="newtab-error-fallback-refresh-link" + /> + </span> + </div> + ); + } +} +ErrorBoundaryFallback.defaultProps = { className: "as-error-fallback" }; + +export class ErrorBoundary extends React.PureComponent { + constructor(props) { + super(props); + this.state = { hasError: false }; + } + + componentDidCatch(error, info) { + this.setState({ hasError: true }); + } + + render() { + if (!this.state.hasError) { + return this.props.children; + } + + return <this.props.FallbackComponent className={this.props.className} />; + } +} + +ErrorBoundary.defaultProps = { FallbackComponent: ErrorBoundaryFallback }; diff --git a/browser/components/newtab/content-src/components/ErrorBoundary/_ErrorBoundary.scss b/browser/components/newtab/content-src/components/ErrorBoundary/_ErrorBoundary.scss new file mode 100644 index 0000000000..cc54f78a27 --- /dev/null +++ b/browser/components/newtab/content-src/components/ErrorBoundary/_ErrorBoundary.scss @@ -0,0 +1,21 @@ +.as-error-fallback { + align-items: center; + border-radius: $border-radius; + box-shadow: inset $inner-box-shadow; + color: var(--newtab-text-secondary-color); + display: flex; + flex-direction: column; + font-size: $error-fallback-font-size; + justify-content: center; + justify-items: center; + line-height: $error-fallback-line-height; + + &.borderless-error { + box-shadow: none; + } + + a { + color: var(--newtab-text-secondary-color); + text-decoration: underline; + } +} |