31 lines
968 B
TypeScript
31 lines
968 B
TypeScript
import clsx from "clsx";
|
|
import StatusIndicators from "./StatusIndicators";
|
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
|
import type { IconProp } from "@fortawesome/fontawesome-svg-core";
|
|
|
|
type CameraOverviewHeaderProps = {
|
|
title?: string;
|
|
status?: string;
|
|
refetch?: () => void;
|
|
icon?: IconProp;
|
|
};
|
|
const CardHeader = ({ title, status, icon, refetch }: CameraOverviewHeaderProps) => {
|
|
return (
|
|
<div
|
|
className={clsx(
|
|
"w-full border-b border-gray-600 flex flex-row items-center space-x-2 mb-6 relative justify-between",
|
|
)}
|
|
>
|
|
<div className="flex flex-row items-center w-full justify-between">
|
|
<h2 className="flex flex-row text-xl items-center">
|
|
{status && <StatusIndicators status={status} />}
|
|
{title}
|
|
</h2>
|
|
{icon && <FontAwesomeIcon icon={icon} className="hover:cursor-pointer" onClick={refetch} />}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default CardHeader;
|