As @PitaJ mentioned header.tpl doesn't have access to the page data, but it is possible to give it access via plugins.
The hook you need to use is filter:middleware.renderHeader. Here is a sample on how to make thumbs available to header.tpl
myPlugin.filterMiddlewareRenderHeader = async function (hookData) {
if (hookData.templateValues.template.name === 'topic') {
hookData.templateValues.thumbs = hookData.data.thumbs;
}
return hookData;
};
The hook looks like this
const hookReturn = await plugins.hooks.fire('filter:middleware.renderHeader', {
req: req,
res: res,
templateValues: templateValues,
data: data,
});
return await req.app.renderAsync('header', hookReturn.templateValues);
templateValues is used to render the header and data is the data used to render the page.
This only works for cold loads though since when you ajaxify on the client side the header is not re-rendered so you need to handle client side ajaxify and update the header too.
$(window).on('action:ajaxify.end', function (ev, data) {
if (ajaxify.data.template.name === 'topic') {
// code to update header using ajaxify.data.thumbs
}
}};
Hope this helps.
