import { createTour } from '@oppla-ai/tours';

const tour = createTour({
  id: 'feature-tour',
  steps: [
    {
      type: 'fork',
      conditions: [
        {
          condition: () => document.querySelector('#premium-feature') !== null,
          steps: [
            {
              type: 'tooltip',
              target: '#premium-feature',
              content: 'Try our premium feature!'
            }
          ]
        },
        {
          condition: () => true,
          steps: [
            {
              type: 'tooltip',
              target: '#basic-feature',
              content: 'Try our basic feature!'
            }
          ]
        }
      ]
    }
  ]
});

tour.start();

{
  type: 'fork',
  conditions: [
    {
      condition: () => user.isPremium,
      steps: [
        {
          type: 'tooltip',
          target: '#premium-feature',
          content: 'Premium feature available!'
        }
      ]
    },
    {
      condition: () => true,
      steps: [
        {
          type: 'tooltip',
          target: '#basic-feature',
          content: 'Basic feature available!'
        }
      ]
    }
  ],
  defaultSteps: [
    {
      type: 'tooltip',
      target: '#default-feature',
      content: 'Default feature available!'
    }
  ]
}

{
  type: 'fork',
  conditions: [
    {
      condition: () => userAction === 'click',
      target: '#upgrade-button',
      steps: [
        {
          type: 'modal',
          content: 'Would you like to upgrade?'
        }
      ]
    },
    {
      condition: () => userAction === 'click',
      target: '#learn-more-button',
      steps: [
        {
          type: 'modal',
          content: 'Learn more about our features'
        }
      ]
    }
  ]
}

{
  type: 'fork',
  conditions: [
    {
      condition: () => {
        return user.isPremium && user.hasCompletedOnboarding;
      },
      steps: [
        {
          type: 'tooltip',
          target: '#advanced-feature',
          content: 'Try our advanced feature!'
        }
      ]
    },
    {
      condition: () => user.isPremium,
      steps: [
        {
          type: 'tooltip',
          target: '#premium-feature',
          content: 'Complete onboarding to unlock advanced features!'
        }
      ]
    }
  ]
}