0x1eef/wimi
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add ErrorRenderer.tsx

Browse source 
Fix #1
This commit is contained in:
0x1eef 2023-09-28 13:45:15 -03:00
parent df3334914f
commit ef42f90553
5 changed files with 33 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/css/components/ErrorRenderer.css Normal file
View file

@ -0,0 +1,19 @@
.error {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
place-content: center;
height: 100%;
}
.error span:first-child {
color: var(--primary-red);
font-weight: bold;
}
.error span {
display: flex;
flex-direction: column;
align-items: center;
}

1
src/html/browseraction.html
View file

@ -4,6 +4,7 @@
<link rel="stylesheet" href="/css/index.css"/> <link rel="stylesheet" href="/css/index.css"/>
<link rel="stylesheet" href="/css/label.css"/> <link rel="stylesheet" href="/css/label.css"/>
<link rel="stylesheet" href="/css/components/Response.css"/> <link rel="stylesheet" href="/css/components/Response.css"/>
<link rel="stylesheet" href="/css/components/ErrorRenderer.css"/>
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>

3
src/js/components/App.tsx
View file

@ -1,4 +1,5 @@
import React from "react"; import React from "react";
import { ErrorRenderer } from "/components/ErrorRenderer";
import { ResponseRenderer } from "/components/ResponseRenderer"; import { ResponseRenderer } from "/components/ResponseRenderer";
import { useWebService } from "/hooks/useWebService"; import { useWebService } from "/hooks/useWebService";
@ -8,7 +9,7 @@ export function App() {
if (response) { if (response) {
return (<ResponseRenderer response={response}/>); return (<ResponseRenderer response={response}/>);
} else if (error) { } else if (error) {
/* FIXME: Add ErrorRenderer */ return (<ErrorRenderer error={error}/>);
} else { } else {
return (<div className="loader">{t("loading")}</div>); return (<div className="loader">{t("loading")}</div>);
} }

10
src/js/components/ErrorRenderer.tsx Normal file
View file

@ -0,0 +1,10 @@
import React from "react";
export function ErrorRenderer({ error }: {error: Error}) {
return (
<div className="error">
<span>Error</span>:
<span>&nbsp;{error.message}</span>
</div>
);
}

3
src/js/hooks/useWebService.ts
View file

@ -12,8 +12,7 @@ export function useWebService(): [Maybe<TResponse>, Maybe<Error>] {
if (res.status === 200) { if (res.status === 200) {
return res.json(); return res.json();
} else { } else {
const message = "There was an unexpected response from the web service. " + const message = `Unexpected server response (${res.status})`;
`The status code was ${res.status}`;
throw new Error(message); throw new Error(message);
} }
} }