@kasuvia/sdk 0.0.1

package/src/hooks/index.ts

@@ -0,0 +1,26 @@
+/**
+ * Hooks Barrel Export
+ * 
+ * Central export point for all React Query hooks.
+ */
+
+export * from './use-cart'
+export * from './use-orders'
+export * from './use-auth'
+export * from './use-countries'
+export * from './use-states'
+export * from './use-languages'
+export * from './use-currencies'
+export * from './use-bespoke-availability'
+export * from './use-collections'
+export * from './use-products'
+export * from './use-wishlist'
+export * from './use-service-booking'
+export * from './use-consultations'
+export * from './use-consultation-stream'
+export * from './use-order-stream'
+export * from './use-is-mounted'
+export * from './use-google-translate'
+export * from './use-payment'
+export * from './use-cms'
+

package/src/hooks/use-auth.ts

@@ -0,0 +1,182 @@
+/**
+ * Auth Hook & Context Provider
+ *
+ * Provides customer authentication state and modal controls across the storefront.
+ */
+import React, { createContext, useContext, useState, useEffect, useCallback, type ReactNode } from 'react'
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
+import { getAuthUser, loginCustomer, registerCustomer, updateProfile, logout as logoutService, silentRefresh } from '../services/auth.service'
+import { tokenStore } from '../client/authClient'
+import { resetGraphQLClient } from '../client/graphqlClient'
+import { logger } from '../utils/logger'
+import type {
+  CustomerLoginPayload,
+  CustomerRegisterPayload,
+  UpdateProfilePayload,
+  CustomerUser,
+  AuthContextValue,
+} from '../types/auth'
+
+// ── React Context ────────────────────────────────────────────────────────────
+
+export const AuthCtx = React.createContext ? React.createContext<AuthContextValue | null>(null) : null
+
+export function AuthProvider({ children }: { children: ReactNode }) {
+  const [customer, setCustomer] = useState<CustomerUser | null>(null)
+  const [isLoading, setIsLoading] = useState(true)
+  const [isModalOpen, setIsModalOpen] = useState(false)
+
+  // Rehydrate session from stored refresh token on app boot
+  useEffect(() => {
+    let voided = false
+    ;(async () => {
+      setIsLoading(true)
+      try {
+        const result = await silentRefresh()
+        if (!voided && result) {
+          setCustomer(result.user)
+          resetGraphQLClient()
+        }
+      } catch (error: unknown) {
+        logger.error('[AuthProvider] Session restore failed:', error)
+        if (!voided) setCustomer(null)
+      } finally {
+        if (!voided) setIsLoading(false)
+      }
+    })()
+    return () => {
+      voided = true
+    }
+  }, [])
+
+  const openModal = useCallback(() => setIsModalOpen(true), [])
+  const closeModal = useCallback(() => {
+    setIsModalOpen(false)
+    if (typeof window !== 'undefined' && (window.location.hash === '#login' || window.location.hash === '#signup')) {
+      window.history.replaceState(null, '', window.location.pathname + window.location.search)
+    }
+  }, [])
+
+  // Listen for #login and #signup hashes to open modal automatically
+  useEffect(() => {
+    const handleHash = () => {
+      if (typeof window === 'undefined') return
+      if (window.location.hash === '#login' || window.location.hash === '#signup') {
+        if (!isLoading && customer) {
+          window.history.replaceState(null, '', window.location.pathname + window.location.search)
+        } else if (!isLoading && !customer) {
+          setIsModalOpen(true)
+        }
+      }
+    }
+    handleHash()
+    window.addEventListener('hashchange', handleHash)
+    return () => window.removeEventListener('hashchange', handleHash)
+  }, [customer, isLoading])
+
+  // Reset GraphQL client when customer state changes to ensure auth headers are included
+  useEffect(() => {
+    resetGraphQLClient()
+  }, [customer])
+
+  const handleLogout = useCallback(async () => {
+    await logoutService()
+    setCustomer(null)
+    setIsModalOpen(false)
+    resetGraphQLClient()
+  }, [])
+
+  const value: AuthContextValue = {
+    customer,
+    isLoading,
+    isModalOpen,
+    openModal,
+    closeModal,
+    setCustomer,
+    logout: handleLogout,
+  }
+
+  if (!AuthCtx) return children
+  return React.createElement(AuthCtx.Provider, { value }, children)
+}
+
+// ── Hooks ────────────────────────────────────────────────────────────────────
+
+export function useAuthUser() {
+  return useQuery({
+    queryKey: ['auth-user'],
+    queryFn: getAuthUser,
+    enabled: !!tokenStore.getAccessToken(),
+  })
+}
+
+export function useLogin() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: loginCustomer,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['auth-user'] })
+      queryClient.invalidateQueries({ queryKey: ['cart'] })
+    },
+  })
+}
+
+export function useRegister() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: registerCustomer,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['auth-user'] })
+      queryClient.invalidateQueries({ queryKey: ['cart'] })
+    },
+  })
+}
+
+export function useUpdateProfile() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: updateProfile,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['auth-user'] })
+    },
+  })
+}
+
+export function useLogout() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: logoutService,
+    onSuccess: () => {
+      queryClient.clear()
+    },
+  })
+}
+
+/**
+ * useAuth()
+ * Consumes the AuthCtx provider value. Falls back to local hook query if no provider exists.
+ */
+export function useAuth(): AuthContextValue {
+  const context = AuthCtx ? useContext(AuthCtx) : null
+  if (context) return context
+
+  // Fallback if useAuth is called outside AuthProvider (e.g. simple SSR/unit tests)
+  const authUserQuery = useAuthUser()
+  const logoutMutation = useLogout()
+
+  return {
+    customer: authUserQuery.data as CustomerUser | null,
+    isLoading: authUserQuery.isLoading,
+    isModalOpen: false,
+    openModal: () => {},
+    closeModal: () => {},
+    setCustomer: () => {},
+    logout: async () => {
+      await logoutMutation.mutateAsync()
+    },
+  }
+}

