Ajax follow button

follo_topic.ex

defmodule MusicTester.FollowTopic do
  use MusicTester.Web, :model

  schema "follow_topics" do
    belongs_to :user, MusicTester.User
    belongs_to :topic, MusicTester.Topic

    timestamps
  end

  @required_fields ~w()
  @optional_fields ~w(user_id topic_id)

  @doc """
  Creates a changeset based on the `model` and `params`.

  If no params are provided, an invalid changeset is returned
  with no validation performed.
  """
  def changeset(model, params \\ :empty) do
    model
    |> cast(params, @required_fields, @optional_fields)
  end
end

follow_topic.js

$(".follow-topic").click(function() {
  let csrf = document.querySelector("meta[name=csrf]").content;
  let user_id = $(this).attr('user_id')
  let topic_id = $(this).attr('id')
  let obj = jQuery.parseJSON('{ "user_id": \"' + user_id +  '\", "topic_id": \"' + topic_id +  '\"}');
  $.ajax({
      url: "/api/v1/follow_topics",
      type: "POST",
      data: {
        follow_topic: obj
      },
      headers: {
          "X-CSRF-TOKEN": csrf 
      },
      dataType: "json",
      success: function (data) {
        $(".follow-topic").hide();
        $(".followed-topic").show();
        $(".followed-topic").attr( "id", data.data.id );
      },
      //error: function (data) {
      //  console.log(data);
      //}
  });
});


$(".followed-topic").click(function() {
  let csrf = document.querySelector("meta[name=csrf]").content;
  let follow_topic_id = $(this).attr('id')
  let obj = jQuery.parseJSON('{ "follow_topic_id": \"' + follow_topic_id +  '\"}');
  $.ajax({
      url: "/api/v1/follow_topics/" + follow_topic_id,
      type: "DELETE",
      data: {
        like_post: obj
      },
      headers: {
          "X-CSRF-TOKEN": csrf 
      },
      dataType: "json",
      success: function (data) {
        $(".follow-topic").show();
        $(".followed-topic").hide();
      },
  });
});

show.html.slim

= if @current_user do  
    .row.m-t-1
      .col-xs-12
        = if @follow_topic do
          .follow-topic.btn.btn-secondary.btn-sm id="#{@topic.id}" user_id="#{@current_user.id}" style="display:none;"
            = gettext("Follow")
          .followed-topic.btn.btn-secondary.btn-sm id="#{@follow_topic.id}"
            = gettext("Following")
        - else
          .follow-topic.btn.btn-secondary.btn-sm id="#{@topic.id}" user_id="#{@current_user.id}"
            = gettext("Follow")
          .followed-topic.btn.btn-secondary.btn-sm style="display:none;"
            = gettext("Following")

topic_controller.ex

def index(conn, _params) do
    topic = conn.assigns.topic

    follow_topic = 
      case  conn.assigns.current_user do
        nil ->
          false
        _ ->
          Repo.get_by( FollowTopic, user_id: conn.assigns.current_user.id, topic_id: topic.id)
      end

    render(conn, "show.html", topic: topic, follow_topic: follow_topic)
  end