Composables
useAnalytics
Client-side analytics event tracking — page views, click-throughs, FAQ views, and search impressions/clicks. Failures are swallowed so analytics never break the UI.
useAnalytics
Client-side analytics composable. Posts events to ${apiEndpoint}/public/analytics/track along with a per-tab session id stored in sessionStorage under xrd_session_id. All operations are guarded by import.meta.server checks (so the composable is a no-op during SSR) and wrapped in try/catch that silently swallows errors — analytics must never break the UI.
Usage
const { trackPageView, trackClickWebsite, trackClickPhone } = useAnalytics()
// Generic event — pick from the typed eventType union
trackEvent("rest_123", "page_view")
// Convenience wrappers
trackPageView("rest_123")
trackClickWebsite("rest_123")
trackClickPhone("rest_123")
trackClickMap("rest_123")
trackFaqView("rest_123")
trackSearchImpression("rest_123")
trackSearchClick("rest_123")
Returns
| Key | Type | Description |
|---|---|---|
trackEvent | (restaurantId: string, eventType: EventType, eventData?: Record<string, unknown>, source?: string) => Promise<void> | Generic POST to the analytics endpoint. No-op on the server and on errors. |
trackPageView | (restaurantId: string) => void | Convenience wrapper for eventType: "page_view". |
trackClickWebsite | (restaurantId: string) => void | Convenience wrapper for eventType: "click_website". |
trackClickPhone | (restaurantId: string) => void | Convenience wrapper for eventType: "click_phone". |
trackClickMap | (restaurantId: string) => void | Convenience wrapper for eventType: "click_map". |
trackFaqView | (restaurantId: string) => void | Convenience wrapper for eventType: "faq_view". |
trackSearchImpression | (restaurantId: string) => void | Convenience wrapper for eventType: "search_impression". |
trackSearchClick | (restaurantId: string) => void | Convenience wrapper for eventType: "search_click". |
Event types
type EventType =
| "page_view"
| "click_website"
| "click_phone"
| "click_map"
| "review_submit"
| "faq_view"
| "search_impression"
| "search_click"
Session id
A xrd_session_id is generated lazily via crypto.randomUUID() and persisted in sessionStorage. It is included on every event payload under sessionId so the server can correlate events within a single browser tab.
AI Context
composable: useAnalytics
package: "@xenterprises/nuxt-x-restaurants"
use-when: >
Tracking restaurant profile views, outbound click-throughs (website/phone/map),
FAQ views, and search impressions/clicks from the client side. The composable
is automatically used by the restaurants/[slug].vue layout to track page
views. Use the convenience wrappers from profile sub-components or call
trackEvent() directly with a typed eventType.