req-070: Parametrização de Scripts de Widget no Editor HTML e Dinamização do Mapeamento do Módulo Subscriptions

Descrição do Problema / Contexto

Este lote de trabalho visa resolver duas frentes principais de melhoria de arquitetura e dinamicidade do sistema:

1. Desacoplamento e Parametrização de Widgets no Editor HTML: A inclusão dos scripts de widget (*.widget.js) no preview do Editor HTML está hardcoded no arquivo global html-editor-interface.js. Queremos passar a lista de scripts a incluir parametrizada a partir de cada módulo. Adicionalmente, com a eliminação do forms.widget.js no lote anterior, os formulários no preview do editor deixaram de funcionar, pois as variáveis dinâmicas injetadas pelo backend não são expostas em conexões AJAX. Precisamos recriar o forms.widget.js de modo que ele recupere essas variáveis via chamada AJAX dedicada e inicialize os scripts de formulário dinamicamente no iframe de preview.

2. Dinamização do Mapeamento de Planos e Cadastros no Módulo Subscriptions (Projeto [REDACTED]): O mapeamento entre formulários e planos ($formToPlan e $planMapping) está hardcoded nos controladores de assinatura. Além disso, as regras para formulários de cadastro (signup) e vinculação de perfis de usuário também estão rígidas. Queremos mover essas configurações para o banco de dados, mapeando-as diretamente no CRUD de Planos de Assinatura (subscriptions-plans) com interface gráfica interativa (autocomplete de perfis de usuário e mapeamento dinâmico de campos do formulário para e-mail/senha).

Mudanças Necessárias

1. Parametrização de Scripts de Widget no Editor HTML (conn2flow)

1.1. Injeção de Parâmetros no Backend (gestor/bibliotecas/html-editor.php)

• Modificar a função html_editor_componente($params) para aceitar a chave 'widget_js_include' em $params.

• Passar esse parâmetro para a injeção de variáveis JS html_editor sob a chave widget_js_include.

1.2. Leitura Dinâmica no Frontend (gestor/assets/interface/html-editor-interface.js)

• Alterar a constante WIDGET_SCRIPT_MODULES para recuperar dinamicamente o valor de gestor.html_editor.widget_js_include.

• Se não estiver definido, aplicar o fallback padrão contendo os 4 módulos: {'galleries': true, 'publisher-index': true, 'menus': true, 'forms': true}.

1.3. Atualização dos Módulos Core (conn2flow)

• Atualizar as chamadas de html_editor_componente nos seguintes arquivos para passar o respectivo parâmetro:

  • Forms (gestor/modulos/forms/forms.php): 'widget_js_include' => ['forms' => true]

  • Menus (gestor/modulos/menus/menus.php): 'widget_js_include' => ['menus' => true]

  • Galleries (gestor/modulos/galleries/galleries.php): 'widget_js_include' => ['galleries' => true]

  • Publisher Index (gestor/modulos/publisher-index/publisher-index.php): 'widget_js_include' => ['publisher-index' => true]

2. Recriação do Script de Widget de Formulário (forms.widget.js & forms.widget.php)

2.1. Rota AJAX no Backend de Formulários (gestor/modulos/forms/forms.php)

• Adicionar o caso 'forms-render-editor-html' no switch de opções AJAX de formulários.

• Criar a função forms_ajax_render_editor_html() que lê form_id da requisição, chama a função de obtenção de dados no widget e retorna forms_js_vars no JSON de resposta.

2.2. Função de Obtenção de Configuração do Form (gestor/modulos/forms/forms.widget.php)

• Criar a função forms_render_editor_html($params) que extrai os esquemas de campos, componentes Fomantic/Tailwind, reCAPTCHA e redirecionamentos para o form_id solicitado, retornando a mesma estrutura de array que formulario_controlador gera.

2.3. Controlador JavaScript do Widget (gestor/modulos/forms/forms.widget.js - [NEW])

• Recriar o arquivo forms.widget.js.

• No carregamento (preview iframe), varrer a página buscando .conn2flow-form ou ._forms-submissions-controller.

• Para cada um, fazer uma chamada AJAX para o endpoint de formulários do admin solicitando a ação forms-render-editor-html para o form_id.

