Extract components

frontend/src/components/map/map-page/LoadingOverlay.tsx

@@ -0,0 +1,20 @@
+import { SpinnerIcon } from '../../ui/icons/SpinnerIcon';
+
+interface LoadingOverlayProps {
+  show: boolean;
+}
+
+export function LoadingOverlay({ show }: LoadingOverlayProps) {
+  if (!show) return null;
+
+  return (
+    <div className="absolute inset-0 z-50 flex items-center justify-center bg-warm-50/80 dark:bg-navy-950/80 backdrop-blur-sm">
+      <div className="flex flex-col items-center gap-4">
+        <SpinnerIcon className="w-12 h-12 text-teal-600 dark:text-teal-400 animate-spin" />
+        <p className="text-warm-600 dark:text-warm-300 text-sm font-medium">
+          Connecting to server...
+        </p>
+      </div>
+    </div>
+  );
+}