Ra-data-mixer NPM

ra-data-mixer

Travis (.org) branch npm npm bundle size GitHub

React Admin DataProvider Mixer

Installation

npm i --save ra-data-mixer

Usage

// in src/App.tsx
import React from "react";
import { Admin, Resource } from "react-admin";
import mixerProvider, { Mixer } from "ra-data-mixer";

import { PostList } from "./posts";

const provider1 = ...;
const provider2 = ...;

const mixer: Mixer = (resource) =>
    (({
        posts: provider1,
        users: provider2,
    } as any)[resource]);

const App = () => (
    <Admin dataProvider={mixerProvider(mixer)}>
        <Resource name="posts" list={PostList} />
    </Admin>
);

export default App;

Filter

You can mix same resources with different filters on different names:

// in src/App.tsx
import mixerProvider, { Mixer } from "ra-data-mixer";

const myProvider = ...;

const mixer: Mixer = (resource) =>
    (({
        managers: [myProvider, "users", (params) => ({
            ...params,
            filter: {
                ...params.filter,
                role: "manager"
            }
        })],
        reporters: [myProvider, "users", (params) => ({
            ...params,
            filter: {
                ...params.filter,
                role: "reporter"
            }
        })],
    } as any)[resource]);

In this example, managers and reporters resources are using a same resource named users with different filters