Namespace Pollution Mechanism

    @blackbox-vision/react-admin-import-csv

    0.2.21 • Public • Published

    react-admin-import-csv

    NPM Version Downloads/week License Github Issues Build and Publish Code Coverage

    CSV import button for react-admin.

    image

    Usage

    Simply import the button into a toolbar, like so:

    Basic Import Action Only

    import {
      Datagrid,
      List,
      TextField,
      RichTextField,
      TopToolbar
    } from "react-admin";
    import { ImportButton } from "react-admin-import-csv";
    import { CreateButton } from "ra-ui-materialui";
    
    const ListActions = props => {
      const { className, basePath } = props;
      return (
        <TopToolbar className={className}>
          <CreateButton basePath={basePath} />
          <ImportButton {...props} />
        </TopToolbar>
      );
    };
    export const PostList = props => (
      <List {...props} filters={<PostFilter />} actions={<ListActions />}>
        <Datagrid>
          <TextField source="title" />
          <RichTextField source="body" />
          ...
        </Datagrid>
      </List>
    );

    Export/Import Actions

    import {
      Datagrid,
      List,
      TextField,
      RichTextField,
      TopToolbar
    } from "react-admin";
    import { ImportButton } from "react-admin-import-csv";
    import { CreateButton, ExportButton } from "ra-ui-materialui";
    
    const ListActions = props => {
      const { 
        className, 
        basePath, 
        total, 
        resource, 
        currentSort, 
        filterValues, 
        exporter 
      } = props;
      return (
        <TopToolbar className={className}>
          <CreateButton basePath={basePath} />
          <ExportButton
            disabled={total === 0}
            resource={resource}
            sort={currentSort}
            filter={filterValues}
            exporter={exporter}
          />
          <ImportButton {...props} />
        </TopToolbar>
      );
    };
    export const PostList = props => (
      <List {...props} filters={<PostFilter />} actions={<ListActions />}>
        <Datagrid>
          <TextField source="title" />
          <RichTextField source="body" />
          ...
        </Datagrid>
      </List>
    );

    Configuration Options

    // All configurations are optional
    const config = {
      logging?: boolean,
      parseConfig?: {
        // Any option from papaparse
        // Any option from 
      } 
    }
    <ImportButton {...props} {...config}/>

    Development

    If you'd like to develop on react-admin-import-csv do the following.

    Local install

    • git clone https://github.com/benwinding/react-admin-import-csv/
    • cd react-admin-import-csv
    • yarn

    Tests

    • yarn test # in root folder

    Run demo

    Open another terminal

    • yarn build-watch

    Open another terminal and goto the demo folder

    • yarn start

    Keywords

    none

    Install

    npm i @blackbox-vision/react-admin-import-csv

    DownloadsWeekly Downloads

    1

    Version

    0.2.21

    License

    MIT

    Unpacked Size

    60.9 kB

    Total Files

    28

    Last publish

    Collaborators

    • jonatansalas
    • manutuero