【Rails/GitHub】お問い合わせフォームからの問い合わせ内容を自動でissue化！

HPでもWebサービスでもお問い合わせフォームは必須な機能だと思います。
今回はお問い合わせフォームからのお問い合わせ内容をGitHubのissueにする方法を紹介します。

事前準備

Gemをインストールする

Gemfile

gem 'octokit'

GitHubでアクセストークンを作成する

github.com

ここからアクセストークンを作成します。

Issues の項目だけ、 Read and write を許可します。

作成したアクセストークンは1度しか表示されないので、忘れずコピーしましょう

アクセストークンをcredentialsに追加する

rails credentials:edit -e development を実行し、以下のようにアクセストークンを追加します。

github:
  access_token: github_~~~~

実装する

ルーティングを設定する

config/routes.rb

resources :inquiries, only: [:new, :create, :index]

Formを実装する

今回はDBに保存しないため、Formオブジェクトを使用します。

app/forms/create_inquiry_form.rb

class CreateInquiryForm
  include ActiveModel::Model
  include ActiveModel::Attributes

  attribute :email, :string
  attribute :name, :string
  attribute :title, :string
  attribute :body, :string

  def save
    return false if invalid?
    ActiveRecord::Base.transaction do
      client = Octokit::Client.new(access_token: Rails.application.credentials.dig(:github, :access_token))
      client.create_issue(
        "kanahebi/inquiry", # issueを作成するリポジトリを指定します。
        title,
        issue_body,
        labels: [
          "未対応", "お問い合わせ"
        ],
        assignees: [
          "kanahebi" # 担当者をアサインしたい場合はここにGitHubのアカウント名を指定します。
        ]
      )
    end
  rescue ActiveRecord::RecordInvalid
    false
  end

  private

  def issue_body
    <<-"BODY"
## お名前
#{name}
## メールアドレス
#{email}
## お問い合わせ内容
#{body}
    BODY
  end
end

コントローラーを実装する

app/controllers/inquiries_controller.rb

class InquiriesController < ApplicationController
  def new
    @inquiry = CreateInquiryForm.new
  end

  def create
    @inquiry = CreateInquiryForm.new(inquiry_params)
    if @inquiry.save
      redirect_to inquiries_url
    else
      render 'new', status: :unprocessable_entity
    end
  end

  def index; end

  private

  def inquiry_params
    params.fetch(:inquiry, {}).permit(:email, :name, :title, :body)
  end
end

viewsを実装する

app/views/inquiries/new.html.erb

<%= form_with model: @inquiry, scope: :inquiry, url: inquiries_path, local: true do |f| %>
  <div>
    <label>
      お名前
    </label>
    <%= f.text_field :name, required: true %>
  </div>
  <div>
    <label>
      メールアドレス
    </label>
    <%= f.email_field :email, required: true %>
  </div>
  <div>
    <label>
      タイトル
    </label>
    <%= f.text_field :title, required: true %>
  </div>
  <div>
    <label>
      詳しい内容
    </label>
    <%= f.text_area :body, required: true %>
  </div>
  <div>
    <%= f.submit "送信する" %>
  </div>
<% end %>

app/views/inquiries/index.html.erb

<div>お問い合わせありがとうございました</div>

動作確認

このような内容でお問い合わせしてみると
GitHub上に以下のようなissueが作成されました！

終わり

カテゴリを追加して、カテゴリごとに担当者を変更するようにするのも便利だと思います！
issue内でお問い合わせ内容についてのディスカッションをしたり、対応状況について記録をするのがおすすめです！

もふもふ技術部

IT技術系mofmofメディア