SSE to WebSocket

I needed to ping pong the content of the message because it was too long
for a SSE event. I swaped to websocket instead

views/partials/message-bot.html

@@ -5,9 +5,7 @@
         <!-- Left column with the icon -->
         {% if IsPlaceholder %}
 
-          <figure class="image is-48x48 message-icon"
-                  style="flex-shrink: 0"
-                  sse-swap="swapIcon-{{ ConversationAreaId }}">
+          <figure class="image is-48x48 message-icon" style="flex-shrink: 0">
             <img src="icons/bouvai2.png"
                  alt="User Image"
                  id="selectedIcon-{{ ConversationAreaId }}">
@@ -83,8 +81,7 @@
           <div class="message-content"
                id="content-{{ ConversationAreaId }}"
                style="width: 100%;
-                      overflow-y: hidden"
-               sse-swap="swapContent-{{ ConversationAreaId }}">
+                      overflow-y: hidden">
             <hx hx-trigger="load" hx-get="/generateMultipleMessages" id="generate-multiple-messages"></hx>
             <div class='message-header'>
               <p>Waiting...</p>
@@ -109,9 +106,7 @@
           {% 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">
+                    id="selection-btn-{{ selectedLLM.ID.String() }}-{{ ConversationAreaId }}">
               <span class="icon is-small">
                 <!--img src="icons/{{ selectedLLM.Company }}.png" alt="{{ selectedLLM.Name }}"
                             style="max-height: 100%; max-width: 100%;"-->