FAQにカテゴリを追加する

app/controllers/admin/faq_categories/faqs_controller.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+class Admin::FAQCategories::FaqsController < AdminController
+  before_action :set_faq_category, only: %i[index update]
+
+  def index
+    @faqs = @faq_category.faqs
+  end
+
+  def update
+    faq = @faq_category.faqs.find(params[:id])
+    faq.insert_at(params[:faq][:insert_at].to_i)
+    head :ok
+  end
+
+  private
+
+  def set_faq_category
+    @faq_category = FAQCategory.find(params[:faq_category_id])
+  end
+end

app/controllers/admin/faq_categories_controller.rb

@@ -0,0 +1,53 @@
+# frozen_string_literal: true
+
+class Admin::FAQCategoriesController < AdminController
+  before_action :set_faq_category, only: %i[edit update destroy]
+
+  def index
+    @faq_categories = FAQCategory.order(:created_at)
+  end
+
+  def new
+    @faq_category = FAQCategory.new
+  end
+
+  def create
+    @faq_category = FAQCategory.new(faq_category_params)
+
+    if @faq_category.save
+      redirect_to admin_faq_categories_path, notice: 'FAQカテゴリーを作成しました。'
+    else
+      render 'new'
+    end
+  end
+
+  def edit; end
+
+  def update
+    if params[:faq_category][:insert_at]
+      @faq_category.insert_at(params[:faq_category][:insert_at].to_i)
+      return head :ok
+    end
+
+    if @faq_category.update(faq_category_params)
+      redirect_to admin_faq_categories_path, notice: 'FAQカテゴリーを更新しました。'
+    else
+      render 'edit'
+    end
+  end
+
+  def destroy
+    @faq_category.destroy
+    redirect_to admin_faq_categories_path, notice: 'FAQカテゴリーを削除しました。'
+  end
+
+  private
+
+  def faq_category_params
+    params.require(:faq_category).permit(:name, :insert_at)
+  end
+
+  def set_faq_category
+    @faq_category = FAQCategory.find(params[:id])
+  end
+end

app/controllers/admin/faqs_controller.rb

@@ -0,0 +1,52 @@
+# frozen_string_literal: true
+
+class Admin::FaqsController < AdminController
+  before_action :set_faq, only: %i[show edit update destroy]
+  before_action :set_faq_category, only: %i[index edit new update create]
+
+  def index; end
+
+  def new
+    @faq = FAQ.new
+  end
+
+  def create
+    @faq = FAQ.new(faq_params)
+
+    if @faq.save
+      redirect_to admin_faqs_path, notice: 'FAQを作成しました。'
+    else
+      render 'new'
+    end
+  end
+
+  def show; end
+  def edit; end
+
+  def update
+    if @faq.update(faq_params)
+      redirect_to admin_faqs_path, notice: 'FAQを更新しました。'
+    else
+      render 'edit'
+    end
+  end
+
+  def destroy
+    @faq.destroy
+    redirect_to admin_faqs_path, notice: 'FAQを削除しました。'
+  end
+
+  private
+
+  def faq_params
+    params.require(:faq).permit(:answer, :question, :faq_category_id)
+  end
+
+  def set_faq
+    @faq = FAQ.find(params[:id])
+  end
+
+  def set_faq_category
+    @faq_categories = FAQCategory.all
+  end
+end

app/controllers/welcome_controller.rb

@@ -1,9 +1,11 @@
 # frozen_string_literal: true
 
+require_dependency 'faq_category'
 class WelcomeController < ApplicationController
   skip_before_action :require_active_user_login, raise: false
   layout 'lp'
   DEFAULT_COURSE = 'Railsエンジニア'
+  FAQ_CATEGORY_NAME = '法人利用について'
 
   def index
     @mentors = current_user ? User.mentors_sorted_by_created_at : User.visible_sorted_mentors
@@ -15,9 +17,22 @@ def job_support; end
 
   def pricing; end
 
-  def faq; end
+  def faq
+    @faq_categories = FAQCategory.order(:position).select do |faq_category|
+      faq_category.faqs.present?
+    end
+
+    if params[:category].present?
+      faq_category = FAQCategory.find_by(name: params[:category])
+      @faqs = faq_category.faqs
+    else
+      @faqs = FAQ.order(:position)
+    end
+  end
 