package/src/hooks/use-bespoke-availability.ts

@@ -0,0 +1,20 @@
+/**
+ * Bespoke Availability Hook
+ * 
+ * React Query hook for checking bespoke service availability.
+ */
+import { useQuery } from '@tanstack/react-query'
+import { bespokeService } from '../services/bespoke.service'
+import type { BespokeAvailability } from '../types/consultations'
+
+/**
+ * Get bespoke availability for a product
+ */
+export function useBespokeAvailability(product_id: string) {
+  return useQuery({
+    queryKey: ['bespoke-availability', product_id],
+    queryFn: () => bespokeService.checkAvailability(product_id),
+    enabled: !!product_id,
+    retry: false, // Don't retry if no config exists (returns 404)
+  })
+}

package/src/hooks/use-cart.ts

@@ -0,0 +1,207 @@
+/**
+ * Cart Hook & Context Provider
+ *
+ * React Query hooks for cart operations with unified drawer state sharing.
+ */
+import React, { createContext, useContext, useState, type ReactNode } from 'react'
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
+import { getCart, addToCart, updateCartItem, removeFromCart, clearCart, mergeGuestCartIfPresent } from '../services/cart.service'
+import { isInitialized } from '../config'
+import type { CartItem, CartResponse, Product } from '../types/store'
+import axios from 'axios'
+
+interface ProductTypeMismatchDetail {
+  code?: string
+  message?: string
+  existing_type?: string
+  new_type?: string
+}
+
+export interface UseCartReturn {
+  cart: CartResponse | undefined
+  items: CartItem[]
+  count: number
+  isOpen: boolean
+  setOpen: (open: boolean) => void
+  isLoading: boolean
+  error: Error | null
+  addToCart: (item: {
+    product_id: string
+    product_slug: string
+    product_name: string
+    image?: string
+    variant_id?: string
+    variant_attributes?: string
+    unit_price: number
+    quantity: number
+    custom_measurements?: string
+    is_bespoke: boolean
+  }) => void
+  updateCartItem: (variables: { itemId: string; quantity: number }) => void
+  removeFromCart: (itemId: string) => void
+  clearCart: () => void
+  clear: () => void
+  mergeGuestCart: () => void
+  addItem: (product: Product, variantId?: string, quantity?: number, customMeasurements?: Record<string, string>) => void
+  updateQty: (itemId: string, quantity: number) => void
+  removeItem: (itemId: string) => void
+  subtotal: number
+  productTypeMismatch: {
+    message: string
+    existing_type: string
+    new_type: string
+  } | null
+  handleClearCartAndAdd: () => void
+  handleKeepCurrentCart: () => void
+}
+
+// ── React Context for Shared Drawer State ─────────────────────────────────────
+
+export interface CartContextValue {
+  isOpen: boolean
+  setOpen: (open: boolean) => void
+}
+
+export const CartCtx = React.createContext ? React.createContext<CartContextValue | null>(null) : null
+
+export function CartProvider({ children }: { children: ReactNode }) {
+  const [isOpen, setIsOpen] = useState(false)
+  if (!CartCtx) return children
+  return React.createElement(CartCtx.Provider, { value: { isOpen, setOpen: setIsOpen } }, children)
+}
+
+// ── Hook ──────────────────────────────────────────────────────────────────────
+
+export function useCart(): UseCartReturn {
+  const queryClient = useQueryClient()
+  const context = CartCtx ? useContext(CartCtx) : null
+
+  const isOpen = context ? context.isOpen : false
+  const setOpen = context ? context.setOpen : () => {}
+
+  // Track product type mismatch errors from cart operations
+  const [productTypeMismatch, setProductTypeMismatch] = useState<{
+    message: string
+    existing_type: string
+    new_type: string
+  } | null>(null)
+
+  const cartQuery = useQuery({
+    queryKey: ['cart'],
+    queryFn: getCart,
+    enabled: isInitialized(),
+  })
+
+  const addToCartMutation = useMutation({
+    mutationFn: addToCart,
+    onSuccess: () => {
+      setProductTypeMismatch(null) // Clear error on success
+      queryClient.invalidateQueries({ queryKey: ['cart'] })
+    },
+    onError: (error: unknown) => {
+      // Handle product type mismatch errors from backend
+      if (axios.isAxiosError(error) && error.response?.status === 409) {
+        const responseData = error.response?.data as { detail?: ProductTypeMismatchDetail } | undefined
+        const errorDetail = responseData?.detail
+        if (errorDetail?.code === 'CART_PRODUCT_TYPE_MISMATCH') {
+          setProductTypeMismatch({
+            message: errorDetail.message ?? 'Your cart contains incompatible items.',
+            existing_type: errorDetail.existing_type ?? 'physical',
+            new_type: errorDetail.new_type ?? 'physical',
+          })
+        }
+      }
+    },
+  })
+
+  const updateCartItemMutation = useMutation({
+    mutationFn: ({ itemId, quantity }: { itemId: string; quantity: number }) =>
+      updateCartItem(itemId, quantity),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['cart'] })
+    },
+  })
+
+  const removeFromCartMutation = useMutation({
+    mutationFn: removeFromCart,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['cart'] })
+    },
+  })
+
+  const clearCartMutation = useMutation({
+    mutationFn: clearCart,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['cart'] })
+    },
+  })
+
+  const mergeGuestCartMutation = useMutation({
+    mutationFn: mergeGuestCartIfPresent,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['cart'] })
+    },
+  })
+
+  // Convenience method for adding items with product object
+  const addItem = (product: Product, variantId?: string, quantity: number = 1, customMeasurements?: Record<string, string>) => {
+    const variant = variantId ? product.variants.find(v => v.id === variantId) : undefined
+    return addToCartMutation.mutate({
+      product_id: product.id,
+      product_slug: product.slug,
+      product_name: product.name,
+      image: product.images[0]?.url,
+      variant_id: variantId,
+      variant_attributes: variant?.attributes ? JSON.stringify(variant.attributes) : undefined,
+      unit_price: variant?.price ?? product.base_price,
+      quantity,
+      custom_measurements: customMeasurements ? JSON.stringify(customMeasurements) : undefined,
+      is_bespoke: product.is_bespoke,
+    })
+  }
+
+  // Helper methods for storefront compatibility
+  const items = cartQuery.data?.items || []
+  const subtotal = cartQuery.data?.subtotal || 0
+  const count = items.reduce((total, item) => total + item.quantity, 0)
+
+  const updateQty = (itemId: string, quantity: number) => {
+    updateCartItemMutation.mutate({ itemId, quantity })
+  }
+
+  const removeItem = (itemId: string) => {
+    removeFromCartMutation.mutate(itemId)
+  }
+
+  const handleClearCartAndAdd = () => {
+    clearCartMutation.mutate()
+    setProductTypeMismatch(null)
+  }
+
+  const handleKeepCurrentCart = () => {
+    setProductTypeMismatch(null)
+  }
+
+  return {
+    cart: cartQuery.data,
+    items,
+    count,
+    isOpen,
+    setOpen,
+    isLoading: cartQuery.isLoading,
+    error: cartQuery.error,
+    addToCart: addToCartMutation.mutate,
+    updateCartItem: updateCartItemMutation.mutate,
+    removeFromCart: removeFromCartMutation.mutate,
+    clearCart: clearCartMutation.mutate,
+    clear: clearCartMutation.mutate, // Alias for storefront compatibility
+    mergeGuestCart: mergeGuestCartMutation.mutate,
+    addItem,
+    updateQty,
+    removeItem,
+    subtotal,
+    productTypeMismatch,
+    handleClearCartAndAdd,
+    handleKeepCurrentCart,
+  }
+}

