一時ウィッシュリストグループ概要

はじめに

一時ウィッシュリストグループコンポーネントは、ユーザーが公式ウィッシュリストに変換する前に作成する一時ウィッシュリストを管理します。これらの一時ウィッシュリストにより、ユーザーは最終決定する準備ができるまで、サブスクリプション使用量に影響を与えることなく、商品選択、カテゴリ、検索クエリを準備できます。

システム概要図

---
config:
  theme: base
  layout: dagre
  flowchart:
    curve: linear
    htmlLabels: true
  themeVariables:
    edgeLabelBackground: "transparent"
---
flowchart TB
    %% External Services
    OpenAI((OpenAI API))
    CSVFile[(CSVファイル)]
    
    %% Database Tables
    TempWishlistDB[(temp_wishlist_to_groups)]
    TempProductDB[(temp_wishlist_products)]
    TempCategoryDB[(temp_wishlist_categories)]
    TempSearchQueryDB[(temp_wishlist_search_queries)]
    TempViewpointDB[(temp_wl_cat_vps<br/>temp_wl_cat_vp_details<br/>temp_wl_spec_vps)]
    
    %% User Actions Layer
    subgraph UserActions["ユーザーアクション"]
        direction LR
        CreateWishlist[一時ウィッシュリスト作成]
        AddProducts[商品追加]
        AddCategories[カテゴリ追加]
        AddSearchQueries[検索クエリ追加]
        ImportCSV[CSVデータインポート]
        GenerateViewpoints[AIビューポイント生成]
        ConvertToOfficial[公式に変換]
    end
    
    %% Processing Layer
    subgraph ProcessingLayer["処理層"]
        direction LR
        TempWishlistController[TempWishlistToGroupController]
        TempProductController[TempWishlistProductController]
        TempCategoryController[TempWishlistCategoryController]
        TempSearchQueryController[TempWishlistSearchQueryController]
        TempViewpointController[TempViewpointController]
        CSVProcessor[CSVインポート/エクスポート処理]
        OpenAIService[OpenAIサービス]
    end
    
    %% Database Layer
    subgraph DatabaseLayer["データベース層"]
        direction LR
        TempWishlistDB
        TempProductDB
        TempCategoryDB
        TempSearchQueryDB
        TempViewpointDB
    end
    
    %% External Layer
    subgraph ExternalLayer["外部サービス"]
        direction LR
        OpenAI
        CSVFile
    end
    
    %% Numbered Steps - With Left to Right and Top to Bottom Flow
    CreateWishlist --- Step1[
        <div style='text-align: center'>
            <span style='display: inline-block; background-color: #4CAF50 !important; color:white; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; font-weight: bold'>1</span>
            <p style='margin-top: 8px'>一時ウィッシュリスト作成</p>
        </div>
    ]
    Step1 --> TempWishlistController
    TempWishlistController --> TempWishlistDB
    
    AddProducts --- Step2A[
        <div style='text-align: center'>
            <span style='display: inline-block; background-color: #2196F3 !important; color:white; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; font-weight: bold'>2A</span>
            <p style='margin-top: 8px'>商品追加</p>
        </div>
    ]
    Step2A --> TempProductController
    TempProductController --> TempProductDB
    
    AddCategories --- Step2B[
        <div style='text-align: center'>
            <span style='display: inline-block; background-color: #2196F3 !important; color:white; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; font-weight: bold'>2B</span>
            <p style='margin-top: 8px'>カテゴリ追加</p>
        </div>
    ]
    Step2B --> TempCategoryController
    TempCategoryController --> TempCategoryDB
    
    AddSearchQueries --- Step2C[
        <div style='text-align: center'>
            <span style='display: inline-block; background-color: #2196F3 !important; color:white; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; font-weight: bold'>2C</span>
            <p style='margin-top: 8px'>検索クエリ追加</p>
        </div>
    ]
    Step2C --> TempSearchQueryController
    TempSearchQueryController --> TempSearchQueryDB
    
    ImportCSV --- Step3[
        <div style='text-align: center'>
            <span style='display: inline-block; background-color: #FF9800 !important; color:white; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; font-weight: bold'>3</span>
            <p style='margin-top: 8px'>一括CSV操作</p>
        </div>
    ]
    Step3 --> CSVProcessor
    CSVProcessor <--> CSVFile
    CSVProcessor --> TempWishlistDB
    CSVProcessor --> TempProductDB
    
    GenerateViewpoints --- Step4[
        <div style='text-align: center'>
            <span style='display: inline-block; background-color: #9C27B0 !important; color:white; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; font-weight: bold'>4</span>
            <p style='margin-top: 8px'>AIビューポイント生成</p>
        </div>
    ]
    Step4 --> TempViewpointController
    TempViewpointController --> OpenAIService
    OpenAIService <--> OpenAI
    OpenAIService --> TempViewpointDB
    
    ConvertToOfficial --- Step5[
        <div style='text-align: center'>
            <span style='display: inline-block; background-color: #F44336 !important; color:white; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; font-weight: bold'>5</span>
            <p style='margin-top: 8px'>公式ウィッシュリストに変換</p>
        </div>
    ]
    Step5 --> TempWishlistController
    
    %% Styling
    style UserActions fill:#e3f2fd,stroke:#1976d2,stroke-width:2px
    style ProcessingLayer fill:#f3e5f5,stroke:#7b1fa2,stroke-width:2px
    style DatabaseLayer fill:#e8f5e9,stroke:#388e3c,stroke-width:2px
    style ExternalLayer fill:#fff3e0,stroke:#e65100,stroke-width:2px
    style OpenAI fill:#ffecb3,stroke:#f57c00,stroke-width:3px
    style CSVFile fill:#e8f5e8,stroke:#388e3c,stroke-width:2px
    style Step1 fill:transparent,stroke:transparent,stroke-width:1px
    style Step2A fill:transparent,stroke:transparent,stroke-width:1px
    style Step2B fill:transparent,stroke:transparent,stroke-width:1px
    style Step2C fill:transparent,stroke:transparent,stroke-width:1px
    style Step3 fill:transparent,stroke:transparent,stroke-width:1px
    style Step4 fill:transparent,stroke:transparent,stroke-width:1px
    style Step5 fill:transparent,stroke:transparent,stroke-width:1px

