import { describe, it, expect, beforeEach, vi } from 'vitest'
import { setActivePinia, createPinia } from 'pinia'
import { mount } from '@vue/test-utils'
import { useAuthStore } from '@/stores/auth.js'
import SettingsView from '@/components/settings/SettingsView.vue'

// Stub every panel — the view only orchestrates tabs and mounts one at a time.
vi.mock('@/components/settings/ApiKeysPanel.vue', () => ({
  default: { name: 'ApiKeysPanel', template: '<div data-test="account-stub" />' },
}))
vi.mock('@/components/settings/NotificationSettingsPanel.vue', () => ({
  default: { name: 'NotificationSettingsPanel', template: '<div data-test="notifications-stub" />' },
}))
vi.mock('@/components/settings/SynapseReactionsPanel.vue', () => ({
  default: { name: 'SynapseReactionsPanel', template: '<div data-test="reactions-stub" />' },
}))
vi.mock('@/components/settings/SynapseTargetsPanel.vue', () => ({
  default: { name: 'SynapseTargetsPanel', template: '<div data-test="targets-stub" />' },
}))
vi.mock('@/components/settings/McpKeysPanel.vue', () => ({
  default: { name: 'McpKeysPanel', template: '<div data-test="mcp-stub" />' },
}))
vi.mock('@/components/settings/AdminToolsPanel.vue', () => ({
  default: { name: 'AdminToolsPanel', template: '<div data-test="admin-tools-stub" />' },
}))

function panel(wrapper, test) {
  return wrapper.find(`[data-test="${test}"]`)
}

describe('SettingsView sections', () => {
  beforeEach(() => {
    setActivePinia(createPinia())
  })
  it('opens Account by default with API keys mounted', () => {
    const wrapper = mount(SettingsView)
    const tabs = wrapper.findAll('[role="tab"]')
    expect(tabs).toHaveLength(4)
    expect(tabs.map(t => t.text())).toEqual(['Account', 'Notifications', 'Synapse', 'MCP'])
    expect(tabs[0].classes()).toContain('tab-active')
    expect(panel(wrapper, 'account-stub').exists()).toBe(true)
    expect(panel(wrapper, 'reactions-stub').exists()).toBe(false)
  })

  it('shows both Synapse panels together on the Synapse tab', async () => {
    const wrapper = mount(SettingsView)
    const synapseTab = wrapper.findAll('[role="tab"]')[2]
    await synapseTab.trigger('click')

    expect(synapseTab.classes()).toContain('tab-active')
    expect(panel(wrapper, 'account-stub').exists()).toBe(false)
    expect(panel(wrapper, 'reactions-stub').exists()).toBe(true)
    expect(panel(wrapper, 'targets-stub').exists()).toBe(true)
  })

  it('mounts MCP keys only on the MCP tab', async () => {
    const wrapper = mount(SettingsView)
    const mcpTab = wrapper.findAll('[role="tab"]')[3]
    await mcpTab.trigger('click')

    expect(panel(wrapper, 'mcp-stub').exists()).toBe(true)
    expect(panel(wrapper, 'account-stub').exists()).toBe(false)
  })

  it('hides the tool reload from a non-admin', async () => {
    useAuthStore().user = { id: 'u1', role: 'user' }
    const wrapper = mount(SettingsView)
    await wrapper.findAll('[role="tab"]')[3].trigger('click')

    expect(panel(wrapper, 'mcp-stub').exists()).toBe(true)
    expect(panel(wrapper, 'admin-tools-stub').exists()).toBe(false)
  })

  it('shows the tool reload to an admin, inside the MCP tab', async () => {
    useAuthStore().user = { id: 'u1', role: 'admin' }
    const wrapper = mount(SettingsView)

    // Not on the default tab...
    expect(panel(wrapper, 'admin-tools-stub').exists()).toBe(false)

    await wrapper.findAll('[role="tab"]')[3].trigger('click')
    expect(panel(wrapper, 'admin-tools-stub').exists()).toBe(true)
    expect(panel(wrapper, 'mcp-stub').exists()).toBe(true)
  })
})