39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
import React from "react";
|
|
import './result.scss'
|
|
import {CheckCircleFilled} from "../icons/CheckCircleFilled.tsx";
|
|
import {NotFound} from "../icons/NotFound.tsx";
|
|
|
|
type Status = 'success' | 'error' | 'info' | 'warning' | '404' | '403' | '500';
|
|
export type ResultProps = {
|
|
extra?: React.ReactNode;
|
|
title?: React.ReactNode;
|
|
subTitle?: React.ReactNode;
|
|
icon?: React.ReactNode;
|
|
status?: Status //number | string;
|
|
};
|
|
export const IconMap: {
|
|
[key in Status]: React.ReactNode
|
|
} = {
|
|
success: <CheckCircleFilled/>,
|
|
error: <CheckCircleFilled/>,
|
|
info: <CheckCircleFilled/>,
|
|
warning: <CheckCircleFilled/>,
|
|
// error: CloseCircleFilled,
|
|
// info: ExclamationCircleFilled,
|
|
// warning: WarningFilled,
|
|
'404': <NotFound/>,
|
|
'500': <NotFound/>,
|
|
'403': <NotFound/>,
|
|
// '500': serverError,
|
|
// '403': unauthorized,
|
|
};
|
|
export const Index: React.FC<ResultProps> = (props) => {
|
|
const icon = props.icon || (props.status ? IconMap[props.status] : <></>)
|
|
return <div className="result-wrapper">
|
|
<div className="icon">{icon}</div>
|
|
<div className="title">{props.title}</div>
|
|
{props.subTitle && <div className="sub-title">{props.subTitle}</div>}
|
|
<div className="extra">{props.extra}</div>
|
|
</div>
|
|
}
|