Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add ErrorBox showing full error details #4

Merged
merged 5 commits into from
May 24, 2020
Merged

feat: add ErrorBox showing full error details #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
316a4e3
fix: show errors in output
timdeschryver May 23, 2020
08e6d48
fix: add error preview
timdeschryver May 23, 2020
7dfd9ea
extract error rendering to ErrorBox component
smeijer May 24, 2020
ec59d6c
Merge branch 'master' into pr/4
smeijer May 24, 2020
22391d5
prefix the error with 'Error'
smeijer May 24, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 9 additions & 2 deletions src/components/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import { initialValues } from '../constants';
import { useAppContext } from './Context';
import HtmlPreview from './HtmlPreview';
import state from '../lib/state';
import ErrorBox from './ErrorBox';

const savedState = state.load();

Expand Down Expand Up @@ -60,11 +61,17 @@ function App() {
/>
<div className="output">
<span className="text-blue-600">&gt; </span>
{parsed.text || parsed.error || 'undefined'}
{parsed.error
? `Error: ${parsed.error}`
: parsed.text || 'undefined'}
</div>
</div>

<ElementInfo />
{parsed.error ? (
<ErrorBox caption={parsed.error} body={parsed.errorBody} />
) : (
<ElementInfo />
)}
</div>
</div>

Expand Down
13 changes: 13 additions & 0 deletions src/components/ErrorBox.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import React from 'react';

function ErrorBox({ caption, body }) {
return (
<div className="bg-red-600 text-white p-4 rounded space-y-2 font-mono text-xs">
<div className="font-bold text-xs">Error: {caption}</div>

<div className="font-mono text-xs whitespace-pre-wrap">{body}</div>
</div>
);
}

export default ErrorBox;