The useApiUrl hook retrieves the default API URL in multiple data providers

According to the documentation, one can use multiple data providers like:

dataProvider={{
  default: dataProvider("https://api.fake-rest.refine.dev"),
  users: dataProvider("https://api.finefoods.refine.dev"),
}}

dataProvider={{
  default: dataProvider("https://api.fake-rest.refine.dev"),
  users: dataProvider("https://api.finefoods.refine.dev"),
}}

And in the resource props, I have something like:

resources={[
  {
    name: "users",
    list: "/dashboard",
    meta: {
      label: "Dashboard",
      dataProviderName: "users",
    },
  },
]}

resources={[
  {
    name: "users",
    list: "/dashboard",
    meta: {
      label: "Dashboard",
      dataProviderName: "users",
    },
  },
]}

When I try to retrieve the API URL with the useApiUrl hook in the rendered component, I get the default API URL instead of the URL for the specified data provider.

import React from "react";
import { useApiUrl } from "@refinedev/core";

export const DashboardPage: React.FC = () => {
  const API_URL = useApiUrl();
  // This picks the default API_URL
  return (
    <p>
      Data provider: <code>{API_URL}</code>
    </p>
  );
};

import React from "react";
import { useApiUrl } from "@refinedev/core";

export const DashboardPage: React.FC = () => {
  const API_URL = useApiUrl();
  // This picks the default API_URL
  return (
    <p>
      Data provider: <code>{API_URL}</code>
    </p>
  );
};

Any reason for this? The example project doesn't help that much in this case.

4 Replies

kapa.ai•15mo ago

Hi @onion7963. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: Sorry @onion7963, I am experiencing especially high traffic right now, please try again. :technologist:

adverse-sapphire•15mo ago

Hey @onion7963, You are right, useApiUrl is not that smart yet. Could you create an issue for this? For now, you can solve your problem by manually passing dataProviderName to useApiUrl as a param.

vicious-gold•14mo ago

Thanks

sunny-green•14mo ago

Hey @onion7963 We've released the feature you mentioned! Please check this PR https://github.com/refinedev/refine/pull/4448

GitHub

feat(core): make useApiUrl hook resource aware by BatuhanW · Pull...

Refactored useApiUrl to infer data provider from the current resource. If you explicitly pass dataProviderName to useApiUrl hook, it will be used. Then it will try to get current resource's dat...