活動時間カレンダーの実装

app/controllers/current_user_controller.rb

@@ -31,7 +31,8 @@ def user_params
       :after_graduation_hope, :training_ends_on, :profile_image,
       :hide_mentor_profile,
       :profile_name, :profile_job, :profile_text, { authored_books_attributes: %i[id title url cover _destroy] },
-      :feed_url, :country_code, :subdivision_code, { discord_profile_attributes: %i[id account_name times_url] }
+      :feed_url, :country_code, :subdivision_code, { discord_profile_attributes: %i[id account_name times_url] },
+      { learning_time_frame_ids: [] }
     ]
     user_attribute.concat(admin_user_attributes) if current_user.admin?
     params.require(:user).permit(user_attribute)

app/controllers/home_controller.rb

@@ -33,7 +33,8 @@ def set_required_fields
       discord_account_name: current_user.discord_profile.account_name,
       github_account: current_user.github_account,
       blog_url: current_user.blog_url,
-      graduated: current_user.graduated?
+      graduated: current_user.graduated?,
+      learning_time_frames: current_user.graduated? || current_user.learning_time_frames.exists?
     )
   end
 

app/helpers/users_helper.rb

@@ -82,4 +82,8 @@ def jobs_for_select
     user_jobs = User.jobs.keys.map { |job| [t("activerecord.enums.user.job.#{job}"), job] }
     user_jobs.prepend(%w[全員 all])
   end
+
+  def visible_learning_time_frames?(user)
+    !user.graduated? && user.learning_time_frames.exists?
+  end
 end

app/javascript/stylesheets/_common-imports.sass

@@ -200,5 +200,6 @@
 @import shared/blocks/form/radios
 @import shared/blocks/form/vue-tags-input
 @import shared/blocks/form/form-textarea
+@import shared/blocks/form/form-table
 
 @import "shared/helpers/state"

app/javascript/stylesheets/application/blocks/user/_user-metas.sass

@@ -6,7 +6,7 @@
   margin-bottom: -1px
   padding: .375rem .75rem
   +text-block(.75rem 1.4, 600)
-  background-color: var(--background)
+  background-color: var(--background-tint)
   position: relative
 
 .user-metas__items

app/javascript/stylesheets/atoms/_a-card.sass

@@ -45,6 +45,11 @@
       display: none
     > input:checked + * .is-hidden-then-checked
       display: none
+  &:has(.a-table)
+    border: none
+    .card-header
+      border: solid 1px var(--border)
+      border-bottom: none
 
 table.a-card
   display: table

app/javascript/stylesheets/atoms/_a-checkbox.sass

@@ -4,6 +4,7 @@
     +position(absolute, left 0, top 0)
     visibility: hidden
     opacity: 0
+    pointer-events: none
   span
     +position(relative)
     display: inline-block
@@ -41,3 +42,4 @@
   opacity: 0
   overflow: hidden
   visibility: hidden
+  pointer-events: none

app/javascript/stylesheets/atoms/_a-table.sass

@@ -1,6 +1,17 @@
 .a-table
   +media-breakpoint-down(sm)
     overflow-x: auto
+  overflow-x: auto
+  &.is-sm
+    font-size: .8125rem
+  td,
+  th
+    padding: .5rem
+  th
+    background-color: var(--background-tint)
+    border: solid 1px var(--border-shade)
+  td
+    border: solid 1px var(--border)
 
 .a-table table
   border-radius: .25rem

app/javascript/stylesheets/config/variables/_colors.sass

@@ -10,7 +10,7 @@ $completion-dark: rgb(0 0 0 / 20%)
 $background-shade: hsl(242, 11%, 85%) // #d5d5dd
 $background-semi-shade: hsl(242, 24%, 92%) // #e6e6ef
 $background: hsl(242, 34%, 98%) // #f8f8fc
-$background-tint: hsl(242, 9%, 93%) // #ececef
+$background-tint: hsl(242, 20%, 93%) // #ececef
 $background-more-tint: hsl(242, 8%, 98.5%) // #fbfbfb
 
 // lp-bg

