Scarriffle/Vorrania
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Produktlisten zeigen "wird geladen" statt "keine Produkte" beim Laden

Browse Source 
Bisher stand sofort "Keine Produkte gefunden." da, obwohl noch geladen wurde.
Jetzt ein Ladezustand: Kopf zeigt "Wird geladen...", Tabelle "Produkte werden
geladen...", und die Leer-Meldung kommt erst, wenn der Server wirklich nichts
liefert.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-07-29 12:07:12 +02:00
parent 620e77dff1
commit 4034b97cf3
1 changed files with 11 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
web/src/pages/Products.jsx
View File

@@ -46,10 +46,15 @@ export default function Products({ fixedType = null }) {
// "" = alle, sonst "food"/"object": trennt Lebensmittel und Gegenstände. // "" = alle, sonst "food"/"object": trennt Lebensmittel und Gegenstände.
const [typ, setTyp] = useState(""); const [typ, setTyp] = useState("");
const [error, setError] = useState(null); const [error, setError] = useState(null);
const [loading, setLoading] = useState(true);
useEffect(() => { useEffect(() => {
// Alle Produkte einmal laden; das Filtern erledigt die Tabelle clientseitig. // Alle Produkte einmal laden; das Filtern erledigt die Tabelle clientseitig.
api.listProducts("", "").then(setProducts).catch((err) => setError(err.message)); setLoading(true);
api.listProducts("", "")
.then(setProducts)
.catch((err) => setError(err.message))
.finally(() => setLoading(false));
api.listCategories().then(setCategories).catch(() => {}); api.listCategories().then(setCategories).catch(() => {});
}, []); }, []);
@@ -126,7 +131,9 @@ export default function Products({ fixedType = null }) {
<div> <div>
<h1>{titel}</h1> <h1>{titel}</h1>
<div className="sub"> <div className="sub">
{sichtbar.length} {fixedType ? titel : `Produkte${activeTyp ? (activeTyp === "food" ? " · Lebensmittel" : " · Gegenstände") : " im Katalog"}`} {loading
? "Wird geladen…"
: `${sichtbar.length} ${fixedType ? titel : `Produkte${activeTyp ? (activeTyp === "food" ? " · Lebensmittel" : " · Gegenstände") : " im Katalog"}`}`}
</div> </div>
</div> </div>
{isAdmin && ( {isAdmin && (
@@ -146,7 +153,8 @@ export default function Products({ fixedType = null }) {
<div className="card"> <div className="card">
<DataTable id={fixedType ? `products-${fixedType}` : "products"} columns={columns} rows={sichtbar} <DataTable id={fixedType ? `products-${fixedType}` : "products"} columns={columns} rows={sichtbar}
getRowKey={(p) => p.id} empty="Keine Produkte gefunden." /> getRowKey={(p) => p.id}
empty={loading ? "Produkte werden geladen…" : "Keine Produkte gefunden."} />
</div> </div>
</div> </div>
); );