• Ao retornar com sucesso:

  • Registrar as configurações retornadas em window.gestor.form[formId].

  • Carregar assincronamente (se não carregados) os scripts interface.js e formulario.js para ligar os eventos de submissão do formulário no preview.

3. Dinamização de Planos e Cadastro no Módulo Subscriptions ([REDACTED])

3.1. Migração de Banco de Dados ([REDACTED])

• Criar uma nova migração Phinx (20260710120000_add_signup_fields_to_subscriptions_plans.php) adicionando as seguintes colunas à tabela subscriptions_plans:

  • is_signup (boolean/tinyint, padrão 0)

  • signup_field_email (string 100, null)

  • signup_field_password (string 100, null)

  • signup_field_password_confirm (string 100, null)

  • signup_id_usuarios_perfis (integer, null)

3.2. Localizações do CRUD de Planos (gestor/modulos/subscriptions-plans/subscriptions-plans.json)

• Adicionar chaves de variáveis de interface em pt-br e en para os novos campos: label-is-signup, label-signup-field-email, label-signup-field-password, label-signup-field-password-confirm, label-signup-user-profile, search-profile-placeholder.

3.3. CRUD Administrativo (gestor/modulos/subscriptions-plans/subscriptions-plans.php)

• Alterar as rotinas de inclusão e edição para salvar e carregar os 5 novos campos do banco de dados.

• Na tela de edição, realizar a busca de perfil vinculado (usuarios_perfis) para mandar a variável #perfil_name# ao HTML do autocomplete.

• Adicionar dois novos endpoints AJAX:

  • buscar-perfis: busca perfis de usuários (usuarios_perfis) por termo de busca via AJAX.

  • buscar-form-campos: extrai campos ativos do JSON de um formulário (forms.fields_schema) e os retorna para povoar as opções de mapeamento de campos.

3.4. Templates HTML do CRUD (gestor/modulos/subscriptions-plans/resources/...)

• Modificar os templates de adicionar e editar (em pt-br e en):

  • Inserir checkbox para is_signup ("Plano de Cadastro").

  • Criar container condicional .sig-signup-fields-container contendo:

  • Campo de autocomplete para buscar perfil de usuário a vincular (data-target="perfis").

  • Três selects de mapeamento de campos: E-mail, Senha e Confirmação de Senha.

3.5. Javascript do CRUD (gestor/modulos/subscriptions-plans/subscriptions-plans.js)

• Ligar escuta no checkbox is_signup para alternar a visibilidade do container de mapeamento de cadastro.

• Monitorar a seleção de formulário no autocomplete. Ao selecionar ou limpar, fazer requisição AJAX para buscar-form-campos e re-povoar os selects de mapeamento de campos de e-mail/senha.

3.6. Dinamização de Assinaturas e Checkout ([REDACTED])

• subscriptions.php: Na função subscriptions_checkout(), remover o array estático $planMapping e buscar dinamicamente o form_id na tabela subscriptions_plans a partir do slug do plano ativo e do idioma.

• subscriptions.ajax.public.php:

  • Na função subscriptions_ajax_forms_process(), remover o array estático $formToPlan e buscar o registro correspondente ao formulário na tabela subscriptions_plans.

  • Se for um formulário de cadastro (is_signup), recuperar dinamicamente as variáveis de email, senha e confirmação de senha configuradas para o plano.

  • Na função subscriptions_criar_usuario($dados), utilizar a coluna signup_id_usuarios_perfis configurada no plano para vincular o perfil correspondente ao usuário, mantendo fallback de slug se nulo.

Validação e Testes

1. Validação de Testes Unitários:

   • Rodar composer test no projeto conn2flow.

   • Rodar composer test no projeto [REDACTED] (caso existam testes).

2. Validação Manual:

   • No editor HTML de formulários do conn2flow, checar se o formulário renderiza interativamente e responde a submissões no preview do iframe.

   • Criar/editar um plano no subscriptions-plans do [REDACTED], habilitar "Plano de Cadastro", vincular a um perfil de usuário e associar a um formulário mapeando os campos de email/senha. Salvar e validar os dados no banco de dados.

   • Efetuar fluxo de checkout no site público do [REDACTED] para o plano criado e verificar que a conta de usuário é criada com o perfil dinamicamente atribuído.