<table class="ad_signup">
  <tr>
    <td colspan = 2>
      <div class="centered large_title">Connect To Facebook and Google Ads to Enable Social advertising</div>
    </td>
  </tr>
  <tr>
    <td valign="center">
      <div>
        <div class="centered vertical_large">
          <div class="adware_label">Facebook Ads</div>
          <div class="button button_grey" id="facebook-login">
            <%= image_tag "/assets/admin/icons/facebook-128.png", class: "button_icon" %>
            <span class="facebook-login-text">Facebook</span>
          </div>
        </div>
      </div>
    </tdv>
    <td valign="center">
      <div class="centered vertical_large">
        <div class="adware_label">Google Ads</div>
        <div class="button button_grey">
          <%= image_tag "/assets/admin/icons/google-128.png", class: "button_icon" %>
          <span>Google</span>
        </div>
      </div>
    </td>
  </tr>
</table>

<script>
  window.fbAsyncInit = () => {

   // 401 errors happens here:
    const checkExistingToken = () => {
      $.get({
        url: '/admin/accounts/<%= current_user.current_account_id %>.json'
      }, (data) => {
        console.log(data);

        if (data.facebook_token) {
          $('.facebook-login-text').html('Facebook <i class="fa fa-check"></i>');
        }
      })
    }

    checkExistingToken();

    const login = () => {
      FB.getLoginStatus((response) => {

        // If user is not logged in:
        if (response.status !== 'connected') {
          FB.login((loginResponse) => {
            if (!loginResponse.authResponse) {
              return
            }

            let token = loginResponse.authResponse.accessToken
            updateUserFbToken(token);
            $('.facebook-login-text').html('Facebook <i class="fa fa-check"></i>');

          }, { scope: 'ads_management,ads_read,business_management,manage_pages,publish_pages' })
        } else {
          FB.logout();
          $('#facebook-login > span').html('Facebook');
        };
      });
    }

    const updateUserFbToken = (value) => {
      $.ajax({
        method: 'PUT',
        url: '/admin/accounts/<%= current_user.current_account_id %>',
        data: {
          authenticity_token: $('[name="csrf-token"]')[0].content,
          'account[facebook_token]': value,
          ajax: true
        }
      })
    }

    $('#facebook-login').click(() => {
      login()
    })

// Facebook scripts injection

    FB.init({
      appId: "<%= Rails.application.credentials.facebook[:app_id] %>",
      cookie: true,
      xfbml: true,
      version: "<%= Rails.application.credentials.facebook[:api_version] %>"
    });

    FB.AppEvents.logPageView();
  };

  (function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) { return; }
    js = d.createElement(s); js.id = id;
    js.src = "https://connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));

// End Facebook scripts injection
</script>