primer_view_components を導入

Gemfile

@@ -5,11 +5,10 @@ ruby "3.2.2"
 
 gem "bcrypt", "~> 3.1.20"
 gem "bootsnap", require: false
-gem "bootstrap", github: 'twbs/bootstrap-rubygem' # v 5.3.3 should fix the problem, but not released yet
-gem "dartsass-rails", "~> 0.5.0"
 gem "importmap-rails"
 gem "jbuilder"
 gem "pg", "~> 1.5"
+gem "primer_view_components", "~> 0.19"
 gem "propshaft"
 gem "puma", "~> 6.4"
 gem "rails-i18n"

Gemfile.lock

@@ -1,6 +1,6 @@
 GIT
   remote: https://github.com/rails/rails.git
-  revision: 93df871020950b67256d0b4182bf8664c0187bcc
+  revision: 4bb73233413f30fd7217bd7f08af44963f5832b1
   branch: main
   specs:
     actioncable (7.2.0.alpha)
@@ -94,14 +94,6 @@ GIT
       thor (~> 1.0, >= 1.2.2)
       zeitwerk (~> 2.6)
 
-GIT
-  remote: https://github.com/twbs/bootstrap-rubygem.git
-  revision: 90467dee09b0c6e52e7d58de867148fda0dd9f49
-  specs:
-    bootstrap (5.3.2)
-      autoprefixer-rails (>= 9.1.0)
-      popper_js (>= 2.11.8, < 3)
-
 GEM
   remote: https://rubygems.org/
   specs:
@@ -115,6 +107,9 @@ GEM
     bindex (0.8.1)
     bootsnap (1.18.3)
       msgpack (~> 1.2)
+    bootstrap (5.3.2)
+      autoprefixer-rails (>= 9.1.0)
+      popper_js (>= 2.11.8, < 3)
     builder (3.2.4)
     capybara (3.40.0)
       addressable
@@ -132,29 +127,31 @@ GEM
       railties (>= 6.0.0)
       sass-embedded (~> 1.63)
     date (3.3.4)
-    debug (1.9.2)
+    debug (1.9.1)
       irb (~> 1.10)
       reline (>= 0.3.8)
     diff-lcs (1.5.1)
-    drb (2.2.1)
+    drb (2.2.0)
+      ruby2_keywords
     erubi (1.12.0)
     execjs (2.9.1)
     factory_bot (6.4.5)
       activesupport (>= 5.0.0)
     factory_bot_rails (6.4.3)
       factory_bot (~> 6.4)
       railties (>= 5.0.0)
+    ffi (1.15.5)
     globalid (1.2.1)
       activesupport (>= 6.1)
     google-protobuf (3.23.4)
-    i18n (1.14.4)
+    i18n (1.14.1)
       concurrent-ruby (~> 1.0)
     importmap-rails (2.0.1)
       actionpack (>= 6.0.0)
       activesupport (>= 6.0.0)
       railties (>= 6.0.0)
     io-console (0.7.2)
-    irb (1.12.0)
+    irb (1.11.2)
       rdoc
       reline (>= 0.4.2)
     jbuilder (2.11.5)
@@ -182,14 +179,20 @@ GEM
       net-protocol
     net-protocol (0.2.2)
       timeout
-    net-smtp (0.5.0)
+    net-smtp (0.4.0.1)
       net-protocol
-    nio4r (2.7.1)
-    nokogiri (1.16.4)
+    nio4r (2.7.0)
+    nokogiri (1.16.2)
       mini_portile2 (~> 2.8.2)
       racc (~> 1.4)
-    pg (1.5.6)
+    octicons (19.8.0)
+    pg (1.5.4)
     popper_js (2.11.8)
+    primer_view_components (0.19.0)
+      actionview (>= 5.0.0)
+      activesupport (>= 5.0.0)
+      octicons (>= 18.0.0)
+      view_component (>= 3.1, < 4.0)
     propshaft (0.8.0)
       actionpack (>= 7.0.0)
       activesupport (>= 7.0.0)
@@ -201,7 +204,7 @@ GEM
     puma (6.4.2)
       nio4r (~> 2.0)
     racc (1.7.3)
