Ruby on Rails 画像アイコンで検索したい！！ ransack

# はじめに
この記事はRuby初心者が備忘録を兼ねて作成したものです。間違い等ありました指摘よろしくお願いします。
# 環境
・ruby 3.2.3
・rails 7.2.1
# 実現したいこと
Railsでよくある掲示板投稿アプリ。そこでの検索機能を実装していきます。ただ今回は画像アイコンでの検索を可能にしていきたいと思います。
また`ransack`を使用するのですが詳細に関しては、他にわかりやすい記事がたくさんあると思うので割愛したいと思います。
# アプリケーション作成
まずはGemfileに`ransack`を追加し、`bundle install`
```:Gemfile
gem 'ransack'
```
### コントローラーの作成
```app/controllers/boards_controller.rb
class BoardsController < ApplicationController
  def index
    @q = Board.ransack(params[:q])
    @boards = @q.result.includes(:user)
  end
  
 （略）
 
end
```

### 掲示板を投稿する際、こちらが用意した画像アイコンを選択してもらうので以下のように作成。
```:app/views/boards/new.html.erb
<p>新しい投稿</p>

<%= form_with model: @board do |form| %>
  <div>
    <%= form.label :タイトル %>
    <%= form.text_field :title %>
  </div>
  <div>
    <%= form.label :本文 %>
    <%= form.text_area :body %>
  </div>
  <div>
  <p>アイコンを選択:</p>
    <div>
      <%= form.radio_button :icon, "your_img１", id: "icon_0_10" %>
      <%= label_tag "icon_0_10" do %>
        <%= image_tag("your_img１", alt: "アイコン１", class: "icon-img") %>
      <% end %>
    </div>
    <div>
      <%= form.radio_button :icon, "your_img2", id: "icon_0_20" %>
      <%= label_tag "icon_0_20" do %>
        <%= image_tag("your_img2", alt: "アイコン２", class: "icon-img") %>
      <% end %>
    </div>
    <div>
      <%= form.radio_button :icon, "your_img3", id: "icon_0_30" %>
      <%= label_tag "icon_0_30" do %>
        <%= image_tag("your_img3", alt: "アイコン３", class: "icon-img") %>
      <% end %>
    </div>  
  </div>
  <div>
  <div>
    <%= form.submit "投稿" %>
  </div>
<% end %>
```
・`form.radio_button`を使用しラジオボタンを生成してます。
・`:icon` これはラジオボタンが関連付けられている属性名です。 `boards` テーブルの `icon`      
   カラムに対応しています。
・`id: "icon_0_10"` は`label_tag`でこのIDを使ってラジオボタンとラベルを関連付けるために利用されます。

### ヘッダー部分に画像を表示。選択することで画像で検索できるようにする。
```app/views/shared/_header.html.erb
<%= search_form_for @q do |f| %>
        <div>
          <div class="icon-selection">
            <%= f.label :icon, "アイコンで検索" %>
            <div>
              <%= f.radio_button :icon_eq, "your_img１", id: "icon_0_10",class: "d-none" %>
              <%= label_tag "icon_0_10", image_tag("your_img１", alt: "アイコン1", class: "icon-img")  %>
            </div>
            <div>
              <%= f.radio_button :icon_eq, "your_img2",id: "icon_0_20",class: "d-none" %>
              <%= label_tag "icon_0_20", image_tag("your_img2", alt: "アイコン1", class: "icon-img") %>
            </div>
            <div>
              <%= f.radio_button :icon_eq, "your_img3", id: "icon_0_30",class: "d-none" %>
              <%= label_tag "icon_0_30", image_tag("your_img3", alt: "アイコン1", class: "icon-img") %>
            </div>
            <div>
              <%= f.submit "検索" %>
            </div>
          </div>
        </div>
      <% end %>
```
`:icon_eq`でデータベースのアイコンフィールドの値と等しいかどうかをチェック。選択されたアイコンに基づいて検索結果をフィルタリングしています。

### 最後にRansackがどの属性を使って検索できるかを定義
```app/models/board.rb
class Board < ApplicationRecord
  validates :title, presence: true, length:  { maximum: 255 }
  validates :body, presence: true, length: { maximum: 65_535 }
  validates :icon, presence:true

  belongs_to :user
  has_many :comments, dependent: :destroy

  def self.ransackable_attributes(auth_object= nil)
    ["icon"]
  end
end

```
# 参考
https://railsdoc.com/page/label_tag
https://github.com/activerecord-hackery/ransack
https://qiita.com/gyu_outputs/items/6cad794b4ca3868e976e