Skip to content

[Onboarding] Walkthrough: Deploy Prompt #3502

Description

@mmabrouk

Parent: #3051

Summary

Implement a guided tour that teaches users how to deploy a prompt version and access it via API.

Tour ID: deploy-prompt

Completion event: variant_deployed

Behind env var: NEXT_PUBLIC_ENABLE_WALKTHROUGHS=true

Steps

# Icon Title Content Selector
1 🚀 Deploy Your Prompt Once you have a prompt version you like, you can deploy it to an environment. Let me show you how. (centered)
2 📋 Open the Registry The registry shows all your committed prompt versions. Click here to open it. [data-tour="registry-nav"]
3 📄 Select a Version Click on a version to see its details. [data-tour="version-row"]
4 🌐 Deploy to an Environment Click Deploy to make this version available via API. You can deploy to staging or production. [data-tour="deploy-button"]
5 🔗 View the API Code Click here to see the code snippet for calling your deployed prompt. Copy this into your application. [data-tour="api-code-button"]

Implementation Tasks

  • Add data-tour attributes to registry/deployment UI elements
  • Create tour definition in components/Onboarding/tours/
  • Register tour with tourRegistry
  • Step 5 should open the API code drawer (use onEnter hook)
  • Fire variant_deployed event on completion

Acceptance Criteria

  • Tour only runs when NEXT_PUBLIC_ENABLE_WALKTHROUGHS=true
  • All 5 steps render with correct copy
  • Selectors target correct elements
  • Step 5 opens the API code drawer
  • Completion event fires when tour finishes

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions