diff --git a/src/common/ErrorHandler.tsx b/src/common/ErrorHandler.tsx index a18de8c1..a72589b0 100644 --- a/src/common/ErrorHandler.tsx +++ b/src/common/ErrorHandler.tsx @@ -1,7 +1,7 @@ -import { SimpleCard } from '@shlinkio/shlink-frontend-kit'; +import { Button } from '@shlinkio/shlink-frontend-kit/tailwind'; import type { PropsWithChildren, ReactNode } from 'react'; import { Component } from 'react'; -import { Button } from 'reactstrap'; +import { ErrorLayout } from './ErrorLayout'; type ErrorHandlerProps = PropsWithChildren<{ location?: typeof window.location; @@ -33,14 +33,11 @@ export class ErrorHandler extends Component - -

Oops! This is awkward :S

-

It seems that something went wrong. Try refreshing the page or just click this button.

-
- -
- + +

It seems that something went wrong. Try refreshing the page or just click this button.

+
+ +
); } diff --git a/src/common/ErrorLayout.tsx b/src/common/ErrorLayout.tsx new file mode 100644 index 00000000..ba3679a4 --- /dev/null +++ b/src/common/ErrorLayout.tsx @@ -0,0 +1,15 @@ +import { SimpleCard } from '@shlinkio/shlink-frontend-kit/tailwind'; +import type { FC, PropsWithChildren } from 'react'; + +export type ErrorLayoutProps = PropsWithChildren<{ + title: string; +}>; + +export const ErrorLayout: FC = ({ children, title }) => ( +
+ +

{title}

+ {children} +
+
+); diff --git a/src/common/NotFound.tsx b/src/common/NotFound.tsx index 582e20d7..a19973f5 100644 --- a/src/common/NotFound.tsx +++ b/src/common/NotFound.tsx @@ -1,18 +1,16 @@ -import { Button, SimpleCard } from '@shlinkio/shlink-frontend-kit/tailwind'; +import { Button } from '@shlinkio/shlink-frontend-kit/tailwind'; import type { FC, PropsWithChildren } from 'react'; +import { ErrorLayout } from './ErrorLayout'; type NotFoundProps = PropsWithChildren<{ to?: string }>; export const NotFound: FC = ({ to = '/', children = 'Home' }) => ( -
- -

Oops! We could not find requested route.

-

- Use your browser's back button to navigate to the page you have previously come from, or just press this - button. -

-
- -
-
+ +

+ Use your browser's back button to navigate to the page you have previously come from, or just press this + button. +

+
+ +
);