[
    {
        "id": 8490,
        "label": "Nome do app",
        "name": "APP_NAME",
        "value": "INFINITY TUNNEL",
        "type": "STRING",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8491,
        "label": "Logo do app",
        "name": "APP_LOGO",
        "value": "https://infinitycloud.site/PNG/Logo2.png",
        "type": "IMAGE",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8492,
        "label": "Imagem de fundo",
        "name": "APP_BACKGROUND_IMAGE",
        "value": "https://i.ibb.co/gt6TJjK/DTseb2igah.jpg",
        "type": "IMAGE",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8493,
        "label": "Tipo do fundo do app",
        "name": "APP_BACKGROUND_TYPE",
        "value": {
            "options": [
                {
                    "label": "Imagem",
                    "value": "IMAGE"
                },
                {
                    "label": "Cor",
                    "value": "COLOR"
                }
            ],
            "selected": "IMAGE"
        },
        "type": "SELECT",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8494,
        "label": "Cor de fundo",
        "name": "APP_BACKGROUND_COLOR",
        "value": "#080e16c7",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8495,
        "label": "Cor do card inicial",
        "name": "APP_CARD_COLOR",
        "value": "#1d242e73",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8496,
        "label": "Raio do card inicial",
        "name": "APP_CARD_RADIUS",
        "value": 20,
        "type": "INTEGER",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8497,
        "label": "Cor do card de status",
        "name": "APP_CARD_STATUS_COLOR",
        "value": "#1d242e73",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8498,
        "label": "Raio do card de status",
        "name": "APP_CARD_STATUS_RADIUS",
        "value": 25,
        "type": "INTEGER",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8499,
        "label": "Cor do card de configurações",
        "name": "APP_CARD_CONFIG_COLOR",
        "value": "#0E171EC9",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8500,
        "label": "Cor do fundo dos dialogs",
        "name": "APP_DIALOG_BACKGROUND_COLOR",
        "value": "#050C5AE4",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 13546,
        "label": "Cor do fundo do dialog de log",
        "name": "APP_DIALOG_LOGGER_COLOR",
        "value": "#080e16c7",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8501,
        "label": "Cor das bordas",
        "name": "APP_BORDER_COLOR",
        "value": "#1d242e73",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8502,
        "label": "Cor dos inputs",
        "name": "APP_INPUT_COLOR",
        "value": "#1d242e73",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8503,
        "label": "Raio dos inputs",
        "name": "APP_INPUT_RADIUS",
        "value": 25,
        "type": "INTEGER",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8504,
        "label": "Cor dos textos",
        "name": "APP_TEXT_COLOR",
        "value": "#FFFFFFFF",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8505,
        "label": "Cor dos botões",
        "name": "APP_BUTTON_COLOR",
        "value": "#1d242e73",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8506,
        "label": "Raio dos botões",
        "name": "APP_BUTTON_RADIUS",
        "value": 25,
        "type": "INTEGER",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8507,
        "label": "Cor dos icones",
        "name": "APP_ICON_COLOR",
        "value": "#FFFFFFFF",
        "type": "COLOR",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8508,
        "label": "Exibir modo de conexão",
        "name": "APP_SHOW_CONNECTION_MODE",
        "value": false,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 23434,
        "label": "Atualizar automaticamente as configurações ao lançar uma atualização.",
        "name": "APP_CONFIG_AUTO_UPDATE",
        "value": true,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8509,
        "label": "Iniciar o app automaticamente ao reiniciar o dispositivo",
        "name": "APP_AUTO_START",
        "value": false,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8510,
        "label": "Usar limiter de conexão",
        "name": "APP_CONNECTION_LIMITER",
        "value": false,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 13547,
        "label": "Usar botão de atualizações",
        "name": "APP_BTN_UPDATE_ENABLED",
        "value": true,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 13548,
        "label": "Usar botão de registros",
        "name": "APP_BTN_LOGGER_ENABLED",
        "value": true,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 13549,
        "label": "Usar botão de pagina webview",
        "name": "APP_BTN_PAGE_ENABLED",
        "value": false,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 13553,
        "label": "Ativar dialog de erros",
        "name": "APP_DIALOG_ERROR_ENABLED",
        "value": true,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 13554,
        "label": "Ativar dialog de checkuser",
        "name": "APP_CHECKUSER_DIALOG_ENABLED",
        "value": false,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 14935,
        "label": "Ativar toast de sucesso",
        "name": "APP_SUCCESS_TOAST_ENABLED",
        "value": true,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 14936,
        "label": "Ativar toast de erro",
        "name": "APP_ERROR_TOAST_ENABLED",
        "value": true,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 14937,
        "label": "Usar layout webview",
        "name": "APP_LAYOUT_WEBVIEW_ENABLED",
        "value": true,
        "type": "BOOLEAN",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8511,
        "label": "Mensagem",
        "name": "APP_MESSAGE",
        "value": null,
        "type": "TEXT",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8512,
        "label": "URL de atualização do aplicativo",
        "name": "APP_UPDATE_URL",
        "value": null,
        "type": "URL",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8513,
        "label": "Tipo de mensagem",
        "name": "APP_MESSAGE_TYPE",
        "value": {
            "options": [
                {
                    "label": "Alerta",
                    "value": "ALERT"
                },
                {
                    "label": "Informação",
                    "value": "INFO"
                },
                {
                    "label": "Boas vindas",
                    "value": "WELCOME"
                },
                {
                    "label": "Sem mensagem",
                    "value": "NONE"
                }
            ],
            "selected": "NONE"
        },
        "type": "SELECT",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 14938,
        "label": "LAYOUT WEBVIEW (POR SUA CONTA E RISCO)",
        "name": "APP_LAYOUT_WEBVIEW",
        "value": "<!DOCTYPE html>\n<html lang=\"en\">\n\n<head>\n    <meta charset=\"UTF-8\">\n    <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css\">\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css\">\n    <title>INFINITY TUNNEL</title>\n    <style>\n        :root {\n            --bg-color: #B721FF;\n      /*cores de fundo, a primeira é a parte de cima a segundo a de baixo*/\n            --bg-image: linear-gradient(to bottom, #482d80, #855cd6);\n\n            --input-border-radius: 6px;\n                     /*cor dos botões*/\n            --input-background-color: #3105479f;\n                     /*sombra dos botões*/\n            --input-shadow-color: #3105479f;\n                   /*sombra do botão de conectar*/\n            --btn-bg-shadow-color: #3105479f;\n            --btn-bg-hover-shadow-color: #3105479f;\n            --btn-active-bg-color: #0093E9;\n\n            --modal-content-bg-shadow-color: #4a148ccc;\n            --modal-content-bg-color: #4a148ccc;\n\n            --config-bg-color: #0000003f;\n            --category-bg-color: #0000003f;\n       /*Cor do texto e icone da box de login*/\n            --text-color: #ffffff;\n            --icon-color: #ffffff;\n        }\n\n        * {\n            margin: ;\n            box-sizing: border-box;\n        }\n\n       \n\n        main {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            padding: 0.9rem;\n        }\n\n        .bg-input {\n            border-radius: var(--input-border-radius);\n            margin: 5px;\n            padding: 0.8rem 0.8rem;\n            color: var(--icon-color);\n            background: var(--input-background-color);\n            box-shadow: 0 1px 20px var(--input-shadow-color);\n        }\n\n        input {\n            width: 100%;\n            background: transparent;\n            border: none;\n            outline: none;\n            color: var(--text-color);\n        }\n\n        input::placeholder {\n            color: var(--text-color);\n        }\n\n        main>button {\n            margin-top: 14.5rem;\n            width: 100px;\n            height: 100px;\n            border-radius: 50%;\n            background: var(--input-background-color);\n            box-shadow: 0 1px 20px var(--btn-bg-shadow-color);\n            border: none;\n            outline: none;\n            cursor: pointer;\n            transition: all 0.3s ease-in-out;\n            -webkit-tap-highlight-color: transparent;\n        }\n\n        main>button:hover {\n            transform: scale(1.1);\n            background: var(--input-background-color);\n            box-shadow: 0px 0px var(--btn-bg-hover-shadow-color);\n        }\n\n        main>button:active {\n            transform: scale(0.9);\n            background: var(--btn-active-bg-color);\n            box-shadow: 0 0px 0px var(--btn-active-bg-color);\n        }\n\n        main>button>i {\n            font-size:50px;\n            color: var(--icon-color);\n        }\n\n        .modal {\n            backdrop-filter: blur5px);\n        }\n\n        .modal-content {\n            border: none;\n            background: var(--modal-content-bg-color);\n            box-shadow: 0 5px 10px var(--modal-content-bg-shadow-color);\n            color: var(--text-color);\n        }\n\n        .modal-dialog {\n            margin: 0 1rem;\n        }\n\n        .bg-category {\n            background: var(--category-bg-color);\n        }\n\n        .bg-config {\n            background: var(--config-bg-color);\n        }\n       \n       /*AQUI ESTÁ A ADAPTAÇÃO DA LOGO*/\n\n\t\tbody {\n   \t\t\tfont-family: Arial, sans-serif;\n   \t\t\twidth: 100%;\n   \t\t\theight: 100vh;\n   \t\t\tdisplay: flex;\n    \t\tflex-direction: column;\n    \t\tjustify-content: center;\n    \t\talign-items: center;\n    \t\tbackground-color: var(--bg-color);\n    \t\tbackground-image: var(--bg-image);\n\t\t}\n\n\t\theader {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 100px;\n    background-color: #f1f1f1;\n    position: relative;\n}\n\n.logo {\n    width: 200px;\n    height: 200px;\n    position: absolute;\n    top: 50%; /* Ajuste a posição vertical aqui */\n    transform: translateY(-60%); /* Centralizar verticalmente */\n}\n    </style>\n</head>\n\n<body>\n    <header>\n        <img src=\"https://infinitycloud.site/PNG/Logo2.png\" alt=\"Logo\" class=\"logo\">\n    </header>\n\n    <!-- Restante do conteúdo do seu aplicativo -->\n\n\n    <main>\n        <button id=\"vpn-start-stop\"><i class=\"bi bi-power\"></i></button>\n        <span class=\"text-uppercase py-3 fw-bold fs-4\" id=\"state\">DESCONECTADO</span>\n        <div class=\"position-absolute px-4\" style=\"bottom: 43%;\">\n            <div class=\"d-flex gap-2 justify-content-center align-items-center bg-input\">\n                <i class=\"bi bi-hdd-network\"></i>\n                <input type=\"text\" placeholder=\"CONFIG.\" disabled id=\"config\">\n                <i class=\"bi bi-arrow-bar-down\"></i>\n            </div>\n            <div class=\"d-flex gap-2\">\n                <div class=\"d-flex gap-2 justify-content-center align-items-center bg-input\">\n                    <i class=\"bi bi-person\"></i>\n                    <input type=\"text\" placeholder=\"Usuário\" id=\"username\">\n\t\t\t\t<i class=\"bi bi-arrow-bar-down\"></i>\n\t\t\t\t</div>\n         <!*Div que separa a BOX de login>\n            </div>\n\t\t\t<div class=\"d-flex gap-2\">\n                <div class=\"d-flex gap-2 justify-content-center align-items-center bg-input\">\n                    <i class=\"bi bi-lock\"></i>\n                    <input type=\"text\" placeholder=\"Senha\" id=\"password\">\n                    <i class=\"bi bi-eye\"></i>\n                </div>\n                <div class=\"d-flex gap-2 justify-content-center align-items-center bg-input\">\n                    <i class=\"bi bi-lock\"></i>\n                    <input type=\"text\" placeholder=\"V2ray UUID\" id=\"uuid\">\n                    <i class=\"bi bi-eye\"></i>\n                </div>\n                       <!*Aqui está a separação do box baixo>\n           \t\t<div class=\"position-absolute px-4\" style=\"bottom: -160%;\">\n            <div class=\"d-flex gap-2 justify-content-between align-content-center my-4 fs-3\">\n                <button class=\"border-0 bg-input\" onclick=\"DtStartAppUpdate.execute()\">\n                    <i class=\"bi bi-arrow-repeat\"></i>\n                </button>\n                <button class=\"border-0 bg-input\" onclick=\"loggerModal.show()\">\n                    <i class=\"bi bi-file-earmark-medical\"></i>\n                </button>\n                <button class=\"border-0 bg-input\" onclick=\"DtStartCheckUser.execute()\">\n                    <i class=\"bi bi-calendar2-day\"></i>\n                </button>\n                                              <!AQUI ESTÀ O BOTÂO DE REDIRECIONAMENTO DO CANAL>\n                <!<button class=\"border-0 bg-input\" onclick=\"DtStartWebViewActivity.execute('')\">\n                    <!<i class=\"bi bi-headset\"></i>\n                </button>\n                <button class=\"border-0 bg-input\" onclick=\"DtIgnoreBatteryOptimizations.execute()\">\n                    <i class=\"bi bi-battery\"></i>\n                </button>\n            </div>\n        </div>\n    </main>\n    <div class=\"modal fade\" id=\"checkUserModal\">\n        <div class=\"modal-dialog modal-dialog-centered\" role=\"document\">\n            <div class=\"modal-content rounded-3 shadow\">\n                <div class=\"modal-header border-bottom-0 pb-0\">\n                    <h1 class=\"modal-title fs-5 chk-title text-light\"></h1>\n                    <button type=\"button\" class=\"btn-close btn-close-white\" data-bs-dismiss=\"modal\"></button>\n                </div>\n                <div class=\"modal-body text-center\">\n                    <p class=\"fs-5 mb-0 chk-message text-light\"></p>\n                </div>\n            </div>\n        </div>\n    </div>\n    <div class=\"modal fade\" id=\"configModal\">\n        <div class=\"modal-dialog modal-dialog-centered\" role=\"document\">\n            <div class=\"modal-content rounded-3 shadow\">\n                <div class=\"modal-header border-bottom-0 pb-0\">\n                    <h1 class=\"modal-title fs-5\" style=\"color: var(--text-color);\">CONFIGURAÇÕES</h1>\n                    <button type=\"button\" class=\"btn-close btn-close-white\" data-bs-dismiss=\"modal\"></button>\n                </div>\n                <div class=\"modal-body p-1 text-center\">\n                    <ul class=\"list-group bg-transparent overflow-y-auto config-body\" style=\"max-height: 600px;\"></ul>\n                </div>\n            </div>\n        </div>\n    </div>\n    <div class=\"modal fade\" id=\"loggerModal\">\n        <div class=\"modal-dialog modal-dialog-centered\" role=\"document\">\n            <div class=\"modal-content rounded-3 shadow\">\n                <div class=\"modal-body p-1 text-center\">\n                    <ul class=\"list-group bg-transparent overflow-y-auto logger-content\" style=\"max-height: 800px;\">\n                    </ul>\n                </div>\n                <div class=\"modal-footer flex-nowrap py-0 px-1 gap-3 border-top-0\">\n                    <button type=\"button\" class=\"border-0 bg-input w-100 clear-logger\" onclick=\"DtClearLogs.execute()\"\n                        style=\"color: var(--text-color);\">LIMPAR</button>\n                    <button type=\"button\" class=\"border-0 bg-input w-100\" style=\"color: var(--text-color);\"\n                        data-bs-dismiss=\"modal\">FECHAR</button>\n                </div>\n            </div>\n        </div>\n    </div>\n    <script src=\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.min.js\"></script>\n    <script>\n        Object.defineProperty(String.prototype, 't', {\n            value: function t() {\n                return window?.DtTranslateText?.execute('' + this) ?? '' + this\n            },\n            writable: true,\n            configurable: true,\n        })\n\n        const startStopVpn = document.querySelector('#vpn-start-stop')\n        startStopVpn.onclick = e => {\n            if (DtGetVpnState.execute() != 'DISCONNECTED') {\n                DtExecuteVpnStop.execute()\n            } else {\n                DtExecuteVpnStart.execute()\n            }\n        }\n\n        const config = document.querySelector('#config')\n        config.parentElement.onclick = () => showConfigsModal();\n\n        const username = document.querySelector('#username')\n        username.oninput = e => DtUsername.set(e.target.value)\n\n        const password = document.querySelector('#password')\n        password.oninput = e => DtPassword.set(e.target.value)\n\n        const uuid = document.querySelector('#uuid')\n        uuid.oninput = e => DtUuid.set(e.target.value)\n\n        const checkUserModal = new bootstrap.Modal(document.querySelector('#checkUserModal'))\n        const configModal = new bootstrap.Modal(document.querySelector('#configModal'))\n        const loggerModal = new bootstrap.Modal(document.querySelector('#loggerModal'))\n\n        const dtConfigClickListener = () => {\n            const data = JSON.parse(window?.DtGetDefaultConfig?.execute() || `{ \"auth\": {\"username\": \"\"} }`)\n            const isV2ray = data?.mode?.toLowerCase()?.startsWith('v2ray');\n\n            config.placeholder = data.name ?? 'Escolha um servidor';\n            username.parentElement.style.setProperty('display', !data?.auth?.username && !isV2ray ? 'flex' : 'none', 'important')\n            password.parentElement.style.setProperty('display', !data?.auth?.password && !isV2ray ? 'flex' : 'none', 'important')\n            uuid.parentElement.style.setProperty('display', !data?.auth?.v2ray_uuid && isV2ray ? 'flex' : 'none', 'important')\n        }\n\n        const dtVpnStateListener = state => {\n            const isRunning = state != 'DISCONNECTED';\n            const status = document.querySelector('#state')\n\n            status.innerHTML = ('LBL_STATE_' + state).t()\n\n            if (isRunning) {\n                username.setAttribute('readonly', 'true')\n                password.setAttribute('readonly', 'true')\n                status.style.color = '#00ff15'\n            } else {\n                username.removeAttribute('readonly')\n                password.removeAttribute('readonly')\n                status.style.color = 'RED'\n            }\n        }\n\n        const dtCheckUserStartedListener = () => {\n            const data = JSON.parse(window?.DtGetDefaultConfig?.execute() || `{}`)\n            const isV2ray = data?.mode?.toLowerCase()?.startsWith('v2ray');\n            if (isV2ray || !data.urlCheckUser) return;\n\n            const html = `\n            <div class=\"d-flex justify-content-center\">\n                <div class=\"spinner-border p-4\" role=\"status\">\n                    <span class=\"visually-hidden\">Loading...</span>\n                </div>\n            </div>\n            `\n\n            checkUserModal._element.querySelector('.chk-title').textContent = 'CHECK USER'\n            checkUserModal._element.querySelector('.chk-message').innerHTML = html;\n            checkUserModal.show()\n        }\n\n        const dtCheckUserModelListener = model => {\n            const data = JSON.parse(model ?? `{\"username\": \"test\"}`)\n            const html = `\n                <div class=\"d-flex flex-column text-white\">\n                    <span>Nome de usuario: ${data.username}</span>\n                    <span>Dias restantes: ${data.expiration_days}</span>\n                    <span>Conexoes: ${data.count_connections}|${data.limit_connections}</span>\n                </div>\n            `\n\n            checkUserModal._element.querySelector('.chk-title').textContent = ' Olá, ' + data.username.toUpperCase() + ''\n            checkUserModal._element.querySelector('.chk-message').innerHTML = html;\n            checkUserModal.show()\n        }\n\n        const showConfigsModal = () => {\n            const mock = '[{\"sorter\":6,\"color\":\"#6D08041C\",\"name\":\"CONFIG\",\"id\":1393,\"items\":[{\"mode\":\"V2RAY - VLESS\",\"sorter\":4,\"tlsVersion\":\"TLSv1.2\",\"name\":\"CONFIG 01\",\"icon\":\"https://cdn-icons-png.flaticon.com/512/8187/8187143.png\",\"id\":11803,\"status\":\"ACTIVE\"},{\"mode\":\"SSH_DIRECT\",\"sorter\":2,\"tlsVersion\":\"TLSv1.2\",\"name\":\"CONFIG 02\",\"icon\":\"https://cdn-icons-png.flaticon.com/512/8187/8187143.png\",\"id\":28627,\"status\":\"ACTIVE\"},{\"mode\":\"OVPN_PROXY\",\"sorter\":23,\"tlsVersion\":\"TLSv1.2\",\"name\":\"CONFIG 03\",\"icon\":\"https://cdn-icons-png.flaticon.com/512/8187/8187143.png\",\"id\":30001,\"status\":\"ACTIVE\"}]},{\"sorter\":2,\"color\":\"#6D08041C\",\"name\":\"CONFIG 2\",\"id\":1846,\"items\":[{\"mode\":\"SSH_PROXY\",\"sorter\":1,\"tlsVersion\":\"TLSv1.2\",\"name\":\"CONFIG 01\",\"icon\":\"https://cdn-icons-png.flaticon.com/512/8187/8187143.png\",\"id\":26295,\"status\":\"ACTIVE\"}]},{\"sorter\":4,\"color\":\"#80000000\",\"name\":\"CONFIG 3\",\"id\":3310,\"items\":[{\"mode\":\"SSH_PROXY\",\"sorter\":1,\"tlsVersion\":\"TLSv1.2\",\"name\":\"CONFIG. TEST\",\"icon\":\"https://cdn-icons-png.flaticon.com/512/8187/8187143.png\",\"id\":29997,\"status\":\"ACTIVE\"},{\"mode\":\"OVPN_PROXY\",\"sorter\":1,\"tlsVersion\":\"TLSv1.2\",\"name\":\"CONFIG. TEST 2\",\"icon\":\"https://cdn-icons-png.flaticon.com/512/8187/8187143.png\",\"id\":29998,\"status\":\"ACTIVE\"}]}]'\n            const data = JSON.parse(window?.DtGetConfigs?.execute() || mock)\n\n            data.sort((a, b) => a.sorter - b.sorter)\n            data.forEach(item => item.items.sort((a, b) => a.sorter - b.sorter))\n\n            const body = configModal._element.querySelector('.config-body')\n            body.innerHTML = ''\n\n            data.forEach(category => {\n                const categoryElement = document.createElement('li')\n                categoryElement.className = 'list-group-item bg-transparent border-0 mb-1 rounded-1 px-1'\n                categoryElement.style.color = 'var(--text-color)'\n                categoryElement.innerHTML = `<span class=\"fw-bold w-100 d-block p-1 rounded-1 mb-1 bg-category\">${category.name}</span>`\n\n                const configUlElement = document.createElement('ul')\n                configUlElement.className = 'list-group overflow-y-auto'\n\n                category.items.forEach(item => {\n                    const configElement = document.createElement('li')\n                    configElement.className = 'list-group-item d-flex border-0 bg-config rounded-2 px-1 py-2 mb-1'\n                    configElement.style.color = 'var(--text-color)'\n                    configElement.innerHTML = `\n                            <img src=\"${item.icon}\" width=\"40\" height=\"40\">\n                            <div class=\"text-start d-flex flex-column ms-2 w-100 text-truncate\">\n                                <span class=\"fw-bold text-uppercase\" style=\"font-size: 0.8rem;\">${item.name}</span>\n                                <span class=\"fst-italic fw-bold text-uppercase\" style=\"font-size: 0.7rem;\">${item.description || ''}</span>\n                            </div>\n                            <div class=\"d-flex flex-column ms-2\">\n                                <span class=\"fst-italic fw-bold text-end text-uppercase text-nowrap\" style=\"font-size: 0.8rem;\">${item.mode}</span>\n                            </div>\n                        </li>\n                    `\n                    configElement.addEventListener('click', e => {\n                        window?.DtSetConfig?.execute(item.id)\n                        configModal.hide()\n                    })\n                    configUlElement.appendChild(configElement)\n                })\n\n                categoryElement.appendChild(configUlElement)\n                body.appendChild(categoryElement)\n            })\n            configModal.show()\n        }\n\n        const dtOnNewLogListener = () => {\n            const mock = [];\n            for (let i = 0; i < 30; i++) {\n                mock.push({ 'TIME': 'MESSAGE ' + i })\n            }\n\n            const log = window?.DtGetLogs?.execute() || JSON.stringify(mock)\n            const data = JSON.parse(log)\n\n            let content = '';\n            data.forEach(item => {\n                content += '<li class=\"list-group-item bg-transparent p-0 border-0 text-start ms-2 text-wrap\" style=\"font-size: 12px; color: var(--text-color);\">';\n                content += Object.keys(item)[0] + \" \" + item[Object.keys(item)]\n                content += '</li>';\n            })\n\n            loggerModal._element.querySelector('.logger-content').innerHTML = content;\n            const listGroup = loggerModal._element.querySelector('.list-group')\n            listGroup.scrollTo(0, listGroup.scrollHeight)\n        }\n\n        username.value = window?.DtUsername?.get() ?? ''\n        password.value = window?.DtPassword?.get() ?? ''\n        uuid.value = window?.DtUuid?.get() ?? ''\n\n        dtOnNewLogListener()\n        dtConfigClickListener()\n        dtVpnStateListener(window?.DtGetVpnState?.execute() ?? 'DISCONNECTED')\n    </script>\n</body>\n\n</html>",
        "type": "HTML",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8514,
        "label": "ANDROID WEBVIEW (POR SUA CONTA E RISCO)",
        "name": "APP_SUPPORT_BUTTON",
        "value": null,
        "type": "HTML",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    },
    {
        "id": 8515,
        "label": "PAGINA WEBVIEW (POR SUA CONTA E RISCO)",
        "name": "APP_WEB_VIEW",
        "value": null,
        "type": "HTML",
        "status": "ACTIVE",
        "user_id": "42e76a53-e72f-413d-afa1-aca5ad0ff453"
    }
]