function CheckoutRoute() {
  const useNewFlow = useBooleanFlag("new-checkout", false)
  return useNewFlow ? <NewCheckoutRoute /> : <ClassicCheckoutRoute />
}

function SearchResults() {
  const pageSize = useNumberFlag("search-page-size", 20)
  const emptyCopy = useStringFlag("search-empty-copy", "No results")

  return <Results pageSize={pageSize} emptyCopy={emptyCopy} />
}

<SuperflagProvider
  clientKey={clientKey}
  targetingKey={organization.id}
  attributes={{ plan: organization.plan }}
>
  <Workspace />
</SuperflagProvider>

const details = useBooleanFlagDetails("new-checkout", false)

supportContext.add({
  variation: details.variation,
  reason: details.reason,
  configVersion: details.configVersion,
  source: details.source,
})

const enabled = useBooleanFlag("new-checkout", false)
const client = useSuperflagClient()

async function completeCheckout() {
  await submitOrder()
  if (enabled) {
    await client.track("new-checkout", "checkout-conversion")
  }
}