詳細データフロー依存関係

主要プロセスフロー

1. 一時ウィッシュリスト作成と管理

  • 説明: ユーザーが包括的なデータ検証を伴う一時ウィッシュリストの作成を開始
  • コントローラー: TempWishlistToGroupControllerがリクエストを処理し、ユーザー権限を検証
  • 処理:
    • ウィッシュリスト名の包括的検証(最大50文字、絵文字なし)
    • isMemberOfGroup()メソッドによるグループメンバーシップ検証
    • 自動スラッグ生成によるトランザクション安全な作成
    • 複雑なネストデータ構造(商品、カテゴリ、検索クエリ)のサポート
  • データベース影響: ステータスTemporarySaveでtemp_wishlist_to_groupsに新しいレコード
  • 依存関係:
    • ユーザー認証とグループメンバーシップ検証
    • WithoutEmojiRuleを含む入力検証ルール
    • TempWishlistToGroupObserverによる自動スラッグ生成
  • ユーザーエクスペリエンス: リアルタイム検証フィードバックと成功作成確認

2. 商品管理操作

  • 説明: ユーザーが異なる入力タイプで一時ウィッシュリストに商品を追加
  • コントローラー: TempWishlistProductControllerが商品固有のCRUD操作を処理
  • 処理:
    • 複数の入力タイプのサポート(ASIN、JAN、楽天ID)
    • モール固有の検証とURL生成
    • 一括操作中の重複検出
    • 入力サニタイゼーションとフォーマット検証
  • データベース影響: 商品詳細を含むtemp_wishlist_productsのレコード
  • 依存関係:
    • URL生成のための有効なモール設定
    • 入力タイプ検証(enum: jan, asin, rakuten_id)
    • 既存の一時ウィッシュリストレコード
  • ユーザーエクスペリエンス: 該当する場合は検証エラーを含む商品追加の即座のフィードバック

3. カテゴリ管理操作

  • 説明: ユーザーがモール固有の検証を伴う一時ウィッシュリストにカテゴリアイテムを追加
  • コントローラー: TempWishlistCategoryControllerがカテゴリ固有の操作を処理
  • 処理:
    • モール固有のカテゴリID検証
    • モール設定に基づくカテゴリURL生成
    • カテゴリパス解決と階層検証
  • データベース影響: カテゴリ詳細を含むtemp_wishlist_categoriesのレコード
  • 依存関係:
    • 検証のためのモール固有カテゴリデータベース
    • カテゴリ階層解決システム
    • 既存の一時ウィッシュリストレコード
  • ユーザーエクスペリエンス: モール固有検証による構造化カテゴリ管理

4. 検索クエリ管理操作

  • 説明: ユーザーが追跡のために一時ウィッシュリストに検索クエリを追加
  • コントローラー: TempWishlistSearchQueryControllerが検索クエリ操作を処理
  • 処理:
    • キーワード検証とサニタイゼーション
    • モール固有の検索互換性チェック
    • キーワード正規化(特殊文字の削除、スペースの正規化)
  • データベース影響: キーワード詳細を含むtemp_wishlist_search_queriesのレコード
  • 依存関係:
    • モール固有の検索設定
    • キーワード検証ルール
    • 既存の一時ウィッシュリストレコード
  • ユーザーエクスペリエンス: 検証フィードバックによる効率的な検索クエリ管理

5. CSVインポートと処理

  • 説明: ユーザーが包括的な検証を伴うCSVファイルを介して一括データをインポート
  • コントローラー: TempWishlistControllerがCSVインポート/エクスポート操作を処理
  • 処理:
    • 多層ファイル検証(MIMEタイプ、サイズ、エンコーディング)
    • 詳細なエラー収集による行ごとのデータ検証
    • 完全な監査証跡によるインポート履歴追跡
    • 失敗したインポートのためのエラーCSV生成
  • データベース影響:
    • すべてのインポート操作を追跡するimport_historiesのレコード
    • 詳細なエラー報告のためのimport_errorsのレコード
    • ステータスCsvImportの新しいtemp_wishlist_to_groups
  • 依存関係:
    • 一時保存のためのファイルシステム
    • CSV解析ライブラリ
    • エラー管理システム
  • ユーザーエクスペリエンス: インポート進行状況の包括的フィードバック、詳細なエラー報告

