2022-11-02 16:05:27 +01:00
|
|
|
import { VFC } from 'react';
|
|
|
|
import { ChangeRequestState } from '../changeRequest.types';
|
2022-11-02 14:23:44 +01:00
|
|
|
import { Badge } from 'component/common/Badge/Badge';
|
|
|
|
import { Check, CircleOutlined, Close } from '@mui/icons-material';
|
|
|
|
|
2022-11-02 16:05:27 +01:00
|
|
|
interface IChangeRequestStatusBadgeProps {
|
|
|
|
state: ChangeRequestState;
|
|
|
|
}
|
|
|
|
|
|
|
|
const ReviewRequiredBadge: VFC = () => (
|
|
|
|
<Badge color="secondary" icon={<CircleOutlined fontSize={'small'} />}>
|
|
|
|
Review required
|
|
|
|
</Badge>
|
|
|
|
);
|
|
|
|
|
2022-11-08 16:16:30 +01:00
|
|
|
const DraftBadge: VFC = () => <Badge color="warning">Draft</Badge>;
|
|
|
|
|
2022-11-02 16:05:27 +01:00
|
|
|
export const ChangeRequestStatusBadge: VFC<IChangeRequestStatusBadgeProps> = ({
|
|
|
|
state,
|
|
|
|
}) => {
|
2022-11-02 14:23:44 +01:00
|
|
|
switch (state) {
|
|
|
|
case 'Draft':
|
2022-11-08 16:16:30 +01:00
|
|
|
return <DraftBadge />;
|
2022-11-02 14:23:44 +01:00
|
|
|
case 'In review':
|
2022-11-02 16:05:27 +01:00
|
|
|
return <ReviewRequiredBadge />;
|
2022-11-02 14:23:44 +01:00
|
|
|
case 'Approved':
|
|
|
|
return (
|
|
|
|
<Badge color="success" icon={<Check fontSize={'small'} />}>
|
|
|
|
Approved
|
|
|
|
</Badge>
|
|
|
|
);
|
|
|
|
case 'Applied':
|
|
|
|
return (
|
|
|
|
<Badge color="success" icon={<Check fontSize={'small'} />}>
|
|
|
|
Applied
|
|
|
|
</Badge>
|
|
|
|
);
|
|
|
|
case 'Cancelled':
|
|
|
|
return (
|
2022-11-03 12:43:03 +01:00
|
|
|
<Badge color="error" icon={<Close fontSize={'small'} />}>
|
2022-11-02 14:23:44 +01:00
|
|
|
Cancelled
|
|
|
|
</Badge>
|
|
|
|
);
|
2023-08-15 09:08:26 +02:00
|
|
|
case 'Rejected':
|
|
|
|
return (
|
|
|
|
<Badge color="error" icon={<Close fontSize={'small'} />}>
|
|
|
|
Rejected
|
|
|
|
</Badge>
|
|
|
|
);
|
2022-11-02 14:23:44 +01:00
|
|
|
default:
|
2022-11-02 16:05:27 +01:00
|
|
|
return <ReviewRequiredBadge />;
|
2022-11-02 14:23:44 +01:00
|
|
|
}
|
|
|
|
};
|