Unable to create discount using useAdminCreateDiscount

[ericyu049]

Bug report

Describe the bug

Unable to use the useAdminCreateDiscount to create discount. Whenever .mutate() is added to the code in a widget, error will occur:

System information

Medusa version (including plugins): 1.19.0 Node.js version: 20.10.0 Database: PostgreSQL Operating system: MacOS Browser (if relevant):

Expected behavior

The discount code should be created and able to view it in the admin discount page.

Code snippets

import type { WidgetConfig, CustomerDetailsWidgetProps, } from "@medusajs/admin"
import { AllocationType, DiscountRuleType } from "@medusajs/medusa";
import { Container, Button } from "@medusajs/ui"
import {
    useAdminUpdateCustomer,
    useAdminCreateDiscount,
    useAdminCreateCustomerGroup,
    useAdminDeleteCustomerGroup,
} from "medusa-react"

const DistributorSettingWidget = ({ customer }: CustomerDetailsWidgetProps) => {
    const isDistributor = customer.metadata.distributor;
    const customerService = useAdminUpdateCustomer(customer.id);
    const createCustomerGroupService = useAdminCreateCustomerGroup();
    const deleteCustomerGroupService = useAdminDeleteCustomerGroup((customer.metadata as any).groupId);
    const createDiscount = useAdminCreateDiscount();
    const handleCreateDiscount = () => {
        createDiscount.mutate({
            code: 'TEST2',
            rule: {
                type: DiscountRuleType.FIXED,
                value: 10,
                allocation: AllocationType.ITEM,
            },
            regions: [
                'reg_01HJCWP3WB48462AVDVZSWK4VE'
            ],
            is_dynamic: false,
            is_disabled: false,
        })
    }

    const convertToDistributor = async () => {
        const group = await createCustomerGroupService.mutateAsync({ name: customer.id })
        await customerService.mutateAsync({ metadata: { ...customer.metadata, distributor: true, groupId: group.customer_group.id } })

    }
    const removeDistributor = async () => {
        await customerService.mutateAsync({ metadata: { ...customer.metadata, distributor: false, groupId: undefined } })
        await deleteCustomerGroupService.mutateAsync();
    }

    return (

        <Container>
            <h1 className="inter-xlarge-semibold text-grey-90">Distributor</h1>
            <div className="py-10">
                <div>
                    <div className="py-2">
                        {isDistributor === false || isDistributor == undefined
                            ? "Customer is not a distributor yet."
                            : "Customer is a distributor."}
                    </div>
                    <div className="py-2">
                        <Button onClick={!isDistributor ? convertToDistributor : removeDistributor}>
                            {isDistributor === false || isDistributor == undefined
                                ? "Convert to Distributor"
                                : "Revoke Distributor"}
                        </Button>
                    </div>
                    <div className="py-2">
                        {(isDistributor && !customer.metadata.code) ? (
                            <Button onClick={handleCreateDiscount}>Generate Code</Button>
                        ) : (
                            <div>123</div>
                        )}
                    </div>
                </div>
            </div>

        </Container>
    )
}
export const config: WidgetConfig = {
    zone: "customer.details.after",
}

export default DistributorSettingWidget

Additional context

If I remove

createDiscount.mutate({
    code: 'TEST2',
    rule: {
        type: DiscountRuleType.FIXED,
        value: 10,
        allocation: AllocationType.ITEM,
    },
    regions: [
        'reg_01HJCWP3WB48462AVDVZSWK4VE'
    ],
    is_dynamic: false,
    is_disabled: false,
})

the code will start compiling again with no issue.

[olivermrbl]

@shahednasser, did you have a similar experience at some point?

[shahednasser]

Yes, you can't use types imported from @medusajs/medusa in your admin customizations, such as DiscountRuleType.FIXED. You'll have to use its equivalent literal type "fixed" or create a similar type to the one you're importing.

@olivermrbl maybe it's worth adding a note/troubleshooting guide about this in the documentation as I've seen another person run into it too.

[olivermrbl]

@olivermrbl maybe it's worth adding a note/troubleshooting guide about this in the documentation as I've seen another person run into it too.

Sounds like a good idea 👍

[ericyu049]

Thank you very much. It's working now. Only thing is that VSCode will show it's an error, but it will compile.

[shahednasser]

You can add //@ts-ignore before the line to disable the error showing in VSCode