6. AIビューポイント生成

  • 説明: ユーザーがAI搭載のカテゴリ説明と特定のビューポイントを生成
  • コントローラー: TempViewpointControllerがコンテンツ生成のためにOpenAIと統合
  • 処理:
    • 3層ビューポイント階層管理:
      • カテゴリビューポイント(名前とグループコンテキストを持つトップレベル)
      • カテゴリ詳細(AI生成説明)
      • 特定のビューポイント(詳細なAI生成分析角度)
    • 再試行メカニズムを持つOpenAI統合
    • トランザクション安全な作成とリンク
  • データベース影響:
    • カテゴリビューポイントのためのtemp_wl_cat_vpsのレコード
    • AI生成説明のためのtemp_wl_cat_vp_detailsのレコード
    • 特定のビューポイントのためのtemp_wl_spec_vpsのレコード
  • 依存関係:
    • OpenAI API接続
    • プロンプトテンプレート設定
    • 再試行ロジックによるエラーハンドリング
  • ユーザーエクスペリエンス: 最小限のユーザー努力でAI強化コンテンツ生成

7. 公式ウィッシュリスト変換

  • 説明: ユーザーが完成した一時ウィッシュリストを公式ウィッシュリストに変換
  • コントローラー: TempWishlistControllerが変換プロセスを処理
  • 処理:
    • サブスクリプションクォータ検証
    • 完全なデータ移行(商品、カテゴリ、検索クエリ、ビューポイント)
    • 移行中の適切な関係保持
  • データベース影響:
    • 一時ウィッシュリストレコードのステータス更新
    • 公式ウィッシュリストテーブルへのデータ移行
  • 依存関係:
    • サブスクリプション管理システム
    • 公式ウィッシュリストデータ構造
    • 完全な移行のためのトランザクション安全性
  • ユーザーエクスペリエンス: 一時から公式ウィッシュリストへのシームレスな移行

統合依存関係

コンポーネント 依存関係 目的
ウィッシュリスト管理 ユーザー認証、グループメンバーシップ、入力検証 一時ウィッシュリストの中核CRUD操作
商品管理 モール設定、入力タイプ検証、URL生成 モール統合による商品固有操作
カテゴリ管理 カテゴリ階層、モール固有検証、URL生成 階層サポートによるカテゴリ固有操作
検索クエリ管理 キーワード検証、モール固有検索システム モール統合による検索クエリ操作
CSV操作 ファイル検証、CSV解析、エラー管理 包括的検証による一括データ操作
OpenAI統合 API接続、プロンプトテンプレート、再試行メカニズム ビューポイントのためのAI搭載コンテンツ生成
変換プロセス サブスクリプション検証、データ移行、関係保持 一時から公式ウィッシュリストへの移行

期待される成果

技術的成果

  • 柔軟なデータ準備: ユーザーはサブスクリプション影響なしでウィッシュリストデータを準備可能
  • AI強化コンテンツ: インテリジェントなカテゴリ説明とビューポイント
  • 一括操作: CSVによる大規模データセットの効率的処理
  • シームレス変換: 公式ウィッシュリストへのスムーズな移行

ビジネス価値

  • サブスクリプション圧力の軽減: ユーザーはクォータ消費なしで実験可能
  • ユーザーエクスペリエンスの向上: AI搭載コンテンツ生成
  • 運用効率: 大規模データセットの一括インポート機能
  • 品質保証: 公式変換前の包括的検証

ユーザーエクスペリエンス

  • 準備ワークスペース: ウィッシュリスト準備のための安全な環境
  • AIアシスタンス: インテリジェントなコンテンツ提案と生成
  • エラー管理: 明確なフィードバックと修正メカニズム
  • 進行状況追跡: 準備プロセス全体を通じた可視的ステータス

モジュール一覧

名前 概要リンク 説明
一時ウィッシュリスト管理 一時ウィッシュリスト管理 中核的な一時ウィッシュリストCRUD操作と管理
CSVインポート/エクスポート CSVインポート/エクスポート 包括的エラーハンドリングによる一括データ操作
商品管理 一時ウィッシュリスト商品 複数の入力タイプによる商品固有操作
カテゴリ管理 一時ウィッシュリストカテゴリ 階層サポートによるカテゴリ固有操作
検索クエリ管理 一時ウィッシュリスト検索クエリ キーワード検証による検索クエリ操作
AIビューポイント生成 AIビューポイント生成 インテリジェントコンテンツ生成のためのOpenAI統合
ユニーク商品CSVインポート ユニーク商品CSVインポート 高度な商品分析のためのユニークコード追跡による一括インポート
公式ウィッシュリスト変換 公式ウィッシュリスト変換 一時から公式ウィッシュリストへの変換プロセス