44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
|
|
export interface DashboardReportCtasProps {
|
|
cycleClosed: boolean;
|
|
hasDailySnapshot: boolean;
|
|
hasEndCycleSnapshot: boolean;
|
|
onOpenDaily: () => void;
|
|
onOpenEndCycle: () => void;
|
|
}
|
|
|
|
const buttonClass =
|
|
'rounded-lg bg-slate-900 px-4 py-2 text-sm font-semibold text-white shadow-sm hover:bg-slate-800 disabled:cursor-not-allowed disabled:bg-slate-400 disabled:hover:bg-slate-400';
|
|
|
|
const label = (hasSnapshot: boolean) => (hasSnapshot ? 'Lihat' : 'Buat');
|
|
|
|
const DashboardReportCtas: React.FC<DashboardReportCtasProps> = ({
|
|
cycleClosed,
|
|
hasDailySnapshot,
|
|
hasEndCycleSnapshot,
|
|
onOpenDaily,
|
|
onOpenEndCycle,
|
|
}) => (
|
|
<div className="flex flex-col items-end gap-1">
|
|
<div className="flex flex-wrap items-center justify-end gap-3">
|
|
<button type="button" onClick={onOpenDaily} className={buttonClass}>
|
|
{label(hasDailySnapshot)} Harian
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={onOpenEndCycle}
|
|
disabled={!cycleClosed}
|
|
className={buttonClass}
|
|
>
|
|
{label(hasEndCycleSnapshot)} Akhir Siklus
|
|
</button>
|
|
</div>
|
|
{!cycleClosed && (
|
|
<p className="text-xs text-slate-500">Tersedia setelah siklus ditutup</p>
|
|
)}
|
|
</div>
|
|
);
|
|
|
|
export default DashboardReportCtas;
|