ui-kit icon indicating copy to clipboard operation
ui-kit copied to clipboard

"No access token provided" error even if `fetchToken` function is provided.

Open GabrielMusatMestre opened this issue 10 months ago • 0 comments

Describe the bug

When fresh starting the React application, a lot of errors like this are thrown:

@propeldata_ui-kit.js?v=d0ba27f7:23550 No access token provided.

Even though the fetchToken function is provided to AccessTokenProvider.

After 10-15 errrors thrown, it stops (at this point, the Oauth server responded with the token correctly)

To reproduce

This is the code for my whole application:

import { Counter, AccessTokenProvider } from '@propeldata/ui-kit'
import { ClientCredentials } from 'simple-oauth2';

import './App.css'

const dataPool = import.meta.env.VITE_DATA_POOL_ID

function App() {
  return (
    <AccessTokenProvider fetchToken={fetchToken}>
      <Counter
        style={{ width: 100, height: 100 }}
        query={{
          metric: {
            count: {
              dataPool: { id: dataPool }
            }
          }
        }}
      />
    </AccessTokenProvider>
  )
}

export default App

async function fetchToken(): Promise<string> {
  const client = new ClientCredentials({
    client: {
      id: import.meta.env.VITE_CLIENT_ID,
      secret: import.meta.env.VITE_CLIENT_SECRET
    },
    auth: {
      tokenHost: "https://auth.us-east-2.propeldata.com",
      tokenPath: "/oauth2/token"
    }
  });
  const accessToken = await client.getToken({});
  return accessToken.token.access_token as string;
}

Screenshots or video

Screenshot 2024-04-11 at 12 28 50

Desktop (please complete the following information)

  • OS: macOS
  • Browser: Chrome
  • UI Kit Version: 0.5.5

GabrielMusatMestre avatar Apr 11 '24 10:04 GabrielMusatMestre