app/javascript/stylesheets/shared/blocks/form/_form-table.sass

@@ -0,0 +1,49 @@
+.form-table
+  overflow: auto
+  max-width: 100%
+  &.is-sm
+    font-size: .8125rem
+  table
+    border: solid 1px var(--border)
+  td,
+  th
+    padding: .5rem
+    border: solid 1px var(--border)
+  th
+    background-color: var(--background-tint)
+    border: solid 1px var(--border-shade)
+  .form-table__check
+    padding: 0
+    label
+      display: flex
+      align-items: center
+      justify-content: center
+      padding: .5rem
+      cursor: pointer
+      border-radius: .25rem
+      input
+        opacity: 0
+        position: absolute
+        pointer-events: none
+      &::after
+        content: ""
+        +size(.875rem)
+        border: solid 1px var(--border-shade)
+        border-radius: .25rem
+    &:has(:checked)
+      label
+        background: var(--input-selected-background)
+        box-shadow: 0 0 0 1px var(--input-selected-border) inset
+      label::after
+        border: none
+        +fa(fas '\f00c')
+        color: var(--main)
+  &.is-sticky
+    thead th
+      position: sticky
+      top: 0
+      z-index: 1
+
+    thead th:first-child
+      position: sticky
+      left: 0

app/models/learning_time_frame.rb

@@ -0,0 +1,6 @@
+# frozen_string_literal: true
+
+class LearningTimeFrame < ApplicationRecord
+  has_many :learning_time_frames_users, dependent: :destroy
+  has_many :users, through: :learning_time_frames_users
+end

app/models/learning_time_frames_user.rb

@@ -0,0 +1,6 @@
+# frozen_string_literal: true
+
+class LearningTimeFramesUser < ApplicationRecord
+  belongs_to :user
+  belongs_to :learning_time_frame
+end

app/models/required_field.rb

@@ -11,11 +11,13 @@ class RequiredField
   attribute :github_account, :string
   attribute :blog_url, :string
   attribute :graduated, :boolean
+  attribute :learning_time_frames, :boolean
 
   validates :avatar_attached, presence: { message: 'ユーザーアイコンを登録してください。' }
   validates :tag_list_count, numericality: { greater_than: 0, message: 'タグを登録してください。' }
   validates :after_graduation_hope, presence: { message: 'フィヨルドブートキャンプを卒業した自分はどうなっていたいかを登録してください。' }, unless: :graduated
   validates :discord_account_name, presence: { message: 'Discordアカウントを登録してください。' }
   validates :github_account, presence: { message: 'GitHubアカウントを登録してください。' }
   validates :blog_url, presence: { message: 'ブログURLを登録してください。' }
+  validates :learning_time_frames, presence: { message: '活動時間を登録してください。' }
 end

app/models/user.rb

@@ -113,6 +113,7 @@ class User < ApplicationRecord
   has_many :request_retirements, dependent: :destroy
   has_one :targeted_request_retirement, class_name: 'RequestRetirement', foreign_key: 'target_user_id', dependent: :destroy, inverse_of: :target_user
   has_many :micro_reports, dependent: :destroy
+  has_many :learning_time_frames_users, dependent: :destroy
 
   has_many :participate_events,
            through: :participations,
@@ -176,6 +177,9 @@ class User < ApplicationRecord
 
   has_many :coding_test_submissions, dependent: :destroy
 
+  has_many :learning_time_frames,
+           through: :learning_time_frames_users
+
   has_one_attached :avatar
   has_one_attached :profile_image
 

app/views/users/_form.html.slim

@@ -23,6 +23,8 @@
     = render 'users/form/avatar', f: f, user: user
     = render 'users/form/description', f: f, user: user
     = render 'users/form/tags', f: f, user: user
+    - if from == :edit && !@user.graduated? && !@user.adviser?
+      = render 'users/form/learning_time_frames', f: f, user: user
     - unless user.adviser?
       - unless user.mentor?
         = render 'users/form/after_graduation_hope', f:, user:

app/views/users/_learning_time_frames.html.slim

