sequenceDiagram
    actor User
    participant UI as TV Console UI
    participant API as TV API
    participant Stripe
    participant DB as TV Console DB
    participant Webhook as Stripe Webhook
    participant Slack

    User->>UI: TV Consoleにアクセス
    User->>UI: パッケージプランを選択<br/>(Basic/Standard/Premium)
    User->>UI: プランの購入を確認
    
    UI->>API: 注文作成をリクエスト
    API->>DB: ユーザーがpayment_provider_customer_idを持っているか確認
    
    alt StripeカスタマーIDがない場合
        API->>Stripe: カスタマーを作成
        Stripe-->>API: カスタマーIDを返却
        API->>DB: ユーザーをpayment_provider_customer_idで更新
    end
    
    API->>Stripe: チェックアウトセッションを作成<br/>(カスタマーIDを含む)
    Stripe-->>API: セッションIDを返却
    
    API->>DB: ユーザーレコードにウィッシュリストを作成<br/>注文履歴を作成(未払い)
    DB-->>API: 保存確認
    API-->>UI: チェックアウトセッションIDを返却
    
    UI->>Stripe: 支払いフォームにリダイレクト
    User->>Stripe: 支払い情報を入力
    
    Note over Stripe,Webhook: 支払い処理
    
    alt 支払い成功
        rect rgb(230, 230, 255)
            Webhook->>API: Webhook: checkout.session.completed
            
            API->>DB: トランザクション開始
            API->>DB: 注文履歴を更新<br/>(payment_intent_id, invoice_id,<br/>status, payment_status, paid_at)
            API->>DB: ウィッシュリストステータスをアクティブに更新
            API->>DB: トランザクションコミット
            
            API->>Slack: 購入成功の通知を送信
            
            API-->>UI: 成功ステータスを返却
            UI-->>User: 成功メッセージを表示
        end
    else 支払い失敗
        rect rgb(255, 200, 200)
            Note over Webhook,API: Stripeでの支払いが失敗
            
            API->>DB: 注文履歴を更新<br/>(status: failed)
            
            API-->>UI: エラーステータスを返却
            UI-->>User: 再試行オプション付きの<br/>失敗メッセージを表示
        end
    end