fix: optimistic favorites
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 3m53s
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 3m53s
This commit is contained in:
@@ -85,10 +85,38 @@ export function Sidebar({
|
|||||||
}
|
}
|
||||||
}, [toast]);
|
}, [toast]);
|
||||||
|
|
||||||
// Mettre à jour les favoris quand ils changent
|
// Mettre à jour les favoris quand ils changent (mise à jour optimiste)
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const handleFavoritesChange = () => {
|
const handleFavoritesChange = async (event: Event) => {
|
||||||
|
const customEvent = event as CustomEvent<{ seriesId: string; action: "add" | "remove" }>;
|
||||||
|
|
||||||
|
// Si on a les détails de l'action, faire une mise à jour optimiste locale
|
||||||
|
if (customEvent.detail?.seriesId) {
|
||||||
|
const { seriesId, action } = customEvent.detail;
|
||||||
|
|
||||||
|
if (action === "add") {
|
||||||
|
// Fetch les détails de la série ajoutée et l'ajouter au state
|
||||||
|
try {
|
||||||
|
const response = await fetch(`/api/komga/series/${seriesId}`);
|
||||||
|
if (response.ok) {
|
||||||
|
const seriesData = await response.json();
|
||||||
|
setFavorites((prev) => {
|
||||||
|
// Éviter les doublons
|
||||||
|
if (prev.some((s) => s.id === seriesId)) return prev;
|
||||||
|
return [...prev, seriesData];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
logger.error({ err: error }, "Erreur lors de l'ajout optimiste du favori:");
|
||||||
|
}
|
||||||
|
} else if (action === "remove") {
|
||||||
|
// Retirer la série du state directement
|
||||||
|
setFavorites((prev) => prev.filter((s) => s.id !== seriesId));
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// Fallback: refetch complet si pas de détails (ex: événement externe)
|
||||||
refreshFavorites();
|
refreshFavorites();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
window.addEventListener("favoritesChanged", handleFavoritesChange);
|
window.addEventListener("favoritesChanged", handleFavoritesChange);
|
||||||
|
|||||||
@@ -61,7 +61,11 @@ export const SeriesHeader = ({ series, refreshSeries }: SeriesHeaderProps) => {
|
|||||||
|
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
setIsFavorite(!isFavorite);
|
setIsFavorite(!isFavorite);
|
||||||
window.dispatchEvent(new Event("favoritesChanged"));
|
// Dispatcher l'événement avec le seriesId pour mise à jour optimiste de la sidebar
|
||||||
|
const event = new CustomEvent("favoritesChanged", {
|
||||||
|
detail: { seriesId: series.id, action: isFavorite ? "remove" : "add" },
|
||||||
|
});
|
||||||
|
window.dispatchEvent(event);
|
||||||
toast({
|
toast({
|
||||||
title: t(isFavorite ? "series.header.favorite.remove" : "series.header.favorite.add"),
|
title: t(isFavorite ? "series.header.favorite.remove" : "series.header.favorite.add"),
|
||||||
description: series.metadata.title,
|
description: series.metadata.title,
|
||||||
|
|||||||
Reference in New Issue
Block a user