Resolve wheel destinations

Use wheel-destination:resolve to change what happens after a wheel is selected. The hook receives the current destination and available public product context.

Open a customer product page

import {
  PLUGIN_API_VERSION,
  definePlugin,
  type PluginWheelRecord,
} from '@iconfigurators/plugin-sdk'

export default definePlugin({
  id: 'customer.product-destination',
  version: '1.0.0',
  apiVersion: PLUGIN_API_VERSION,

  setup(api) {
    api.hooks.filter('wheel-destination:resolve', (request) => {
      const wheel = request.wheel as PluginWheelRecord
      if (!wheel.wheelImageId) return request

      return {
        ...request,
        destination: {
          type: 'external',
          url: `/products/wheels/${encodeURIComponent(String(wheel.wheelImageId))}`,
          target: '_self',
        },
      }
    })
  },
})

Relative URLs resolve against the embedding website. Use _blank only when opening a new tab is an intentional part of the customer experience.

Preserve destinations you do not own

Return the request unchanged when the plugin cannot produce a valid destination or when the source does not match the intended workflow:

api.hooks.filter('wheel-destination:resolve', (request) => {
  if (request.source !== 'by-brand') return request

  const wheel = request.wheel as PluginWheelRecord
  const productId = wheel.wheelImageId
  if (!productId) return request

  return {
    ...request,
    destination: {
      type: 'external',
      url: `/YOUR_PRODUCT_PATH/${encodeURIComponent(String(productId))}`,
    },
  }
})

Supported destination types are route, external, and cancel. Prefer semantic commands for plugin-owned buttons; use this hook specifically to resolve wheel-selection behavior.