-    rack (3.0.10)
+    rack (3.0.9)
     rack-session (2.0.0)
       rack (>= 3.0.0)
     rack-test (2.1.0)
@@ -219,15 +222,15 @@ GEM
     rails-i18n (7.0.9)
       i18n (>= 0.7, < 2)
       railties (>= 6.0.0, < 8)
-    rake (13.2.1)
-    rdoc (6.6.3.1)
+    rake (13.1.0)
+    rdoc (6.6.2)
       psych (>= 4.0.0)
     redis (5.1.0)
       redis-client (>= 0.17.0)
-    redis-client (0.19.1)
+    redis-client (0.21.0)
       connection_pool
     regexp_parser (2.9.0)
-    reline (0.5.1)
+    reline (0.4.2)
       io-console (~> 0.5)
     rexml (3.2.6)
     rspec-core (3.13.0)
@@ -238,30 +241,47 @@ GEM
     rspec-mocks (3.13.0)
       diff-lcs (>= 1.2.0, < 2.0)
       rspec-support (~> 3.13.0)
-    rspec-rails (6.1.2)
+    rspec-rails (6.1.1)
       actionpack (>= 6.1)
       activesupport (>= 6.1)
       railties (>= 6.1)
-      rspec-core (~> 3.13)
-      rspec-expectations (~> 3.13)
-      rspec-mocks (~> 3.13)
-      rspec-support (~> 3.13)
-    rspec-support (3.13.1)
+      rspec-core (~> 3.12)
+      rspec-expectations (~> 3.12)
+      rspec-mocks (~> 3.12)
+      rspec-support (~> 3.12)
+    rspec-support (3.13.0)
+    ruby2_keywords (0.0.5)
     rubyzip (2.3.2)
     sass-embedded (1.63.6)
       google-protobuf (~> 3.23)
       rake (>= 13.0.0)
-    selenium-webdriver (4.19.0)
+    sassc (2.4.0)
+      ffi (~> 1.9)
+    sassc-rails (2.1.2)
+      railties (>= 4.0.0)
+      sassc (>= 2.0)
+      sprockets (> 3.0)
+      sprockets-rails
+      tilt
+    selenium-webdriver (4.17.0)
       base64 (~> 0.2)
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
       websocket (~> 1.0)
+    sprockets (4.2.0)
+      concurrent-ruby (~> 1.0)
+      rack (>= 2.2.4, < 4)
+    sprockets-rails (3.4.2)
+      actionpack (>= 5.2)
+      activesupport (>= 5.2)
+      sprockets (>= 3.0.0)
     stimulus-rails (1.3.3)
       railties (>= 6.0.0)
     stringio (3.1.0)
-    thor (1.3.1)
+    thor (1.3.0)
+    tilt (2.2.0)
     timeout (0.4.1)
-    turbo-rails (2.0.5)
+    turbo-rails (2.0.0)
       actionpack (>= 6.0.0)
       activejob (>= 6.0.0)
       railties (>= 6.0.0)
@@ -292,14 +312,13 @@ PLATFORMS
 DEPENDENCIES
   bcrypt (~> 3.1.20)
   bootsnap
-  bootstrap!
   capybara
-  dartsass-rails (~> 0.5.0)
   debug
   factory_bot_rails
   importmap-rails
   jbuilder
   pg (~> 1.5)
+  primer_view_components (~> 0.19)
   propshaft
   puma (~> 6.4)
   rails!

app/assets/config/manifest.js

@@ -2,3 +2,6 @@
 //= link_tree ../../javascript .js
 //= link_tree ../../../vendor/javascript .js
 //= link_tree ../builds
+
+//= link application.css
+//= link primer_view_components.css

app/assets/stylesheets/application.scss

@@ -1,3 +1,4 @@
 // Entry point for your Sass build
 
-@import "./application.bootstrap.scss"
+//= link primer_view_components.css
+@import url("https://unpkg.com/@primer/css@^21.1.1/dist/primer.css")

app/components/alert_component.html.erb

@@ -1,4 +1 @@
-<% alert_name = @message_type.to_sym == :alert ? 'danger' : 'success' %>
-<div class="alert alert-<%= alert_name %>">
-  <%= @message %>
-</div>
+<%= render(Primer::Alpha::Banner.new(scheme: @message_type)) { @message } %>

