import { fireEvent, render, screen } from '@testing-library/react'
import { describe, expect, it, vi } from 'vitest'
import Sidebar from './Sidebar'

describe('Sidebar', () => {
  it('메뉴를 순서대로 보여준다', () => {
    render(<Sidebar />)

    const labels = [
      'Dashboard',
      '기관관리',
      '채널생성',
      '사업관리',
      '권리확인',
      '권리처리',
      '자료실',
      'Mattermost',
      '시스템관리',
    ]
    const items = screen.getAllByRole('listitem').map((li) => li.textContent)
    expect(items).toEqual(labels)
  })

  it('activeKey에 해당하는 메뉴가 현재 페이지로 표시된다', () => {
    render(<Sidebar activeKey="channels" />)

    expect(screen.getByRole('link', { name: '채널생성' }))
      .toHaveAttribute('aria-current', 'page')
    expect(screen.getByRole('link', { name: '기관관리' }))
      .not.toHaveAttribute('aria-current')
  })

  it('활성 메뉴를 누르면 onSelect가 호출된다', () => {
    const onSelect = vi.fn()
    render(<Sidebar activeKey="orgs" onSelect={onSelect} />)

    fireEvent.click(screen.getByRole('link', { name: '채널생성' }))

    expect(onSelect).toHaveBeenCalledWith('channels')
  })

  it('미구현 메뉴는 비활성으로 표시되고 링크가 아니다', () => {
    render(<Sidebar />)

    const dashboard = screen.getByText('Dashboard')
    expect(dashboard).toHaveAttribute('aria-disabled', 'true')
    expect(dashboard).toHaveAttribute('title', '준비 중')
    expect(screen.queryByRole('link', { name: 'Dashboard' })).toBeNull()
  })

  it('브랜드 영역을 보여준다', () => {
    render(<Sidebar />)

    expect(screen.getByText('ITN-HUB')).toBeTruthy()
    expect(screen.getByText('사업관리시스템')).toBeTruthy()
  })

  it('접힌 상태에서는 라벨이 사라지고 툴팁으로 남는다', () => {
    render(<Sidebar collapsed onToggle={() => {}} />)

    expect(screen.queryByText('기관관리')).toBeNull()
    expect(screen.queryByText('ITN-HUB')).toBeNull()
    expect(screen.getByText('IH')).toBeTruthy()

    expect(screen.getByRole('link', { name: '기관관리' })).toHaveAttribute('title', '기관관리')
    expect(screen.getByTitle('Dashboard (준비 중)')).toBeTruthy()
  })

  it('접기 버튼을 누르면 onToggle이 호출된다', () => {
    const onToggle = vi.fn()
    render(<Sidebar onToggle={onToggle} />)

    fireEvent.click(screen.getByRole('button', { name: '메뉴 접기' }))

    expect(onToggle).toHaveBeenCalled()
  })
})
