1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-20 14:37:43 +01:00

better looking error boundary

This commit is contained in:
Jelle van Snik 2022-02-18 14:51:30 +01:00
parent 002964572c
commit 36737490a8
3 changed files with 12 additions and 8 deletions

View file

@ -34,7 +34,7 @@ Check out [this project's issues](https://github.com/JamesHawkinss/movie-web/iss
## Rewrite TODO's ## Rewrite TODO's
- [x] Better provider errors (only fail if all failed, show individual fails somewhere) - [x] Better provider errors (only fail if all failed, show individual fails somewhere)
- [ ] Better search suffix view - [x] Better search suffix view
- [ ] Add back link of results view - [ ] Add back link of results view
- [x] Add results list end - [x] Add results list end
- [ ] Add Brand tag top left - [ ] Add Brand tag top left
@ -42,6 +42,6 @@ Check out [this project's issues](https://github.com/JamesHawkinss/movie-web/iss
- [ ] Store watched percentage - [ ] Store watched percentage
- [ ] Implement movie + series view - [ ] Implement movie + series view
- [ ] Add provider stream method - [ ] Add provider stream method
- [ ] Better looking error boundary - [x] Better looking error boundary
- [ ] sort search results so they aren't sorted by provider - [ ] sort search results so they aren't sorted by provider
- [ ] Get rid of react warnings - [ ] Get rid of react warnings

View file

@ -1,3 +1,5 @@
import { IconPatch } from "components/Buttons/IconPatch";
import { Icons } from "components/Icon";
import { Title } from "components/Text/Title"; import { Title } from "components/Text/Title";
import { Component } from "react"; import { Component } from "react";
@ -42,20 +44,21 @@ export class ErrorBoundary extends Component<{}, ErrorBoundaryState> {
// TODO make pretty // TODO make pretty
return ( return (
<div> <div className="flex min-h-screen w-full flex-col items-center justify-center px-4 py-12">
<div> <div className="flex flex-col items-center justify-start text-center">
<IconPatch icon={Icons.WARNING} className="mb-6 text-red-400" />
<Title>Whoops, it broke</Title> <Title>Whoops, it broke</Title>
<p> <p className="my-6 max-w-lg">
The app encountered an error and wasn't able to recover, please The app encountered an error and wasn't able to recover, please
report it to the discord server or on GitHub. report it to the discord server or on GitHub.
</p> </p>
</div> </div>
{this.state.error ? ( {this.state.error ? (
<div> <div className="bg-denim-300 mt-12 max-w-4xl rounded px-6 py-4">
<p className="txt-white"> <p className="mb-2 break-words font-bold text-white">
{this.state.error.name} - {this.state.error.description} {this.state.error.name} - {this.state.error.description}
</p> </p>
<p>{this.state.error.path}</p> <p className="break-words">{this.state.error.path}</p>
</div> </div>
) : null} ) : null}
</div> </div>

View file

@ -19,6 +19,7 @@ import { useLoading } from "hooks/useLoading";
import { IconPatch } from "components/Buttons/IconPatch"; import { IconPatch } from "components/Buttons/IconPatch";
function SearchLoading() { function SearchLoading() {
throw new Error("testing");
return <Loading className="my-12" text="Fetching your favourite shows..." />; return <Loading className="my-12" text="Fetching your favourite shows..." />;
} }