@@ -0,0 +1,26 @@
+.a-card
+  .card-header.is-sm
+    h2.card-header__title
+      | 主な活動予定時間
+  .a-table.is-sm.text-center
+    table.w-full
+      thead
+        tr
+          th
+          - %w[日 月 火 水 木 金 土].each do |day|
+            th = day
+      tbody#learning_time_frame
+        - 24.times do |hour|
+          tr(class='hover:bg-[var(--background-more-tint)]')
+            th.text-center
+              | #{hour.to_s}:00
+            - 7.times do |day_index|
+              - value = day_index * 24 + hour + 1
+              - name = "checked_#{value}"
+              - if user.learning_time_frames.ids.include?(value)
+                td.p-0.h-6 name=name
+                  span.flex.h-full.text-center.justify-center.items-center.p-1.border.border-solid.rounded(class='text-[var(--main)] bg-[var(--input-selected-background)] border-[var(--main)]')
+                    i.fa-duotone.fa-solid.fa-check
+              - else
+                td.p-0.h-6
+                  span.flex.h-full.text-center.justify-center.items-center.p-1.rounded

app/views/users/form/_learning_time_frames.html.slim

@@ -0,0 +1,27 @@
+.form-item
+  = f.label :learning_time_frames, '主な活動予定時間', class: 'a-form-label'
+  .a-form-help
+    p
+      | フィヨルドブートキャンプの活動を行う予定の大体の日時にチェックを入れてください。
+      br
+      | この情報は他のフィヨルドブートキャンプ参加者に公開され、
+      | ペアワークや就職相談、勉強会、輪読会などのイベント開催を行う際の参考に使われます。
+  .form-table.is-sm.max-h-96.is-sticky.mt-4
+    table.min-w-full
+      thead
+        tr
+          th
+          - %w[日 月 火 水 木 金 土].each do |day|
+            th = day
+      tbody#learning_time_frame
+        = hidden_field_tag 'user[learning_time_frame_ids][]', ''
+        - 24.times do |hour|
+          tr(class='hover:bg-[var(--background-more-tint)]')
+            th
+              | #{hour.to_s}:00
+            - 7.times do |day_index|
+              - value = day_index * 24 + hour + 1
+              td.form-table__check
+                = f.label :learning_time_frame_ids, for: "user_learning_time_frame_ids_#{value}" do
+                  span
+                    = f.check_box :learning_time_frame_ids, { multiple: true, checked: user.learning_time_frame_ids.include?(value) }, value, false

app/views/users/show.html.slim

@@ -31,10 +31,10 @@
             p
               | このページは他のユーザーから見た、あなたのプロフィールページです。
               | （ #{link_to '登録情報変更', edit_current_user_path} ）
-    .container.is-xl
+    .container(class="#{visible_learning_time_frames?(@user) ? 'is-xxl' : 'is-xl'}")
       .columns
         .row
-          .col-xs-12.col-lg-6.col-xxl-6
+          .col-xs-12(class="#{visible_learning_time_frames?(@user) ? 'col-lg-4 col-xxl-5' : 'col-lg-6 col-xxl-6'}")
             .page-content.is-user
               = render 'users/profile', user: @user
               .card-counts.is-user
@@ -66,7 +66,7 @@
                   .user-data__row
                     = render 'users/metas', user: @user
 
-          .col-xs-12.col-lg-6.col-xxl-6
+          .col-xs-12(class="#{visible_learning_time_frames?(@user) ? 'col-lg-4 col-xxl-4' : 'col-lg-6 col-xxl-6'}")
             - if admin_or_mentor_login?
               = render 'users/user_mentor_memo', user_id: @user.id
             - unless @user.total_learning_time.zero? || @user.mentor?
@@ -104,3 +104,7 @@
                     .user-statuses__delete
                       = link_to 'このユーザーを削除する', admin_user_path(@user), method: :delete, id: "delete-#{@user.id}", class: 'a-muted-text-link',
                         data: { confirm: '本当によろしいですか？この操作はデータを削除するため元に戻すことができません。' }
