;
+ interactiveLayerIds?: string[];
+ handleMapClick?: (e: maplibregl.MapLayerMouseEvent) => void;
+ handleContextMenu?: (e: maplibregl.MapMouseEvent & maplibregl.Event) => void;
+ handleMapInteraction?: () => void;
+ onMouseMove?: (e: MapLayerMouseEvent) => void;
+ onMouseLeave?: () => void;
+ cursor?: string | null;
+};
+
+type MapView = {
+ longitude: number;
+ latitude: number;
+ zoom: number;
+};
+
+export default function MainMap({
+ id,
+ ref,
+ onMouseLeave,
+ onMouseMove,
+ children,
+ initialBound = [34.5468992, 52.7300532],
+ initialZoom = 5.5,
+ handleMapClick,
+ interactiveLayerIds,
+ mapLayer,
+ handleContextMenu,
+ handleMapInteraction,
+ cursor,
+}: MainMapProps) {
+ const { mapMove } = useMapMove();
+ const activeLayer = useMapLayersStore((s) => s.activeLayer);
+ const setIsMapMoving = useMapStore((s) => s.setIsMapMoving);
+
+ const parsed = useMemo(() => {
+ if (typeof window === "undefined") return null;
+ const saved = localStorage.getItem(STORAGE_KEY);
+ return saved ? (JSON.parse(saved) as MapView) : null;
+ }, []);
+
+ const MAP_STYLES = useMemo(
+ () => ({
+ dark: DARK_MAP_TILE,
+ bright: BRIGHT_MAP_TILE,
+ }),
+ []
+ );
+
+ return (
+
+
+
+ );
+}
diff --git a/src/components/UI/GroupAvatar.tsx b/src/components/UI/GroupAvatar.tsx
new file mode 100644
index 0000000..7c01a17
--- /dev/null
+++ b/src/components/UI/GroupAvatar.tsx
@@ -0,0 +1,36 @@
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/UI/avatar";
+
+export default function GroupAvatar() {
+ return (
+
+
+
+ U1
+
+
+
+ U2
+
+
+
+ U3
+
+
+
+ U3
+
+