package/src/hooks/use-cms.ts

@@ -0,0 +1,165 @@
+/**
+ * CMS Hooks
+ *
+ * React Query hooks for CMS model and entry operations.
+ */
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
+import {
+  listCmsEntries,
+  getCmsEntry,
+  createCmsEntry,
+  updateCmsEntry,
+  deleteCmsEntry,
+} from '../services/cms.service'
+import { isInitialized } from '../config'
+import type {
+  CmsEntry,
+  CmsEntryListResponse,
+  CreateCmsEntryParams,
+  UpdateCmsEntryParams,
+  ListCmsEntriesParams,
+} from '../types/cms'
+
+export interface UseCmsEntriesReturn {
+  entries: CmsEntry[]
+  total: number
+  page: number
+  page_size: number
+  isLoading: boolean
+  error: Error | null
+  refetch: () => void
+}
+
+/**
+ * Hook to list CMS entries for a specific model.
+ */
+export function useCmsEntries(
+  modelSlug: string,
+  params?: ListCmsEntriesParams
+): UseCmsEntriesReturn {
+  const query = useQuery({
+    queryKey: ['cms-entries', modelSlug, params],
+    queryFn: () => listCmsEntries(modelSlug, params),
+    enabled: isInitialized() && !!modelSlug,
+  })
+
+  return {
+    entries: query.data?.entries || [],
+    total: query.data?.total || 0,
+    page: query.data?.page || 1,
+    page_size: query.data?.page_size || 50,
+    isLoading: query.isLoading,
+    error: query.error as Error | null,
+    refetch: query.refetch,
+  }
+}
+
+export interface UseCmsEntryReturn {
+  entry: CmsEntry | undefined
+  isLoading: boolean
+  error: Error | null
+  refetch: () => void
+}
+
+/**
+ * Hook to get a single CMS entry by ID.
+ */
+export function useCmsEntry(
+  modelSlug: string,
+  entryId: string
+): UseCmsEntryReturn {
+  const query = useQuery({
+    queryKey: ['cms-entry', modelSlug, entryId],
+    queryFn: () => getCmsEntry(modelSlug, entryId),
+    enabled: isInitialized() && !!modelSlug && !!entryId,
+  })
+
+  return {
+    entry: query.data,
+    isLoading: query.isLoading,
+    error: query.error as Error | null,
+    refetch: query.refetch,
+  }
+}
+
+export interface UseCreateCmsEntryReturn {
+  createEntry: (params: CreateCmsEntryParams) => void
+  isLoading: boolean
+  error: Error | null
+}
+
+/**
+ * Hook to create a new CMS entry.
+ */
+export function useCreateCmsEntry(modelSlug: string): UseCreateCmsEntryReturn {
+  const queryClient = useQueryClient()
+
+  const mutation = useMutation({
+    mutationFn: (params: CreateCmsEntryParams) => createCmsEntry(modelSlug, params),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['cms-entries', modelSlug] })
+    },
+  })
+
+  return {
+    createEntry: mutation.mutate,
+    isLoading: mutation.isPending,
+    error: mutation.error as Error | null,
+  }
+}
+
+export interface UseUpdateCmsEntryReturn {
+  updateEntry: (entryId: string, params: UpdateCmsEntryParams) => void
+  isLoading: boolean
+  error: Error | null
+}
+
+/**
+ * Hook to update an existing CMS entry.
+ */
+export function useUpdateCmsEntry(modelSlug: string): UseUpdateCmsEntryReturn {
+  const queryClient = useQueryClient()
+
+  const mutation = useMutation({
+    mutationFn: ({ entryId, params }: { entryId: string; params: UpdateCmsEntryParams }) =>
+      updateCmsEntry(modelSlug, entryId, params),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['cms-entries', modelSlug] })
+      queryClient.invalidateQueries({ queryKey: ['cms-entry', modelSlug] })
+    },
+  })
+
+  return {
+    updateEntry: (entryId: string, params: UpdateCmsEntryParams) =>
+      mutation.mutate({ entryId, params }),
+    isLoading: mutation.isPending,
+    error: mutation.error as Error | null,
+  }
+}
+
+export interface UseDeleteCmsEntryReturn {
+  deleteEntry: (entryId: string) => void
+  isLoading: boolean
+  error: Error | null
+}
+
+/**
+ * Hook to delete a CMS entry.
+ */
+export function useDeleteCmsEntry(modelSlug: string): UseDeleteCmsEntryReturn {
+  const queryClient = useQueryClient()
+
+  const mutation = useMutation({
+    mutationFn: (entryId: string) => deleteCmsEntry(modelSlug, entryId),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['cms-entries', modelSlug] })
+      queryClient.invalidateQueries({ queryKey: ['cms-entry', modelSlug] })
+    },
+  })
+
+  return {
+    deleteEntry: mutation.mutate,
+    isLoading: mutation.isPending,
+    error: mutation.error as Error | null,
+  }
+}

