Files
function/templates/mithril_loader.html
2025-07-23 21:36:22 +10:00

49 lines
1.4 KiB
HTML

{% extends 'base.html' %}
{% block content %}
<div id="mithril-loader"></div>
<script id="mithril-data" type="application/json">
{
"component": {{ component | tojson | safe }},
"props": {{ props | tojson | safe }},
"shared": {{ shared | tojson | safe }},
"errors": {{ errors | tojson | safe }},
"flash": {{ flash | tojson | safe }}
}
</script>
<script>
const componentMap = {
Alert,
DiffView,
Editor,
ResponseView
};
const dataElement = document.getElementById('mithril-data');
const data = JSON.parse(dataElement.textContent);
const componentName = data.component;
const props = data.props;
const shared = data.shared;
const errors = data.errors;
const flash = data.flash;
const component = componentMap[componentName];
if (component) {
m.mount(document.getElementById('mithril-loader'), {
view: () => m(component, { ...props, ...shared, errors, flash })
});
} else {
console.error(`Component "${componentName}" not found.`);
document.getElementById('mithril-loader').innerHTML = `
<div class="p-4 bg-red-100 text-red-800 rounded">
<strong>Error:</strong> Mithril component "<strong>${componentName}</strong>" not found.
</div>
`;
}
</script>
{% endblock %}