mirror of
https://github.com/Steffo99/sophon.git
synced 2024-12-22 23:04:21 +00:00
🔧 Allow users to ignore errors
This commit is contained in:
parent
d8cadae9be
commit
edfe74ba6e
3 changed files with 64 additions and 2 deletions
|
@ -1,11 +1,15 @@
|
|||
import {Box, Form} from "@steffo/bluelib-react"
|
||||
import * as React from "react"
|
||||
import {ErrorBox} from "./ErrorBox"
|
||||
import {IgnoreErrorButton} from "./IgnoreErrorButton"
|
||||
import {ReportBugButton} from "./ReportBugButton"
|
||||
|
||||
|
||||
interface ErrorCatcherBoxProps {
|
||||
children?: React.ReactNode,
|
||||
}
|
||||
|
||||
|
||||
interface ErrorCatcherBoxState {
|
||||
error?: Error,
|
||||
}
|
||||
|
@ -18,6 +22,7 @@ export class ErrorCatcherBox extends React.Component<ErrorCatcherBoxProps, Error
|
|||
constructor(props: ErrorCatcherBoxProps) {
|
||||
super(props)
|
||||
this.state = {error: undefined}
|
||||
this.clearError = this.clearError.bind(this)
|
||||
}
|
||||
|
||||
componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
|
||||
|
@ -27,10 +32,24 @@ export class ErrorCatcherBox extends React.Component<ErrorCatcherBoxProps, Error
|
|||
})
|
||||
}
|
||||
|
||||
clearError() {
|
||||
this.setState(state => {
|
||||
return {...state, error: undefined}
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.error) {
|
||||
if(this.state.error) {
|
||||
return (
|
||||
<ErrorBox error={this.state.error}/>
|
||||
<Box bluelibClassNames={"color-red"}>
|
||||
{this.state.error.toString()}
|
||||
<Form>
|
||||
<Form.Row>
|
||||
<IgnoreErrorButton onClick={this.clearError}/>
|
||||
<ReportBugButton/>
|
||||
</Form.Row>
|
||||
</Form>
|
||||
</Box>
|
||||
)
|
||||
} else {
|
||||
return this.props.children
|
||||
|
|
18
frontend/src/components/errors/IgnoreErrorButton.tsx
Normal file
18
frontend/src/components/errors/IgnoreErrorButton.tsx
Normal file
|
@ -0,0 +1,18 @@
|
|||
import {faAngleDoubleRight} from "@fortawesome/free-solid-svg-icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import {Button} from "@steffo/bluelib-react"
|
||||
import * as React from "react"
|
||||
|
||||
|
||||
export interface IgnoreErrorButtonProps {
|
||||
onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
||||
}
|
||||
|
||||
|
||||
export function IgnoreErrorButton({onClick}: IgnoreErrorButtonProps): JSX.Element {
|
||||
return (
|
||||
<Button onClick={onClick}>
|
||||
<FontAwesomeIcon icon={faAngleDoubleRight}/> Try ignoring the error
|
||||
</Button>
|
||||
)
|
||||
}
|
25
frontend/src/components/errors/ReportBugButton.tsx
Normal file
25
frontend/src/components/errors/ReportBugButton.tsx
Normal file
|
@ -0,0 +1,25 @@
|
|||
import {faBug} from "@fortawesome/free-solid-svg-icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import {navigate} from "@reach/router"
|
||||
import {Button} from "@steffo/bluelib-react"
|
||||
import * as React from "react"
|
||||
|
||||
|
||||
export function ReportBugButton(): JSX.Element {
|
||||
const onClick =
|
||||
React.useCallback(
|
||||
async () => {
|
||||
await navigate("https://github.com/Steffo99/sophon/issues/new?assignees=&labels=bug&template=1_bug_report.md&title=")
|
||||
},
|
||||
[],
|
||||
)
|
||||
|
||||
return React.useMemo(
|
||||
() => (
|
||||
<Button>
|
||||
<FontAwesomeIcon onClick={onClick} icon={faBug}/> Report bug
|
||||
</Button>
|
||||
),
|
||||
[onClick],
|
||||
)
|
||||
}
|
Loading…
Reference in a new issue