iam working on a task that make appointments that will show on calendar in which the appointment's position be calculated by its start_time and end_time, iam using Rails7 + TurboStream to sync (real time) the appointment(create/update/destroy) between its participants.

Here is the problem: participants (users) live in different timezones so that the position of the appointment on each user's calendar are different, for example, i setup a appointment at my timezone at 8AM->10AM, my partner will see the appointment on 8PM->10PM due to his timezone. Now if the appointment data in json format then which some code in js (on frontend) we could handle this case. But how could we do it by server rendering effectively ? Hotwire style will sync HTML directly to clients, hence i have to broadcast the appointment's html in variant timezones to all participants.

  # appointment view on calendar
  <div id="appointment<%= appointment.id %><%= current_user.timezone %>"
       class="absolute top- left-" # <-- base on timezone

  # update appointment success -> sync
  def update
    # ...
    if @appointment.save
      # ....
      @appointment.participant_timezones.each do |tz|
        Turbo::StreamsChannel.broadcast_replace_to(
          @appointment,
          target: ...,
          partial: ..., # this will be render base on user timezone       
          locals: {timezone: tz}
        )
      end
  end

As you can see, in my current solution, i have to sync multiple turbo frames (for each participant's timezone) and i also need to sync/cache timezones, i think it is not an effective way.

Is there any way to intercept turbo js so that i just broadcast only one turbo frame and each client js will manipulate it before do Dom actions ?

                                                    -> user1: turbo.js update css position -> dom replace
                                                    |
one update appointment -> broadcast updated frame ->|->user2:  ................................
                                                    |
                                                    -> ...