All files / src/components/admin/monitoring SnoozeDropdown.test.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import { SnoozeDropdown } from './SnoozeDropdown';

describe('SnoozeDropdown', () => {
  const mockOnSnooze = jest.fn();

  beforeEach(() => {
    mockOnSnooze.mockClear();
  });

  it('renders snooze button', () => {
    render(<SnoozeDropdown currentSnoozedUntil={null} onSnooze={mockOnSnooze} />);
    expect(screen.getByTestId('snooze-button')).toBeInTheDocument();
    expect(screen.getByText('Snooze')).toBeInTheDocument();
  });

  it('shows Snoozed text when currently snoozed', () => {
    const futureDate = new Date(Date.now() + 24 * 60 * 60 * 1000);
    render(<SnoozeDropdown currentSnoozedUntil={futureDate} onSnooze={mockOnSnooze} />);
    expect(screen.getByText('Snoozed')).toBeInTheDocument();
  });

  it('opens dropdown on click', () => {
    render(<SnoozeDropdown currentSnoozedUntil={null} onSnooze={mockOnSnooze} />);
    fireEvent.click(screen.getByTestId('snooze-button'));
    expect(screen.getByTestId('snooze-dropdown')).toBeInTheDocument();
  });

  it('shows snooze duration options', () => {
    render(<SnoozeDropdown currentSnoozedUntil={null} onSnooze={mockOnSnooze} />);
    fireEvent.click(screen.getByTestId('snooze-button'));

    expect(screen.getByText('1 hour')).toBeInTheDocument();
    expect(screen.getByText('4 hours')).toBeInTheDocument();
    expect(screen.getByText('1 day')).toBeInTheDocument();
    expect(screen.getByText('3 days')).toBeInTheDocument();
    expect(screen.getByText('1 week')).toBeInTheDocument();
    expect(screen.getByText('Custom...')).toBeInTheDocument();
  });

  it('calls onSnooze with calculated date when option selected', () => {
    render(<SnoozeDropdown currentSnoozedUntil={null} onSnooze={mockOnSnooze} />);
    fireEvent.click(screen.getByTestId('snooze-button'));
    fireEvent.click(screen.getByTestId('snooze-option-1'));

    expect(mockOnSnooze).toHaveBeenCalledTimes(1);
    const calledDate = mockOnSnooze.mock.calls[0][0];
    expect(calledDate).toBeInstanceOf(Date);
    // Should be roughly 1 hour in the future
    const hourFromNow = new Date(Date.now() + 60 * 60 * 1000);
    expect(Math.abs(calledDate.getTime() - hourFromNow.getTime())).toBeLessThan(1000);
  });

  it('shows unsnooze option when snoozed', () => {
    const futureDate = new Date(Date.now() + 24 * 60 * 60 * 1000);
    render(<SnoozeDropdown currentSnoozedUntil={futureDate} onSnooze={mockOnSnooze} />);
    fireEvent.click(screen.getByTestId('snooze-button'));

    expect(screen.getByTestId('unsnooze-button')).toBeInTheDocument();
  });

  it('calls onSnooze with null when unsnoozed', () => {
    const futureDate = new Date(Date.now() + 24 * 60 * 60 * 1000);
    render(<SnoozeDropdown currentSnoozedUntil={futureDate} onSnooze={mockOnSnooze} />);
    fireEvent.click(screen.getByTestId('snooze-button'));
    fireEvent.click(screen.getByTestId('unsnooze-button'));

    expect(mockOnSnooze).toHaveBeenCalledWith(null);
  });

  it('is disabled when disabled prop is true', () => {
    render(<SnoozeDropdown currentSnoozedUntil={null} onSnooze={mockOnSnooze} disabled />);
    expect(screen.getByTestId('snooze-button')).toBeDisabled();
  });

  it('shows custom date picker when Custom is selected', () => {
    render(<SnoozeDropdown currentSnoozedUntil={null} onSnooze={mockOnSnooze} />);
    fireEvent.click(screen.getByTestId('snooze-button'));
    fireEvent.click(screen.getByTestId('snooze-option--1'));

    expect(screen.getByTestId('snooze-custom-input')).toBeInTheDocument();
  });
});