+
+          - if visible_learning_time_frames?(@user)
+            .col-xs-12.col-lg-4.col-xxl-3
+              = render 'users/learning_time_frames', user: @user

db/fixtures/learning_time_frames.yml

@@ -0,0 +1,9 @@
+<% week_days = { '日' => 'sun', '月' => 'mon', '火' => 'tue', '水' => 'wed', '木' => 'thu', '金' => 'fri', '土' => 'sat' } %>
+<% week_days.each_with_index do |(day_name, day_prefix), day_index| %>
+  <% (0..23).each_with_index do |hour, hour_index| %>
+  <%= "#{day_prefix}#{hour}:" %>
+    id: <%= day_index * 24 + hour_index + 1 %>
+    week_day: <%= day_name %>
+    activity_time: <%= hour %>
+  <% end %>
+<% end %>

db/migrate/20250130052049_create_learning_time_frames.rb

@@ -0,0 +1,10 @@
+class CreateLearningTimeFrames < ActiveRecord::Migration[6.1]
+  def change
+    create_table :learning_time_frames do |t|
+      t.string :week_day
+      t.integer :activity_time
+
+      t.timestamps
+    end
+  end
+end

db/migrate/20250130052357_create_learning_time_frames_users.rb

@@ -0,0 +1,10 @@
+class CreateLearningTimeFramesUsers < ActiveRecord::Migration[6.1]
+  def change
+    create_table :learning_time_frames_users do |t|
+      t.references :user, null: false, foreign_key: true
+      t.references :learning_time_frame, null: false, foreign_key: true
+
+      t.timestamps
+    end
+  end
+end

db/schema.rb

@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 2025_01_29_033027) do
+ActiveRecord::Schema.define(version: 2025_01_30_052357) do
 
   # These are extensions that must be enabled in order to support this database
   enable_extension "pgcrypto"
@@ -437,6 +437,22 @@
     t.index ["practice_id"], name: "index_learning_minute_statistics_on_practice_id"
   end
 
+  create_table "learning_time_frames", force: :cascade do |t|
+    t.string "week_day"
+    t.integer "activity_time"
+    t.datetime "created_at", precision: 6, null: false
+    t.datetime "updated_at", precision: 6, null: false
+  end
+
+  create_table "learning_time_frames_users", force: :cascade do |t|
+    t.bigint "user_id", null: false
+    t.bigint "learning_time_frame_id", null: false
+    t.datetime "created_at", precision: 6, null: false
+    t.datetime "updated_at", precision: 6, null: false
+    t.index ["learning_time_frame_id"], name: "index_learning_time_frames_users_on_learning_time_frame_id"
+    t.index ["user_id"], name: "index_learning_time_frames_users_on_user_id"
+  end
+
   create_table "learning_times", force: :cascade do |t|
     t.bigint "report_id"
     t.datetime "started_at", null: false
@@ -881,6 +897,8 @@
   add_foreign_key "hibernations", "users"
   add_foreign_key "images", "users"
   add_foreign_key "learning_minute_statistics", "practices"
+  add_foreign_key "learning_time_frames_users", "learning_time_frames"
+  add_foreign_key "learning_time_frames_users", "users"
   add_foreign_key "learning_times", "reports"
   add_foreign_key "linear_scales", "survey_questions"
   add_foreign_key "micro_reports", "users"

db/seeds.rb

@@ -30,6 +30,7 @@
   followings
   reports
   learning_times
+  learning_time_frames
   learnings
   notifications
   participations

test/fixtures/learning_time_frames.yml

@@ -0,0 +1,9 @@
+<% week_days = { '日' => 'sun', '月' => 'mon', '火' => 'tue', '水' => 'wed', '木' => 'thu', '金' => 'fri', '土' => 'sat' } %>
+<% week_days.each_with_index do |(day_name, day_prefix), day_index| %>
+  <% (0..23).each_with_index do |hour, hour_index| %>
+  <%= "#{day_prefix}#{hour}:" %>
+    id: <%= day_index * 24 + hour_index + 1 %>
+    week_day: <%= day_name %>
+    activity_time: <%= hour %>
+  <% end %>
+<% end %>