import React from 'react';
import { describe, expect, it, vi } from 'vitest';
import { render, screen } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import { UploadActionCard } from '../HomePage';

vi.mock('../../hooks/useDirectUpload', () => ({
  useDirectUpload: () => ({
    upload: vi.fn(),
    uploading: false,
    error: null,
    warning: null,
    progress: 0,
    reset: vi.fn(),
  }),
}));

vi.mock('react-router-dom', async () => {
  const actual = await vi.importActual<typeof import('react-router-dom')>('react-router-dom');
  return {
    ...actual,
    useNavigate: () => vi.fn(),
  };
});

describe('UploadActionCard', () => {
  it('renders with dark mode surface classes', () => {
    render(
      <MemoryRouter>
        <UploadActionCard
          token="demo"
          accentColor="#FF5A5F"
          secondaryAccent="#FFF8F5"
          radius={12}
          requiresApproval={false}
        />
      </MemoryRouter>,
    );

    const card = screen.getByTestId('upload-action-card');
    expect(card.className).toContain('bg-[var(--guest-surface)]');
    expect(card.className).toContain('dark:bg-slate-950/70');
  });
});