remove: toast notification system

This commit is contained in:
2026-04-06 19:52:24 +02:00
parent da60c9d6fd
commit 55284a855e
4 changed files with 1 additions and 52 deletions

View File

@@ -75,16 +75,6 @@ func (h *WatchlistHandler) HandleUpdateWatchlist(w http.ResponseWriter, r *http.
return
}
// For HTMX, we can just return a success toast or update a portion of the UI
displayStatus := status
switch status {
case "on_hold":
displayStatus = "on hold"
case "plan_to_watch":
displayStatus = "plan to watch"
}
w.Header().Set("HX-Trigger", fmt.Sprintf(`{"toast": "added to %s"}`, displayStatus))
templates.WatchlistDropdown(int(animeID), animeTitle, animeImage, status).Render(r.Context(), w)
}
@@ -125,8 +115,6 @@ func (h *WatchlistHandler) HandleDeleteWatchlist(w http.ResponseWriter, r *http.
return
}
w.Header().Set("HX-Trigger", `{"toast": "removed from watchlist"}`)
// If called from watchlist page, just return empty (hx-swap="delete" handles removal)
if r.URL.Query().Get("from") == "watchlist" {
w.WriteHeader(http.StatusOK)
@@ -286,7 +274,6 @@ func (h *WatchlistHandler) HandleImportWatchlist(w http.ResponseWriter, r *http.
imported++
}
w.Header().Set("HX-Trigger", fmt.Sprintf(`{"toast": "imported %d entries"}`, imported))
w.Header().Set("HX-Redirect", "/watchlist")
w.WriteHeader(http.StatusOK)
}

View File

@@ -29,23 +29,6 @@ templ Layout(title string) {
<main>
{ children... }
</main>
<div id="toast-container"></div>
<script>
document.body.addEventListener('toast', function(evt) {
const container = document.getElementById('toast-container');
const toast = document.createElement('div');
toast.className = 'toast';
toast.textContent = evt.detail.value;
container.appendChild(toast);
requestAnimationFrame(() => { toast.style.opacity = '1'; });
setTimeout(() => {
toast.style.opacity = '0';
setTimeout(() => { toast.remove(); }, 300);
}, 3000);
});
</script>
</body>
</html>
}

View File

@@ -50,7 +50,7 @@ func Layout(title string) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "</main><div id=\"toast-container\"></div><script>\n\t\t\t\tdocument.body.addEventListener('toast', function(evt) {\n\t\t\t\t\tconst container = document.getElementById('toast-container');\n\t\t\t\t\tconst toast = document.createElement('div');\n\t\t\t\t\ttoast.className = 'toast';\n\t\t\t\t\ttoast.textContent = evt.detail.value;\n\t\t\t\t\tcontainer.appendChild(toast);\n\t\t\t\t\t\n\t\t\t\t\trequestAnimationFrame(() => { toast.style.opacity = '1'; });\n\t\t\t\t\t\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\ttoast.style.opacity = '0';\n\t\t\t\t\t\tsetTimeout(() => { toast.remove(); }, 300);\n\t\t\t\t\t}, 3000);\n\t\t\t\t});\n\t\t\t</script></body></html>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "</main></body></html>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}

View File

@@ -714,27 +714,6 @@ a:hover {
margin: 4px 0;
}
/* Toast */
#toast-container {
position: fixed;
bottom: 24px;
right: 24px;
z-index: 1000;
display: flex;
flex-direction: column;
gap: 8px;
}
.toast {
background: var(--surface);
border: 1px solid var(--border);
color: var(--text);
padding: 12px 16px;
font-size: 13px;
opacity: 0;
transition: opacity 0.2s;
}
/* Responsive */
@media (max-width: 900px) {
.anime-page {