All threads / Flash Messages and Toasts with Hotwire & Turbo.js Discussion

Ask A Question

Notifications

You’re not receiving notifications from this thread.

Flash Messages and Toasts with Hotwire & Turbo.js Discussion

Nice! I've been playing with Turbo and that comes on perfect timing, thanks!

But didn't you think that feels wrong?

We used to have the controller do all of that for us with the redirects and flashes.

I think this is a missing piece of Turbo. It has to work as seamlessly as it is without it.

I'm not following. If you're making realtime updates on the page without refreshing, you're going to want the same for flash and toasts.

Sorry for not being clear.
I mean having to create a template for turbo_stream to do flashes and such.
It's rjs with new clothes.

I think that ideally, turbo should work with the same flow that we have with "normal" Rails.

You can avoid that turbo_stream template by putting everything in the controller, like this:

respond_to do |format|
  format.html { redirect_to tweets_path, notice: "Your tweet was successfully created." }
  format.json { render :show, status: :created, location: @tweet }
  format.turbo_stream { render turbo_stream: turbo_stream.prepend('tweets', partial: 'tweets/tweet', locals: { tweet: @tweet })}
end

But I personally liked a lot this approach of adding a proper template for the turbo_stream response.

Thanks a lot for this video, Chris!

It work with the current flow, in your controller you can have

def create
  if @model.save
    redirect_to list_path, 'Model created successfully'
  else
    render :new, status: :unprocessable_entity
  end
end

and on application.html.erb have the same approach for toats using flash variables.
it will trigger the connect on stimulus controller and display the toast.

The approach showed on the video is more when you have complex pages and not only a regular CRUD.
having the ability to create reactive apps using this approach looks awesome.

Reply

I'm trying to add a toast after running a background job, i.e., the type and content of the toast depends on wether or not a certain service object called in the BG job is successful or not.

I can render the toasts correctly when I stream from a turbo_stream controller format response, but if I try to stream from the Job with Turbo::StreamsChannel.broadcast_append_to 'toasts' ... it doesn't have any error and in the logs I can see the partial was rendered but it never gets delivered to the UI.

Any ideas on how to do this?

Reply

One cool thing is we also could use layouts. It is possible to create a layout app/views/layouts/application.turbo_stream.erb and manage the code related to flash messages once for all turbo stream response. (Don't forget to use yield 😅)

<%= turbo_stream.prepend :flashes partial: "shared/flashes" %>

<%= yield %>
Reply
Join the discussion

Want to stay up-to-date with Ruby on Rails?

Join 46,687+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.

    logo Created with Sketch.

    Ruby on Rails tutorials, guides, and screencasts for web developers learning Ruby, Rails, Javascript, Turbolinks, Stimulus.js, Vue.js, and more. Icons by Icons8

    © 2021 GoRails, LLC. All rights reserved.