From bd7bda9c0642b4107392b5f5a6b8eca608ceb77d Mon Sep 17 00:00:00 2001
From: Marco Roth <marco.roth@intergga.ch>
Date: Tue, 3 Dec 2024 01:03:00 +0100
Subject: [PATCH] Extrac _header_content to being able to broadcast changes

---
 app/models/speaker.rb                       |  2 +-
 app/views/speakers/_header.html.erb         | 37 +--------------------
 app/views/speakers/_header_content.html.erb | 36 ++++++++++++++++++++
 3 files changed, 38 insertions(+), 37 deletions(-)
 create mode 100644 app/views/speakers/_header_content.html.erb

diff --git a/app/models/speaker.rb b/app/models/speaker.rb
index 419442ac..681de9d7 100644
--- a/app/models/speaker.rb
+++ b/app/models/speaker.rb
@@ -161,7 +161,7 @@ def fetch_bsky_metadata!
   end
 
   def broadcast_header
-    broadcast_update_to self, target: dom_id(self, :header), partial: "speakers/header", locals: {speaker: self}
+    broadcast_update_to self, target: dom_id(self, :header_content), partial: "speakers/header_content", locals: {speaker: self}
   end
 
   def valid_website_url
diff --git a/app/views/speakers/_header.html.erb b/app/views/speakers/_header.html.erb
index 1218f7a7..bd884c50 100644
--- a/app/views/speakers/_header.html.erb
+++ b/app/views/speakers/_header.html.erb
@@ -1,40 +1,5 @@
 <div class="block lg:flex gap-8 align-center justify-between" id="<%= dom_id(speaker, :header) %>">
-  <div class="flex flex-col lg:flex-row gap-8 items-center lg:justify-right text-center lg:text-left mb-6 lg:mb-0">
-    <div class="relative w-fit">
-      <%= image_tag speaker.github_avatar_url(size: 200),
-            class: "rounded-full border border-[#D9DFE3] size-24 md:size-36",
-            height: 200,
-            width: 200,
-            alt: "GitHub picture profile of #{speaker.github}",
-            loading: :lazy %>
-
-      <% if speaker.verified? %>
-        <div class="absolute right-0 top-0 badge badge-accent flex gap-1">
-          <%= fa("badge-check", class: "fill-white", size: :xs) %>
-
-          Verified
-        </div>
-      <% end %>
-    </div>
-
-    <div class="flex-col flex gap-3 title justify-center">
-      <div class="flex flex-col lg:flex-row justify-center lg:justify-start text-black font-bold gap-2">
-        <h1 style="view-transition-name: title"><%= speaker.name %></h1>
-
-        <% if speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(speaker.pronouns_type) %>
-          <span class="text-sm content-center text-[#737373]">(<%= speaker.pronouns %>)</span>
-        <% end %>
-      </div>
-
-      <p class="text-[#636B74] max-w-[700px]">
-        <%= speaker.bio %>
-      </p>
-
-      <div class="mt-2 flex justify-center lg:justify-start">
-        <%= render "speakers/socials", speaker: speaker %>
-      </div>
-    </div>
-  </div>
+  <%= render "speakers/header_content", speaker: speaker %>
 
   <div class="flex flex-col gap-3 place-content-center align-center lg:max-w-[250px]">
     <% if speaker.website.present? %>
diff --git a/app/views/speakers/_header_content.html.erb b/app/views/speakers/_header_content.html.erb
new file mode 100644
index 00000000..2d48a204
--- /dev/null
+++ b/app/views/speakers/_header_content.html.erb
@@ -0,0 +1,36 @@
+<div id="<%= dom_id(speaker, :header_content) %>" class="flex flex-col lg:flex-row gap-8 items-center lg:justify-right text-center lg:text-left mb-6 lg:mb-0">
+  <div class="relative w-fit">
+    <%= image_tag speaker.github_avatar_url(size: 200),
+          class: "rounded-full border border-[#D9DFE3] size-24 md:size-36",
+          height: 200,
+          width: 200,
+          alt: "GitHub picture profile of #{speaker.github}",
+          loading: :lazy %>
+
+    <% if speaker.verified? %>
+      <div class="absolute right-0 top-0 badge badge-accent flex gap-1">
+        <%= fa("badge-check", class: "fill-white", size: :xs) %>
+
+        Verified
+      </div>
+    <% end %>
+  </div>
+
+  <div class="flex-col flex gap-3 title justify-center">
+    <div class="flex flex-col lg:flex-row justify-center lg:justify-start text-black font-bold gap-2">
+      <h1 style="view-transition-name: title"><%= speaker.name %></h1>
+
+      <% if speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(speaker.pronouns_type) %>
+        <span class="text-sm content-center text-[#737373]">(<%= speaker.pronouns %>)</span>
+      <% end %>
+    </div>
+
+    <p class="text-[#636B74] max-w-[700px]">
+      <%= speaker.bio %>
+    </p>
+
+    <div class="mt-2 flex justify-center lg:justify-start">
+      <%= render "speakers/socials", speaker: speaker %>
+    </div>
+  </div>
+</div>