fix: mostrar error de carga en vez de tabla vacía silenciosa
This commit is contained in:
1 parent
148d8b2550
commit
580ecff258
1 file changed
+14
-2
@@ -62,6 +62,7 @@ function TicketsContent() {
|
|||||||
const [total, setTotal] = useState(0);
|
const [total, setTotal] = useState(0);
|
||||||
const [page, setPage] = useState(1);
|
const [page, setPage] = useState(1);
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
|
const [loadError, setLoadError] = useState("");
|
||||||
const [view, setView] = useState<View>("all");
|
const [view, setView] = useState<View>("all");
|
||||||
// Vacío = Todos los estados. Con 1 o más = filtra por esos estados.
|
// Vacío = Todos los estados. Con 1 o más = filtra por esos estados.
|
||||||
const [statusFilters, setStatusFilters] = useState<string[]>([]);
|
const [statusFilters, setStatusFilters] = useState<string[]>([]);
|
||||||
@@ -119,7 +120,10 @@ function TicketsContent() {
|
|||||||
// fetch en curso que lo apaga en .finally(). Poner setLoading(true)
|
// fetch en curso que lo apaga en .finally(). Poner setLoading(true)
|
||||||
// en un onClick sin cambio real de estado dejaba spinner eterno.
|
// en un onClick sin cambio real de estado dejaba spinner eterno.
|
||||||
// Diferido como el efecto de URL para no disparar cascading renders.
|
// Diferido como el efecto de URL para no disparar cascading renders.
|
||||||
queueMicrotask(() => setLoading(true));
|
queueMicrotask(() => {
|
||||||
|
setLoading(true);
|
||||||
|
setLoadError("");
|
||||||
|
});
|
||||||
getTickets({
|
getTickets({
|
||||||
status: statusFilters.length > 0 ? statusFilters : undefined,
|
status: statusFilters.length > 0 ? statusFilters : undefined,
|
||||||
priority: priorityFilter || undefined,
|
priority: priorityFilter || undefined,
|
||||||
@@ -138,9 +142,10 @@ function TicketsContent() {
|
|||||||
setTickets(data.items || []);
|
setTickets(data.items || []);
|
||||||
setTotal(data.total || 0);
|
setTotal(data.total || 0);
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch((err) => {
|
||||||
setTickets([]);
|
setTickets([]);
|
||||||
setTotal(0);
|
setTotal(0);
|
||||||
|
setLoadError(err instanceof Error ? err.message : "Error al cargar tickets");
|
||||||
})
|
})
|
||||||
.finally(() => setLoading(false));
|
.finally(() => setLoading(false));
|
||||||
}, [statusFilters, priorityFilter, search, page, view, numericId, hasNumericId, isTeam]);
|
}, [statusFilters, priorityFilter, search, page, view, numericId, hasNumericId, isTeam]);
|
||||||
@@ -206,6 +211,13 @@ function TicketsContent() {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{loadError && (
|
||||||
|
<div className="alert alert-danger py-2" role="alert">
|
||||||
|
<i className="bi bi-exclamation-triangle me-2"></i>
|
||||||
|
{loadError}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{hasActiveFilters && (
|
{hasActiveFilters && (
|
||||||
<div className="alert alert-info py-2 d-flex align-items-center justify-content-between" role="alert">
|
<div className="alert alert-info py-2 d-flex align-items-center justify-content-between" role="alert">
|
||||||
<span>
|
<span>
|
||||||
|
|||||||
Reference in new issue
Block a user