data-table-providers-map

Simplify managing Dexie database tables with a dynamic providers map for CRUD operations, perfect for React Admin users.

Overview

If you’ve ever worked with React Admin, you’ve probably encountered the complexity of managing multiple Data Providers. Declaring each Data Provider can quickly become verbose and challenging to maintain.

data-table-providers-map solves this pain point by providing a simple, dynamic mapping for Data Providers. Whether you’re managing books, authors, or any resource in a Dexie-powered database, this library makes the process seamless and declarative.

Features

🚀 Dynamic Mapping: Simplifies managing multiple Data Providers for CRUD operations.
⚡ Optimized for React Admin: Reduces verbosity and complexity of proxying Data Providers.
🔗 Dexie Integration: Easily connect and manage Dexie database tables.
🛠️ TypeScript Ready: Fully typed for enhanced developer experience.

Installation

Install the package via npm:

npm install data-table-providers-map

Usage

Here’s a quick example of how you can integrate data-table-providers-map in your project:

Define Database Constants

import { IId } from "data-table-providers-map";

export interface IBook extends IId {
  title: string;
  authorId: number;
}
export interface IAuthor extends IId {
  name: string;
  books?: number[];
}

import DataTable from "data-table-providers-map";
import { IBook, IAuthor } from './interfaces';

export const booksDB = new DataTable<IBook>('tb_books', "++id, title, authorId, *genres", []);
export const authorsDB = new DataTable<IAuthor>('tb_authors', '++id, name, *books', []);

Set Up the Providers Map

import DataTableService from "data-table-providers-map";
import DataProviderFactory from "data-table-providers-map";
import { IDataTableProvidersMap } from "data-table-providers-map";

export const dataTableProvidersMap: IDataTableProvidersMap = {
  books: DataProviderFactory(new DataTableService<IBook>(booksDB.getResorceTable())),
  authors: DataProviderFactory(new DataTableService<IAuthor>(authorsDB.getResorceTable())),
};

Integrate with React Admin

import { useMultiDataProvides } from "data-table-providers-map";
import { dataTableProvidersMap } from "data-table-providers-map";

export const App = () => (
  <Admin
    dataProvider={useMultiDataProvides(dataTableProvidersMap)}
    authProvider={authProvider}
  >
    <Resource name="books" list={BooksList} />
    <Resource name="authors" list={AuthorsList} />
  </Admin>
);

Documentation

Contributing

We welcome contributions! To get started:

Fork the repository.
Create a new branch (git checkout -b feature-name).
Submit a pull request.

For bug reports or feature requests, feel free to open an issue.

Roadmap

Add support for custom table schemas.
Expand documentation with more examples.
Improve integration with additional React Admin features.

License

This project is licensed under the MIT License.

Acknowledgments

Built with ❤️ by the community to make React Admin development easier.