form_with を使いながら bootstrap のボタンの中に fontawesome と文字を入れる

上の画像の右のボタンの中に

こうやってアイコンを入れる試み

左のメッセージは link_to のタグを使っているので簡単にアイコンを入れられるんだけど
右のフォローするのボタンは form_with をつかっているのでどうしても入れられなかった

開発環境

ruby 2.6.5
Ruby on Rails 5.2.5

前提

fontawesome を導入している

ちなみに左のボタンのコードは以下

  = link_to conversations_path(sender_id: current_user.id, recipient_id: user.id), method: :post, class: "btn btn-outline-primary" do 
    i.fab.fa-facebook-messenger
    | メッセージ

これは上記のコードで簡単にアイコンをいれられる

---

これを参考にした

そもそもなんで今回のケースでメッセージにアイコンをいれられるのかというと
メッセージのボタンは do で囲ってブロックの中に入れちゃってるから

対して form_with の submit でコンパイルされるフォームは input タグになる
だから do でブロックを取れない

なので submit ではなく `button_p にコンパイルするといける

これがどういうことかというと具体的なコードは以下

span id = "follow_form_#{user.id}"
  - unless current_user.following?(user)
    = form_with(model: current_user.active_relationships.build(followed_id: user.id), class: "follow_form") do |f|
      = f.hidden_field :followed_id
      = f.button class: "btn btn-outline-primary" do 
        i.far.fa-handshake
        |フォローをする
  - else 
    = form_with(model: current_user.active_relationships.find_by(followed_id: user.id), method: :delete, class: "follow_form") do |f|
      = f.button class: "btn btn-outline-primary" do 
        i.fas.fa-handshake-slash
        |フォローを解除

こうやって f.button ってするとブロックをとることができるみたい