Feature: Interview survey form with multi select

app/controllers/application_controller.rb

@@ -1,6 +1,7 @@
 class ApplicationController < ActionController::Base
   include CurrentTheme
   include Pagy::Backend
+  extend RequiresFeature
 
   before_action :configure_permitted_parameters, if: :devise_controller?
   before_action :set_sentry_user, if: :current_user

app/controllers/concerns/requires_feature.rb

@@ -0,0 +1,12 @@
+module RequiresFeature
+  def requires_feature(name, **)
+    before_action(
+      lambda do
+        return if Flipper.enabled?(name, current_user)
+
+        redirect_to dashboard_path, notice: 'Feature not enabled'
+      end,
+      **
+    )
+  end
+end

app/controllers/interview_surveys_controller.rb

@@ -1,12 +1,27 @@
 class InterviewSurveysController < ApplicationController
+  before_action :authenticate_user!
+  requires_feature :survey_feature
+
   def new
-    unless Feature.enabled?(:survey_feature, current_user)
-      redirect_to dashboard_path, notice: 'Feature not enabled'
-    end
+    @interview_survey = InterviewSurvey.new
   end
 
   def create
-    # puts params[:survey]
-    redirect_to dashboard_path, notice: 'Survey Submitted'
+    @interview_survey = current_user.interview_surveys.build(interview_survey_params)
+
+    if @interview_survey.save!
+      redirect_to dashboard_path, notice: 'Survey Submitted'
+    else
+      render :new, status: :unprocessable_entity
+    end
+  end
+
+  private
+
+  def interview_survey_params
+    params.require(:interview_survey).permit(
+      :interview_date,
+      interview_concept_names: []
+    )
   end
 end

app/javascript/controllers/multi_select_controller.js

@@ -0,0 +1,14 @@
+import { Controller } from '@hotwired/stimulus'
+import SlimSelect from 'slim-select'
+
+export default class MultiSelectController extends Controller {
+  connect () {
+    // eslint-disable-next-line no-new
+    new SlimSelect({
+      select: this.element,
+      events: {
+        addable: function (value) { return value }
+      }
+    })
+  }
+}

app/models/interview_concept.rb

@@ -1,5 +1,6 @@
 class InterviewConcept < ApplicationRecord
-  has_many :interview_survey_concepts, dependent: :destroy
+  has_many :interview_survey_concepts, dependent: :destroy, inverse_of: :interview_concept
+  has_many :interview_surveys, through: :interview_survey_concepts, inverse_of: :interview_concepts
 
   validates :name, presence: true
   validates :name, length: { minimum: 2, maximum: 25 }

app/models/interview_survey.rb

@@ -1,10 +1,25 @@
 class InterviewSurvey < ApplicationRecord
   belongs_to :user
-  has_many :interview_survey_concepts, dependent: :destroy
+  has_many :interview_survey_concepts, dependent: :destroy, inverse_of: :interview_survey
+  has_many :interview_concepts,
+           through: :interview_survey_concepts,
+           inverse_of: :interview_surveys
 
   validates :interview_date, presence: true
   validate :interview_date_must_be_in_the_past
 
+  def interview_concept_names
+    interview_concepts.pluck(:name)
+  end
+
+  def interview_concept_names=(names)
+    self.interview_concepts = names.compact_blank.map do |name|
+      InterviewConcept.find_or_create_by(name:)
+    end
+  end
+
+  private
+
   def interview_date_must_be_in_the_past
     return if interview_date.present? && interview_date <= Time.zone.today
 

app/models/user.rb

@@ -19,6 +19,7 @@ class User < ApplicationRecord
   has_many :notifications, as: :recipient, dependent: :destroy
   has_many :announcements, dependent: nil
   has_many :likes, dependent: :destroy
+  has_many :interview_surveys, dependent: :destroy
 
   belongs_to :path, optional: true, counter_cache: true
 

app/views/interview_surveys/new.html.erb

@@ -4,8 +4,18 @@
   <div class="page-container">
     <h1 class="page-heading-title">Interview Survey</h1>
 
-    <div class='max-w-xl mx-auto'>
-      <%# where form will be rendered %>
-    </div>
+    <%= form_with model: @interview_survey, builder: TailwindFormBuilder do |form| %>
+      <%= form.label :interview_date %>
+      <%= form.date_field :interview_date %>
+
+      <%= form.label :interview_concept_names %>
+      <%= form.select :interview_concept_names,
+        InterviewConcept.pluck(:name, :name),
+        { multiple: true },
+        { data: { controller: 'multi-select' } } %>
+
+      <%= form.submit 'Submit', class: 'button button--primary w-full text-sm' %>
+    <% end %>
+
   </div>
 </div>

app/views/layouts/application.html.erb

@@ -22,6 +22,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
 
     <%= stylesheet_link_tag 'application', 'main', media: 'all', data: { turbo_track: 'reload' } %>
+    <link rel="stylesheet" href="https://unpkg.com/slim-select@latest/dist/slimselect.css" />
     <%= render 'shared/sentry' %>
     <%= render 'shared/analytics' %>
     <%= javascript_include_tag 'main', defer: true, data: { turbo_track: 'reload' } %>

package.json

@@ -30,6 +30,7 @@
     "mermaid": "^11.6.0",
     "postcss": "^8.5.3",
     "prismjs": "^1.30.0",
+    "slim-select": "^2.11.0",
     "sortablejs": "^1.15.6",
     "stimulus-use": "^0.52.3",
     "tailwindcss": "4.1.7",

spec/models/interview_concept_spec.rb

@@ -4,6 +4,7 @@
   subject(:interview_concept) { create(:interview_concept) }
 
   it { (is_expected.to have_many(:interview_survey_concepts)) }
+  it { (is_expected.to have_many(:interview_surveys)) }
   it { is_expected.to validate_presence_of(:name) }
   it { is_expected.to validate_length_of(:name).is_at_least(2).is_at_most(25) }
 end

spec/models/user_spec.rb

@@ -17,6 +17,7 @@
   it { is_expected.to have_many(:notifications) }
   it { is_expected.to have_many(:likes).dependent(:destroy) }
   it { is_expected.to belong_to(:path).optional(true) }
+  it { is_expected.to have_many(:interview_surveys).dependent(:destroy) }
 
   context 'when user is created' do
     let!(:default_path) { create(:path, default_path: true) }

spec/system/interview_survey_spec.rb

@@ -10,11 +10,33 @@
   context 'when the feature is enabled' do
     before do
       Flipper.enable(:survey_feature)
+      create(:interview_concept, name: 'Rails routing')
     end
 
-    it 'shows the survey' do
+    it 'creates an interview survey with existing concepts' do
       visit new_interview_survey_path
-      expect(page).to have_content('Interview Survey')
+
+      fill_in :interview_survey_interview_date, with: Date.current
+
+      find('div[aria-label="Combobox"]').click
+      find('div[class="ss-option"]', text: 'Rails routing').click
+
+      click_on 'Submit'
+
+      expect(page).to have_content('Survey Submitted')
+    end
+
+    it 'creates an interview survey with new concepts' do
+      visit new_interview_survey_path
+
+      fill_in :interview_survey_interview_date, with: Date.current
+
+      find('div[aria-label="Combobox"]').click
+      find('input[type="search"]').set('React props').send_keys(:return)
+
+      click_on 'Submit'
+
+      expect(page).to have_content('Survey Submitted')
     end
   end