Skip to main content
Skip to main content

Payment Collections

Queries and Mutations listed here are used to send requests to the Store Payment Collection API Routes.

A payment collection is useful for managing additional payments, such as for Order Edits, or installment payments.

Mutations

useManageMultiplePaymentSessions

This hook creates, updates, or deletes a list of payment sessions of a Payment Collections. If a payment session is not provided in the sessions array, it's deleted.

Example

To add two new payment sessions:

import React from "react"
import { useManageMultiplePaymentSessions } from "medusa-react"

type Props = {
paymentCollectionId: string
}

const PaymentCollection = ({
paymentCollectionId
}: Props) => {
const managePaymentSessions = useManageMultiplePaymentSessions(
paymentCollectionId
)

const handleManagePaymentSessions = () => {
managePaymentSessions.mutate({
// Total amount = 10000
sessions: [
{
provider_id: "stripe",
amount: 5000,
},
{
provider_id: "manual",
amount: 5000,
},
]
}, {
onSuccess: ({ payment_collection }) => {
console.log(payment_collection.payment_sessions)
}
})
}

// ...
}

export default PaymentCollection

To update a payment session and another one by not including it in the payload:

import React from "react"
import { useManageMultiplePaymentSessions } from "medusa-react"

type Props = {
paymentCollectionId: string
}

const PaymentCollection = ({
paymentCollectionId
}: Props) => {
const managePaymentSessions = useManageMultiplePaymentSessions(
paymentCollectionId
)

const handleManagePaymentSessions = () => {
managePaymentSessions.mutate({
// Total amount = 10000
sessions: [
{
provider_id: "stripe",
amount: 10000,
session_id: "ps_123456"
},
]
}, {
onSuccess: ({ payment_collection }) => {
console.log(payment_collection.payment_sessions)
}
})
}

// ...
}

export default PaymentCollection

Hook Parameters

idstringRequired
The payment collection's ID.

Mutation Function Parameters

StorePostPaymentCollectionsBatchSessionsReqStorePostPaymentCollectionsBatchSessionsReqRequired
The details of the payment sessions to manage.

Mutation Function Returned Data

StorePaymentCollectionsResStorePaymentCollectionsResRequired
The payment collection's details.

useManagePaymentSession

This hook creates a Payment Session for a payment provider in a Payment Collection.

Example

import React from "react"
import { useManagePaymentSession } from "medusa-react"

type Props = {
paymentCollectionId: string
}

const PaymentCollection = ({
paymentCollectionId
}: Props) => {
const managePaymentSession = useManagePaymentSession(
paymentCollectionId
)

const handleManagePaymentSession = (
providerId: string
) => {
managePaymentSession.mutate({
provider_id: providerId
}, {
onSuccess: ({ payment_collection }) => {
console.log(payment_collection.payment_sessions)
}
})
}

// ...
}

export default PaymentCollection

Hook Parameters

idstringRequired
The payment collection's ID.

Mutation Function Parameters

StorePaymentCollectionSessionsReqStorePaymentCollectionSessionsReqRequired
The details of the payment session to manage.

Mutation Function Returned Data

StorePaymentCollectionsResStorePaymentCollectionsResRequired
The payment collection's details.

useAuthorizePaymentSession

This hook authorizes a Payment Session of a Payment Collection.

Example

import React from "react"
import { useAuthorizePaymentSession } from "medusa-react"

type Props = {
paymentCollectionId: string
}

const PaymentCollection = ({
paymentCollectionId
}: Props) => {
const authorizePaymentSession = useAuthorizePaymentSession(
paymentCollectionId
)
// ...

const handleAuthorizePayment = (paymentSessionId: string) => {
authorizePaymentSession.mutate(paymentSessionId, {
onSuccess: ({ payment_collection }) => {
console.log(payment_collection.payment_sessions)
}
})
}

// ...
}

export default PaymentCollection

Hook Parameters

idstringRequired
The payment collection's ID.

Mutation Function Parameters

stringstringRequired
The payment session's ID.

Mutation Function Returned Data

StorePaymentCollectionsResStorePaymentCollectionsResRequired
The payment collection's details.

useAuthorizePaymentSessionsBatch

This hook authorize the Payment Sessions of a Payment Collection.

Example

import React from "react"
import { useAuthorizePaymentSessionsBatch } from "medusa-react"

type Props = {
paymentCollectionId: string
}

const PaymentCollection = ({
paymentCollectionId
}: Props) => {
const authorizePaymentSessions = useAuthorizePaymentSessionsBatch(
paymentCollectionId
)
// ...

const handleAuthorizePayments = (paymentSessionIds: string[]) => {
authorizePaymentSessions.mutate({
session_ids: paymentSessionIds
}, {
onSuccess: ({ payment_collection }) => {
console.log(payment_collection.payment_sessions)
}
})
}

// ...
}

export default PaymentCollection

Hook Parameters

idstringRequired
The payment collection's ID.

Mutation Function Parameters

StorePostPaymentCollectionsBatchSessionsAuthorizeReqStorePostPaymentCollectionsBatchSessionsAuthorizeReqRequired
The details of the payment sessions to authorize.

Mutation Function Returned Data

StorePaymentCollectionsResStorePaymentCollectionsResRequired
The payment collection's details.

usePaymentCollectionRefreshPaymentSession

This hook refreshes a Payment Session's data to ensure that it is in sync with the Payment Collection.

Example

import React from "react"
import { usePaymentCollectionRefreshPaymentSession } from "medusa-react"

type Props = {
paymentCollectionId: string
}

const PaymentCollection = ({
paymentCollectionId
}: Props) => {
const refreshPaymentSession = usePaymentCollectionRefreshPaymentSession(
paymentCollectionId
)
// ...

const handleRefreshPaymentSession = (paymentSessionId: string) => {
refreshPaymentSession.mutate(paymentSessionId, {
onSuccess: ({ payment_session }) => {
console.log(payment_session.status)
}
})
}

// ...
}

export default PaymentCollection

Hook Parameters

idstringRequired
The payment collection's ID.

Mutation Function Parameters

stringstringRequired
The payment session's ID.

Mutation Function Returned Data

StorePaymentCollectionsSessionResStorePaymentCollectionsSessionResRequired
The details of the payment session.

Queries

usePaymentCollection

This hook retrieves a Payment Collection's details.

Example

import React from "react"
import { usePaymentCollection } from "medusa-react"

type Props = {
paymentCollectionId: string
}

const PaymentCollection = ({
paymentCollectionId
}: Props) => {
const {
payment_collection,
isLoading
} = usePaymentCollection(
paymentCollectionId
)

return (
<div>
{isLoading && <span>Loading...</span>}
{payment_collection && (
<span>{payment_collection.status}</span>
)}
</div>
)
}

export default PaymentCollection

Hook Parameters

idstringRequired
The payment collection's ID.

Query Returned Data

payment_collectionPaymentCollectionRequired
Payment collection's details.
Was this section helpful?