API endpoint SDK (/api/v1/me/roles/) not compatible with SUPERSET_APP_ROOT subpath routing

[irodriguez-nebustream]

Bug description

When Superset is configured with SUPERSET_APP_ROOT set to a non-root path (e.g., "/prefix"), the embedded dashboard's API call to /api/v1/me/roles/ fails with a 404 error because the endpoint doesn't account for the application root path.
Reproduction steps:

Configure Superset with SUPERSET_APP_ROOT="/prefix" in the config
Embed a dashboard using the embedDashboard() SDK function
Monitor the network requests

Expected behavior:
The API call should go to /prefix/api/v1/me/roles/ (with the app root prefix) to match the subpath routing configuration.
Actual behavior:
The API call goes to /api/v1/me/roles/ (without the prefix), resulting in a 404 error because the route doesn't exist at the root level.
Root cause:

In superset-frontend/src/embedded/index.tsx, the start() function has a hardcoded endpoint path that doesn't consider the application root:
typescriptconst getMeWithRole = makeApi<void, { result: UserWithPermissionsAndRoles }>({
  method: 'GET',
  endpoint: '/api/v1/me/roles/',  // Hardcoded path, no app root
});

Screenshots/recordings

Console error showing 404 for /api/v1/me/roles/ when Superset is configured with SUPERSET_APP_ROOT="/prefix"

Superset version

master / latest-dev

Python version

3.10

Node version

I don't know

Browser

Chrome

Additional context

No response

Checklist

• I have searched Superset docs and Slack and didn't find a solution to my problem.
• I have searched the GitHub issue tracker and didn't find a similar bug report.
• I have checked Superset's logs for errors and if I found a relevant Python stacktrace, I included it here as text in the "additional context" section.

[dosubot]

To resolve the issue with the API endpoint not accounting for the SUPERSET_APP_ROOT subpath routing, you can modify the endpoint to dynamically include the application root. This can be achieved by using the getUrl method from the SupersetClientClass in the Superset SDK. Here's how you can adjust the endpoint in your code:

Replace the hardcoded endpoint in superset-frontend/src/embedded/index.tsx with a dynamic one:

import { SupersetClient } from 'superset-ui-core';

const client = new SupersetClient();

const getMeWithRole = makeApi<void, { result: UserWithPermissionsAndRoles }>({
  method: 'GET',
  endpoint: client.getUrl({ endpoint: '/api/v1/me/roles/' }),  // Use getUrl to include app root
});

This change will ensure that the API call correctly includes the SUPERSET_APP_ROOT prefix, preventing the 404 error when accessing the endpoint ^[1][2].

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Bug Report | Other}

[irodriguez-nebustream]

Very new to doing any PR's but here is my attempt at a fix #33356

[irodriguez-nebustream]

@rusackas Hello, i'm fairly new to contributing, but I believe this is a simple enough fix. Can you help me get this through

[rusackas]

Leaving comments on the PR...