O que exatamente está prestes a ser quebrado? Talvez já exista um componente de tema compatível que sirva ao propósito.
É apenas o banner no topo que liga ao site principal?
1 curtida
Existe um substituto para:
api.changeWidgetSetting("header-notifications", "avatarSize", "large");
Isso me dá o aviso de depreciação que leva aqui:
O widget header-notifications foi descontinuado e changeWidgetSetting não é mais uma substituição suportada.
5 curtidas
Estou no mesmo barco.
Tentando alterar a URL do logotipo da maneira correta, mas o seguinte não é mais alcançável:
api.changeWidgetSetting("home-logo", "href", "https://my-other-homepage/");
Qual é a chamada de API de substituição para isso?
1 curtida
Estamos trabalhando em uma solução limpa para isso, mas ainda não está pronta. Fique de olho neste tópico para atualizações.
2 curtidas
Olá @david - uma solução limpa pode estar pronta até sexta-feira, 7 de junho? Se não, você poderia fornecer uma estimativa?
Desculpe pela pressa, estamos começando o Beta fechado em 17 de junho e precisamos saber se isso será implementado antes dos testes ou não.
Não tenho uma data exata, mas provavelmente será nas próximas 1-2 semanas. Não estará pronto para amanhã.
Se você precisar de algo funcionando para amanhã, recomendo usar a API antiga, que mudará automaticamente seu site para usar a implementação de cabeçalho legada.
2 curtidas
@kana.tatsuta a nova API foi mesclada.
Adicionei uma seção no OP com exemplos de como personalizar a URL do logotipo.
2 curtidas
Ativamos o aviso de administrador para novas implantações em instâncias que usam plugins ou temas incompatíveis.
2 curtidas
Não tenho certeza de como atualizar meu código. Tentei algumas coisas, mas toda vez as imagens aparecem do tema claro em vez do meu tema escuro e do que foi carregado diretamente para essas imagens no componente. Alguma sugestão sobre o que isso deveria ser reestruturado?
<script type="text/discourse-plugin" version="0.8.25">
api.reopenWidget("home-logo", {
logoUrl() {
return (
settings.Alternative_logo_url || ""
);
},
mobileLogoUrl() {
return (
settings.Alternative_mobile_logo_url || ""
);
},
smallLogoUrl() {
return (
settings.Alternative_small_logo_url || ""
);
}
});
</script>
Tente usar um conector no outlet do plugin home-logo-contents. Seu código seria traduzido para algo como:
// javascripts/discourse/initializers/customize-logo.gjs
import HomeLogoContents from "discourse/components/header/home-logo-contents";
import { withPluginApi } from "discourse/lib/plugin-api";
export default {
name: `logo-customizations`,
initialize(container) {
withPluginApi("1.29.0", (api) => {
renderHomeLogo(api);
});
},
};
function renderHomeLogo(api) {
const logoSmallUrl = settings.Alternative_small_logo_url || "";
const logoUrl = settings.Alternative_logo_url || "";
const mobileLogoUrl = settings.Alternative_mobile_logo_url || "";
api.renderInOutlet("home-logo-contents", <template>
<HomeLogoContents
@logoSmallUrl={{logoSmallUrl}}
@logoUrl={{logoUrl}}
@minimized={{@outletArgs.minimized}}
@mobileLogoUrl={{mobileLogoUrl}}
@showMobileLogo={{@outletArgs.showMobileLogo}}
@title={{@outletArgs.title}}
/>
</template>);
}
3 curtidas
Para reopenWidget (sidebar-toggle), você poderia me ajudar a entender como substituir o seguinte código? Não encontrei instruções neste guia
// /javascripts/discourse/api-initializers/desktop-open-sidebar-always.js
/* botão sidebarToggle removido por "reopenWidget", applicationController força showSidebar para true (para desktopView) */
import { withPluginApi } from "discourse/lib/plugin-api";
import { reopenWidget } from "discourse/widgets/widget";
function sidebarToggle(api) {
const applicationController = api.container.lookup("controller:application");
api.reopenWidget("sidebar-toggle", {
html(attrs) {
if (this.site.desktopView == true && attrs.showSidebar == false) {
applicationController.set("showSidebar", true);
}
},
});
}
export default {
name: "desktop-open-sidebar-always",
initialize() {
withPluginApi("0.10.1", sidebarToggle);
},
};
Olá pessoal 
,
Alguém poderia me ajudar com as alterações que preciso para isso, por favor?
<script type="text/discourse-plugin" version="0.4">
const { iconNode } = require("discourse-common/lib/icon-library");
api.decorateWidget('header-icons:before', helper => {
return helper.h('li', [
helper.h('a#graduation-cap.icon', {
href:'https://example.com/',
title: 'Learning Center'
}, iconNode('graduation-cap')),
]);
});
</script>
Acredito que preciso convertê-lo para usar api.headerIcons.add(“foo”, FooIcon, { before: “search” }), mas não tenho 100% de certeza de como fazer isso 
Qualquer ajuda aqui seria muito apreciada 
Olá @angelinekwan,
Aqui está nossa recomendação:
-
Remova o arquivo
javascripts/discourse/api-initializers/desktop-open-sidebar-always.jsexistente. -
Crie um novo arquivo:
javascripts/discourse/pre-initializers/desktop-open-sidebar-always.jse adicione o seguinte código:
import { withPluginApi } from "discourse/lib/plugin-api";
const PLUGIN_NAME = "desktop-open-sidebar-always";
export default {
name: PLUGIN_NAME,
initialize() {
withPluginApi("1.34.0", (api) => {
api.modifyClass("controller:application", {
pluginId: PLUGIN_NAME,
calculateShowSidebar() {
if (this.site.desktopView && this.canDisplaySidebar) {
return true;
}
return this._super(...arguments);
},
});
});
},
};
Adicione o seguinte a common/common.scss
html.desktop-view {
.header-sidebar-toggle {
display: none;
}
}
4 curtidas
Olá @Danny_Dainton,
Dê uma olhada no componente de tema Custom Header Links (icons). Acredito que ele faz o que você precisa.
Se você não puder usar o componente de tema, api.headerIcons.add resolverá o problema. 
- Crie um novo arquivo inicializador. Ele precisa ter a extensão
.gjs - O código a seguir deve fazer o que você deseja:
// javascripts/discourse/initializers/custom-header-icons.gjs
import { apiInitializer } from "discourse/lib/api";
import dIcon from "discourse-common/helpers/d-icon";
export default apiInitializer("1.34.0", (api) => {
api.headerIcons.add(
"custom-header-home",
`
<li>
<a id="graduation-cap" class="icon" href="https://example.com/" title="Learning Center">
${dIcon("graduation-cap")}
</a>
</li>
`,
{ before: "search" }
);
});
4 curtidas
Obrigado, Senhor!
Ah, isso faz um pouco mais de sentido para mim agora depois de ver isso na minha frente.
Agradeço muito sua resposta!! 
1 curtida
Agradeço a ajuda para migrar este trecho de código que não consigo migrar:
api.reopenWidget("user-dropdown", {
html(attrs) {
return h(
"a.icon",
{title: I18n.t("custom.string.title")},
[iconNode("bell"), this.attach("header-notifications", attrs)],
);
},
});
O objetivo desta alteração originalmente é manter o menu user-dropdown como está, mas substituir a imagem do perfil por um ícone (sino)
A maneira mais fácil de obter o efeito que você deseja é adicionar o ícone usando o PluginOutlet existente e simplesmente ocultar a imagem do avatar do usuário usando CSS.
Em um arquivo .gjs:
// javascripts/discourse/initializers/user-dropdown-bell-icon.gjs
import { withPluginApi } from "discourse/lib/plugin-api";
import dIcon from "discourse-common/helpers/d-icon";
export default {
name: "user-dropdown-bell-icon",
initialize(container) {
withPluginApi("1.34.0", (api) => {
api.renderInOutlet("user-dropdown-notifications__before",
`{{dIcon "bell"}}`
);
});
},
};
Adicione o seguinte CSS:
.header-dropdown-toggle.user-menu-panel img {
display: none;
}
Você obtém:
2 curtidas
O código antigo do widget foi removido.
3 curtidas
Alguém poderia me ajudar a atualizar um componente de tema que adiciona texto ao lado do "home-logo"? Agradeço desde já.