É possível injetar parâmetros do template para uma ação de widget?

Dev
1

Continuando a discussão de Guia do desenvolvedor para Temas do Discourse:

Olá a todos,

Estava me perguntando se parâmetros poderiam ser injetados do template para uma ação, mas não encontrei uma resposta positiva ou negativa no guia do @Johani. Meu objetivo é ter múltiplos widgets gerados pelo template, e a ação de cada um deles saberia o parâmetro do loop {{#each}}.

Um exemplo, após selecionar o botão de notificação multiescolha de categoria:

<script type="text/x-handlebars" data-template-name="components/some_component">
{{#each categories as |c|}}
    {{category-notifications-button
        value=c.notification_level
        category=c
        onChange=(action "changeCategoryNotificationLevel" ***dealgumaforma_injetar_c_como_um_parametro***)
    }}
{{/each}}
</script>

<script type="text/discourse-plugin" version="0.8">
  api.modifyClass("controller:some_component", {
    actions: {
      changeCategoryNotificationLevel(selected_value, ***c_como_um_parametro***) {
        c_como_um_parametro.setNotification(notificationLevel);
      }
    }
  }
});
</script>

Existe uma maneira, dentro de changeCategoryNotificationLevel, de saber em qual categoria estou a partir do template?

Se não, e se meu problema estiver bem descrito, alguém consegue ver outra maneira de alcançar o mesmo resultado?

Obrigado antecipadamente

2

Não consegui encontrar nada sobre o problema geral, mas consegui contornar o meu problema com

{{#each categories as |c|}}
    {{category-notifications-button
        ...
        onChange=(action (mut c.notification_level))
    }}
{{/each}}

O que significa, eu acho, que quero mutar o campo c.notification_level com o valor retornado pelo botão.

3

Na verdade, meu problema não pôde ser resolvido da maneira apresentada acima:

  • sim, o nível de notificação foi alterado, mas…
  • ele não foi salvo. Seria necessário clicar em outro lugar para salvá-lo com outra ação.

Ao pesquisar intensamente palavras-chave aleatórias no banco de código do GitHub, consegui encontrar uma estrutura como esta:
{{d-button action=(action "up" wc) ...}}.

Com alguns testes, cheguei à conclusão de que funciona assim:

  • template:
    {{d-button action=(action "nomedaacao" arg1 arg2) ...}}
  • JS:
    api.modifyClass("component:some-component", {
    actions: {
        nomedaacao(arg1, arg2, argA, argB) {
            console.log(arg1);
            console.log(arg2);
            console.log(argA);
            console.log(argB);
        }
    }
})

Os primeiros argumentos arg1, arg2 dos métodos são os fornecidos pelo template. Os argumentos restantes argA, argB… podem ser fornecidos pela especificidade do componente (por exemplo, o category-notifications-button retornará um inteiro dependendo da configuração em que o usuário clicar).

Não tenho absoluta certeza de que o que escrevi está correto, mas pode ajudar alguém que esteja fazendo a mesma pergunta que eu fiz.