39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
/**
|
|
* Copyright (c) 2023-present Plane Software, Inc. and contributors
|
|
* SPDX-License-Identifier: AGPL-3.0-only
|
|
* See the LICENSE file for details.
|
|
*/
|
|
|
|
import { AlertCircle, CheckCircle2 } from "lucide-react";
|
|
|
|
type TBanner = {
|
|
type: "success" | "error";
|
|
message: string;
|
|
};
|
|
|
|
export function Banner(props: TBanner) {
|
|
const { type, message } = props;
|
|
|
|
return (
|
|
<div
|
|
className={`w-full rounded-md border p-2 ${type === "error" ? "border-danger-strong bg-danger-subtle" : "border-success-strong bg-success-subtle"}`}
|
|
>
|
|
<div className="flex items-center justify-center">
|
|
<div className="flex-shrink-0">
|
|
{type === "error" ? (
|
|
<span className="flex h-6 w-6 items-center justify-center rounded-full">
|
|
<AlertCircle className="h-5 w-5 text-danger-primary" aria-hidden="true" />
|
|
</span>
|
|
) : (
|
|
<CheckCircle2 className="h-5 w-5 text-success-primary" aria-hidden="true" />
|
|
)}
|
|
</div>
|
|
<div className="ml-1">
|
|
<p className={`text-13 font-medium ${type === "error" ? "text-danger-primary" : "text-success-primary"}`}>
|
|
{message}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|