diff --git a/src/components/DropZone.vue b/src/components/DropZone.vue
index e93b03d..6ae4fa6 100644
--- a/src/components/DropZone.vue
+++ b/src/components/DropZone.vue
@@ -47,7 +47,9 @@
   };
 
   const handleFiles = async (files: FileList) => {
+    console.log('Handling files:', files.length);
     const imageFiles = Array.from(files).filter(file => file.type.startsWith('image/'));
+    console.log('Image files filtered:', imageFiles.length);
 
     if (imageFiles.length === 0) {
       store.showNotification('Please upload image files only', 'error');
@@ -55,21 +57,30 @@
     }
 
     const newSprites: Sprite[] = [];
+    let errorCount = 0;
 
     for (let i = 0; i < imageFiles.length; i++) {
       const file = imageFiles[i];
+      console.log(`Processing file ${i+1}/${imageFiles.length}:`, file.name, file.type, file.size);
+
       try {
         const sprite = await createSpriteFromFile(file, i);
         newSprites.push(sprite);
+        console.log(`Successfully processed ${file.name}`);
       } catch (error) {
+        errorCount++;
         console.error('Error loading sprite:', error);
+        store.showNotification(`Failed to load ${file.name}`, 'error');
       }
     }
 
     if (newSprites.length > 0) {
+      console.log('Adding sprites to store:', newSprites.length);
       store.addSprites(newSprites);
       emit('files-uploaded', newSprites);
       store.showNotification(`Added ${newSprites.length} sprites successfully`);
+    } else if (errorCount > 0) {
+      store.showNotification(`Failed to load all ${errorCount} sprites`, 'error');
     }
   };
 
@@ -78,9 +89,26 @@
       const reader = new FileReader();
 
       reader.onload = e => {
+        if (!e.target?.result) {
+          console.error('Failed to read file:', file.name);
+          reject(new Error(`Failed to read file: ${file.name}`));
+          return;
+        }
+
         const img = new Image();
 
+        // Set crossOrigin to anonymous to handle CORS issues
+        img.crossOrigin = 'anonymous';
+
         img.onload = () => {
+          // Verify the image has loaded properly
+          if (img.width === 0 || img.height === 0) {
+            console.error('Image loaded with invalid dimensions:', file.name, img.width, img.height);
+            reject(new Error(`Image has invalid dimensions: ${file.name}`));
+            return;
+          }
+
+          console.log('Sprite created successfully:', file.name, img.width, img.height);
           resolve({
             img,
             width: img.width,
@@ -93,11 +121,20 @@
           });
         };
 
-        img.onerror = reject;
-        img.src = e.target?.result as string;
+        img.onerror = (error) => {
+          console.error('Error loading image:', file.name, error);
+          reject(new Error(`Failed to load image: ${file.name}`));
+        };
+
+        // Set the source after setting up event handlers
+        img.src = e.target.result as string;
+      };
+
+      reader.onerror = (error) => {
+        console.error('Error reading file:', file.name, error);
+        reject(new Error(`Error reading file: ${file.name}`));
       };
 
-      reader.onerror = reject;
       reader.readAsDataURL(file);
     });
   };
diff --git a/src/composables/useSpritesheetStore.ts b/src/composables/useSpritesheetStore.ts
index cc89ccb..d69736d 100644
--- a/src/composables/useSpritesheetStore.ts
+++ b/src/composables/useSpritesheetStore.ts
@@ -58,70 +58,174 @@ export function useSpritesheetStore() {
   });
 
   function addSprites(newSprites: Sprite[]) {
-    sprites.value.push(...newSprites);
-    sprites.value.sort((a, b) => a.uploadOrder - b.uploadOrder);
-    updateCellSize();
-    autoArrangeSprites();
+    console.log('Store: Adding sprites', newSprites.length);
+    if (newSprites.length === 0) {
+      console.warn('Store: Attempted to add empty sprites array');
+      return;
+    }
+
+    try {
+      // Validate sprites before adding them
+      const validSprites = newSprites.filter(sprite => {
+        if (!sprite.img || sprite.width <= 0 || sprite.height <= 0) {
+          console.error('Store: Invalid sprite detected', sprite);
+          return false;
+        }
+        return true;
+      });
+
+      if (validSprites.length === 0) {
+        console.error('Store: No valid sprites to add');
+        return;
+      }
+
+      console.log('Store: Adding valid sprites', validSprites.length);
+      sprites.value.push(...validSprites);
+      sprites.value.sort((a, b) => a.uploadOrder - b.uploadOrder);
+      updateCellSize();
+      autoArrangeSprites();
+      console.log('Store: Sprites added successfully, total count:', sprites.value.length);
+    } catch (error) {
+      console.error('Store: Error adding sprites:', error);
+    }
   }
 
   function updateCellSize() {
-    if (sprites.value.length === 0) return;
+    console.log('Store: Updating cell size');
+    if (sprites.value.length === 0) {
+      console.log('Store: No sprites to update cell size');
+      return;
+    }
 
-    let maxWidth = 0;
-    let maxHeight = 0;
+    try {
+      let maxWidth = 0;
+      let maxHeight = 0;
 
-    sprites.value.forEach(sprite => {
-      maxWidth = Math.max(maxWidth, sprite.width);
-      maxHeight = Math.max(maxHeight, sprite.height);
-    });
+      sprites.value.forEach(sprite => {
+        if (sprite.width <= 0 || sprite.height <= 0) {
+          console.warn('Store: Sprite with invalid dimensions detected', sprite);
+          return;
+        }
+        maxWidth = Math.max(maxWidth, sprite.width);
+        maxHeight = Math.max(maxHeight, sprite.height);
+      });
 
-    cellSize.width = maxWidth;
-    cellSize.height = maxHeight;
+      if (maxWidth === 0 || maxHeight === 0) {
+        console.error('Store: Failed to calculate valid cell size');
+        return;
+      }
 
-    updateCanvasSize();
+      console.log('Store: Cell size calculated', maxWidth, maxHeight);
+      cellSize.width = maxWidth;
+      cellSize.height = maxHeight;
+
+      updateCanvasSize();
+    } catch (error) {
+      console.error('Store: Error updating cell size:', error);
+    }
   }
 
   function updateCanvasSize() {
-    if (!canvas.value || sprites.value.length === 0) return;
+    console.log('Store: Updating canvas size');
+    if (!canvas.value) {
+      console.error('Store: Canvas not available for size update');
+      return;
+    }
 
-    const totalSprites = sprites.value.length;
-    const cols = columns.value;
-    const rows = Math.ceil(totalSprites / cols);
+    if (sprites.value.length === 0) {
+      console.log('Store: No sprites to determine canvas size');
+      return;
+    }
 
-    canvas.value.width = cols * cellSize.width;
-    canvas.value.height = rows * cellSize.height;
+    try {
+      const totalSprites = sprites.value.length;
+      const cols = columns.value;
+      const rows = Math.ceil(totalSprites / cols);
+
+      if (cellSize.width <= 0 || cellSize.height <= 0) {
+        console.error('Store: Invalid cell size for canvas update', cellSize);
+        return;
+      }
+
+      const newWidth = cols * cellSize.width;
+      const newHeight = rows * cellSize.height;
+
+      console.log('Store: Setting canvas size to', newWidth, newHeight);
+      canvas.value.width = newWidth;
+      canvas.value.height = newHeight;
+    } catch (error) {
+      console.error('Store: Error updating canvas size:', error);
+    }
   }
 
   function autoArrangeSprites() {
-    if (sprites.value.length === 0) return;
+    console.log('Store: Auto-arranging sprites');
+    if (sprites.value.length === 0) {
+      console.log('Store: No sprites to arrange');
+      return;
+    }
 
-    sprites.value.forEach((sprite, index) => {
-      const column = index % columns.value;
-      const row = Math.floor(index / columns.value);
+    try {
+      if (cellSize.width <= 0 || cellSize.height <= 0) {
+        console.error('Store: Invalid cell size for auto-arranging', cellSize);
+        return;
+      }
 
-      sprite.x = column * cellSize.width;
-      sprite.y = row * cellSize.height;
-    });
+      sprites.value.forEach((sprite, index) => {
+        const column = index % columns.value;
+        const row = Math.floor(index / columns.value);
 
-    renderSpritesheetPreview();
+        sprite.x = column * cellSize.width;
+        sprite.y = row * cellSize.height;
+        console.log(`Store: Positioned sprite ${index} at (${sprite.x}, ${sprite.y})`);
+      });
 
-    if (!animation.isPlaying && animation.manualUpdate && isModalOpen.value) {
-      renderAnimationFrame(animation.currentFrame);
+      renderSpritesheetPreview();
+
+      if (!animation.isPlaying && animation.manualUpdate && isModalOpen.value) {
+        renderAnimationFrame(animation.currentFrame);
+      }
+
+      console.log('Store: Sprites arranged successfully');
+    } catch (error) {
+      console.error('Store: Error auto-arranging sprites:', error);
     }
   }
 
   function renderSpritesheetPreview(showGrid = true) {
-    if (!ctx.value || !canvas.value || sprites.value.length === 0) return;
-
-    ctx.value.clearRect(0, 0, canvas.value.width, canvas.value.height);
-
-    if (showGrid) {
-      drawGrid();
+    console.log('Store: Rendering spritesheet preview');
+    if (!ctx.value || !canvas.value) {
+      console.error('Store: Canvas or context not available for rendering');
+      return;
     }
 
-    sprites.value.forEach(sprite => {
-      ctx.value!.drawImage(sprite.img, sprite.x, sprite.y);
-    });
+    if (sprites.value.length === 0) {
+      console.log('Store: No sprites to render');
+      return;
+    }
+
+    try {
+      ctx.value.clearRect(0, 0, canvas.value.width, canvas.value.height);
+
+      if (showGrid) {
+        drawGrid();
+      }
+
+      sprites.value.forEach((sprite, index) => {
+        try {
+          if (!sprite.img || sprite.img.width === 0 || sprite.img.height === 0) {
+            console.warn(`Store: Invalid sprite at index ${index}, skipping render`);
+            return;
+          }
+          ctx.value!.drawImage(sprite.img, sprite.x, sprite.y);
+        } catch (spriteError) {
+          console.error(`Store: Error rendering sprite at index ${index}:`, spriteError);
+        }
+      });
+      console.log('Store: Spritesheet preview rendered successfully');
+    } catch (error) {
+      console.error('Store: Error rendering spritesheet preview:', error);
+    }
   }
 
   function drawGrid() {