/**
 * Supera Glia - Tab Chat Equipe v2
 * @module ChatEquipeTab
 * 
 * Versão sem header redundante - mais espaço para o conteúdo
 */

(function() {
    'use strict';

    const CHAT_EQUIPE_URL = 'https://equipe.supera.myddns.me';

    const ChatEquipeTab = () => {
        const { useState } = SuperaGlia.hooks;
        const { Icon } = SuperaGlia;
        const [loading, setLoading] = useState(true);
        const [iframeError, setIframeError] = useState(false);

        // Layout altura total
        return React.createElement('div', { style: { height: 'calc(100vh - 32px)' } },
            React.createElement('div', { 
                className: 'bg-white rounded-xl border border-gray-200 overflow-hidden h-full flex flex-col'
            },
                // Header do card
                React.createElement('div', { 
                    className: 'flex items-center justify-between p-4 border-b border-gray-100'
                },
                    React.createElement('div', { className: 'flex items-center gap-3' },
                        React.createElement('div', { 
                            className: 'w-10 h-10 bg-green-500 rounded-xl flex items-center justify-center'
                        },
                            React.createElement(Icon, { name: 'users', className: 'w-5 h-5 text-white' })
                        ),
                        React.createElement('div', null,
                            React.createElement('h3', { className: 'font-semibold text-gray-900' }, 'Chat da Equipe'),
                            React.createElement('p', { className: 'text-sm text-gray-500' }, 'XMPP - Mensagens Instantâneas')
                        )
                    ),
                    React.createElement('button', {
                        onClick: () => window.open(CHAT_EQUIPE_URL, '_blank'),
                        className: 'flex items-center gap-2 px-4 py-2 bg-green-500 hover:bg-green-600 text-white rounded-lg transition-colors text-sm font-medium'
                    },
                        'Abrir em nova aba'
                    )
                ),
                // Status do usuário (se existir)
                React.createElement('div', { 
                    className: 'flex items-center gap-2 px-4 py-2 bg-green-50 border-b border-green-100'
                },
                    React.createElement('span', { className: 'w-2 h-2 bg-green-500 rounded-full' }),
                    React.createElement('span', { className: 'text-sm text-green-700' }, 'Online')
                ),
                // Iframe
                React.createElement('div', { className: 'flex-1 relative' },
                    loading && React.createElement('div', { 
                        className: 'absolute inset-0 flex items-center justify-center bg-gray-50 z-10'
                    },
                        React.createElement('div', { className: 'text-center' },
                            React.createElement('div', { 
                                className: 'w-10 h-10 border-4 border-green-200 border-t-green-500 rounded-full animate-spin mx-auto mb-4'
                            }),
                            React.createElement('p', { className: 'text-gray-500' }, 'Carregando Chat da Equipe...')
                        )
                    ),
                    iframeError ?
                        React.createElement('div', { 
                            className: 'absolute inset-0 flex items-center justify-center bg-gray-50'
                        },
                            React.createElement('div', { className: 'text-center' },
                                React.createElement(Icon, { name: 'alert-circle', className: 'w-16 h-16 text-gray-300 mx-auto mb-4' }),
                                React.createElement('p', { className: 'text-gray-500 mb-4' }, 'Não foi possível carregar o Chat'),
                                React.createElement('button', {
                                    onClick: () => window.open(CHAT_EQUIPE_URL, '_blank'),
                                    className: 'px-4 py-2 bg-green-500 text-white rounded-lg hover:bg-green-600 transition-colors'
                                }, 'Abrir em nova aba')
                            )
                        ) :
                        React.createElement('iframe', {
                            src: CHAT_EQUIPE_URL,
                            className: 'w-full h-full border-0',
                            onLoad: () => setLoading(false),
                            onError: () => { setIframeError(true); setLoading(false); },
                            allow: 'microphone; camera; clipboard-read; clipboard-write',
                            sandbox: 'allow-same-origin allow-scripts allow-forms allow-popups allow-modals'
                        })
                )
            )
        );
    };

    // Registrar componente
    SuperaGlia.initChatEquipeTab = function() {
        SuperaGlia.ChatEquipeTab = ChatEquipeTab;
    };
})();