event for each users

views/partials/message-bot.html

@@ -6,7 +6,7 @@
             {% if IsPlaceholder %}
 
             <figure class="image is-48x48 message-icon" style="flex-shrink: 0;"
-                sse-swap="swapIcon-{{ ConversationAreaId }}">
+                sse-swap="swapIcon-{{ ConversationAreaId }}-{{ userID }}">
                 <img src="icons/bouvai2.png" alt="User Image" id="selectedIcon-{{ ConversationAreaId }}">
             </figure>
 
@@ -72,7 +72,7 @@
             {% elif IsPlaceholder %}
             <div class="is-flex is-align-items-start">
                 <div class="message-content" id="content-{{ ConversationAreaId }}"
-                    sse-swap="swapContent-{{ ConversationAreaId }}">
+                    sse-swap="swapContent-{{ ConversationAreaId }}-{{ userID }}">
                     <hx hx-trigger="load" hx-get="/generateMultipleMessages" id="generate-multiple-messages"></hx>
                     <div class='message-header'>
                         <p>
@@ -98,7 +98,8 @@
 
                 {% for selectedLLM in SelectedLLMs %}
                 <button disable class="button is-small is-primary message-button is-outlined mr-1"
-                    sse-swap="swapSelectionBtn-{{ selectedLLM.ID.String() }}" hx-swap="outerHTML" hx-target="this">
+                    sse-swap="swapSelectionBtn-{{ selectedLLM.ID.String() }}-{{ userID }}" hx-swap="outerHTML"
+                    hx-target="this">
                     <span class="icon is-small">
                         <!--img src="icons/{{ selectedLLM.Company }}.png" alt="{{ selectedLLM.Name }}"
                             style="max-height: 100%; max-width: 100%;"-->