sambruk/excalidraw
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Separated specification and implementation in TopErrorBoundary (#1031)

Browse Source 
* Encapsulate SceneHistory. A little.

* Clean up TopErrorBoundary
This commit is contained in:
Kent Beck 2020-03-21 02:26:01 -07:00 committed by GitHub
parent f6b36519f1
commit 1e8cd2bd1c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 62 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

124
src/components/TopErrorBoundary.tsx
View File

@ -20,6 +20,10 @@ export class TopErrorBoundary extends React.Component<
localStorage: "",
};
render() {
return this.state.hasError ? this.errorSplash() : this.props.children;
}
componentDidCatch(error: Error) {
resetCursor();
const _localStorage: any = {};
@ -88,74 +92,70 @@ export class TopErrorBoundary extends React.Component<
);
}
render() {
if (this.state.hasError) {
return (
<div className="ErrorSplash">
<div className="ErrorSplash-messageContainer">
<div className="ErrorSplash-paragraph bigger align-center">
{t("errorSplash.headingMain_pre")}
<button onClick={() => window.location.reload()}>
{t("errorSplash.headingMain_button")}
</button>
private errorSplash() {
return (
<div className="ErrorSplash">
<div className="ErrorSplash-messageContainer">
<div className="ErrorSplash-paragraph bigger align-center">
{t("errorSplash.headingMain_pre")}
<button onClick={() => window.location.reload()}>
{t("errorSplash.headingMain_button")}
</button>
</div>
<div className="ErrorSplash-paragraph align-center">
{t("errorSplash.clearCanvasMessage")}
<button
onClick={() => {
localStorage.clear();
window.location.reload();
}}
>
{t("errorSplash.clearCanvasMessage_button")}
</button>
<br />
<div className="smaller">
<span role="img" aria-label="warning">
⚠️
</span>
{t("errorSplash.clearCanvasCaveat")}
<span role="img" aria-hidden="true">
⚠️
</span>
</div>
<div className="ErrorSplash-paragraph align-center">
{t("errorSplash.clearCanvasMessage")}
<button
onClick={() => {
localStorage.clear();
window.location.reload();
}}
>
{t("errorSplash.clearCanvasMessage_button")}
</div>
<div>
<div className="ErrorSplash-paragraph">
{t("errorSplash.openIssueMessage_pre")}
<button onClick={this.createGithubIssue}>
{t("errorSplash.openIssueMessage_button")}
</button>
<br />
<div className="smaller">
<span role="img" aria-label="warning">
⚠️
</span>
{t("errorSplash.clearCanvasCaveat")}
<span role="img" aria-hidden="true">
⚠️
</span>
</div>
{t("errorSplash.openIssueMessage_post")}
</div>
<div>
<div className="ErrorSplash-paragraph">
{t("errorSplash.openIssueMessage_pre")}
<button onClick={this.createGithubIssue}>
{t("errorSplash.openIssueMessage_button")}
</button>
{t("errorSplash.openIssueMessage_post")}
</div>
<div className="ErrorSplash-paragraph">
<div className="ErrorSplash-details">
<label>{t("errorSplash.errorStack")}</label>
<textarea
rows={10}
onPointerDown={this.selectTextArea}
readOnly={true}
value={
this.state.unresolvedError
? t("errorSplash.errorStack_loading")
: this.state.stack
}
/>
<label>{t("errorSplash.sceneContent")}</label>
<textarea
rows={5}
onPointerDown={this.selectTextArea}
readOnly={true}
value={this.state.localStorage}
/>
</div>
<div className="ErrorSplash-paragraph">
<div className="ErrorSplash-details">
<label>{t("errorSplash.errorStack")}</label>
<textarea
rows={10}
onPointerDown={this.selectTextArea}
readOnly={true}
value={
this.state.unresolvedError
? t("errorSplash.errorStack_loading")
: this.state.stack
}
/>
<label>{t("errorSplash.sceneContent")}</label>
<textarea
rows={5}
onPointerDown={this.selectTextArea}
readOnly={true}
value={this.state.localStorage}
/>
</div>
</div>
</div>
</div>
);
}
return this.props.children;
</div>
);
}
}