'use client'

import React from 'react'
import ParticipantsPopover from '../ParticipantsPopover'
import type { ParticipantSection, ViewerCardState, ParticipantItem, UserAdminInfo } from '../types'

interface ParticipantsPopoverViewerCardProps {
    mode: 'desktop' | 'mobile'
    panelRef: React.RefObject<HTMLDivElement>
    maxH: number | null
    shiftX: number
    t: (key: string) => string
    participantsClosing: boolean
    participantsEntering: boolean
    onClose: () => void
    sections: ParticipantSection[]
    onUserClick: (e: React.MouseEvent<HTMLButtonElement>, u: ParticipantItem) => void
    streamerId: string
    /** 保留供上層與型別相容；ViewerCard 已改由 Container.floatingOverlay 渲染 */
    viewerCard?: ViewerCardState | null
    viewerCardRef?: React.RefObject<HTMLDivElement>
    viewerCardDepth?: 'root' | 'gift' | 'admin'
    viewerCardBanStatus?: { userId: string; isBanned: boolean } | null
    userAdminInfo?: UserAdminInfo | null
    onCloseViewerCard?: () => void
    onBackToRoot?: () => void
    onGift?: (user: ParticipantItem) => void
    onBan?: (user: ParticipantItem) => void
    onUnban?: (user: ParticipantItem) => void
    onAddMod?: (user: ParticipantItem) => void
    onRemoveMod?: (user: ParticipantItem) => void
    isModerator?: boolean
    isStreamer?: boolean
    isSuperAdmin?: boolean
    currentUserId?: string | null
}

export default function ParticipantsPopoverViewerCard({
    panelRef,
    maxH,
    shiftX,
    t,
    participantsClosing,
    participantsEntering,
    onClose,
    sections,
    onUserClick,
    streamerId,
}: ParticipantsPopoverViewerCardProps) {
    return (
        <ParticipantsPopover
            panelRef={panelRef}
            maxH={maxH}
            shiftX={shiftX}
            t={t}
            participantsClosing={participantsClosing}
            participantsEntering={participantsEntering}
            onClose={onClose}
            sections={sections}
            onUserClick={onUserClick}
            streamerId={streamerId}
        />
    )
}