Customers
Queries and Mutations listed here are used to send requests to the Admin Customer API Routes.
All hooks listed require authentication.
Related Guide: How to manage customers.
Mutations
useAdminCreateCustomer
This hook creates a customer as an admin.
Example
import React from "react"
import { useAdminCreateCustomer } from "medusa-react"
type CustomerData = {
first_name: string
last_name: string
email: string
password: string
}
const CreateCustomer = () => {
const createCustomer = useAdminCreateCustomer()
// ...
const handleCreate = (customerData: CustomerData) => {
createCustomer.mutate(customerData, {
onSuccess: ({ customer }) => {
console.log(customer.id)
}
})
}
// ...
}
export default CreateCustomer
Mutation Function Parameters
The details of the customer to create.
Mutation Function Returned Data
The customer's details.
useAdminUpdateCustomer
This hook updates a customer's details.
Example
import React from "react"
import { useAdminUpdateCustomer } from "medusa-react"
type CustomerData = {
first_name: string
last_name: string
email: string
password: string
}
type Props = {
customerId: string
}
const Customer = ({ customerId }: Props) => {
const updateCustomer = useAdminUpdateCustomer(customerId)
// ...
const handleUpdate = (customerData: CustomerData) => {
updateCustomer.mutate(customerData)
}
// ...
}
export default Customer
Hook Parameters
id
stringRequiredThe customer's ID.
Mutation Function Parameters
The details of the customer to update.
Mutation Function Returned Data
The customer's details.
Queries
useAdminCustomers
This hook retrieves a list of Customers. The customers can be filtered by fields such as
q
or groups
. The customers can also be paginated.
Example
To list customers:
import React from "react"
import { useAdminCustomers } from "medusa-react"
const Customers = () => {
const { customers, isLoading } = useAdminCustomers()
return (
<div>
{isLoading && <span>Loading...</span>}
{customers && !customers.length && (
<span>No customers</span>
)}
{customers && customers.length > 0 && (
<ul>
{customers.map((customer) => (
<li key={customer.id}>{customer.first_name}</li>
))}
</ul>
)}
</div>
)
}
export default Customers
You can specify relations to be retrieved within each customer. In addition, by default, only the first 50
records are retrieved.
You can control pagination by specifying the limit
and offset
properties:
import React from "react"
import { useAdminCustomers } from "medusa-react"
const Customers = () => {
const {
customers,
limit,
offset,
isLoading
} = useAdminCustomers({
expand: "billing_address",
limit: 20,
offset: 0
})
return (
<div>
{isLoading && <span>Loading...</span>}
{customers && !customers.length && (
<span>No customers</span>
)}
{customers && customers.length > 0 && (
<ul>
{customers.map((customer) => (
<li key={customer.id}>{customer.first_name}</li>
))}
</ul>
)}
</div>
)
}
export default Customers
Hook Parameters
Filters and pagination configurations to apply on the retrieved customers.
Query Returned Data
limit
numberRequiredThe maximum number of items that can be returned in the list.
offset
numberRequiredThe number of items skipped before the returned items in the list.
count
numberRequiredThe total number of items available.
An array of customer details.
useAdminCustomer
This hook retrieves the details of a customer.
Example
import React from "react"
import { useAdminCustomer } from "medusa-react"
type Props = {
customerId: string
}
const Customer = ({ customerId }: Props) => {
const { customer, isLoading } = useAdminCustomer(
customerId
)
return (
<div>
{isLoading && <span>Loading...</span>}
{customer && <span>{customer.first_name}</span>}
</div>
)
}
export default Customer
Hook Parameters
id
stringRequiredThe customer's ID.
Query Returned Data
Customer details.
Was this section helpful?