mirror of
https://github.com/perstarkse/minne.git
synced 2026-03-26 03:11:34 +01:00
30 lines
1.3 KiB
HTML
30 lines
1.3 KiB
HTML
<div class="relative my-2">
|
|
<button id="references-toggle-{{user_message_id}}"
|
|
class="text-xs text-blue-500 hover:text-blue-700 hover:underline focus:outline-none flex items-center">
|
|
References
|
|
{% include "icons/chevron_icon.html" %}
|
|
</button>
|
|
<div id="references-content-{{user_message_id}}" class="hidden max-w-full mt-1">
|
|
<div class="flex flex-wrap">
|
|
{% for reference in references %}
|
|
<span class="badge badge-sm text-xs truncate max-w-[20ch] overflow-hidden text-left block tooltip"
|
|
hx-get="/knowledge/{{reference}}" hx-trigger="mouseenter once delay:500ms"
|
|
hx-target="#tooltip-content-{{loop.index}}-{{user_message_id}}" hx-swap="innerHTML">
|
|
{{reference}}
|
|
<div id="tooltip-content-{{loop.index}}-{{user_message_id}}" class="tooltip-content">
|
|
<!-- Loading indicator while content is fetched -->
|
|
<div class="animate-pulse text-gray-400 text-xs">Loading...</div>
|
|
</div>
|
|
</span>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
document.getElementById('references-toggle-{{user_message_id}}').addEventListener('click', function () {
|
|
const content = document.getElementById('references-content-{{user_message_id}}');
|
|
const icon = document.getElementById('toggle-icon');
|
|
content.classList.toggle('hidden');
|
|
icon.classList.toggle('rotate-180');
|
|
});
|
|
</script> |