Convex backend (AUDIT-5–10): - schema: add returnLabelUrl, returnTrackingNumber, returnCarrier fields + by_return_tracking_number_and_carrier and by_stripe_payment_intent_id indexes - orders: markReturnReceived now sets status="completed"; add getOrderByPaymentIntent and applyReturnAccepted internal helpers - returnActions: add acceptReturn action — creates Shippo return label (is_return:true), persists label data, sends return label email to customer - stripeActions: handle refund.updated webhook to auto-mark orders refunded via Stripe Dashboard - shippoWebhook: add getOrderByReturnTracking; applyTrackingUpdate extended with isReturnTracking flag (return events use return_tracking_update type, skip delivered transition) - emails: add sendReturnLabelEmail; fulfillmentActions: createShippingLabel action Admin UI (AUDIT-1–6): - OrderActionsBar: full rewrite per authoritative action matrix; remove UpdateStatusDialog; add AcceptReturnButton for delivered+returnRequested state - AcceptReturnButton: new action component matching CreateLabelButton pattern - FulfilmentCard: add returnLabelUrl prop; show "Return label" row; rename outbound label to "Outbound label" when both are present - statusConfig: add return_accepted to OrderEventType and EVENT_TYPE_LABELS - orders detail page and all supporting cards/components Storefront & shared (TS fixes): - checkout/success, CheckoutErrorState, OrderReviewStep, PaymentStep: replace Button as/color/isLoading/variant="flat" with HeroUI v3-compatible props - ReviewList: isLoading → isPending for HeroUI v3 Button - packages/utils: add return and completed entries to ORDER_STATUS_LABELS/COLORS Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
import Link from "next/link"
|
|
import { buttonVariants } from "@/components/ui/button"
|
|
import { cn } from "@/lib/utils"
|
|
import { HugeiconsIcon } from "@hugeicons/react"
|
|
import { ArrowLeft01Icon } from "@hugeicons/core-free-icons"
|
|
import { OrderStatusBadge } from "../shared/OrderStatusBadge"
|
|
import { OrderPaymentBadge } from "../shared/OrderPaymentBadge"
|
|
|
|
interface Props {
|
|
orderNumber: string
|
|
createdAt: number
|
|
status: string
|
|
paymentStatus: string
|
|
}
|
|
|
|
export function OrderPageHeader({
|
|
orderNumber,
|
|
createdAt,
|
|
status,
|
|
paymentStatus,
|
|
}: Props) {
|
|
const formattedDate = new Date(createdAt).toLocaleDateString("en-GB", {
|
|
day: "numeric",
|
|
month: "short",
|
|
year: "numeric",
|
|
hour: "2-digit",
|
|
minute: "2-digit",
|
|
})
|
|
|
|
return (
|
|
<div className="flex flex-col gap-1">
|
|
<Link
|
|
href="/orders"
|
|
className={cn(
|
|
buttonVariants({ variant: "ghost", size: "sm" }),
|
|
"-ml-2 w-fit",
|
|
)}
|
|
>
|
|
<HugeiconsIcon icon={ArrowLeft01Icon} strokeWidth={2} />
|
|
Orders
|
|
</Link>
|
|
<div className="flex flex-wrap items-center gap-2">
|
|
<h1 className="font-mono text-xl font-semibold">{orderNumber}</h1>
|
|
<OrderStatusBadge status={status} />
|
|
<OrderPaymentBadge status={paymentStatus} />
|
|
<span className="text-sm text-muted-foreground">{formattedDate}</span>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|