on GitHub" data-tooltip-id=":R1blcldtb:">v2.4·Edited Jan 27·Report Issue
In this chapter, you'll find some tips for your admin development.
To send a request to an API route in the Medusa Application, use Medusa's JS SDK with Tanstack Query. Both of these tools are installed in your project by default.
v^5.28.14
as a development dependency.First, create the file src/admin/lib/config.ts
to setup the SDK for use in your customizations:
Then, use the configured SDK with the useQuery
Tanstack Query hook to send GET
requests, and useMutation
hook to send POST
or DELETE
requests.
For example:
You can also send requests to custom routes as explained in the JS SDK reference.
To navigate or link to other pages, or perform other routing functionalities, use the react-router-dom package. It's installed in your project through the Medusa Admin.
For example:
1import { defineWidgetConfig } from "@medusajs/admin-sdk"2import { Container } from "@medusajs/ui"3import { Link } from "react-router-dom"4 5// The widget6const ProductWidget = () => {7 return (8 <Container className="divide-y p-0">9 <Link to={"/orders"}>View Orders</Link>10 </Container>11 )12}13 14// The widget's configurations15export const config = defineWidgetConfig({16 zone: "product.details.before",17})18 19export default ProductWidget
This adds a widget in a product's details page with a link to the Orders page. The link's path must be without the /app
prefix.
The Medusa Admin dashboard can be displayed in languages other than English, which is the default. Other languages are added through community contributions.
Learn how to add a new language translation for the Medusa Admin in this guide.