package/src/hooks/use-collections.ts

@@ -0,0 +1,40 @@
+/**
+ * Collections Hooks
+ * 
+ * React Query hooks for fetching collections.
+ */
+import { useQuery } from '@tanstack/react-query'
+import { getStorefrontCollections, getStorefrontCollectionBySlug } from '../services/collection.service'
+import type { ListParams } from '../types/store'
+import { getCacheTier } from '../utils/cache'
+
+export const collectionKeys = {
+  all:   ['core', 'collections'] as const,
+  list:  (params?: ListParams) => ['core', 'collections', 'list', params ?? {}] as const,
+  slug:  (slug: string) => ['core', 'collections', 'slug', slug] as const,
+}
+
+/**
+ * Hook to fetch paginated collections for the storefront.
+ */
+export function useStorefrontCollections(params?: ListParams) {
+  return useQuery({
+    queryKey: collectionKeys.list(params),
+    queryFn: () => getStorefrontCollections(params),
+    // medium — collections change infrequently
+    ...getCacheTier('medium'),
+  })
+}
+
+/**
+ * Hook to fetch a single collection by slug for the storefront.
+ */
+export function useStorefrontCollection(slug: string) {
+  return useQuery({
+    queryKey: collectionKeys.slug(slug),
+    queryFn: () => getStorefrontCollectionBySlug(slug),
+    // medium — collection details change infrequently
+    ...getCacheTier('medium'),
+    enabled: !!slug,
+  })
+}