# Terminal
rails g helper TurboStreams::Toast
rails g helper TurboStreams::Log
yarn add toastify-js
# views/welcome/index.html.erb
<turbo-stream action="toast" message="Hello World"></turbo-stream>
# app/javascript/application.js
import "./turbo_streams"
# app/javascript/turbo_streams/index.js
import "./toast"
import "./log"
# app/assets/stylesheets/application.bootstrap.scss
@use "toastify-js/src/toastify.css";
# app/javascript/turbo_streams/toast.js
import { StreamActions } from "@hotwired/turbo"
import Toastify from "toastify-js"
StreamActions.toast = function() {
const message = this.getAttribute("message")
const position = this.getAttribute("position")
Toastify({
text: message,
duration: 3000,
destination: "",
close: true,
gravity: "top",
position: position,
stopOnFocus: true,
style: {
background: "linear-gradient(to right, #00b09b, #96c93d)",
}
}).showToast()
}
# app/javascript/turbo_streams/log.js
import { StreamActions } from "@hotwired/turbo"
StreamActions.log = function() {
const message = this.getAttribute("message")
console.log(message)
}
# app/helpers/turbo_streams/toast_helper.rb
module TurboStreams::ToastHelper
def toast(message, position: "left")
turbo_stream_action_tag :toast, message: message, position: position
end
end
Turbo::Streams::TagBuilder.prepend(TurboStreams::ToastHelper)
# app/helpers/turbo_streams/log_helper.rb
module TurboStreams::LogHelper
def log(message)
turbo_stream_action_tag :log, message: message
end
end
Turbo::Streams::TagBuilder.prepend(TurboStreams::LogHelper)
# welcome_controller.rb
class WelcomeController < ApplicationController
def index
end
def page1
render turbo_stream: turbo_stream.toast("hello from a rails controller", position: :right)
end
def page2
render turbo_stream: [
turbo_stream.log("log from page 2"),
turbo_stream.toast("hello from page 2", position: :left),
turbo_stream.toast("hello from page 2 and this is a second toast", position: :right),
]
end
end
# models/user.rb
class User < ApplicationRecord
include Turbo::Streams::ActionHelper
include Turbo::Streams::StreamName
after_create -> {
content = turbo_stream_action_tag(:toast, message: "A new user was created")
ActionCable.server.broadcast(stream_name_from(:users), content)
}
end
# views/users/index.html.erb
<%= turbo_stream_from :users %>