Bugfix order page

01-frontend/src/helper/adminpanel/OrdersInfo.tsx

@@ -13,7 +13,7 @@ import {
     useTheme
 } from "@mui/material";
 import { useMutation, useQuery } from "@tanstack/react-query";
-import React, { PropsWithChildren, useEffect, useState } from "react";
+import React, { PropsWithChildren, useState } from "react";
 import { DndProvider, useDrag, useDrop } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import { useTranslation } from "react-i18next";
@@ -125,15 +125,13 @@ const EditOrder: React.FC<{ open: boolean; order: OrderType | null; onClose: ()
     );
 };
 
-// Main component for managing orders
 export default function OrdersInfo() {
-    const [orders, setOrders] = useState<OrderType[]>([]);
     const [editOrder, setEditOrder] = useState<OrderType | null>(null);
     const [openSnackbar, setOpenSnackbar] = useState(false);
 
     const { user: loginData } = useAccount();
 
-    const { data, refetch } = useQuery({
+    const { data, refetch, isLoading } = useQuery({
         queryKey: ["fetchOrdersAdmin", loginData],
         queryFn: () => fetchOrdersAdmin(loginData ? loginData : { email: "", password: "", session: "", customerId: -1, isAdmin: false }),
         retry: 3,
@@ -146,15 +144,10 @@ export default function OrdersInfo() {
     });
 
 
-    useEffect(() => {
-        console.log("data", data);
-        if (data) {
-            setOrders(data);
-        }
-    }, [data]);
-
     const handleDrop = async (id: number, status: OrderStatusEnum) => {
-        const obj = orders.find((o) => o.id === id);
+
+        const currentOrders = data ?? [];
+        const obj = currentOrders.find((o) => o.id === id);
         if (!obj) {
             setOpenSnackbar(true);
             return;
@@ -162,20 +155,22 @@ export default function OrdersInfo() {
         try {
             await patchOrderMutation.mutateAsync({ id: obj.id, status: status });
             refetch();
-            setOrders(orders.map((o) => (o.id === id ? { ...o, status } : o)));
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
         } catch (error) {
             setOpenSnackbar(true);
         }
     };
     const handleEdit = (order: OrderType) => setEditOrder(order);
 
+    if (isLoading || !data) {
+        return <div>Lade Bestellungen...</div>;
+    }
+
     return (
         <DndProvider backend={HTML5Backend}>
             <div style={{ display: 'flex', gap: 10, minHeight: '90%' }}>
                 {statusOrder.map((status) => (
                     <Column key={status} status={status} onDrop={handleDrop}>
-                        {orders
+                        {data
                             .filter((o) => o.status === status)
                             .map((o) => (
                                 <OrderCard key={o.id} order={o} onClick={() => handleEdit(o)} />
@@ -196,5 +191,4 @@ export default function OrdersInfo() {
             />
         </DndProvider>
     );
-
 }