Deploy to production - ensure all endpoints operational

src/components/__tests__/Navigation.test.tsx

@@ -1,87 +1,87 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest'
-import { render } from '@testing-library/react'
-import { screen, fireEvent } from '@testing-library/dom'
-import '@testing-library/jest-dom'
-import { Navigation } from '../Navigation'
-
-// Mock the UI components
-vi.mock('../ui', () => ({
-  LogoMark: () => <div data-testid="logo-mark">Logo</div>,
-  Magnetic: ({ children }: { children: React.ReactNode }) => <div>{children}</div>
-}))
-
-describe('Navigation Component', () => {
-  const mockProps = {
-    darkMode: false,
-    setDarkMode: vi.fn(),
-    mobileMenuOpen: false,
-    setMobileMenuOpen: vi.fn()
-  }
-
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  it('renders navigation with logo and brand name', () => {
-    render(<Navigation {...mockProps} />)
-    
-    expect(screen.getByTestId('logo-mark')).toBeInTheDocument()
-    expect(screen.getByText('Miracles in Motion')).toBeInTheDocument()
-    expect(screen.getByText('Essentials for every student')).toBeInTheDocument()
-  })
-
-  it('renders desktop navigation links', () => {
-    render(<Navigation {...mockProps} />)
-    
-    expect(screen.getByLabelText('Read success stories')).toBeInTheDocument()
-    expect(screen.getByLabelText('View testimonies')).toBeInTheDocument()
-    expect(screen.getByLabelText('Volunteer opportunities')).toBeInTheDocument()
-    expect(screen.getByLabelText('Corporate partnerships')).toBeInTheDocument()
-    expect(screen.getByLabelText('Request assistance')).toBeInTheDocument()
-    expect(screen.getByLabelText('Portal login')).toBeInTheDocument()
-  })
-
-  it('toggles dark mode when button is clicked', () => {
-    render(<Navigation {...mockProps} />)
-    
-    const darkModeButtons = screen.getAllByLabelText('Switch to dark mode')
-    fireEvent.click(darkModeButtons[0])
-    
-    expect(mockProps.setDarkMode).toHaveBeenCalledWith(true)
-  })
-
-  it('toggles mobile menu when hamburger button is clicked', () => {
-    render(<Navigation {...mockProps} />)
-    
-    const mobileMenuButton = screen.getByLabelText('Open navigation menu')
-    fireEvent.click(mobileMenuButton)
-    
-    expect(mockProps.setMobileMenuOpen).toHaveBeenCalledWith(true)
-  })
-
-  it('displays mobile menu when mobileMenuOpen is true', () => {
-    render(<Navigation {...mockProps} mobileMenuOpen={true} />)
-    
-    const storiesLinks = screen.getAllByText('Stories')
-    expect(storiesLinks).toHaveLength(2) // One in desktop nav, one in mobile nav
-    expect(screen.getByText('Testimonies')).toBeInTheDocument()
-    expect(screen.getByText('Volunteers')).toBeInTheDocument()
-  })
-
-  it('handles keyboard navigation correctly', () => {
-    render(<Navigation {...mockProps} />)
-    
-    const darkModeButton = screen.getAllByLabelText('Switch to dark mode')[0]
-    fireEvent.keyDown(darkModeButton, { key: 'Enter', code: 'Enter' })
-    
-    expect(mockProps.setDarkMode).toHaveBeenCalledWith(true)
-  })
-
-  it('displays correct icon based on dark mode state', () => {
-    const { rerender } = render(<Navigation {...mockProps} darkMode={false} />)
-    expect(screen.getAllByLabelText('Switch to dark mode')).toHaveLength(2)
-    
-    rerender(<Navigation {...mockProps} darkMode={true} />)
-    expect(screen.getAllByLabelText('Switch to light mode')).toHaveLength(2)
-  })
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { render } from '@testing-library/react'
+import { screen, fireEvent } from '@testing-library/dom'
+import '@testing-library/jest-dom'
+import { Navigation } from '../Navigation'
+
+// Mock the UI components
+vi.mock('../ui', () => ({
+  LogoMark: () => <div data-testid="logo-mark">Logo</div>,
+  Magnetic: ({ children }: { children: React.ReactNode }) => <div>{children}</div>
+}))
+
+describe('Navigation Component', () => {
+  const mockProps = {
+    darkMode: false,
+    setDarkMode: vi.fn(),
+    mobileMenuOpen: false,
+    setMobileMenuOpen: vi.fn()
+  }
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+  })
+
+  it('renders navigation with logo and brand name', () => {
+    render(<Navigation {...mockProps} />)
+    
+    expect(screen.getByTestId('logo-mark')).toBeInTheDocument()
+    expect(screen.getByText('Miracles in Motion')).toBeInTheDocument()
+    expect(screen.getByText('Essentials for every student')).toBeInTheDocument()
+  })
+
+  it('renders desktop navigation links', () => {
+    render(<Navigation {...mockProps} />)
+    
+    expect(screen.getByLabelText('Read success stories')).toBeInTheDocument()
+    expect(screen.getByLabelText('View testimonies')).toBeInTheDocument()
+    expect(screen.getByLabelText('Volunteer opportunities')).toBeInTheDocument()
+    expect(screen.getByLabelText('Corporate partnerships')).toBeInTheDocument()
+    expect(screen.getByLabelText('Request assistance')).toBeInTheDocument()
+    expect(screen.getByLabelText('Portal login')).toBeInTheDocument()
+  })
+
+  it('toggles dark mode when button is clicked', () => {
+    render(<Navigation {...mockProps} />)
+    
+    const darkModeButtons = screen.getAllByLabelText('Switch to dark mode')
+    fireEvent.click(darkModeButtons[0])
+    
+    expect(mockProps.setDarkMode).toHaveBeenCalledWith(true)
+  })
+
+  it('toggles mobile menu when hamburger button is clicked', () => {
+    render(<Navigation {...mockProps} />)
+    
+    const mobileMenuButton = screen.getByLabelText('Open navigation menu')
+    fireEvent.click(mobileMenuButton)
+    
+    expect(mockProps.setMobileMenuOpen).toHaveBeenCalledWith(true)
+  })
+
+  it('displays mobile menu when mobileMenuOpen is true', () => {
+    render(<Navigation {...mockProps} mobileMenuOpen={true} />)
+    
+    const storiesLinks = screen.getAllByText('Stories')
+    expect(storiesLinks).toHaveLength(2) // One in desktop nav, one in mobile nav
+    expect(screen.getByText('Testimonies')).toBeInTheDocument()
+    expect(screen.getByText('Volunteers')).toBeInTheDocument()
+  })
+
+  it('handles keyboard navigation correctly', () => {
+    render(<Navigation {...mockProps} />)
+    
+    const darkModeButton = screen.getAllByLabelText('Switch to dark mode')[0]
+    fireEvent.keyDown(darkModeButton, { key: 'Enter', code: 'Enter' })
+    
+    expect(mockProps.setDarkMode).toHaveBeenCalledWith(true)
+  })
+
+  it('displays correct icon based on dark mode state', () => {
+    const { rerender } = render(<Navigation {...mockProps} darkMode={false} />)
+    expect(screen.getAllByLabelText('Switch to dark mode')).toHaveLength(2)
+    
+    rerender(<Navigation {...mockProps} darkMode={true} />)
+    expect(screen.getAllByLabelText('Switch to light mode')).toHaveLength(2)
+  })
 })