import type { EventComponentProps } from 'stream-chat-react'
import { describe, expect, it } from 'vitest'

import type { DmAgentSystemType } from '../../stream-custom-data'
import { renderWithProviders, screen } from '../../test/utils'

import { CustomSystemMessage } from '.'

const createProps = (
  messageOverrides: Partial<EventComponentProps['message']> = {}
): EventComponentProps =>
  ({
    message: {
      id: 'system-message-1',
      type: 'system',
      text: 'System message',
      created_at: new Date('2025-01-01T00:00:00.000Z'),
      ...messageOverrides,
    },
  }) as EventComponentProps

describe('CustomSystemMessage', () => {
  it.each([
    'SYSTEM_ESCALATION',
    'SYSTEM_DM_AGENT_PAUSED',
    'SYSTEM_DM_AGENT_RESUMED',
  ] as const)('hides the timestamp for %s', (customType) => {
    const { container } = renderWithProviders(
      <CustomSystemMessage
        {...createProps({
          metadata: { custom_type: customType },
        })}
      />
    )

    expect(container.querySelector('time')).not.toBeInTheDocument()
  })

  it('shows the timestamp for age safety system messages', () => {
    const { container } = renderWithProviders(
      <CustomSystemMessage
        {...createProps({
          metadata: { custom_type: 'SYSTEM_AGE_SAFETY_BLOCKED' },
        })}
      />
    )

    expect(container.querySelector('time')).toBeInTheDocument()
  })

  it.each([
    { metadata: {}, text: 'Unknown system message' },
    { text: 'Absent system type' },
  ])('hides the timestamp for unknown or absent system types', (overrides) => {
    const { container } = renderWithProviders(
      <CustomSystemMessage {...createProps(overrides)} />
    )

    expect(container.querySelector('time')).not.toBeInTheDocument()
  })

  it('hides the timestamp for legacy dm-agent messages without a custom_type', () => {
    const { container } = renderWithProviders(
      <CustomSystemMessage
        {...createProps({
          dm_agent_system_type: 'SYSTEM_DM_AGENT_PAUSED',
        })}
      />
    )

    expect(container.querySelector('time')).not.toBeInTheDocument()
  })

  it('detects DM Agent system subtype from metadata.custom_type', () => {
    renderWithProviders(
      <CustomSystemMessage
        {...createProps({
          text: 'DM Agent paused',
          metadata: {
            custom_type: 'SYSTEM_DM_AGENT_PAUSED',
          },
          dm_agent_system_type: 'SYSTEM_DM_AGENT_RESUMED',
        })}
      />
    )

    const dmAgentSystemMessage = screen.getByTestId('dm-agent-system-message')
    expect(dmAgentSystemMessage).toHaveAttribute(
      'data-dm-agent-system-type',
      'SYSTEM_DM_AGENT_PAUSED'
    )
    expect(dmAgentSystemMessage).toHaveTextContent('DM Agent paused')
  })

  it('falls back to message.dm_agent_system_type when metadata subtype is absent', () => {
    renderWithProviders(
      <CustomSystemMessage
        {...createProps({
          text: 'DM Agent resumed',
          metadata: {},
          dm_agent_system_type: 'SYSTEM_DM_AGENT_RESUMED',
        })}
      />
    )

    const dmAgentSystemMessage = screen.getByTestId('dm-agent-system-message')
    expect(dmAgentSystemMessage).toHaveAttribute(
      'data-dm-agent-system-type',
      'SYSTEM_DM_AGENT_RESUMED'
    )
    expect(dmAgentSystemMessage).toHaveTextContent('DM Agent resumed')
  })

  it('renders the age safety blocked subtype with fallback copy and warning treatment', () => {
    const { container } = renderWithProviders(
      <CustomSystemMessage
        {...createProps({
          text: '   ',
          metadata: {
            custom_type: 'SYSTEM_AGE_SAFETY_BLOCKED',
          },
        })}
      />
    )

    const ageSafetySystemMessage = screen.getByTestId(
      'age-safety-system-message'
    )
    expect(ageSafetySystemMessage).toHaveAttribute(
      'data-age-safety-system-type',
      'SYSTEM_AGE_SAFETY_BLOCKED'
    )
    expect(ageSafetySystemMessage).toHaveTextContent(
      'This user isn’t able to reply because they don’t meet our age safety guidelines.'
    )
    const emphasisLink = screen.getByRole('link', {
      name: 'age safety guidelines.',
    })
    expect(emphasisLink).toHaveClass('mes-age-safety-system-message__emphasis')
    expect(emphasisLink).toHaveAttribute(
      'href',
      'https://linktr.ee/s/about/contact'
    )
    expect(emphasisLink).toHaveAttribute('target', '_blank')
    expect(emphasisLink).toHaveAttribute('rel', 'noopener noreferrer')
    expect(
      screen.getByTestId('age-safety-system-message-icon')
    ).toBeInTheDocument()
    expect(
      container.querySelector('.mes-age-safety-system-message__icon')
    ).toBeInTheDocument()
    expect(
      container.querySelector(
        '[data-testid="age-safety-system-message-icon"] path[opacity="0.2"]'
      )
    ).toBeInTheDocument()
  })

  it('falls back to legacy generic rendering when subtype is absent or unknown', () => {
    const { container } = renderWithProviders(
      <CustomSystemMessage
        {...createProps({
          text: 'Legacy system message',
          dm_agent_system_type:
            'SYSTEM_DM_AGENT_UNKNOWN' as unknown as DmAgentSystemType,
        })}
      />
    )

    expect(
      screen.queryByTestId('dm-agent-system-message')
    ).not.toBeInTheDocument()
    expect(screen.getByText('Legacy system message')).toBeInTheDocument()
    expect(
      container.querySelector('.str-chat__message--system__line')
    ).toBeInTheDocument()
  })
})