aboutsummaryrefslogtreecommitdiff
path: root/packages/demobank-ui/src/components/ErrorLoading.tsx
diff options
context:
space:
mode:
authorSebastian <sebasjm@gmail.com>2023-09-25 08:40:18 -0300
committerSebastian <sebasjm@gmail.com>2023-09-25 14:50:44 -0300
commitae49194d4271f1108ec9b8318ea3b7977314cb85 (patch)
tree9a386163e762e64e4ba7d1c1a37f53ad1f0b3eca /packages/demobank-ui/src/components/ErrorLoading.tsx
parent15af6c619de70336bcdfbabbd32b9d93aabefc5b (diff)
more ui
Diffstat (limited to 'packages/demobank-ui/src/components/ErrorLoading.tsx')
-rw-r--r--packages/demobank-ui/src/components/ErrorLoading.tsx19
1 files changed, 14 insertions, 5 deletions
diff --git a/packages/demobank-ui/src/components/ErrorLoading.tsx b/packages/demobank-ui/src/components/ErrorLoading.tsx
index fbc4ffceb..a4faa4d5d 100644
--- a/packages/demobank-ui/src/components/ErrorLoading.tsx
+++ b/packages/demobank-ui/src/components/ErrorLoading.tsx
@@ -15,15 +15,24 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { useTranslationContext } from "@gnu-taler/web-util/browser";
+import { HttpError, useTranslationContext } from "@gnu-taler/web-util/browser";
import { h, VNode } from "preact";
-export function ErrorLoading(): VNode {
+export function ErrorLoading({ error }: { error: HttpError<SandboxBackend.SandboxError> }): VNode {
const { i18n } = useTranslationContext()
return (
- <div><i18n.Translate>
- Could not complete the request
- </i18n.Translate>
+ <div><div class="rounded-md bg-red-50 p-4">
+ <div class="flex">
+ <div class="flex-shrink-0">
+ <svg class="h-5 w-5 text-red-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+ <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z" clip-rule="evenodd" />
+ </svg>
+ </div>
+ <div class="ml-3 flex-1 md:flex md:justify-between">
+ <p class="text-sm font-medium text-red-800">{error.message}</p>
+ </div>
+ </div>
+ </div>
</div>
);
}