// hooks/useRoute.ts
import { reactive } from 'vue'

const routeState = reactive({
  path: '',
  query: {} as Record<string, any>
})

function isSameQuery(a: Record<string, any>, b: Record<string, any>) {
  const aKeys = Object.keys(a || {})
  const bKeys = Object.keys(b || {})
  if (aKeys.length !== bKeys.length) return false
  return aKeys.every((key) => String(a[key]) === String(b[key]))
}

export function updateRoute() {
  const pages = getCurrentPages()
  const current = pages[pages.length - 1]

  if (current) {
    const nextPath = '/' + (current.route || '')
    const nextQuery = { ...(current.options || {}) }

    if (routeState.path === nextPath && isSameQuery(routeState.query, nextQuery)) {
      return
    }

    routeState.path = nextPath
    routeState.query = nextQuery
  }
}

export default function useRoute() {
  return routeState
}