'use client'

import type { EventManagementInsights } from '@/services/eventManagement'
import { formatCurrency } from '@/helpers'

import { InsightStat } from './AdminEventDetailUi'

interface AdminEventFinancialTabProps {
  insights: EventManagementInsights | null
}

const AdminEventFinancialTab = ({ insights }: AdminEventFinancialTabProps) => {
  if (!insights) {
    return <p className="p-4 text-sm text-secondary-30">اطلاعاتی یافت نشد.</p>
  }

  return (
    <div className="grid gap-3 sm:grid-cols-2 xl:grid-cols-4">
      <InsightStat
        label="فروش ناخالص"
        value={formatCurrency(insights.financial.grossAmount)}
      />
      <InsightStat
        label="کمیسیون پلتفرم"
        value={formatCurrency(insights.financial.commissionAmount)}
      />
      <InsightStat
        label="بازپرداخت مهمان"
        value={formatCurrency(insights.financial.guestRefundAmount)}
      />
      <InsightStat
        label="درآمد خالص"
        value={formatCurrency(insights.financial.netAmount)}
      />
      <InsightStat
        label="در انتظار آزادسازی"
        value={formatCurrency(insights.financial.heldAmount)}
      />
      <InsightStat
        label="آماده تسویه"
        value={formatCurrency(insights.financial.availableAmount)}
      />
      <InsightStat
        label="تسویه‌شده"
        value={formatCurrency(insights.financial.settledAmount)}
      />
    </div>
  )
}

export default AdminEventFinancialTab