Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using multiple API sources #117

Open
jamesremuscat opened this issue Mar 31, 2024 · 1 comment
Open

Using multiple API sources #117

jamesremuscat opened this issue Mar 31, 2024 · 1 comment

Comments

@jamesremuscat
Copy link

Just wondered if there was an idiomatic way to configure one Admiral frontend instance to talk to multiple backend APIs?

In my case, I have a bunch of different microservices all sharing an authentication method (JWT).

The best way I've found is to do something like the following:

const multiDataProvider = (resourceMap: { [key: string]: DataProvider }) : DataProvider => {
  return {

    getList: (resource: string, params: object) => resourceMap[resource].getList(resource, params),

    getOne: (resource: string, params: GetOneParams) => resourceMap[resource].getOne(resource, params),

    getCreateFormData: (resource: string) => resourceMap[resource].getCreateFormData(resource),

    getFiltersFormData: (resource: string) => resourceMap[resource].getFiltersFormData(resource),

    create: (resource: string, params: CreateParams) => resourceMap[resource].create(resource, params),

    getUpdateFormData: (resource: string, params: GetOneParams) => resourceMap[resource].getUpdateFormData(resource, params),

    update: (resource: string, params: UpdateParams) => resourceMap[resource].update(resource, params),

    deleteOne: (resource: string, params: DeleteParams) => resourceMap[resource].deleteOne(resource, params),

    reorderList: (resource: string, params: ReorderParams) => resourceMap[resource].reorderList(resource, params)
  }
}

const usersDataProvider = dataProvider(usersUrl);
const replaysDataProvider = dataProvider(replaysUrl);

const mdp = multiDataProvider({
    'users': usersDataProvider,
    'replays': replaysDataProvider,
    'errors': replaysDataProvider
})

then supplying mdp to <Admin> as its dataProvider prop.

Is there a better/easier/more Admiral-ish way?

@mr-bantsevich
Copy link
Contributor

Thank you for your message!
We really didn't set the goal to support multiple APIs at the same time.
Admiral's logic initially involves passing a prefix for server-side URLs, e.g.: '/api', which would be substituted at the beginning of all URLs for requests.
The way you suggested looks good. I think this is the way to go.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants