Content inside dev tag in Rails repo cannot be displayed

Question

I am making an "add to bookmark" function, I have already set up the route, controller and related models. Finally, I want to add the "add to bookmark" hyperlink to the page, but I find that it doesn't show up, that is, it doesn't exist on the page. What should I add please? Is this something to do with JavaScript?

This is the undisplayable content (part of view):

    <div data-controller="favorite" data-favorite-id-value="<%= @task.id %>">
      <a href="#" id="favorite_btn" data-action="favorite#toggleFavorite">
        <%= favorite_icon(current_user, @task) %>
      </a>
    </div>

This is part of routes:

    namespace :api do
        namespace :v1 do
            resources :tasks, only: [] do
                member do
                    post :favorite
                end
            end
        end
    end

this is its controller

class Api::V1::TasksController < ApplicationController
    def favorite
    task = Task.find(params[:id])

    if Bookmark.exists?(task: task)
      # Remove bookmark
      current_user.favorite_notes.delete(task)
      render json: { status: "removed", id: params[:id] }
    else
      # Add bookmark
      current_user.favorite_notes << task
      render json: { status: "added", id: params[:id] }
    end
  end
end

this is model Bookmark

class Bookmark < ApplicationRecord
  belongs_to :user
  belongs_to :task
end

this is part of model User

  has_many :bookmarks
  has_many :favorite_notes,
            through: :bookmarks,
            source: :task

  def favorite?(n)
    favorite_notes.exists?(n.id)
  end

this is TasksHelper

module TasksHelper
  def favorite_icon(user, task)
    classes = ['favorite_icon']

    if user
      classes << (user.favorite?(task) ? 'favorite-on' : 'favorite-off')
    end

    tag.div class: classes, "data-favorite-target": "icon"
  end
end