-  def training; end
+  def training
+    @faqs = FAQCategory.find_by(name: FAQ_CATEGORY_NAME).faqs
+  end
 
   def practices; end
 

app/helpers/faq_helper.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+module FAQHelper
+  def format_question(question)
+    "#{question.delete('?？')}？"
+  end
+end

app/javascript/packs/application.js

@@ -57,6 +57,8 @@ import '../invitation-url-updater.js'
 import '../payment-methods-check-boxes.js'
 import '../product-checker.js'
 import '../user-follow.js'
+import '../sort-faq.js'
+import '../sort-faq-category.js'
 
 import VueMounter from '../VueMounter.js'
 import Questions from '../components/questions.vue'

app/javascript/sort-faq-category.js

@@ -0,0 +1,24 @@
+import Sortable from 'sortablejs'
+import Bootcamp from 'bootcamp'
+
+document.addEventListener('DOMContentLoaded', () => {
+  const element = document.querySelector('#js-faq-category-sortable')
+  if (!element) return
+
+  Sortable.create(element, {
+    handle: '.js-grab',
+    onEnd(event) {
+      const id = event.item.id
+      const url = `/admin/faq_categories/${id}`
+      const params = {
+        faq_category: {
+          insert_at: event.newIndex + 1
+        }
+      }
+
+      Bootcamp.patch(url, params).catch((error) => {
+        console.error('Error while updating an order:', error)
+      })
+    }
+  })
+})

app/javascript/sort-faq.js

@@ -0,0 +1,25 @@
+import Sortable from 'sortablejs'
+import Bootcamp from 'bootcamp'
+
+document.addEventListener('DOMContentLoaded', () => {
+  const element = document.querySelector('#js-faq-sortable')
+  if (!element) return
+
+  Sortable.create(element, {
+    handle: '.js-grab',
+    onEnd(event) {
+      const id = event.item.id
+      const categoryId = event.item.dataset.faqCategoryId
+      const url = `/admin/faq_categories/${categoryId}/faqs/${id}`
+      const params = {
+        faq: {
+          insert_at: event.newIndex + 1
+        }
+      }
+
+      Bootcamp.patch(url, params).catch((error) => {
+        console.error('Error while updating an order:', error)
+      })
+    }
+  })
+})

app/javascript/stylesheets/_common-imports.sass

@@ -173,4 +173,30 @@
 @import "shared/blocks/card-list/card-list"
 @import "shared/blocks/card-list/products"
 
+@import shared/blocks/form/block-checks
+@import shared/blocks/form/books-form-item
+@import shared/blocks/form/books-form
+@import shared/blocks/form/checkboxes
+@import shared/blocks/form/form-actions
+@import shared/blocks/form/form-added-choice
+@import shared/blocks/form/form-item-actions
+@import shared/blocks/form/form-item-block
+@import shared/blocks/form/form-item-group
+@import shared/blocks/form/form-item
+@import shared/blocks/form/form-link-block
+@import shared/blocks/form/form-notice
+@import shared/blocks/form/form-selects
+@import shared/blocks/form/form-tabs-item
+@import shared/blocks/form/form-tabs
+@import shared/blocks/form/form-times
+@import shared/blocks/form/form
+@import shared/blocks/form/hidden-form-item
+@import shared/blocks/form/important-message
+@import shared/blocks/form/linear-scale
+@import shared/blocks/form/many-check-boxes
+@import shared/blocks/form/markdown-form
+@import shared/blocks/form/radios
+@import shared/blocks/form/vue-tags-input
+@import shared/blocks/form/form-textarea
+
 @import "shared/helpers/state"

app/javascript/stylesheets/application.sass

@@ -29,32 +29,6 @@
 @import application/blocks/footer/footer-nav
 @import application/blocks/footer/footer
 
-@import application/blocks/form/block-checks
-@import application/blocks/form/books-form-item
-@import application/blocks/form/books-form
-@import application/blocks/form/checkboxes
-@import application/blocks/form/form-actions
-@import application/blocks/form/form-added-choice
-@import application/blocks/form/form-item-actions
-@import application/blocks/form/form-item-block
-@import application/blocks/form/form-item-group
-@import application/blocks/form/form-item
-@import application/blocks/form/form-link-block
-@import application/blocks/form/form-notice
-@import application/blocks/form/form-selects
-@import application/blocks/form/form-tabs-item
-@import application/blocks/form/form-tabs
-@import application/blocks/form/form-times
-@import application/blocks/form/form
-@import application/blocks/form/hidden-form-item
-@import application/blocks/form/important-message
-@import application/blocks/form/linear-scale
-@import application/blocks/form/many-check-boxes
-@import application/blocks/form/markdown-form
-@import application/blocks/form/radios
-@import application/blocks/form/vue-tags-input
-@import application/blocks/form/form-textarea
-
 @import application/blocks/header/header-current-user
 @import application/blocks/header/header-dropdown
 @import application/blocks/header/header-links

