Calling an Identiy Provider API Issues with automating token

Hello,

I am well and truly stuck with calling an Identity provider API (in my case GitHub) via a React application. I have read through the documentation but the part around automating the token request is difficult to make out. https://auth0.com/docs/tutorials/calling-an-external-idp-api

Settings I have (2 Clients):

1 Single Page Application used for step 1 (below) for my login process.

1 API Explorer client (non-interactive)

Step 1.

I have a custom login form that uses the GitHub social connection, this works great and returns an access token, no issues here.

Step 2.

From what I understand I cannot use the access token from Step 1 to access the GitHub API, I have to get a new token via a post request which will then return an access token within the identities array which I can extract and use to call the GitHub API.

I have attempted this request using axios within my React App like so:

axios
  .post('https://name.eu.auth0.com/oauth/token', {
    headers: {
      'content-type': 'application/json'
    },
    data: {
      client_id: 'CLIENT_ID',
      client_secret: 'CLIENT_SECRET',
      audience: 'https://name.eu.auth0.com/api/v2/',
      grant_type: 'client_credentials'          
    }
  })
  .then(function(response) {
    console.log(response);
  })
  .catch(function(error) {
    console.log(error);
  });

But I get an error, request failed with status code 401, which means unauthorised access. I have been using my API explorer client (non-interactive) details here for the client_id and client_secret.

I’m not sure what I’m doing wrong, I presume I have some configuration wrong within my Auth0 account dashboard but its quite confusing to work out how it should be setup, I would love if you have a real demo somewhere.

I have used the management API on your website with a manually generated token and it works great. Auth0 Management API v2