(function () {
    var selectedAgency = null;
    var agencies = [];
    var messages = [];
    var processingMessages = {};
    var isSearching = false;
    var isApplying = false;

    function $(id) {
        return document.getElementById(id);
    }

    function t(key, fallback) {
        return window.HyAppI18n && window.HyAppI18n.t
            ? window.HyAppI18n.t(key, fallback)
            : fallback || key;
    }

    function setStatus(key, kind) {
        var node = $('joinAgencyStatus');
        if (!node) return;
        if (!key) {
            node.hidden = true;
            node.textContent = '';
            node.className = 'join-agency-status';
            return;
        }
        node.hidden = false;
        node.className = 'join-agency-status' + (kind ? ' is-' + kind : '');
        node.textContent = t(key);
    }

    function setStatusMessage(message, kind) {
        var node = $('joinAgencyStatus');
        if (!node) return;
        if (!message) {
            setStatus('');
            return;
        }
        node.hidden = false;
        node.className = 'join-agency-status' + (kind ? ' is-' + kind : '');
        node.textContent = message;
    }

    function setSearching(searching) {
        isSearching = searching;
        var input = $('agencySearchInput');
        var button = $('agencySearchButton');
        if (input) input.disabled = searching;
        if (button) {
            button.disabled = searching;
            button.textContent = searching
                ? t('host_center.searching', 'Searching...')
                : t('host_center.search', 'Search');
        }
    }

    function setConfirmApplying(applying) {
        isApplying = applying;
        var submit = $('joinConfirmSubmitButton');
        var cancel = $('joinConfirmCancelButton');
        var backdrop = $('joinConfirmBackdrop');
        if (submit) {
            submit.disabled = applying || !selectedAgency;
            submit.textContent = applying
                ? t('host_center.applying', 'Submitting...')
                : t('host_center.join', 'Join');
        }
        if (cancel) cancel.disabled = applying;
        if (backdrop) backdrop.disabled = applying;
        document
            .querySelectorAll('.agency-list-join')
            .forEach(function (button) {
                button.disabled = applying;
            });
    }

    function agencyID(agency) {
        return String((agency && (agency.agency_id || agency.agencyId)) || '');
    }

    function agencyName(agency) {
        return String((agency && agency.name) || '');
    }

    function agencyAvatar(agency) {
        return String(
            (agency &&
                (agency.avatar || agency.owner_avatar || agency.ownerAvatar)) ||
                ''
        );
    }

    function agencyHostCount(agency) {
        var value =
            agency &&
            (agency.host_count ||
                agency.hostCount ||
                agency.active_host_count ||
                agency.activeHostCount);
        var count = Number(value || 0);
        return Number.isFinite(count) && count > 0 ? count : 0;
    }

    function profileAvatar(profile) {
        return String(
            (profile &&
                (profile.avatar ||
                    profile.user_avatar ||
                    profile.userAvatar ||
                    profile.avatar_url ||
                    profile.avatarUrl ||
                    profile.profile_avatar ||
                    profile.profileAvatar)) ||
                ''
        );
    }

    function profileInitial(name) {
        return String(name || '')
            .trim()
            .charAt(0)
            .toUpperCase();
    }

    function renderProfileAvatar(profile, name) {
        var avatar = $('profileAvatar');
        var fallback = $('profileAvatarFallback');
        if (!avatar || !fallback) return;
        fallback.textContent = profileInitial(name) || 'N';

        var src = profileAvatar(profile);
        if (!src) {
            avatar.hidden = true;
            avatar.removeAttribute('src');
            fallback.hidden = false;
            return;
        }

        avatar.onerror = function () {
            avatar.hidden = true;
            avatar.removeAttribute('src');
            fallback.hidden = false;
        };
        avatar.onload = function () {
            avatar.hidden = false;
            fallback.hidden = true;
        };
        fallback.hidden = true;
        avatar.hidden = false;
        avatar.src = src;
    }

    function hostCountText(count) {
        if (count === 1) return t('host_center.host_count_one', '1 host');
        return t('host_center.host_count_many', '{count} hosts').replace(
            '{count}',
            String(count)
        );
    }

    function appendFallbackAvatar(avatar, name) {
        var span = document.createElement('span');
        span.textContent = name.trim().charAt(0).toUpperCase() || 'A';
        avatar.appendChild(span);
    }

    function commandID(prefix, id) {
        return [
            prefix,
            id || '0',
            Date.now(),
            Math.random().toString(16).slice(2),
        ].join('-');
    }

    function firstValue(source, keys) {
        if (!source) return '';
        for (var i = 0; i < keys.length; i += 1) {
            var value = source[keys[i]];
            if (value !== undefined && value !== null && value !== '') {
                return value;
            }
        }
        return '';
    }

    function normalizeInvitationMessage(item) {
        var invitation = (item && item.invitation) || item || {};
        var inviter = (item && item.inviter) || {};
        var id = String(invitation.invitation_id || invitation.invitationId || '');
        var type = firstValue(invitation, [
            'invitation_type',
            'invitationType',
        ]);
        var agencyName = firstValue(invitation, [
            'agency_name',
            'agencyName',
        ]);
        var inviterName =
            firstValue(inviter, ['username', 'name', 'display_user_id']) ||
            firstValue(invitation, ['inviter_user_id', 'inviterUserId']) ||
            t('host_center.inviter', 'Inviter');
        var account =
            firstValue(inviter, ['display_user_id', 'displayUserID']) ||
            firstValue(inviter, ['user_id', 'userId']) ||
            firstValue(invitation, ['inviter_user_id', 'inviterUserId']);
        return {
            id: id,
            type: type,
            name: inviterName,
            account: account,
            avatar: firstValue(inviter, ['avatar']),
            agencyName: agencyName,
            title: invitationMessageTitle(type, inviterName, agencyName),
        };
    }

    function invitationMessageTitle(type, inviterName, agencyName) {
        if (type === 'host') {
            return t(
                'host_center.host_invitation',
                '{name} invited you to join {agency}'
            )
                .replace('{name}', inviterName)
                .replace('{agency}', agencyName || t('host_center.agency', 'Agency'));
        }
        if (type === 'agency') {
            return t(
                'host_center.agency_invitation',
                '{name} invited you to create agency {agency}'
            )
                .replace('{name}', inviterName)
                .replace('{agency}', agencyName || t('host_center.agency', 'Agency'));
        }
        if (type === 'bd') {
            return t(
                'host_center.bd_invitation',
                '{name} invited you to become BD'
            ).replace('{name}', inviterName);
        }
        return t(
            'host_center.role_invitation',
            '{name} sent you an invitation'
        ).replace('{name}', inviterName);
    }

    function renderUnread() {
        var dot = $('messageUnreadDot');
        if (dot) dot.hidden = messages.length <= 0;
    }

    function createMessageAvatar(message) {
        var avatar = document.createElement('div');
        avatar.className = 'message-avatar';
        if (!message.avatar) {
            avatar.textContent =
                String(message.name || 'M').trim().charAt(0).toUpperCase() ||
                'M';
            return avatar;
        }
        var img = document.createElement('img');
        img.src = message.avatar;
        img.alt = '';
        img.addEventListener('error', function () {
            avatar.textContent =
                String(message.name || 'M').trim().charAt(0).toUpperCase() ||
                'M';
        });
        avatar.appendChild(img);
        return avatar;
    }

    function renderMessages() {
        var list = $('messageList');
        var empty = $('messageEmpty');
        if (!list || !empty) return;
        list.textContent = '';
        empty.hidden = messages.length > 0;
        empty.textContent = t('host_center.no_messages', 'No messages');
        messages.forEach(function (message) {
            var card = document.createElement('article');
            var user = document.createElement('div');
            var copy = document.createElement('div');
            var title = document.createElement('div');
            var meta = document.createElement('div');
            var actions = document.createElement('div');
            var agree = document.createElement('button');
            var refuse = document.createElement('button');
            card.className = 'message-card';
            user.className = 'message-user';
            copy.className = 'message-copy';
            title.className = 'message-name';
            meta.className = 'message-id';
            actions.className = 'message-actions';
            agree.className = 'message-action agree';
            refuse.className = 'message-action refuse';
            agree.type = 'button';
            refuse.type = 'button';
            agree.disabled = Boolean(processingMessages[message.id]);
            refuse.disabled = Boolean(processingMessages[message.id]);
            title.textContent = message.title;
            meta.textContent = message.account ? 'ID: ' + message.account : '';
            agree.textContent = t('host_center.agree', 'Agree');
            refuse.textContent = t('host_center.refuse', 'Refuse');
            agree.addEventListener('click', function () {
                processInvitationMessage(message, 'accept');
            });
            refuse.addEventListener('click', function () {
                processInvitationMessage(message, 'reject');
            });
            user.appendChild(createMessageAvatar(message));
            copy.appendChild(title);
            copy.appendChild(meta);
            user.appendChild(copy);
            actions.appendChild(agree);
            actions.appendChild(refuse);
            card.appendChild(user);
            card.appendChild(actions);
            list.appendChild(card);
        });
        renderUnread();
    }

    function loadRoleInvitations() {
        if (
            !window.HyAppAPI ||
            !window.HyAppAPI.roleInvitations ||
            !window.HyAppAPI.roleInvitations.list
        ) {
            return Promise.resolve(false);
        }
        return window.HyAppAPI.roleInvitations
            .list('pending', 50)
            .then(function (payload) {
                var items = (payload && (payload.items || payload.invitations)) || [];
                messages = items.map(normalizeInvitationMessage).filter(function (item) {
                    return !!item.id;
                });
                renderMessages();
                return true;
            })
            .catch(function () {
                messages = [];
                renderMessages();
                return false;
            });
    }

    function processInvitationMessage(message, action) {
        if (
            !message ||
            !message.id ||
            !window.HyAppAPI ||
            !window.HyAppAPI.roleInvitations ||
            !window.HyAppAPI.roleInvitations.process
        ) {
            return;
        }
        processingMessages[message.id] = true;
        renderMessages();
        window.HyAppAPI.roleInvitations
            .process(message.id, {
                command_id: commandID('role-invite-' + action, message.id),
                action: action,
                reason: 'h5_message_center',
            })
            .then(function () {
                messages = messages.filter(function (item) {
                    return item.id !== message.id;
                });
                renderMessages();
                setStatus(
                    action === 'accept'
                        ? 'host_center.invitation_accepted'
                        : 'host_center.invitation_rejected',
                    'success'
                );
            })
            .catch(function (error) {
                setStatusMessage(
                    (error && error.message) ||
                        t(
                            'host_center.process_failed',
                            'Process failed. Try again later.'
                        ),
                    'error'
                );
            })
            .finally(function () {
                delete processingMessages[message.id];
                renderMessages();
            });
    }

    function openMessages() {
        var modal = $('messageModal');
        if (!modal) return;
        renderMessages();
        modal.hidden = false;
        modal.setAttribute('aria-hidden', 'false');
        document.body.classList.add('daily-modal-open');
    }

    function closeMessages() {
        var modal = $('messageModal');
        if (!modal) return;
        modal.hidden = true;
        modal.setAttribute('aria-hidden', 'true');
        document.body.classList.remove('daily-modal-open');
    }

    function createAgencyAvatar(agency) {
        var avatar = document.createElement('div');
        var name = agencyName(agency) || t('host_center.agency', 'Agency');
        avatar.className = 'agency-list-avatar';
        if (!agencyAvatar(agency)) {
            appendFallbackAvatar(avatar, name);
            return avatar;
        }
        var img = document.createElement('img');
        img.src = agencyAvatar(agency);
        img.alt = '';
        img.addEventListener('error', function () {
            avatar.textContent = '';
            appendFallbackAvatar(avatar, name);
        });
        avatar.appendChild(img);
        return avatar;
    }

    function createAgencyRow(agency) {
        var row = document.createElement('div');
        var name = agencyName(agency) || t('host_center.agency', 'Agency');
        row.className = 'agency-list-item';

        var copy = document.createElement('div');
        copy.className = 'agency-list-copy';

        var title = document.createElement('div');
        title.className = 'agency-list-name';
        title.textContent = name;

        var meta = document.createElement('div');
        meta.className = 'agency-list-meta';
        meta.textContent = hostCountText(agencyHostCount(agency));

        var join = document.createElement('button');
        join.className = 'agency-list-join';
        join.type = 'button';
        join.textContent = t('host_center.join', 'Join');
        join.disabled = isApplying;
        join.addEventListener('click', function () {
            openJoinConfirm(agency);
        });

        copy.appendChild(title);
        copy.appendChild(meta);
        row.appendChild(createAgencyAvatar(agency));
        row.appendChild(copy);
        row.appendChild(join);
        return row;
    }

    function renderAgencyList(items) {
        var list = $('agencyList');
        if (!list) return;
        list.textContent = '';
        agencies = items || [];
        if (!agencies.length) {
            var empty = document.createElement('div');
            empty.className = 'agency-list-empty';
            empty.id = 'agencyListEmpty';
            empty.textContent = t(
                'host_center.no_agency',
                'No agency found in your country.'
            );
            list.appendChild(empty);
            return;
        }
        agencies.forEach(function (agency) {
            list.appendChild(createAgencyRow(agency));
        });
    }

    function updateConfirmMessage() {
        var message = $('joinConfirmMessage');
        if (!message) return;
        var name =
            agencyName(selectedAgency) || t('host_center.agency', 'Agency');
        message.textContent = t(
            'host_center.join_confirm_message',
            'Are you sure you want to join {agency}?'
        ).replace('{agency}', name);
    }

    function openJoinConfirm(agency) {
        selectedAgency = agency || null;
        var modal = $('joinConfirmModal');
        if (!modal || !selectedAgency) return;
        updateConfirmMessage();
        modal.hidden = false;
        modal.setAttribute('aria-hidden', 'false');
        document.body.classList.add('daily-modal-open');
        setConfirmApplying(false);
    }

    function closeJoinConfirm(force) {
        if (isApplying && !force) return;
        var modal = $('joinConfirmModal');
        if (!modal) return;
        modal.hidden = true;
        modal.setAttribute('aria-hidden', 'true');
        document.body.classList.remove('daily-modal-open');
        selectedAgency = null;
        setConfirmApplying(false);
    }

    function searchAgency(event) {
        if (event) event.preventDefault();
        if (!window.HyAppAPI || !window.HyAppAPI.host) return;
        var input = $('agencySearchInput');
        var shortID = input ? input.value.trim() : '';
        setStatus('host_center.loading_agencies');
        setSearching(true);
        window.HyAppAPI.host
            .searchAgencies(shortID, 100)
            .then(function (data) {
                var items = (data && (data.items || data.agencies)) || [];
                setStatus('');
                renderAgencyList(items);
            })
            .catch(function () {
                renderAgencyList([]);
                setStatus('host_center.search_failed', 'error');
            })
            .finally(function () {
                setSearching(false);
            });
    }

    function applyAgency() {
        if (!selectedAgency || !window.HyAppAPI || !window.HyAppAPI.host)
            return;
        setStatus('host_center.applying');
        setConfirmApplying(true);
        window.HyAppAPI.host
            .applyToAgency({
                agency_id: agencyID(selectedAgency),
                command_id:
                    'host_apply_' +
                    Date.now() +
                    '_' +
                    Math.random().toString(16).slice(2),
            })
            .then(function () {
                closeJoinConfirm(true);
                setStatus('host_center.apply_success', 'success');
            })
            .catch(function (error) {
                if (error && error.status === 409) {
                    setStatus('');
                    return;
                }
                setStatusMessage(
                    (error && error.message) ||
                        t(
                            'host_center.apply_failed',
                            'Application failed. Try again later.'
                        ),
                    'error'
                );
            })
            .finally(function () {
                setConfirmApplying(false);
            });
    }

    function renderUser(current) {
        var user = current && current.user;
        var profile = user && (user.profile || user.user || user);
        if (!profile) return;
        var name = profile.username || profile.name || profile.nickname || '';
        var uid =
            profile.display_user_id ||
            profile.displayUserId ||
            profile.user_id ||
            profile.userId ||
            '';
        if (name && $('profileName')) {
            $('profileName').removeAttribute('data-i18n');
            $('profileName').textContent = name;
        }
        if (uid && $('profileUID')) {
            $('profileUID').removeAttribute('data-i18n');
            $('profileUID').textContent = 'UID: ' + uid;
        }
        renderProfileAvatar(profile, name);
    }

    function init() {
        if (window.HyAppParams) {
            window.HyAppParams.parse();
            window.HyAppParams.loadUser()
                .then(renderUser)
                .catch(function () {});
        }
        var form = $('joinAgencyForm');
        if (form) form.addEventListener('submit', searchAgency);
        var submit = $('joinConfirmSubmitButton');
        if (submit) submit.addEventListener('click', applyAgency);
        var cancel = $('joinConfirmCancelButton');
        if (cancel) cancel.addEventListener('click', closeJoinConfirm);
        var backdrop = $('joinConfirmBackdrop');
        if (backdrop) backdrop.addEventListener('click', closeJoinConfirm);
        var messageButton = $('messageButton');
        if (messageButton) messageButton.addEventListener('click', openMessages);
        var messageClose = $('messageCloseButton');
        if (messageClose) messageClose.addEventListener('click', closeMessages);
        var messageBackdrop = $('messageBackdrop');
        if (messageBackdrop)
            messageBackdrop.addEventListener('click', closeMessages);
        var backButton = $('backButton');
        if (backButton) {
            backButton.addEventListener('click', function () {
                if (window.HyAppBridge) window.HyAppBridge.back();
            });
        }
        searchAgency();
        loadRoleInvitations();
    }

    window.addEventListener('hyapp:i18n-ready', function () {
        var searching = isSearching;
        setSearching(searching);
        if (!searching) renderAgencyList(agencies);
        renderMessages();
        if (selectedAgency) updateConfirmMessage();
        setConfirmApplying(isApplying);
    });

    document.addEventListener('DOMContentLoaded', init);
})();
