73 lines
2.3 KiB
TypeScript
73 lines
2.3 KiB
TypeScript
import { useAdminDiscount } from "medusa-react"
|
|
import { Outlet, useLoaderData, useParams } from "react-router-dom"
|
|
|
|
import { JsonViewSection } from "../../../components/common/json-view-section"
|
|
import { DiscountConfigurationSection } from "./components/discount-configurations-section"
|
|
import { DiscountGeneralSection } from "./components/discount-general-section"
|
|
|
|
import { DetailsSection } from "./components/details-section"
|
|
import { DiscountConditionsSection } from "./components/discount-conditions-section"
|
|
import { RedemptionsSection } from "./components/discount-redemptions-section"
|
|
import { discountLoader, expand } from "./loader"
|
|
|
|
// import after from "medusa-admin:widgets/discount/details/after"
|
|
// import before from "medusa-admin:widgets/discount/details/before"
|
|
|
|
export const DiscountDetail = () => {
|
|
const initialData = useLoaderData() as Awaited<
|
|
ReturnType<typeof discountLoader>
|
|
>
|
|
|
|
const { id } = useParams()
|
|
const { discount, isLoading } = useAdminDiscount(
|
|
id!,
|
|
{ expand },
|
|
{
|
|
initialData,
|
|
}
|
|
)
|
|
|
|
if (isLoading || !discount) {
|
|
return <div>Loading...</div>
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-col gap-y-2">
|
|
{/* {before.widgets.map((w, i) => {
|
|
return (
|
|
<div key={i}>
|
|
<w.Component />
|
|
</div>
|
|
)
|
|
})} */}
|
|
|
|
<div className="flex flex-col gap-x-4 xl:flex-row xl:items-start">
|
|
<div className="flex w-full flex-col gap-y-2">
|
|
<DiscountGeneralSection discount={discount} />
|
|
<DiscountConfigurationSection discount={discount} />
|
|
<DiscountConditionsSection discount={discount} />
|
|
<div className="flex w-full flex-col gap-y-2 xl:hidden">
|
|
<RedemptionsSection redemptions={discount.usage_count} />
|
|
<DetailsSection discount={discount} />
|
|
</div>
|
|
|
|
{/* {after.widgets.map((w, i) => {
|
|
return (
|
|
<div key={i}>
|
|
<w.Component />
|
|
</div>
|
|
)
|
|
})} */}
|
|
|
|
<JsonViewSection data={discount} />
|
|
</div>
|
|
<div className="hidden w-full max-w-[400px] flex-col gap-y-2 xl:flex">
|
|
<RedemptionsSection redemptions={discount.usage_count} />
|
|
<DetailsSection discount={discount} />
|
|
</div>
|
|
</div>
|
|
<Outlet />
|
|
</div>
|
|
)
|
|
}
|