'use client';

import { useTheme } from '@/components/providers/theme-provider';

export const MAPBOX_STYLE_LIGHT = 'mapbox://styles/mapbox/streets-v12';
export const MAPBOX_STYLE_DARK = 'mapbox://styles/mapbox/dark-v11';

/**
 * Resolve the Mapbox style URL for the current app theme. Call this inside
 * the map component and pass the result to `new mapboxgl.Map({ style })` AND
 * call `map.setStyle(style)` whenever it changes.
 */
export function useMapboxStyle(): string {
  const { theme } = useTheme();
  return theme === 'dark' ? MAPBOX_STYLE_DARK : MAPBOX_STYLE_LIGHT;
}