简体   繁体   中英

Is it possible to use startUndoable with custom action in react-admin?

I wondered if passing a custom action with a custom fetch and type (which is not update) to startUndoable is feasible.

Or is it possible that somehow define a pattern with values in meta and based on this pattern the view would be re-rendered?

In this case the IMPORT is updating only one property in the database with a fixed value.

This is the action:

export const importParcel = ({ id }) => ({
    type: IMPORT_PARCEL,
    payload: {
        id
    },
    meta: {
        resource: 'parcels',
        fetch: IMPORT,
        refresh: true,
        onSuccess: {
            notification: {
                body: 'Parcel Imported',
                level: 'info'
            }
        },
        onFailure: {
            notification: {
                body: 'Error: Import failed',
                level: 'warning'
            }
        }
    }
});

This is the handler:

fetchUtils
.fetchJson(`/${resource}/import/${params.id}`, {
    method: 'PUT',
    headers: getAuthenticationHeaders()
})
.then(res => ({ data: res.json }));

Thanks for your help! :)

Sure, as explained in the Optimistic Rendering and Undo documentation you can create whatever action you want with startUndoable :

import { startUndoable as startUndoableAction } from 'ra-core';

class App extends Component {
    handleImport = () => {
        this.props.startUndoable(importParcel());
    };

    render() {
        return <Button onClick={this.handleImport}>Import Parcel</Button>;
    }
}

export default connect(null, { startUndoable: startUndoableAction })(App);

You action must have a onSuccess notification in order to display the undo button.

The rest should be implemented in your data provider.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM