Fix jwt-token

client/src/main.jsx

@@ -3,6 +3,19 @@ import ReactDOM from 'react-dom/client'
 import App from './App.jsx'
 import './index.css'
 
+// Suppress browser extension errors in development
+if (process.env.NODE_ENV === 'development') {
+  const originalError = console.error;
+  console.error = (...args) => {
+    // Filter out extension-related errors
+    const message = args[0]?.toString() || '';
+    if (message.includes('content.js') || message.includes('checkoutUrls')) {
+      return; // Suppress extension errors
+    }
+    originalError.apply(console, args);
+  };
+}
+
 ReactDOM.createRoot(document.getElementById('root')).render(
   <React.StrictMode>
     <App />

client/src/pages/MapView.jsx

@@ -30,7 +30,9 @@ const FitBounds = ({ bounds, shouldFit }) => {
   const map = useMap();
   
   useEffect(() => {
+    console.log('FitBounds: useEffect triggered - bounds:', bounds, 'shouldFit:', shouldFit);
     if (bounds && bounds.length === 2 && shouldFit) {
+      console.log('FitBounds: Calling map.fitBounds with bounds:', bounds);
       map.fitBounds(bounds, { padding: [20, 20] });
     }
   }, [bounds, map, shouldFit]);
@@ -103,6 +105,8 @@ const createDroneIcon = (rssi, droneType) => {
 };
 
 const MapView = () => {
+  console.log('MapView: Component render started');
+  
   const [devices, setDevices] = useState([]);
   const [selectedDevice, setSelectedDevice] = useState(null);
   const [loading, setLoading] = useState(true);
@@ -171,10 +175,12 @@ const MapView = () => {
       // Debug: Check if token exists before making request
       const token = localStorage.getItem('token');
       console.log('MapView: fetchDevices - Token exists:', !!token, 'Token length:', token?.length);
+      console.log('MapView: fetchDevices - Current state before fetch - isInitialLoad:', isInitialLoad, 'shouldFitBounds:', shouldFitBounds);
       
       const response = await api.get('/devices/map');
       const deviceData = response.data.data;
       
+      console.log('MapView: fetchDevices - Device data received, length:', deviceData.length);
       setDevices(deviceData);
       
       // Calculate bounds dynamically based on device locations
@@ -287,7 +293,8 @@ const MapView = () => {
       <div className="bg-white rounded-lg shadow-lg overflow-hidden">
         <div className="h-96 lg:h-[600px] relative">
           <MapContainer
-            center={mapCenter}
+            key="drone-map" // Static key to prevent re-creation
+            center={[59.3293, 18.0686]} // Static center - Stockholm
             zoom={mapZoom}
             className="h-full w-full"
           >