Refresh local time target when morphed

Alternative to https://github.com/basecamp/fizzy/pull/486
2025-05-13 05:44:19 +02:00
parent cb6a001ba2
commit 515396263e
3 changed files with 8 additions and 2 deletions
@@ -1,5 +1,5 @@
 module TimeHelper
  def local_datetime_tag(datetime, style: :time, **attributes)
-    tag.time **attributes, datetime: datetime.iso8601, data: { local_time_target: style }
+    tag.time **attributes, datetime: datetime.iso8601, data: { local_time_target: style, action: "turbo:morph-element->local-time#refreshTarget" }
  end
 end
@@ -37,6 +37,12 @@ export default class extends Controller {
    })
  }

+  refreshTarget(event) {
+    const target = event.target;
+    const targetName = target.dataset.localTimeTarget
+    this.#formatTime(this[`${targetName}Formatter`], target)
+  }
+
  timeTargetConnected(target) {
    this.#formatTime(this.timeFormatter, target)
  }
@@ -25,7 +25,7 @@
    <link rel="apple-touch-icon" href="/apple-touch-icon.png">
  </head>

-  <body data-controller="lightbox local-time timezone-cookie" data-action="turbo:morph@window->local-time#refreshAll turbo:frame-load->local-time#refreshAll">
+  <body data-controller="lightbox local-time timezone-cookie" data-action="turbo:morph@window->local-time#refreshAll">
    <header id="header">
      <a href="#main-content" class="skip-navigation btn">Skip to main content</a>
      <%= yield :header %>