ü++

backend/server.js

@@ -231,9 +231,10 @@ app.get('/games/:gameId/items', (req, res) => {
             if (err) {
                 return res.status(500).json({ error: 'Internal server error' });
             }
+            // Convert image data to base64 and store as Img property
             const processedRows = rows.map(row => {
-                if (row.img) {
+                if (row.img) {  // Database column is lowercase
-                    row.Img = `data:image/jpeg;base64,${row.img.toString('base64')}`;
+                    row.Img = `data:image/jpeg;base64,${row.img.toString('base64')}`;  // Store as uppercase Img
                 }
                 return row;
             });

frontend/src/pages/gameMasterPage.jsx

@@ -21,21 +21,18 @@ const GameMasterPage = () => {
   const [allOwners, setAllOwners] = useState([]);
   const [formData, setFormData] = useState(null);
 
-  // Fix useEffect data fetching
+  // Update useEffect for data fetching
   useEffect(() => {
     const fetchData = async () => {
       try {
-        // Fetch player characters
         const pcsResponse = await axios.get(`http://localhost:5000/games/${gameId}/playerchars`);
         const processedPCs = Array.isArray(pcsResponse.data) ? pcsResponse.data : [pcsResponse.data];
         setPlayerCharacters(processedPCs.filter(pc => pc !== null));
 
-        // Fetch NPCs with different structure
         const npcsResponse = await axios.get(`http://localhost:5000/games/${gameId}/npcs`);
         const processedNPCs = Array.isArray(npcsResponse.data) ? npcsResponse.data : [npcsResponse.data];
         setNpcs(processedNPCs.filter(npc => npc !== null));
 
-        // Fetch Items
         const itemsResponse = await axios.get(`http://localhost:5000/games/${gameId}/items`);
         const processedItems = Array.isArray(itemsResponse.data) ? itemsResponse.data : [itemsResponse.data];
         setItems(processedItems.filter(item => item !== null));
@@ -44,15 +41,21 @@ const GameMasterPage = () => {
       }
     };
 
-    fetchData();
+    // Initial fetch only if no modal is open
-    let interval;
+    if (!editModalOpen) {
-    if (!isEditing && !editModalOpen) {  // Add editModalOpen check
+      fetchData();
-      interval = setInterval(fetchData, 10000);
     }
+    
+    // Set up polling only if modal is closed
+    let interval;
+    if (!editModalOpen) {
+      interval = setInterval(fetchData, 5000);
+    }
+    
     return () => {
       if (interval) clearInterval(interval);
     };
-  }, [gameId, isEditing, editModalOpen]);  // Add editModalOpen dependency
+  }, [gameId, editModalOpen]);
 
   useEffect(() => {
     const fetchOwners = async () => {
@@ -83,7 +86,7 @@ const GameMasterPage = () => {
     setFormData({...item});
     setEditType('item');
     setEditModalOpen(true);
-    setIsEditing(true);
+    setIsEditing(true); // Stops the polling
   };
 
   const handleNpcClick = (npc) => {
@@ -102,6 +105,7 @@ const GameMasterPage = () => {
     setIsEditing(true);
   };
 
+  // Update handleUpdate to fetch once after saving
   const handleUpdate = async () => {
     try {
       let response;
@@ -114,10 +118,26 @@ const GameMasterPage = () => {
       }
       
       if (response.status === 200) {
+        const fetchData = async () => {
+          try {
+            const pcsResponse = await axios.get(`http://localhost:5000/games/${gameId}/playerchars`);
+            const processedPCs = Array.isArray(pcsResponse.data) ? pcsResponse.data : [pcsResponse.data];
+            setPlayerCharacters(processedPCs.filter(pc => pc !== null));
+
+            const npcsResponse = await axios.get(`http://localhost:5000/games/${gameId}/npcs`);
+            const processedNPCs = Array.isArray(npcsResponse.data) ? npcsResponse.data : [npcsResponse.data];
+            setNpcs(processedNPCs.filter(npc => npc !== null));
+
+            const itemsResponse = await axios.get(`http://localhost:5000/games/${gameId}/items`);
+            const processedItems = Array.isArray(itemsResponse.data) ? itemsResponse.data : [itemsResponse.data];
+            setItems(processedItems.filter(item => item !== null));
+          } catch (error) {
+            console.error('Error fetching data:', error);
+          }
+        };
+        await fetchData(); // Fetch once after successful update
         setEditModalOpen(false);
-        setIsEditing(false);
         setFormData(null);
-        fetchData();
       }
     } catch (error) {
       console.error('Error updating:', error);
@@ -126,7 +146,7 @@ const GameMasterPage = () => {
 
   const handleModalClose = () => {
     setEditModalOpen(false);
-    setIsEditing(false);
+    setIsEditing(false); // Restarts the polling
     setFormData(null);
   };
 
@@ -489,8 +509,8 @@ const GameMasterPage = () => {
                 }}>
                   <CardMedia
                     component="img"
-                    height="135" // Reduced from 140
+                    height="135" 
-                    image={item.img || defaultItemImage}  // Changed from item.img to item.Img
+                    image={item.Img || defaultItemImage} 
                     alt={item.ItemName}
                     className={`rarity-${item.Rarity} rarity-image`}
                     sx={{