Struggling with a simple Turbostream update for sidebar navigation

1

The turbo trigger link is just refreshing the page for my user show view.

I tried turbo_stream.replace & turbo_stream.update also pointed to the frame rightmaincontent but all that’s happening is reloading the user show view which is the fallback part of the dance_journal method.

Am I overlooking something? All the tutorials and ChatGPT I’m seeing seems to show I’m setting this up correctly.

Also, I do have turbo frames setup for pagination on some other pages on my site so I’m sure that I have turbo installed correctly.

On my user show view I have a sidebar rendered via a partial (layouts/sidebar_content):

   <div class="sidebar-left">
      <%= render 'layouts/sidebar_content', user: @user %>
    </div>

Also on the user show view I have a section wrapped in the turbo frame rightmaincontent:

<%= turbo_frame_tag 'rightmaincontent' do %>
<div class="main-content">
Main Content Divs
</div>
<% end %>

Inside of the sidebar_content partial I have a link to the Dance Journal path:

 <%= link_to 'Your Dance Journal', dance_journal_user_path(@user), data: { turbo_frame: 'rightmaincontent' }, class: 'nav-link' %>

My dance journal partial is simple and as follows:

<div>
  <h3>Your Dance Journal</h3>
  <div class="container text-bg-light p-3 rounded">
    <h3>Your dance journal</h3>
    <div class="fs-6 fw-light">Keep track of your dance videos all in one place!</div>
    <br/>
    <p>Coming soon!</p>
  </div>
  <br>
</div>

And inside of my users controller I have a dance journal method with the following:

  def dance_journal
    @user = User.friendly.find(params[:id])
  
    respond_to do |format|
      format.turbo_stream do
        render turbo_stream: turbo_stream.update('rightmaincontent',
                                                partial: 'dance_journal',
                                                locals: { user: @user })
      end
      format.html { redirect_to user_path(@user) } # Fallback for non-Turbo Stream requests
    end
  end

I was able to find that if I have the the link inside of the turbo frame tag ‘rightmaintcontent’ the page updates as expected. So now I’m trying to figure out how I can trigger the same behaviour from a link that outside of the turbo frame tag in the sidebar navigation. if you have any insights around that I’d appreciate it.

Is a turbo stream better, do turbo stream actions need to target div ids instead of the turbo frames?

1 Like
2

Your link is correct and it is navigating the turbo frame but you are confusing turbo-frames with turbo streams. If you want to respond with a turbo-stream than remove the data-turbo-frame from your link and replace it with a data-turbo-method to make it trigger a post request, and make sure your dance_journal route is also expecting a post request.
This is one way to fix your issue and leaving the current controller setup.
The other way is to just use turbo frames which would mean your dance_journal method must have a matching view dance_journal.html.erb and inside of the view you would add a matching turbo-frame-tag

<%= turbo_frame_tag 'rightmaincontent' do %>
  <%= render "dance_journal", user: @user %>
<% end %>