paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat(errors): Reuse ResponseErrorList for non ResponseErrors

Browse Source 
Signed-off-by: Joel Low <joel@joelsplace.sg>
This commit is contained in:
Joel Low
2021-03-19 16:23:54 +08:00
parent 9570256146
commit fcc3ada247
2 changed files with 89 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/shy-owls-grab.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/core': patch
---
Reuse ResponseErrorList for non ResponseErrors
packages/core/src/components/ResponseErrorPanel/ResponseErrorPanel.tsx
+84 -52
View File
@@ -39,6 +39,78 @@ const useStyles = makeStyles(theme => ({
},
}));
type ResponseErrorListProps = {
error: string;
message: string;
request?: string;
stack?: string;
json?: string;
};
const ResponseErrorList = ({
error,
request,
message,
stack,
json,
}: ResponseErrorListProps) => {
const classes = useStyles();
return (
<List dense>
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Error"
secondary={error}
/>
<CopyTextButton text={error} />
</ListItem>
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Message"
secondary={message}
/>
<CopyTextButton text={message} />
</ListItem>
{request && (
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Request"
secondary={request}
/>
<CopyTextButton text={request} />
</ListItem>
)}
{stack && (
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Stack Trace"
secondary={stack}
/>
<CopyTextButton text={stack} />
</ListItem>
)}
{json && (
<>
<Divider component="li" className={classes.divider} />
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Full Error as JSON"
secondary={<CodeSnippet language="json" text={json} />}
/>
<CopyTextButton text={json} />
</ListItem>
</>
)}
</List>
);
};
type Props = {
error: Error;
};
@@ -50,13 +122,13 @@ type Props = {
* server-provided information about what happened.
*/
export const ResponseErrorDetails = ({ error }: Props) => {
const classes = useStyles();
if (error.name !== 'ResponseError') {
return (
<List dense>
<ListItemText primary="Message" secondary={error.message} />
</List>
<ResponseErrorList
error={error.name}
message={error.message}
stack={error.stack}
/>
);
}
@@ -70,53 +142,13 @@ export const ResponseErrorDetails = ({ error }: Props) => {
const jsonString = JSON.stringify(data, undefined, 2);
return (
<List dense>
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Error"
secondary={errorString}
/>
<CopyTextButton text={errorString} />
</ListItem>
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Message"
secondary={messageString}
/>
<CopyTextButton text={messageString} />
</ListItem>
{requestString && (
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Request"
secondary={requestString}
/>
<CopyTextButton text={requestString} />
</ListItem>
)}
{stackString && (
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Stack Trace"
secondary={stackString}
/>
<CopyTextButton text={stackString} />
</ListItem>
)}
<Divider component="li" className={classes.divider} />
<ListItem alignItems="flex-start">
<ListItemText
classes={{ secondary: classes.text }}
primary="Full Error as JSON"
secondary={<CodeSnippet language="json" text={jsonString} />}
/>
<CopyTextButton text={jsonString} />
</ListItem>
</List>
<ResponseErrorList
error={errorString}
message={messageString}
request={requestString}
stack={stackString}
json={jsonString}
/>
);
};