notyf refactored

app/javascript/application.js

@@ -1,16 +1,10 @@
 // Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
 import "@hotwired/turbo-rails"
 import "controllers"
-import { Notyf } from 'notyf'
 
-window.buildNotyf = ()=>{
-    const notyf=new Notyf({
-        duration: 5000,
-        position: { x: 'center', y: 'top' },
-    })
-    return notyf
-}
+// Notyf
+import { Notyf } from 'notyf'
+window.Notyf=Notyf
 
 // Customize Turbo default behaviour
 Turbo.setProgressBarDelay(300)
-// Turbo.session.drive = false

app/views/layouts/_notification.html.erb

@@ -1,13 +1,14 @@
-<h2>NOTIFICATION BAR</h2>
-<script data-turbo-temporary>
-  document.addEventListener('turbo:load',(e)=>{
+<% if flash.count.positive? %>
+  <script data-turbo-temporary>
+    document.addEventListener('turbo:load',(e)=>{
 
-    const notyf=window.buildNotyf()
-    notyf.success('rails notice')
-    notyf.error('rails alert')
+      const notyf=new Notyf({ duration: 5000, position: { x: 'center', y: 'top' } })
+      <% if flash.notice%> notyf.success('<%=flash.notice%>') <%end%>
+      <% if flash.alert%> notyf.error('<%=flash.alert%>') <%end%>
 
-    // useful to prevent flickering from turbo preview
-    Turbo.cache.exemptPageFromPreview()
+      // useful to prevent flickering from turbo preview
+      Turbo.cache.exemptPageFromPreview()
 
-  }, {once: true})
-</script>
+    }, {once: true})
+  </script>
+<%end%>