…ように実装する_#24

GitHub Issue Ticket

やった事

このプルリクエストにて何をしたのか？ TMDBから取得した映画情報をもとに生成するシャッフルされたあらすじ（ShuffledOverviewモデルレコード）の内容を保存して、詳細画面（/users/:user_id/shuffled_overview/:shuffled_overview）に遷移するようにした。まずRailsデータベース上でのidを付与

Railsコントローラーで、保存した後の詳細画面への遷移を Railsメソッドのredirect_toで設定しようとしたがエラーが起きるため jsで実装した保存メソッドに詳細画面への遷移を設定した。

  function saveShuffledOverview() {
    const content = container.innerHTML;

    // ユニークな映画のIDを取得
    const movieLinks = document.querySelectorAll('.movie-link');
    const movieIds = Array.from(new Set(Array.from(movieLinks).map(link => link.dataset.movieId)));

    fetch(`/users/${userId}/shuffled_overviews`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
      },
      body: JSON.stringify({ 
        shuffled_overview: { 
          content: content, 
          movie_ids: movieIds // 映画のIDを送信
        } 
      })
    })
    .then(response => response.json())
    .then(data => {
      if (data.message) {
        console.log(data.message);
        // ID を使用して `shuffled_overview#show` ページへリダイレクト
        window.location.href = `/users/${userId}/shuffled_overviews/${data.id}`;
      } else if (data.errors) {
        console.error(data.errors);
      }
    })
    .catch(error => console.error('Error:', error));
  }

なぜやるのか

GitHub Issue で説明できない捕捉的な事項 (GitHub Issue の説明で十分であればここは不要) なぜこのプルリクエストが必要と考えたかについて説明があるとレビュワーがわかりやすい

28 で中間テーブルによるassociationを設定するために、shuffled_overview_id が必要のため。

動作確認

どの環境でどんな動作チェックをしたか 動作確認をした事についてスクショなどがあるとわかりやすくて良い

development環境

Refs (レビューにあたって参考にすべき情報）(Optional)

関連するプルリクエストやイシュー、コンフルリンクなど、レビュワーがレビューするにあたっての補足情報

maixhashi / plotforge

Feature_2024.08.04.23.07_ShuffledOverviewモデルレコードを保存した後に詳細画面にレンダリングされる… #29