app/javascript/stylesheets/atoms/_a-text-input.sass

@@ -53,6 +53,8 @@ textarea.a-text-input
   line-height: 1.5
   min-height: 10rem
   overflow: hidden
+  &.is-xs
+    min-height: 6rem
   &.is-sm
     min-height: 10rem
   &.is-md

app/javascript/stylesheets/config/mixins/_grid.sass

@@ -11,7 +11,6 @@
 .row
   @for $i from 0 through 16
     $gutter-size: $i * 4
-    +media-breakpoint-up(xl)
-      &.is-gutter-width-#{$gutter-size}
-        gap: #{math.div($gutter-size, 16)}rem
-        +make-grid-columns($grid-columns, #{math.div($gutter-size, 16)}rem)
+    &.is-gutter-width-#{$gutter-size}
+      gap: #{math.div($gutter-size, 16)}rem
+      +make-grid-columns($grid-columns, #{math.div($gutter-size, 16)}rem)

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

@@ -3,7 +3,7 @@ $accent: hsl(44, 96%, 54%)
 $base: white
 
 // completion
-$completion: hsl(197deg 83% 49%)
+$completion: hsl(197, 83%, 49%)
 $completion-dark: rgb(0 0 0 / 20%)
 
 // background

app/javascript/stylesheets/lp.sass

@@ -16,6 +16,8 @@
 @import lp/blocks/lp/lp-header
 @import lp/blocks/lp/lp-header-nav
 
+@import lp/blocks/lp/welcome-top-info
+
 // top
 @import lp/blocks/lp/lp-top-cover
 
@@ -60,6 +62,7 @@
 // lp-faqs
 @import lp/blocks/lp/lp-faqs
 @import lp/blocks/lp/lp-faq
+@import lp/blocks/lp/side-filter
 
 // lp-course-selection
 @import lp/blocks/lp/lp-course-selection
@@ -79,11 +82,6 @@
 @import lp/blocks/articles/article-author
 
 /////////////////////
-@import lp/welcome/welcome-top-info
-@import lp/welcome/welcome-trial-period-table
-
 
-@import lp/corporate-training/corporate-training-images
-@import lp/corporate-training/corporate-training-overview
 @import lp/corporate-training/corporate-training-example
 @import lp/corporate-training/corporate-training-testimonial

app/javascript/stylesheets/lp/base/_base.sass

@@ -5,7 +5,6 @@ html.is-lp
 body.is-lp
   background-color: var(--background)
 
-
 .not-logged-in-footer
   color: var(--default-text)
 

app/javascript/stylesheets/lp/blocks/lp/_lp-content-sub-title.sass

@@ -12,3 +12,11 @@
     +text-block(1.375rem 1.4, 800)
     &.is-course-name
       font-size: .875rem
+  &.is-sm
+    color: var(--main)
+    +media-breakpoint-up(lg)
+      +text-block(1.5rem 1.4, 800)
+    +media-breakpoint-only(md)
+      +text-block(1.25rem 1.4, 800)
+    +media-breakpoint-down(sm)
+      +text-block(1.125rem 1.4, 800)

app/javascript/stylesheets/lp/blocks/lp/_lp-faq.sass

@@ -29,3 +29,12 @@
     font-size: 1rem
   +media-breakpoint-down(sm)
     font-size: .875rem
+
+.lp-faq__edit
+  margin-top: .75rem
+
+.lp-faq__edit-link
+  +text-block(.875rem 1.4)
+  color: var(--muted-text)
+  &:hover
+    color: var(--main)

app/javascript/stylesheets/lp/blocks/lp/_lp-faqs.sass

@@ -3,4 +3,4 @@
   flex-direction: column
   gap: 2rem
   max-width: 40rem
-  float: right
+  margin: 0