welcomeページをつくる

app/assets/stylesheets/application.css

@@ -18,3 +18,10 @@
     width: 30px;
     height: 30px;
 }
+.login-button {
+    margin-left: 1rem;
+    background-color: #6b7280;
+    color: #fff;
+    border-radius: 0.375rem;
+    padding: 0.5rem 1rem;
+}

app/controllers/home_controller.rb

@@ -1,7 +1,14 @@
 # frozen_string_literal: true
 
 class HomeController < ApplicationController
-  skip_before_action :check_logged_in, only: :index
+  skip_before_action :check_logged_in
 
-  def index; end
+  def index
+    redirect_to meal_plans_path if current_user.present?
+  end
+
+  def welcome
+    family = Family.find_by!(invitation_token: params[:invitation_token])
+    @invitation_token = family.invitation_token
+  end
 end

app/controllers/sessions_controller.rb

@@ -8,14 +8,14 @@ def create
     user.find_or_new_family(request.env['omniauth.params']['invitation_token']) if user.family_id.nil?
     if user.save
       log_in user
-      redirect_to meal_plans_path
+      redirect_to meal_plans_path, notice: 'ログインに成功しました'
     else
-      redirect_to root_path
+      redirect_to root_path, notice: 'ログインに失敗しました'
     end
   end
 
   def destroy
     log_out
-    redirect_to root_path
+    redirect_to root_path, notice: 'ログアウトしました'
   end
 end

app/helpers/home_helper.rb

@@ -1,4 +1,11 @@
 # frozen_string_literal: true
 
 module HomeHelper
+  def google_oauth2_path(invitation_token = nil)
+    if invitation_token
+      "/auth/google_oauth2/?invitation_token=#{invitation_token}"
+    else
+      '/auth/google_oauth2'
+    end
+  end
 end

app/views/home/index.html.erb

@@ -1,4 +1,21 @@
-<div>
-  <h1 class="font-bold text-4xl">Home#index</h1>
-  <p>Find me in app/views/home/index.html.erb</p>
+<div class="w-full">
+  <% if notice.present? %>
+    <p class="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-lg inline-block" id="notice"><%= notice %></p>
+  <% end %>
+
+  <div class="flex justify-between items-center">
+    <h1 class="font-bold text-4xl text-stone-800">ごはんサミット</h1>
+  </div>
+  <p>
+    ごはんサミットへようこそ！
+  </p>
+  <p>
+    ログインして家族で献立を相談しよう！
+  </p>
+  <p>
+    献立表を作ろう！
+  </p>
+  <div>
+    <%= button_to 'Googleでログイン', google_oauth2_path, method: :post, data: { turbo: false }, class: 'login-button' %>
+  </div>
 </div>

app/views/home/welcome.html.erb

@@ -0,0 +1,22 @@
+<div class="w-full">
+  <% if notice.present? %>
+    <p class="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-lg inline-block" id="notice"><%= notice %></p>
+  <% end %>
+
+  <div class="flex justify-between items-center">
+    <h1 class="font-bold text-4xl text-stone-800">ごはんサミット</h1>
+  </div>
+  <p>
+    家族から招待されています！
+  </p>
+  <p>
+    ログインして家族で献立を相談しよう！
+  </p>
+  <p>
+    献立表を作ろう！
+  </p>
+  <div>
+    <%= button_to '招待：Googleでログイン', google_oauth2_path(@invitation_token), method: :post,
+                                                                           data: { turbo: false }, class: 'login-button' %>
+  </div>
+</div>

app/views/layouts/application.html.erb

@@ -27,8 +27,6 @@
           <%= link_to '共有ページへ', family_path, class: 'ml-4 text-stone-100 hover:underline' %>
           <%= link_to 'ログアウト', log_out_path, class: 'ml-4 text-stone-300 hover:underline' %>
         <% else %>
-          <%= button_to 'Googleでログイン', '/auth/google_oauth2', method: :post, data: { turbo: false },
-                                                              class: 'ml-4 bg-stone-500 text-white rounded-md py-2 px-4' %>
           <span class="mr-4">ゲストさん</span>
         <% end %>
       </div>

config/routes.rb

@@ -17,6 +17,7 @@
   resources :meeting_rooms, only: %i[show create] do
     resources :remarks, only: %i[new create edit update destroy]
   end
+  get 'welcome', to: 'home#welcome'
 
   # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html