hnh-map/frontend-nuxt/composables/useMapBookmarks.ts

export interface MapBookmark {
  id: string
  name: string
  mapId: number
  x: number
  y: number
  zoom?: number
  createdAt: number
}

const STORAGE_KEY = 'hnh-map-bookmarks'
const MAX_BOOKMARKS = 50

const BOOKMARKS_STATE_KEY = 'hnh-map-bookmarks-state'

function loadBookmarks(): MapBookmark[] {
  if (import.meta.server) return []
  try {
    const raw = localStorage.getItem(STORAGE_KEY)
    if (!raw) return []
    const parsed = JSON.parse(raw) as MapBookmark[]
    return Array.isArray(parsed) ? parsed : []
  } catch {
    return []
  }
}

function saveBookmarks(bookmarks: MapBookmark[]) {
  if (import.meta.server) return
  try {
    localStorage.setItem(STORAGE_KEY, JSON.stringify(bookmarks.slice(0, MAX_BOOKMARKS)))
  } catch (_) {}
}

export function useMapBookmarks() {
  const bookmarks = useState<MapBookmark[]>(BOOKMARKS_STATE_KEY, () => [])

  function refresh() {
    bookmarks.value = loadBookmarks()
  }

  function add(bookmark: Omit<MapBookmark, 'id' | 'createdAt'>) {
    const list = loadBookmarks()
    const id = `b-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`
    const created: MapBookmark = {
      ...bookmark,
      id,
      createdAt: Date.now(),
    }
    list.unshift(created)
    saveBookmarks(list)
    refresh()
    return id
  }

  function remove(id: string) {
    const list = loadBookmarks().filter((b) => b.id !== id)
    saveBookmarks(list)
    refresh()
  }

  function clear() {
    saveBookmarks([])
    refresh()
  }

  onMounted(refresh)

  return {
    bookmarks: readonly(bookmarks),
    refresh,
    add,
    remove,
    clear,
  }
}