lti-web-client/src/components/pages/expense/ExpenseStatusBadge.tsx

import StatusBadge from '@/components/helper/StatusBadge';

import { BaseApproval } from '@/types/api/api-general';
import { Color } from '@/types/theme';

interface ExpenseStatusBadgeProps {
  approval?: BaseApproval;
}

const ExpenseStatusBadge = ({ approval }: ExpenseStatusBadgeProps) => {
  const isLatestApprovalRejected = approval?.action === 'REJECTED';

  const latestApprovalStepNumber = approval?.step_number;

  let expenseStatusBadgeColor: Color = 'neutral';

  switch (latestApprovalStepNumber) {
    case 1:
      expenseStatusBadgeColor = 'neutral';
      break;

    case 2:
      expenseStatusBadgeColor = 'info';
      break;

    case 3:
      expenseStatusBadgeColor = 'warning';
      break;

    case 4:
      expenseStatusBadgeColor = 'error';
      break;

    case 5:
      expenseStatusBadgeColor = 'success';
      break;

    case 6:
      expenseStatusBadgeColor = 'success';
      break;
  }

  if (isLatestApprovalRejected) {
    expenseStatusBadgeColor = 'error';
  }

  return (
    <StatusBadge
      color={expenseStatusBadgeColor}
      text={isLatestApprovalRejected ? 'Ditolak' : (approval?.step_name ?? '')}
      className={{
        badge: 'whitespace-nowrap max-w-max w-fit',
      }}
    />
  );
};

export default ExpenseStatusBadge;