useCreateMany

useCreateMany is a modified version of react-query's useMutation for multiple create mutations.

It uses createMany method as mutation function from the dataProvider which is passed to <Refine>.

tip

If your data provider didn't implement createMany method, useCreateMany will use create method multiple times instead.

Features

• Shows notifications after the mutation succeeds or fails.

• Automatically invalidates the list queries after the mutation is succesfully run. Refer to React Query docs for detailed information →

Usage

Let's say that we have a resource named categories.

https://api.fake-rest.refine.dev/categories

{
    [
        {
            id: 1,
            title: "E-business",
        },
        {
            id: 2,
            title: "Virtual Invoice Avon",
        },
    ];
}

type CategoryMutationResult = {
    id: number;
    title: string;
};

import { useCreateMany } from "@pankod/refine-core";

const { mutate } = useCreateMany<CategoryMutationResult>();

mutate({
    resource: "categories",
    values: [
        {
            title: "New Category",
        },
        {
            title: "Another New Category",
        },
    ],
});

tip

mutate can also accept lifecycle methods like onSuccess and onError.

mutate(
    {
        resource: "categories",
        values: [
            {
                title: "New Category",
            },
            {
                title: "Another New Category",
            },
        ],
    },
    {
        onError: (error, variables, context) => {
            // An error happened!
        },
        onSuccess: (data, variables, context) => {
            // Let's celebrate!
        },
    },
);

Refer to react-query docs for further information. →

After the mutation runs categories will be updated as below:

https://api.fake-rest.refine.dev/categories

{
    [
        {
            id: 1,
            title: "E-business",
        },
        {
            id: 2,
            title: "Virtual Invoice Avon",
        },
        {
            id: 3,
            title: "New Category",
        },
        {
            id: 4,
            title: "Another New Category",
        },
    ];
}

note

Queries that use /categories endpoint will be automatically invalidated to show the updated data. For example, data returned from useList will be automatically updated.

tip

useCreateMany returns react-query's useMutation result which includes a lot of properties, one of which being mutate.

caution

Variables passed to mutate must have these types.

{
    resource: string;
    values: TVariables[] = {};
}

API

Properties

Property	Description	Type	Default
resource Required	Resource name for API data interactions	string
values Required	Values for mutation function	TVariables[]	[{}]
successNotification	Successful Mutation notification	SuccessErrorNotification	"Successfully created resources"
errorNotification	Unsuccessful Mutation notification	SuccessErrorNotification	"There was an error creating resource (status code: statusCode)"
metaData	Metadata query for dataProvider	MetaDataQuery	{}
dataProviderName	If there is more than one dataProvider, you should use the dataProviderName that you will use.	string	default
invalidates	You can use it to manage the invalidations that will occur at the end of the mutation.	all, resourceAll, list, many, detail, false	["list", "many"]

Type Parameters

Property	Desription	Type	Default
TData	Result data of the mutation. Extends BaseRecord	BaseRecord	BaseRecord
TError	Custom error object that extends HttpError	HttpError	HttpError
TVariables	Values for mutation function	{}	{}

Return value

Description	Type
Result of the react-query's useMutation	UseMutationResult< { data: TData[]}, TError, { resource: string; values: TVariables[]; }, unknown>