diff --git a/app/controllers/notification_controller.rb b/app/controllers/notification_controller.rb
index 3360f59..011acb4 100644
--- a/app/controllers/notification_controller.rb
+++ b/app/controllers/notification_controller.rb
@@ -1,10 +1,11 @@
+COUNT ||= 0
+
 class NotificationController < ApplicationController
   def index
     logger.info 'index'
   end
 
   def show_notice
-    # flash.alert = 'toto'
     flash.alert = %w[titi toto] if params[:multiple] == 'true'
     redirect_to notification_index_path, notice: 'this is a notice'
   end
@@ -13,4 +14,37 @@ class NotificationController < ApplicationController
     flash.notice = ['<i>italic</i> <b>message</b>', 'normal <b>message</b>'] if params[:multiple] == 'true'
     redirect_to notification_index_path, alert: 'this is an alert'
   end
+
+  def turbo_notice
+    COUNT += 1
+    # TODO: render_stream (partial + flash -> flash.now + optional replace|append)
+    flash.now[:notice] = "coucou ##{COUNT}"
+    render turbo_stream: [
+      turbo_stream.replace(:flash, partial: 'layouts/components/flash')
+    ]
+  end
+
+  def turbo_alert
+    COUNT += 1
+    flash.now[:alert] = "alert, do the stuff right now ##{COUNT}"
+    render turbo_stream: [
+      turbo_stream.replace(:flash, partial: 'layouts/components/flash')
+    ]
+  end
+
+  def turbo_more
+    COUNT += 1
+    flash.now[:alert] = "alert, do the stuff right now ##{COUNT}"
+    flash.now[:notice] = ["this is extra notice ##{COUNT}", 'one more time']
+    render turbo_stream: [
+      turbo_stream.replace(:flash, partial: 'layouts/components/flash')
+    ]
+  end
+
+  def turbo_none
+    COUNT += 1
+    render turbo_stream: [
+      turbo_stream.replace(:flash, partial: 'layouts/components/flash')
+    ]
+  end
 end
diff --git a/app/javascript/controllers/flash_controller.js b/app/javascript/controllers/flash_controller.js
index fa69bb7..eeacb08 100644
--- a/app/javascript/controllers/flash_controller.js
+++ b/app/javascript/controllers/flash_controller.js
@@ -1,8 +1,11 @@
 import { Controller } from "@hotwired/stimulus"
 import Toastify from 'toastify-js'
 
+let _should_popup = false
+
 export default class extends Controller {
 
+  _should_popup = false
   static targets = ['flashItem']
 
   OPTIONS = {
@@ -13,12 +16,63 @@ export default class extends Controller {
     offset: { y: 30 },
   }
 
-  onLoad(event) {
+  showLog(event) {
+    switch (event.type) {
+      case 'turbo:before-fetch-request':
+        _should_popup = true
+        // console.log('should popup on next connect', _should_popup)
+        break
+      case 'turbo:visit':
+        _should_popup = false
+        // console.log('redirect detected', _should_popup)
+        break
+      case 'turbo:load':
+        // console.log('should popup now', this.flashItemTargets.length)
+        this.doPopup()
+        break
+    }
+  }
+
+  connect() {
+    if (_should_popup) {
+      // console.warn('popup on connect', _should_popup, this.flashItemTargets.length)
+      this.doPopup()
+      _should_popup = false
+    }
+  }
+
+  // disconnect() {
+  //   console.warn('disconnect')
+  // }
+
+
+  // flashItemTargetConnected(target) {
+  //   console.warn('on targetConnected', target, this.element.isConnected)
+  //   // this.popup({ detail: { type: target.dataset.type, message: target.textContent.trim() } })
+  // }
+
+  // flashItemTargetDisconnected(target) {
+  //   console.warn('on targetDisconnected')
+  // }
+
+  // onFrameLoad(event) {
+  //   console.warn('onFrameLoad', this.element, document.documentElement.hasAttribute("data-turbolinks-preview"))
+  // }
+
+  doPopup() {
     this.flashItemTargets.forEach((item) => {
       this.popup({ detail: { type: item.dataset.type, message: item.textContent.trim() } })
     })
   }
 
+
+  onLoad(event) {
+    // console.warn('onLoad', this.element.parentNode.isConnected)
+    // this.flashItemTargets.forEach((item) => {
+    //   this.popup({ detail: { type: item.dataset.type, message: item.textContent.trim() } })
+    // })
+  }
+
   icon(drawing) {
     return `<svg xmlns="http://>']www.w3.org/2000/svg" class="h-6 w-6 shrink-0 stroke-current mx-4" fill="none" viewBox="0 0 24 24">
     <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="${drawing}" />
diff --git a/app/views/layouts/components/_flash.html.erb b/app/views/layouts/components/_flash.html.erb
new file mode 100644
index 0000000..55d6f03
--- /dev/null
+++ b/app/views/layouts/components/_flash.html.erb
@@ -0,0 +1,15 @@
+<%= turbo_frame_tag :flash do %>
+  <div class='hidden'
+    data-controller='flash'
+    data-action="turbo:before-fetch-request@window->flash#showLog turbo:load@window->flash#showLog turbo:visit@window->flash#showLog"
+    >
+    <% flash.each do |type, messages| %>
+      <%= Time.now%>
+      <% Array(messages).each do |message| %>
+        <div data-flash-target='flashItem' data-type='<%= type %>'>
+          <%= message %>
+        </div>
+      <% end %>
+    <% end %>
+  </div>
+<% end %>
\ No newline at end of file
diff --git a/app/views/layouts/components/_flashbar.html.erb b/app/views/layouts/components/_flashbar.html.erb
index 4c28b71..23c0c03 100644
--- a/app/views/layouts/components/_flashbar.html.erb
+++ b/app/views/layouts/components/_flashbar.html.erb
@@ -22,15 +22,4 @@
 
 </div>
 
-<div class='hidden'
-  data-controller='flash'
-  data-action="turbo:load@window->flash#onLoad"
-  >
-  <% flash.each do |type, messages| %>
-    <% Array(messages).each do |message| %>
-      <div data-flash-target='flashItem' data-type='<%= type %>'>
-        <%= message %>
-      </div>
-    <% end %>
-  <% end %>
-</div>
+<%= render 'layouts/components/flash' %>
\ No newline at end of file
diff --git a/app/views/notification/index.html.erb b/app/views/notification/index.html.erb
index 19de4b3..f26e00a 100644
--- a/app/views/notification/index.html.erb
+++ b/app/views/notification/index.html.erb
@@ -3,40 +3,83 @@
 </div>
 
 <section>
-  <h2 class="text-bold text-2xl">By using <span class="italic">stimulus</span></h2>
+  <h2 class="text-bold text-2xl">By using <span class="italic">redirect_to</span></h2>
   <ul class="flex flex-row list bg-base-100 rounded-box shadow-md">
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Notice', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
-        type: 'notice',
-        message: 'this is a message from Stimulus'
-      }}))", class: 'btn btn-primary'%>
+      <%= link_to 'Notice', 
+      notification_show_notice_path, 
+      class: 'btn btn-primary',
+      data: { turbo_prefetch: false }%>
     </li>
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Alert', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
-        type: 'alert',
-        message: 'this is an alert'
-      }}))", class: 'btn btn-secondary'%>
+      <%= link_to 'Notice ++', notification_show_notice_path({multiple: true}), class: 'btn btn-primary', 'data-turbo-prefetch': false %>
+    </li>
+    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
+      <%= link_to 'Alert', notification_show_alert_path, class: 'btn btn-secondary', 'data-turbo-prefetch': false %>
+    </li>
+    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
+      <%= link_to 'Alert ++', notification_show_alert_path({multiple: true}), class: 'btn btn-secondary', 'data-turbo-prefetch': false %>
+    </li>
+    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
+      <%= link_to 'None', notification_index_path, class: 'btn btn-accent btn-outline', 'data-turbo-prefetch': false %>
     </li>
   </ul>
 </section>
 
 <section>
-  <h2 class="text-bold text-2xl">By using <span class="italic">redirect_to</span></h2>
+  <h2 class="text-bold text-2xl">By using <span class="italic">turbo stream</span></h2>
   <ul class="flex flex-row list bg-base-100 rounded-box shadow-md">
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Notice', notification_show_notice_path, class: 'btn btn-primary'%>
+      <%= link_to notification_turbo_notice_path, class: "btn btn-primary", data: { turbo_stream: true, turbo_prefetch: false } do %>
+        Turbo Notice
+      <% end %>
     </li>
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Notice ++', notification_show_notice_path({multiple: true}), class: 'btn btn-primary'%>
+      <%= link_to notification_turbo_alert_path, class: "btn btn-secondary", data: { turbo_stream: true, turbo_prefetch: false } do %>
+        Turbo Alert
+      <% end %>
     </li>
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Alert', notification_show_alert_path, class: 'btn btn-secondary'%>
+      <%= link_to notification_turbo_more_path, class: "btn btn-accent", data: { turbo_stream: true, turbo_prefetch: false } do %>
+        Turbo More
+      <% end %>
     </li>
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'Alert ++', notification_show_alert_path({multiple: true}), class: 'btn btn-secondary'%>
+      <%= link_to notification_turbo_none_path, class: "btn btn-accent btn-outline", data: { turbo_stream: true, turbo_prefetch: false } do %>
+        Turbo None
+      <% end %>
     </li>
+  </ul>
+
+  <%# <div class="flex gap-4">
+    <div class="flex-1 flex-col">
+      <h3 class='m-2'>Choice</h3>
+      <div class="grow card h-50 bg-base-300 rounded-box place-items-center">content</div>
+    </div>
+
+    <div class="flex-none divider sm:divider-horizontal grow-0">OR</div>
+    <div class="flex-1 flex-col">
+      <h3 class='m-2'>Selected</h3>
+      <div class="grow card h-50 bg-base-300 rounded-box place-items-center">content</div>
+    </div>
+
+  </div> %>
+</section>
+
+<section>
+  <h2 class="text-bold text-2xl">By using plain <span class="italic">Javascript</span></h2>
+  <ul class="flex flex-row list bg-base-100 rounded-box shadow-md">
     <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
-      <%= link_to 'None', notification_index_path, class: 'btn btn-accent btn-outline'%>
+      <%= link_to 'Notice', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
+        type: 'notice',
+        message: 'this is a message from within Stimulus'
+      }}))", class: 'btn btn-primary'%>
+    </li>
+    <li class="p-4 pb-2 text-xs opacity-60 tracking-wide">
+      <%= link_to 'Alert', "javascript: window.dispatchEvent(new CustomEvent('popup-toast', {detail: {
+        type: 'alert',
+        message: 'this is an alert by the way'
+      }}))", class: 'btn btn-secondary'%>
     </li>
   </ul>
-</section>
\ No newline at end of file
+</section>
diff --git a/config/routes.rb b/config/routes.rb
index ed53bae..6f95a6a 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -3,4 +3,8 @@ Rails.application.routes.draw do
   get 'notification/index'
   get 'notification/show_notice'
   get 'notification/show_alert'
+  get 'notification/turbo_notice'
+  get 'notification/turbo_alert'
+  get 'notification/turbo_more'
+  get 'notification/turbo_none'
 end