I noticied that few plugin outlet like topic-list-after-title require raw.hbs file
I did search in the handlebars documentation, but I could see anything as raw hbs file.
I checked in the discourse code, plugin outlet like topic-list-after-title are defined as
{{raw-plugin-outlet name="topic-list-after-title"}}
while other plugins are defined as
{{plugin-outlet name="composer-fields-below" args=(hash model=model)}}
Q1. Is there any reason why some plugin plugin are defined in above way ( raw-plugin-outlet) ?
Also I noticied that in the raw.hbs file, the setupcomponent is not called as explained in this link
Q2. Is it so? I had also asked similar question regarding this.
2 curtidas
I would be interested in this as well. Did you find the answer yet?
sam
Fevereiro 3, 2020, 1:06am
3
Raw templates are a performance optimisation. Only partial ember view features exists, removal of features is what makes it faster.
Hence we use a different pattern here for extensibility. We donât have the full ember lifecycle.
3 curtidas
Is there something similar to setupComponent(args, component) with the raw outlets as well? What about computed properties? I would like to do some computations based on the data in context. How can I go about this? I dont even know if I named my accompanying .js.es6 file right. Should I name it .raw.js.es6?
SetUpComponent not being called for topic list tags plugin outlet - #3 by net_deamon
https://github.com/paviliondev/discourse-events/blob/master/assets/javascripts/discourse/initializers/event-edits.js.es6#L74 https://github.com/paviliondev/discourse-events/blob/master/assets/javascripts/discourse/connectors/topic-list-after-title/topic-list-event-rsvp.raw.hbs#L5
1 curtida
merefield
Setembro 20, 2021, 10:22pm
5
Eu tenho a mesma pergunta.
Ă possĂvel associar um template bruto com o JavaScript correspondente, como nos Componentes regulares, dentro de um Componente de Tema?
Tenho um caso de uso bastante desafiador e preciso gerenciar açÔes para passar argumentos de volta pela cadeia de componentes, a partir de um template profundamente embutido na lista de tópicos.
Notei que hĂĄ vĂĄrios arquivos .hbr com elementos de Componente JavaScript correspondentes na fonte do Discourse, mas observei algo estranho, por exemplo:
merefield@development:~/discourse$ find . -type f -name "flat-button.*"
./app/assets/javascripts/discourse/app/templates/flat-button.hbr
./app/assets/javascripts/discourse/app/templates/components/flat-button.hbs
./app/assets/javascripts/discourse/app/components/flat-button.js
merefield@development:~/discourse$ find . -type f -name "topic-list-item.*"
./app/assets/javascripts/discourse/app/templates/mobile/list/topic-list-item.hbr
./app/assets/javascripts/discourse/app/templates/components/topic-list-item.hbs
./app/assets/javascripts/discourse/app/templates/list/topic-list-item.hbr
./app/assets/javascripts/discourse/app/components/topic-list-item.js
merefield@development:~/discourse$ find . -type f -name "topic-post-badges.*"
./app/assets/javascripts/discourse/app/templates/components/topic-post-badges.hbs
./app/assets/javascripts/discourse/app/templates/topic-post-badges.hbr
./app/assets/javascripts/discourse/app/components/topic-post-badges.js
Parece haver vĂĄrios casos, portanto, em que existem versĂ”es .hbr e .hbs de um Componente especĂfico?
merefield
Setembro 21, 2021, 8:20am
6
Ah, pelo menos com topic-list-item, vejo que a troca Ă© feita aqui:
ConteĂșdo do arquivo hbs:
{{topicListItemContents}}
Javascript de suporte:
@observes("topic.pinned")
renderTopicListItem() {
const template = findRawTemplate("list/topic-list-item");
if (template) {
this.set(
"topicListItemContents",
template(this, RUNTIME_OPTIONS).htmlSafe()
);
schedule("afterRender", () => {
if (this.selected && this.selected.includes(this.topic)) {
this.element.querySelector("input.bulk-select").checked = true;
}
});
}
},
Astuto!
Então isso sugere que arquivos hbr não possuem arquivos javascript subjacentes, a menos que sejam suportados por esse tipo de solução alternativa?
1 curtida
Sim, acredito que seja esse o caso. Se houver outra maneira, eu ainda nĂŁo a vi!
1 curtida
Esse observador nĂŁo Ă© ideal, pois estamos tentando nos afastar deles Ă medida que continuamos a atualizar o Ember. Acredito que uma maneira melhor Ă© criar um helper e colocar seu JS nele. Aqui estĂĄ um exemplohttps://github.com/discourse/discourse-category-experts/blob/main/assets/javascripts/discourse/connectors/topic-list-after-title/category-experts-indicator.hbr
export function categoryExpertTopicListIndicators(context) {
let html = "";
html += addApprovedPills(context.topic, context.siteSettings);
html += addNeedsApprovalPill(
context.topic,
context.currentUser,
context.siteSettings
);
html += addIsQuestionPill(
context.topic,
context.currentUser,
context.siteSettings
);
return htmlSafe(html);
}
2 curtidas
merefield
Setembro 22, 2021, 1:54pm
9
Em alguns trabalhos recentes, precisei que parte da âĂĄrvoreâ de templates fosse capaz de comunicar dados de um template folha usando açÔes de fechamento (closure actions), entĂŁo alterei alguns hbrâs para hbsâs para dar suporte a isso.
O trabalho Ă© experimental e reconheço que isso terĂĄ impacto no desempenho, mas apĂłs iterar o design algumas vezes, nĂŁo consegui encontrar uma alternativa para fazer isso mantendo tudo âdentro do frameworkâ.
VocĂȘ nĂŁo pode passar funçÔes para um helper e chamĂĄ-las lĂĄ? Acredito que nĂŁo tenha tentado isso, mas imagino que seja possĂvel.
1 curtida
merefield
Setembro 22, 2021, 2:01pm
11
Especificamente, estou determinando propriedades de uma imagem em um componente folha e, em seguida, armazenando-as como propriedades do avÎ para influenciar a estilização que deve persistir além da renderização atual da lista. Os dados definitivamente precisam subir. Se um helper puder fazer isso, parece uma boa opção caso eu fique travado com a abordagem atual, obrigado!
1 curtida