app/components/alert_component.rb

@@ -2,7 +2,7 @@
 
 class AlertComponent < ViewComponent::Base
   def initialize(message_type:, message:)
-    @message_type = message_type
+    @message_type = message_type.to_sym
     @message = message
   end
 end

app/controllers/events_controller.rb

@@ -26,25 +26,30 @@ def create
     @event.organizer_id = current_user.id
 
     if @event.save
-      redirect_to @event, notice: 'Event was successfully created.'
+      flash[:success] = 'Event was successfully created.'
+      redirect_to @event
     else
+      flash.now[:warning] = @event.errors.full_messages.join(', ')
       render :new
     end
   end
 
   # PATCH/PUT /events/1
   def update
     if @event.update(event_params)
-      redirect_to @event, notice: 'Event was successfully updated.'
+      flash[:success] = 'Event was successfully updated.'
+      redirect_to @event
     else
+      flash.now[:warning] = @event.errors.full_messages.join(', ')
       render :edit
     end
   end
 
   # DELETE /events/1
   def destroy
     @event.destroy
-    redirect_to events_url, notice: 'Event was successfully destroyed.'
+    flash[:success] = 'Event was successfully destroyed.'
+    redirect_to events_url
   end
 
   private

app/controllers/registrations_controller.rb

@@ -9,10 +9,10 @@ def create
     @user = User.new(user_params)
 
     if @user.save
-      flash[:notice] = 'ユーザー登録しました'
+      flash[:success] = 'ユーザー登録しました'
       redirect_to login_path
     else
-      flash.now[:alert] = @user.errors.full_messages.join(", ")
+      flash.now[:warning] = @user.errors.full_messages.join(", ")
       render :new, status: :unprocessable_entity
     end
   end

app/controllers/sessions_controller.rb

@@ -8,16 +8,17 @@ def create
 
     if user
       session[:user_id] = user.id
-      flash[:notice] = 'ログインに成功しました'
+      flash[:success] = 'ログインに成功しました'
       redirect_to events_path
     else
-      flash.now[:alert] = 'ログインに失敗しました'
+      flash.now[:warning] = 'ログインに失敗しました'
       render :new, status: :unauthorized
     end
   end
 
   def destroy
     session[:user_id] = nil
+    flash[:success] = 'ログアウトしました'
     redirect_to login_path
   end
 end

app/forms/appliation_form.rb

@@ -0,0 +1,2 @@
+class ApplicationForm < Primer::Forms::Base
+end

app/forms/event_form.rb

@@ -0,0 +1,56 @@
+class EventForm < ApplicationForm
+  form do |event_form|
+    event_form.text_field(
+      name: :name,
+      type: "text",
+      label: 'タイトル',
+      required: true,
+    )
+
+    event_form.text_field(
+      name: :description,
+      type: "text",
+      label: '説明',
+      required: true,
+    )
+
+    event_form.text_field(
+      name: :location,
+      type: "text",
+      label: '場所',
+    )
+
+    event_form.text_field(
+      name: :max_size,
+      type: "number",
+      label: '最大人数',
+    )
+
+    event_form.text_field(
+      name: :budget,
+      type: "text",
+      label: '予算',
+    )
+
+    event_form.text_field(
+      name: :start_at,
+      type: "datetime-local",
+      label: '開始日時',
+      required: true,
+    )
+
+    event_form.text_field(
+      name: :end_at,
+      type: "datetime-local",
+      label: '終了日時',
+      required: true,
+    )
+
+    event_form.submit(
+      name: :submit,
+      label: "登録",
+      scheme: :primary,
+      mb: 3
+    )
+  end
+end

app/forms/login_form.rb

@@ -0,0 +1,24 @@
+class LoginForm < ApplicationForm
+  form do |login_form|
+    login_form.text_field(
+      name: :email,
+      type: "email",
+      label: 'メールアドレス',
+      required: true,
+    )
+
+    login_form.text_field(
+      name: :password,
+      type: "password",
+      label: 'パスワード',
+      required: true,
+    )
+
+    login_form.submit(
+      name: :submit,
+      label: 'ログイン',
+      scheme: :primary,
+      mb: 3
+    )
+  end
+end