@fluid-app/portal-sdk 0.1.75 → 0.1.77
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{ContactsScreen-fNFKA1nn.cjs → ContactsScreen-B45I4fsu.cjs} +2 -2
- package/dist/{ContactsScreen-fNFKA1nn.cjs.map → ContactsScreen-B45I4fsu.cjs.map} +1 -1
- package/dist/{ContactsScreen-pCkw9htG.cjs → ContactsScreen-BY_bV9hD.cjs} +2 -2
- package/dist/{ContactsScreen-CzvfANNV.mjs → ContactsScreen-fv44z4G1.mjs} +2 -2
- package/dist/{ContactsScreen-CzvfANNV.mjs.map → ContactsScreen-fv44z4G1.mjs.map} +1 -1
- package/dist/{MessagingScreen-Bp5t4STI.mjs → MessagingScreen-L76XP3Oz.mjs} +1 -0
- package/dist/{MySiteScreen-CqeZTwj9.mjs → MySiteScreen-BfYDwE3C.mjs} +12 -11
- package/dist/MySiteScreen-BfYDwE3C.mjs.map +1 -0
- package/dist/{MySiteScreen-BhFE_jmk.cjs → MySiteScreen-CEb9L0vp.cjs} +1 -1
- package/dist/{MySiteScreen-Ci2rLGQc.cjs → MySiteScreen-DY7PSqP6.cjs} +11 -10
- package/dist/MySiteScreen-DY7PSqP6.cjs.map +1 -0
- package/dist/{OrdersScreen-Bkdrj8I1.cjs → OrdersScreen-CB_VOlRI.cjs} +2 -2
- package/dist/{OrdersScreen-Bkdrj8I1.cjs.map → OrdersScreen-CB_VOlRI.cjs.map} +1 -1
- package/dist/{OrdersScreen-DOI-Rl_H.mjs → OrdersScreen-CuQTI5f9.mjs} +2 -2
- package/dist/{OrdersScreen-DOI-Rl_H.mjs.map → OrdersScreen-CuQTI5f9.mjs.map} +1 -1
- package/dist/{OrdersScreen-GlJc86ai.cjs → OrdersScreen-D5_PtRCp.cjs} +2 -2
- package/dist/{ProductsScreen-SExV06P8.mjs → ProductsScreen-BQlgLkmn.mjs} +6 -2
- package/dist/{ProductsScreen-KLajmCLk.mjs → ProductsScreen-CGe2U2jo.mjs} +2 -2
- package/dist/{ProductsScreen-KLajmCLk.mjs.map → ProductsScreen-CGe2U2jo.mjs.map} +1 -1
- package/dist/{ProductsScreen-D1hLP4qn.cjs → ProductsScreen-DzJlDMus.cjs} +2 -2
- package/dist/{ProductsScreen-D1hLP4qn.cjs.map → ProductsScreen-DzJlDMus.cjs.map} +1 -1
- package/dist/{ProductsScreen-DD07WW44.cjs → ProductsScreen-a7n9oVPF.cjs} +2 -2
- package/dist/{ShareablesScreen-C_aJXryA.mjs → ShareablesScreen-B67BMAUa.mjs} +6 -2
- package/dist/{ShareablesScreen-CA8sm7n_.cjs → ShareablesScreen-BSy0IA8v.cjs} +2 -2
- package/dist/{ShareablesScreen-CA8sm7n_.cjs.map → ShareablesScreen-BSy0IA8v.cjs.map} +1 -1
- package/dist/{ShareablesScreen-BKidUZz_.cjs → ShareablesScreen-BnAtijbM.cjs} +2 -2
- package/dist/{ShareablesScreen-CTruUco1.mjs → ShareablesScreen-CRtMGs-h.mjs} +2 -2
- package/dist/{ShareablesScreen-CTruUco1.mjs.map → ShareablesScreen-CRtMGs-h.mjs.map} +1 -1
- package/dist/{ShopScreen-D0xqkK7W.cjs → ShopScreen-5t5Jqdw5.cjs} +1 -1
- package/dist/{ShopScreen-BZLvCzbI.mjs → ShopScreen-BpQQ00y7.mjs} +3 -3
- package/dist/{ShopScreen-BZLvCzbI.mjs.map → ShopScreen-BpQQ00y7.mjs.map} +1 -1
- package/dist/{ShopScreen-saEPQJZ-.cjs → ShopScreen-OfnN0oCo.cjs} +5 -5
- package/dist/{ShopScreen-saEPQJZ-.cjs.map → ShopScreen-OfnN0oCo.cjs.map} +1 -1
- package/dist/{SubscriptionsScreen-C2n-qh9n.mjs → SubscriptionsScreen-CBoAwhKQ.mjs} +2 -2
- package/dist/{SubscriptionsScreen-C2n-qh9n.mjs.map → SubscriptionsScreen-CBoAwhKQ.mjs.map} +1 -1
- package/dist/{SubscriptionsScreen-Lvd76SAc.cjs → SubscriptionsScreen-D5oQ8bt1.cjs} +2 -2
- package/dist/{SubscriptionsScreen-Lvd76SAc.cjs.map → SubscriptionsScreen-D5oQ8bt1.cjs.map} +1 -1
- package/dist/{SubscriptionsScreen-B_RaW9A9.cjs → SubscriptionsScreen-DxYZJ0k6.cjs} +2 -2
- package/dist/index.cjs +23 -23
- package/dist/index.mjs +25 -25
- package/dist/{order-detail-LrdeXs2m.cjs → order-detail-65Ln2EUO.cjs} +25 -38
- package/dist/{order-detail-LrdeXs2m.cjs.map → order-detail-65Ln2EUO.cjs.map} +1 -1
- package/dist/{order-detail--h20GcWg.mjs → order-detail-o-C0YhaZ.mjs} +25 -38
- package/dist/{order-detail--h20GcWg.mjs.map → order-detail-o-C0YhaZ.mjs.map} +1 -1
- package/dist/{src-B-aQFEbA.cjs → src-fXyI4AWk.cjs} +36 -35
- package/dist/src-fXyI4AWk.cjs.map +1 -0
- package/dist/{src-CvQ9ezCI.mjs → src-nhqydD53.mjs} +36 -35
- package/dist/src-nhqydD53.mjs.map +1 -0
- package/package.json +22 -18
- package/dist/MySiteScreen-Ci2rLGQc.cjs.map +0 -1
- package/dist/MySiteScreen-CqeZTwj9.mjs.map +0 -1
- package/dist/src-B-aQFEbA.cjs.map +0 -1
- package/dist/src-CvQ9ezCI.mjs.map +0 -1
|
@@ -648,7 +648,7 @@ function OrderItemRow({ item }) {
|
|
|
648
648
|
item.subscription && /* @__PURE__ */ jsx(StatusBadge, {
|
|
649
649
|
color: "blue",
|
|
650
650
|
size: "xs",
|
|
651
|
-
className: "mt-1",
|
|
651
|
+
className: "mt-1 self-start",
|
|
652
652
|
children: "Subscription"
|
|
653
653
|
}),
|
|
654
654
|
/* @__PURE__ */ jsx("p", {
|
|
@@ -805,42 +805,29 @@ function OrderDetailsSection({ order }) {
|
|
|
805
805
|
}),
|
|
806
806
|
/* @__PURE__ */ jsxs("div", {
|
|
807
807
|
className: "divide-border flex divide-x",
|
|
808
|
-
children: [
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
/* @__PURE__ */
|
|
820
|
-
className: "
|
|
821
|
-
children:
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
children: [/* @__PURE__ */ jsx("div", {
|
|
832
|
-
className: "text-muted-foreground text-sm",
|
|
833
|
-
children: "Date"
|
|
834
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
835
|
-
className: "text-foreground font-medium",
|
|
836
|
-
children: new Date(order.created_at).toLocaleDateString("en-US", {
|
|
837
|
-
year: "numeric",
|
|
838
|
-
month: "short",
|
|
839
|
-
day: "numeric"
|
|
840
|
-
})
|
|
841
|
-
})]
|
|
842
|
-
})
|
|
843
|
-
]
|
|
808
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
809
|
+
className: "flex-1 pr-4",
|
|
810
|
+
children: [/* @__PURE__ */ jsx("div", {
|
|
811
|
+
className: "text-muted-foreground text-sm",
|
|
812
|
+
children: "Order Number"
|
|
813
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
814
|
+
className: "text-foreground font-medium",
|
|
815
|
+
children: order.order_number
|
|
816
|
+
})]
|
|
817
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
818
|
+
className: "flex-1 pl-4 text-right",
|
|
819
|
+
children: [/* @__PURE__ */ jsx("div", {
|
|
820
|
+
className: "text-muted-foreground text-sm",
|
|
821
|
+
children: "Date"
|
|
822
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
823
|
+
className: "text-foreground font-medium",
|
|
824
|
+
children: new Date(order.created_at).toLocaleDateString("en-US", {
|
|
825
|
+
year: "numeric",
|
|
826
|
+
month: "short",
|
|
827
|
+
day: "numeric"
|
|
828
|
+
})
|
|
829
|
+
})]
|
|
830
|
+
})]
|
|
844
831
|
}),
|
|
845
832
|
order.email && /* @__PURE__ */ jsxs("div", {
|
|
846
833
|
className: "mt-3",
|
|
@@ -964,4 +951,4 @@ function OrderDetail({ token, onNotFound, onError }) {
|
|
|
964
951
|
//#endregion
|
|
965
952
|
export { OrdersCoreProvider as a, PaginationFooter as i, OrdersList as n, TableColumn as r, OrderDetail as t };
|
|
966
953
|
|
|
967
|
-
//# sourceMappingURL=order-detail
|
|
954
|
+
//# sourceMappingURL=order-detail-o-C0YhaZ.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"order-detail--h20GcWg.mjs","names":["ordersApi.fetchOrder","ordersApi.fetchCustomerOrders"],"sources":["../../../orders/api-client/src/namespaces/orders.ts","../../../orders/core/src/context.ts","../../../orders/core/src/provider.tsx","../../../orders/core/src/query-keys.ts","../../../orders/core/src/hooks/use-order.ts","../../../orders/core/src/hooks/use-customer-orders.ts","../../../orders/core/src/utils/format-order-total.ts","../../../orders/ui/src/components/search-input.tsx","../../../orders/ui/src/components/pagination-footer.tsx","../../../orders/ui/src/components/status-badge.tsx","../../../orders/ui/src/components/table-column.tsx","../../../orders/ui/src/components/orders-list.tsx","../../../orders/ui/src/lib/format.ts","../../../orders/ui/src/components/order-status-badge.tsx","../../../orders/ui/src/components/order-detail.tsx"],"sourcesContent":["import type { FetchClient } from \"../lib/fetch-client\";\nimport type { orders } from \"../custom/orders\";\n\n/**\n * Fetch a single order by token.\n * Endpoint: GET /public/v2025-06/orders/{orderToken}\n */\nexport async function fetchOrder(\n client: FetchClient,\n orderToken: string,\n): Promise<orders.OrderResponse> {\n return client.get(`/public/v2025-06/orders/${orderToken}`);\n}\n\n/**\n * Fetch a paginated list of customer orders.\n * Endpoint: GET /v202506/orders\n */\nexport async function fetchCustomerOrders(\n client: FetchClient,\n params: orders.FetchOrdersParams,\n): Promise<orders.CustomerOrdersResponse> {\n const input: Record<string, string> = {};\n\n if (params.cursor) input[\"page[cursor]\"] = params.cursor;\n if (params.limit != null) input[\"page[limit]\"] = params.limit.toString();\n if (params.search) input.search = params.search;\n if (params.sort) input.sort = params.sort;\n if (params.status) input.status = params.status;\n if (params.type) input.type = params.type;\n if (params.customerId != null)\n input.customer_id = params.customerId.toString();\n if (params.userCompanyId != null)\n input.user_company_id = params.userCompanyId.toString();\n if (params.subscriptionId != null)\n input.subscription_id = params.subscriptionId.toString();\n if (params.startDate) input.start_date = params.startDate;\n if (params.endDate) input.end_date = params.endDate;\n if (params.withinDays != null)\n input.within_days = params.withinDays.toString();\n if (params.cartSource) input.cart_source = params.cartSource;\n if (params.countryIsos) input.country_isos = params.countryIsos;\n if (params.forceStats != null)\n input.force_stats = params.forceStats.toString();\n\n return client.get(\"/v202506/orders\", input);\n}\n","import { createContext, useContext } from \"react\";\nimport type { FetchClient } from \"@fluid-app/api-client-core\";\n\nconst OrdersClientContext = createContext<FetchClient | null>(null);\n\nexport const OrdersClientProvider = OrdersClientContext.Provider;\n\nexport function useOrdersClient(): FetchClient {\n const client = useContext(OrdersClientContext);\n if (!client) {\n throw new Error(\n \"useOrdersClient must be used within an OrdersCoreProvider\",\n );\n }\n return client;\n}\n","import type { FetchClient } from \"@fluid-app/api-client-core\";\nimport type { JSX, ReactNode } from \"react\";\nimport { OrdersClientProvider } from \"./context\";\n\nexport interface OrdersCoreProviderProps {\n client: FetchClient;\n children: ReactNode;\n}\n\nexport function OrdersCoreProvider({\n client,\n children,\n}: OrdersCoreProviderProps): JSX.Element {\n return <OrdersClientProvider value={client}>{children}</OrdersClientProvider>;\n}\n","import type { orders } from \"@fluid-app/orders-api-client\";\n\nexport const ordersKeys = {\n all: [\"orders\"] as const,\n list: (params?: orders.FetchOrdersParams) =>\n [...ordersKeys.all, \"list\", params] as const,\n detail: (orderToken: string) =>\n [...ordersKeys.all, \"detail\", orderToken] as const,\n} as const;\n","import { useQuery } from \"@tanstack/react-query\";\nimport { ordersApi } from \"@fluid-app/orders-api-client\";\nimport { ordersKeys } from \"../query-keys\";\nimport { useOrdersClient } from \"../context\";\n\nexport function useOrder(orderToken: string, options?: { enabled?: boolean }) {\n const client = useOrdersClient();\n return useQuery({\n queryKey: ordersKeys.detail(orderToken),\n queryFn: () => ordersApi.fetchOrder(client, orderToken),\n enabled: (options?.enabled ?? true) && !!orderToken,\n });\n}\n","import { useQuery } from \"@tanstack/react-query\";\nimport type { orders } from \"@fluid-app/orders-api-client\";\nimport { ordersApi } from \"@fluid-app/orders-api-client\";\nimport { ordersKeys } from \"../query-keys\";\nimport { useOrdersClient } from \"../context\";\n\nexport function useCustomerOrders(\n params: orders.FetchOrdersParams,\n options?: { enabled?: boolean },\n) {\n const client = useOrdersClient();\n return useQuery({\n queryKey: ordersKeys.list(params),\n queryFn: () => ordersApi.fetchCustomerOrders(client, params),\n enabled: options?.enabled ?? true,\n });\n}\n","import type { orders } from \"@fluid-app/orders-api-client\";\n\nexport function formatOrderTotal(order: orders.ListOrder): string {\n if (order.order_total_after_points_redemption != null) {\n return `${order.currency_symbol || \"$\"}${Number(\n order.order_total_after_points_redemption,\n ).toFixed(2)}`;\n }\n return (\n order.total_display_amount ||\n `${order.currency_symbol || \"$\"}${Number(order.amount).toFixed(2)}`\n );\n}\n","import { Input } from \"@fluid-app/ui-primitives\";\nimport { Search } from \"lucide-react\";\n\ninterface SearchInputProps {\n searchTerm: string;\n onSearchChange: (value: string) => void;\n placeholder?: string;\n}\n\nexport function SearchInput({\n searchTerm,\n onSearchChange,\n placeholder,\n}: SearchInputProps) {\n return (\n <div className=\"relative\">\n <Search className=\"text-muted-foreground absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2\" />\n <Input\n value={searchTerm}\n onChange={(e) => onSearchChange(e.target.value)}\n placeholder={placeholder}\n className=\"pl-9\"\n />\n </div>\n );\n}\n","import { cn } from \"@fluid-app/ui-primitives\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\n\nexport interface PaginationFooterProps {\n currentPage: number;\n totalPages: number;\n pageSize: number;\n totalItems: number;\n /** @deprecated No longer used. Kept for backward compatibility with subscriptions-ui. */\n maxVisiblePages?: number;\n onPageChange?: (page: number) => void;\n cursorPaginationMode?: boolean;\n hasNextPage?: boolean;\n hasPrevPage?: boolean;\n onCursorNext?: () => void;\n onCursorPrev?: () => void;\n /** @deprecated Use lucide icons directly. Kept for backward compatibility with subscriptions-ui. */\n chevronLeftIcon?: string;\n /** @deprecated Use lucide icons directly. Kept for backward compatibility with subscriptions-ui. */\n chevronRightIcon?: string;\n /** @deprecated Pagination labels are now hardcoded in English. Kept for backward compatibility. */\n t?: (key: string) => string;\n}\n\nexport function PaginationFooter({\n currentPage,\n totalPages,\n pageSize,\n totalItems,\n onPageChange,\n cursorPaginationMode,\n hasNextPage,\n hasPrevPage,\n onCursorNext,\n onCursorPrev,\n}: PaginationFooterProps) {\n const isCursor = !!cursorPaginationMode;\n\n const isPrevDisabled = isCursor ? !hasPrevPage : currentPage === 1;\n const isNextDisabled = isCursor\n ? !hasNextPage\n : totalPages === 0 || currentPage === totalPages;\n\n const handlePrevClick = () => {\n if (isCursor) {\n onCursorPrev?.();\n } else {\n onPageChange?.(currentPage - 1);\n }\n };\n\n const handleNextClick = () => {\n if (isCursor) {\n onCursorNext?.();\n } else {\n onPageChange?.(currentPage + 1);\n }\n };\n\n const displayText = (() => {\n if (isCursor) {\n return (\n <>\n Total <span className=\"font-medium\">{totalItems}</span> results\n </>\n );\n }\n const start = totalItems === 0 ? 0 : (currentPage - 1) * pageSize + 1;\n const end = Math.min(currentPage * pageSize, totalItems);\n return (\n <>\n Showing <span className=\"font-medium\">{start}</span> to{\" \"}\n <span className=\"font-medium\">{end}</span> of{\" \"}\n <span className=\"font-medium\">{totalItems}</span> results\n </>\n );\n })();\n\n const buttonBase =\n \"relative inline-flex items-center px-3 py-2 text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50\";\n\n return (\n <div className=\"border-border flex items-center justify-between border-t px-4 py-3 sm:px-6\">\n {/* Mobile prev/next */}\n <div className=\"flex flex-1 justify-between sm:hidden\">\n <button\n type=\"button\"\n onClick={handlePrevClick}\n disabled={isPrevDisabled}\n className={cn(\n buttonBase,\n \"border-border bg-background text-foreground hover:bg-accent rounded-md border\",\n )}\n >\n Previous\n </button>\n <button\n type=\"button\"\n onClick={handleNextClick}\n disabled={isNextDisabled}\n className={cn(\n buttonBase,\n \"border-border bg-background text-foreground hover:bg-accent ml-3 rounded-md border\",\n )}\n >\n Next\n </button>\n </div>\n\n {/* Desktop */}\n <div className=\"hidden sm:flex sm:flex-1 sm:items-center sm:justify-between\">\n <p className=\"text-muted-foreground text-xs\">{displayText}</p>\n <nav\n aria-label=\"Pagination\"\n className=\"isolate inline-flex -space-x-px rounded-md shadow-sm\"\n >\n <button\n type=\"button\"\n onClick={handlePrevClick}\n disabled={isPrevDisabled}\n className={cn(\n buttonBase,\n \"border-border text-muted-foreground hover:bg-accent rounded-l-md border\",\n )}\n >\n <span className=\"sr-only\">Previous</span>\n <ChevronLeft className=\"h-4 w-4\" />\n </button>\n {!isCursor && (\n <span className=\"border-border bg-background text-foreground relative inline-flex items-center border px-4 py-2 text-sm font-medium\">\n {currentPage} / {totalPages}\n </span>\n )}\n <button\n type=\"button\"\n onClick={handleNextClick}\n disabled={isNextDisabled}\n className={cn(\n buttonBase,\n \"border-border text-muted-foreground hover:bg-accent rounded-r-md border\",\n )}\n >\n <span className=\"sr-only\">Next</span>\n <ChevronRight className=\"h-4 w-4\" />\n </button>\n </nav>\n </div>\n </div>\n );\n}\n","import { cn } from \"@fluid-app/ui-primitives\";\n\nexport type BadgeColor = \"green\" | \"yellow\" | \"red\" | \"blue\" | \"gray\";\n\ntype BadgeSize = \"xs\" | \"sm\" | \"md\";\n\ninterface StatusBadgeProps {\n color: BadgeColor;\n dot?: boolean;\n size?: BadgeSize;\n className?: string;\n children: React.ReactNode;\n}\n\nconst colorStyles: Record<BadgeColor, string> = {\n green: \"bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400\",\n yellow:\n \"bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-400\",\n red: \"bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400\",\n blue: \"bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400\",\n gray: \"bg-gray-100 text-gray-800 dark:bg-gray-800 dark:text-gray-300\",\n};\n\nconst dotColorStyles: Record<BadgeColor, string> = {\n green: \"bg-green-500\",\n yellow: \"bg-yellow-500\",\n red: \"bg-red-500\",\n blue: \"bg-blue-500\",\n gray: \"bg-gray-500\",\n};\n\nconst sizeStyles: Record<BadgeSize, string> = {\n xs: \"px-1.5 py-0.5 text-[10px]\",\n sm: \"px-2 py-0.5 text-xs\",\n md: \"px-2.5 py-1 text-sm\",\n};\n\nexport function StatusBadge({\n color,\n dot,\n size = \"md\",\n className,\n children,\n}: StatusBadgeProps) {\n return (\n <span\n className={cn(\n \"inline-flex items-center gap-1 rounded-full font-medium whitespace-nowrap\",\n colorStyles[color],\n sizeStyles[size],\n className,\n )}\n >\n {dot && (\n <span\n className={cn(\"h-1.5 w-1.5 rounded-full\", dotColorStyles[color])}\n />\n )}\n {children}\n </span>\n );\n}\n","import { cn } from \"@fluid-app/ui-primitives\";\n\ninterface TableColumnProps {\n label: string;\n sortable?: boolean;\n className?: string;\n onSortClick?: (sortBy: string) => void;\n sortBy?: string;\n sortData?: {\n column: string;\n direction: \"asc\" | \"desc\";\n };\n chevronUpIcon?: string;\n chevronDownIcon?: string;\n}\n\nexport function TableColumn({\n label,\n sortable = true,\n className,\n onSortClick,\n sortBy,\n sortData,\n chevronUpIcon,\n chevronDownIcon,\n}: TableColumnProps) {\n const hideUpIcon =\n sortData?.column !== sortBy ||\n (sortData?.column === sortBy && sortData?.direction === \"asc\");\n\n const hideDownIcon =\n sortData?.column !== sortBy ||\n (sortData?.column === sortBy && sortData?.direction === \"desc\");\n\n return (\n <th\n className={cn(\n \"group cursor-pointer px-3 py-2 text-left text-xs font-medium text-gray-500 transition-colors duration-200\",\n \"hover:text-blue-600\",\n className,\n )}\n onClick={() => sortable && onSortClick?.(sortBy ?? \"\")}\n >\n <div className=\"relative flex items-center\">\n {label}\n {sortable && chevronUpIcon && chevronDownIcon && (\n <button\n className={`ml-2 inline-flex flex-col items-center justify-center group-hover:opacity-100 ${\n sortData?.column === sortBy ? \"opacity-100\" : \"opacity-0\"\n } transition-opacity duration-200`}\n >\n <div className=\"flex flex-col\">\n <img\n src={chevronUpIcon}\n alt=\"\"\n width={12}\n height={12}\n className={cn(\n \"h-2.5 w-2.5 text-gray-400 transition-colors duration-200 group-hover:text-blue-600\",\n hideUpIcon && \"opacity-0\",\n sortData?.column !== sortBy && \"group-hover:opacity-100\",\n )}\n />\n <img\n src={chevronDownIcon}\n alt=\"\"\n width={12}\n height={12}\n className={cn(\n \"h-2.5 w-2.5 text-gray-400 transition-colors duration-200 group-hover:text-blue-600\",\n hideDownIcon && \"opacity-0\",\n sortData?.column !== sortBy && \"group-hover:opacity-100\",\n )}\n />\n </div>\n </button>\n )}\n </div>\n </th>\n );\n}\n","import { useState, useCallback } from \"react\";\nimport type { orders } from \"@fluid-app/orders-api-client\";\nimport { useCustomerOrders, formatOrderTotal } from \"@fluid-app/orders-core\";\nimport { Skeleton } from \"@fluid-app/ui-primitives\";\nimport { SearchInput } from \"./search-input\";\nimport { PaginationFooter } from \"./pagination-footer\";\nimport { StatusBadge } from \"./status-badge\";\nimport { TableColumn } from \"./table-column\";\n\nexport interface OrdersListProps {\n customerId: number | undefined;\n onOrderClick: (order: orders.ListOrder) => void;\n onSubscriptionClick?: (subscriptionToken: string) => void;\n t: (key: string) => string;\n pageSize?: number;\n}\n\nexport function OrdersList({\n customerId,\n onOrderClick,\n onSubscriptionClick,\n t,\n pageSize = 10,\n}: OrdersListProps) {\n const [cursor, setCursor] = useState<string | null>(null);\n const [searchTerm, setSearchTerm] = useState(\"\");\n\n const params: orders.FetchOrdersParams = {\n customerId,\n limit: pageSize,\n search: searchTerm || undefined,\n cursor: cursor || undefined,\n sort: \"-created_at\",\n };\n\n const { data, isLoading } = useCustomerOrders(params, {\n enabled: !!customerId,\n });\n\n const handleSearchChange = useCallback((term: string) => {\n setSearchTerm(term);\n setCursor(null);\n }, []);\n\n const handleNextPage = useCallback(() => {\n const nextCursor = data?.meta?.pagination?.next_cursor;\n if (nextCursor) {\n setCursor(nextCursor);\n }\n }, [data?.meta?.pagination?.next_cursor]);\n\n const handlePrevPage = useCallback(() => {\n const prevCursor = data?.meta?.pagination?.prev_cursor;\n if (prevCursor) {\n setCursor(prevCursor);\n } else {\n setCursor(null);\n }\n }, [data?.meta?.pagination?.prev_cursor]);\n\n const ordersList = data?.orders || [];\n const pagination = data?.meta?.pagination;\n const totalItems = pagination?.total_count ?? ordersList.length;\n const totalPages = pagination?.total_pages ?? 1;\n const currentPage = pagination?.current_page ?? 1;\n const hasNextPage = !!pagination?.next_cursor;\n const hasPrevPage = !!pagination?.prev_cursor;\n\n return (\n <div className=\"border-border overflow-hidden rounded-lg border shadow-sm\">\n <div className=\"p-3 text-left\">\n <div className=\"w-full md:mr-auto md:w-1/2 lg:w-1/3\">\n <SearchInput\n searchTerm={searchTerm}\n onSearchChange={handleSearchChange}\n placeholder={t(\"search_orders\")}\n />\n </div>\n </div>\n\n {/* mobile view */}\n <div className=\"block md:hidden\">\n {isLoading ? (\n Array(5)\n .fill(0)\n .map((_, index) => (\n <div\n key={`skeleton-${index}`}\n className=\"border-border border-b p-4\"\n >\n <div className=\"flex space-x-3\">\n <Skeleton className=\"h-12 w-12 rounded-md\" />\n <div className=\"flex-1 space-y-2\">\n <Skeleton className=\"h-4 w-3/4\" />\n <Skeleton className=\"h-3 w-1/2\" />\n </div>\n </div>\n </div>\n ))\n ) : ordersList.length === 0 ? (\n <div className=\"text-muted-foreground px-3 py-8 text-center text-sm\">\n {searchTerm ? t(\"no_matching_orders\") : t(\"no_orders_found\")}\n </div>\n ) : (\n ordersList.map((order) => (\n <div\n key={order.id}\n className=\"border-border hover:bg-accent cursor-pointer border-b p-4 transition-colors duration-200 ease-in-out last:border-b-0\"\n onClick={() => onOrderClick(order)}\n >\n <div className=\"flex items-start space-x-3\">\n {order.first_item?.image_url ? (\n <img\n src={order.first_item.image_url}\n alt={t(\"no_image_available\")}\n width={48}\n height={48}\n className=\"h-12 w-12 flex-shrink-0 rounded-md object-cover\"\n />\n ) : (\n <div className=\"bg-border h-12 w-12 flex-shrink-0 rounded-md\" />\n )}\n <div className=\"w-0 min-w-0 flex-1\">\n {order.first_item?.title ? (\n <p className=\"text-foreground truncate text-sm font-medium\">\n {order.first_item.title}\n </p>\n ) : (\n <div className=\"bg-muted rounded-lg p-2\">\n <div className=\"text-muted-foreground text-xs\">\n {t(\"this_product_no_longer_exists\")}\n </div>\n </div>\n )}\n {order.subscription && (\n <StatusBadge color=\"blue\" size=\"xs\" className=\"mt-1\">\n {t(\"subscription\")}\n </StatusBadge>\n )}\n {order.subscription && onSubscriptionClick && (\n <button\n type=\"button\"\n className=\"text-foreground hover:text-foreground/80 mt-1 inline-block text-xs transition-colors duration-200 hover:underline\"\n onClick={(e) => {\n e.stopPropagation();\n onSubscriptionClick(\n order.subscription!.subscription_token,\n );\n }}\n >\n {t(\"view_subscription\")}\n </button>\n )}\n <div className=\"mt-2 grid grid-cols-2 gap-x-4 gap-y-1 text-sm\">\n <div>\n <span className=\"text-muted-foreground block text-xs\">\n {t(\"date\")}\n </span>\n <span className=\"text-muted-foreground\">\n {new Date(order.created_at).toLocaleDateString()}\n </span>\n </div>\n <div>\n <span className=\"text-muted-foreground block text-xs\">\n {t(\"total\")}\n </span>\n <span className=\"text-foreground font-medium\">\n {formatOrderTotal(order)}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n ))\n )}\n </div>\n\n {/* desktop view */}\n <div className=\"hidden overflow-x-auto md:block\">\n <table className=\"min-w-full table-fixed\">\n <colgroup>\n <col className=\"w-2/5 min-w-[240px]\" />\n <col className=\"w-1/3 min-w-[100px]\" />\n <col className=\"w-[26.67%] min-w-[100px]\" />\n </colgroup>\n <thead className=\"bg-muted\">\n <tr className=\"h-10\">\n <TableColumn label={t(\"product\")} sortable={false} />\n <TableColumn label={t(\"date\")} sortable={false} />\n <TableColumn label={t(\"total\")} sortable={false} />\n </tr>\n </thead>\n <tbody className=\"divide-border bg-background divide-y\">\n {isLoading ? (\n Array(5)\n .fill(0)\n .map((_, index) => (\n <tr key={`skeleton-${index}`}>\n <td className=\"px-3 py-4\">\n <div className=\"flex items-center space-x-2\">\n <Skeleton className=\"h-9 w-9 rounded-md\" />\n <Skeleton className=\"h-4 w-32\" />\n </div>\n </td>\n <td className=\"px-3 py-4\">\n <Skeleton className=\"h-4 w-24\" />\n </td>\n <td className=\"px-3 py-4\">\n <Skeleton className=\"h-4 w-24\" />\n </td>\n </tr>\n ))\n ) : ordersList.length === 0 ? (\n <tr>\n <td\n colSpan={3}\n className=\"text-muted-foreground px-3 py-8 text-center text-sm\"\n >\n {searchTerm ? t(\"no_matching_orders\") : t(\"no_orders_found\")}\n </td>\n </tr>\n ) : (\n ordersList.map((order) => (\n <tr\n key={order.id}\n className=\"hover:bg-accent cursor-pointer transition-colors duration-200 ease-in-out\"\n onClick={() => onOrderClick(order)}\n >\n <td className=\"text-muted-foreground px-3 py-4 text-sm\">\n <div className=\"flex max-w-[280px] flex-row items-center space-x-3\">\n {order.first_item?.image_url ? (\n <img\n src={order.first_item.image_url}\n alt={t(\"no_image_available\")}\n width={42}\n height={42}\n className=\"h-[42px] w-[42px] flex-shrink-0 rounded-md object-cover\"\n />\n ) : (\n <div className=\"bg-border ml-1 h-9 w-9 flex-shrink-0 rounded-md\" />\n )}\n <div className=\"flex min-w-0 flex-col space-y-1\">\n <div className=\"flex items-center space-x-2\">\n {order.first_item?.title ? (\n <span className=\"text-foreground truncate text-sm font-medium\">\n {order.first_item.title}\n </span>\n ) : (\n <div className=\"bg-muted w-full rounded-lg p-2\">\n <div className=\"text-muted-foreground text-xs\">\n {t(\"this_product_no_longer_exists\")}\n </div>\n </div>\n )}\n {order.subscription && (\n <StatusBadge\n color=\"blue\"\n size=\"xs\"\n className=\"flex-shrink-0\"\n >\n {t(\"subscription\")}\n </StatusBadge>\n )}\n </div>\n {order.subscription && onSubscriptionClick && (\n <button\n type=\"button\"\n className=\"text-foreground hover:text-foreground/80 text-left text-xs transition-colors duration-200 hover:underline\"\n onClick={(e) => {\n e.stopPropagation();\n onSubscriptionClick(\n order.subscription!.subscription_token,\n );\n }}\n >\n {t(\"view_subscription\")}\n </button>\n )}\n </div>\n </div>\n </td>\n <td className=\"text-muted-foreground px-3 py-4 text-sm whitespace-nowrap\">\n {new Date(order.created_at).toLocaleDateString()}\n </td>\n <td className=\"text-foreground px-3 py-4 text-sm whitespace-nowrap\">\n {formatOrderTotal(order)}\n </td>\n </tr>\n ))\n )}\n </tbody>\n </table>\n </div>\n\n <PaginationFooter\n currentPage={currentPage}\n totalPages={totalPages}\n pageSize={pageSize}\n totalItems={totalItems}\n cursorPaginationMode\n hasNextPage={hasNextPage}\n hasPrevPage={hasPrevPage}\n onCursorNext={handleNextPage}\n onCursorPrev={handlePrevPage}\n />\n </div>\n );\n}\n","export function startCase(str: string | undefined | null): string {\n if (!str) return \"\";\n return str.replace(/_/g, \" \").replace(/\\b\\w/g, (char) => char.toUpperCase());\n}\n\nexport function formatCurrency(symbol: string, value: string | number): string {\n return `${symbol}${Number(value).toFixed(2)}`;\n}\n","import { StatusBadge, type BadgeColor } from \"./status-badge\";\nimport { startCase } from \"../lib/format\";\n\nconst statusColorMap: Record<string, BadgeColor> = {\n paid: \"green\",\n fulfilled: \"green\",\n delivered: \"green\",\n complete: \"green\",\n pending: \"yellow\",\n unfulfilled: \"yellow\",\n partially_fulfilled: \"yellow\",\n processing: \"yellow\",\n refunded: \"red\",\n cancelled: \"red\",\n failed: \"red\",\n voided: \"red\",\n};\n\nexport interface OrderStatusBadgeProps {\n status: string;\n className?: string;\n}\n\nexport function OrderStatusBadge({ status, className }: OrderStatusBadgeProps) {\n const color = statusColorMap[status] ?? \"gray\";\n return (\n <StatusBadge color={color} dot size=\"sm\" className={className}>\n {startCase(status)}\n </StatusBadge>\n );\n}\n","import { useEffect } from \"react\";\nimport type { orders } from \"@fluid-app/orders-api-client\";\nimport { useOrder } from \"@fluid-app/orders-core\";\nimport { Skeleton } from \"@fluid-app/ui-primitives\";\nimport { Truck } from \"lucide-react\";\nimport { OrderStatusBadge } from \"./order-status-badge\";\nimport { StatusBadge } from \"./status-badge\";\nimport { startCase, formatCurrency } from \"../lib/format\";\n\nexport interface OrderDetailProps {\n token: string;\n onNotFound?: () => void;\n onError?: (error: Error) => void;\n}\n\n/* ── Skeleton ─────────────────────────────────────────────────────── */\n\nfunction OrderDetailSkeleton() {\n return (\n <div className=\"flex flex-col lg:grid lg:grid-cols-8\">\n {/* Left: items skeleton */}\n <div className=\"bg-muted flex flex-col items-center px-8 lg:col-span-4\">\n <div className=\"w-full max-w-lg py-6\">\n <Skeleton className=\"mb-4 h-6 w-48\" />\n <div className=\"space-y-4\">\n <div className=\"flex items-center space-x-4\">\n <Skeleton className=\"h-24 w-24 rounded\" />\n <div className=\"flex-1 space-y-2\">\n <Skeleton className=\"h-4 w-3/4\" />\n <Skeleton className=\"h-4 w-1/2\" />\n <Skeleton className=\"h-4 w-1/4\" />\n </div>\n </div>\n </div>\n <div className=\"mt-6 space-y-2\">\n <Skeleton className=\"h-4 w-full\" />\n <Skeleton className=\"h-4 w-full\" />\n <Skeleton className=\"h-4 w-full\" />\n <Skeleton className=\"h-5 w-full\" />\n </div>\n </div>\n </div>\n {/* Right: details skeleton */}\n <div className=\"bg-background px-8 pt-4 lg:col-span-4\">\n <div className=\"mx-auto max-w-lg lg:mx-0 lg:mr-auto\">\n <Skeleton className=\"mb-4 h-10 w-full rounded\" />\n <div className=\"mt-6 space-y-4\">\n <Skeleton className=\"h-5 w-40\" />\n <Skeleton className=\"h-16 w-full rounded\" />\n </div>\n <div className=\"mt-6 space-y-4\">\n <Skeleton className=\"h-5 w-40\" />\n <Skeleton className=\"h-16 w-full rounded\" />\n </div>\n <div className=\"mt-6 space-y-4\">\n <Skeleton className=\"h-5 w-40\" />\n <Skeleton className=\"h-16 w-full rounded\" />\n </div>\n </div>\n </div>\n </div>\n );\n}\n\n/* ── Left column: items & price summary ───────────────────────────── */\n\nfunction OrderItemRow({ item }: { item: orders.LegacyOrderItem }) {\n return (\n <div className=\"flex items-center space-x-4 py-4\">\n <div className=\"relative shrink-0\">\n <div className=\"bg-muted h-24 w-24 overflow-hidden rounded\">\n {item.image_url ? (\n <img\n src={item.image_url}\n alt={item.title}\n width={96}\n height={96}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div className=\"text-muted-foreground flex h-full w-full items-center justify-center\">\n No image\n </div>\n )}\n </div>\n {item.quantity > 1 && (\n <span className=\"bg-foreground text-background absolute -top-2 -right-2 z-10 flex h-6 w-6 items-center justify-center rounded-full text-xs font-medium\">\n {item.quantity}\n </span>\n )}\n </div>\n <div className=\"flex min-w-0 flex-1 flex-col space-y-0.5\">\n <p\n className=\"text-foreground truncate text-sm font-medium\"\n title={item.title}\n >\n {item.title}\n </p>\n {item.ordered_variant.length > 0 && (\n <p className=\"text-muted-foreground text-sm\">\n {item.ordered_variant.map((v) => v.value).join(\" / \")}\n </p>\n )}\n {item.sku && (\n <p className=\"text-muted-foreground text-xs\">SKU: {item.sku}</p>\n )}\n {item.subscription && (\n <StatusBadge color=\"blue\" size=\"xs\" className=\"mt-1\">\n Subscription\n </StatusBadge>\n )}\n <p className=\"text-foreground text-sm font-medium\">\n {item.display_total}\n </p>\n {item.quantity > 1 && (\n <p className=\"text-muted-foreground text-xs\">\n {item.display_price} x {item.quantity}\n </p>\n )}\n </div>\n </div>\n );\n}\n\nfunction OrderItemsSection({ order }: { order: orders.Order }) {\n const visibleItems = order.items.filter(\n (item) => item.display_to_customer !== false,\n );\n const sym = order.currency_symbol || \"$\";\n\n return (\n <section className=\"bg-muted flex w-full flex-col items-center px-8 lg:col-span-4\">\n <div className=\"flex w-full max-w-lg flex-col\">\n {/* Items header */}\n <div className=\"mt-4\">\n <h2 className=\"text-foreground mb-2 text-lg font-medium\">\n Items ({visibleItems.length})\n </h2>\n <hr className=\"border-border\" />\n </div>\n\n {/* Item rows */}\n <div className=\"divide-border divide-y\">\n {visibleItems.map((item) => (\n <OrderItemRow key={item.id} item={item} />\n ))}\n </div>\n\n {/* Pricing summary */}\n <div className=\"border-border mb-4 border-t pt-4\">\n <div className=\"flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">Subtotal</p>\n <p className=\"text-muted-foreground font-medium\">\n {order.sub_total_in_currency}\n </p>\n </div>\n {Number(order.discount) > 0 && (\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">\n Discount\n {order.discount_codes?.length\n ? ` (${order.discount_codes.join(\", \")})`\n : \"\"}\n </p>\n <p className=\"text-muted-foreground font-medium\">\n -{order.discount_in_currency}\n </p>\n </div>\n )}\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">Shipping</p>\n <p className=\"text-muted-foreground font-medium\">\n {order.free_shipping ? \"Free\" : order.shipping_total_for_display}\n </p>\n </div>\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">\n Tax\n {order.price_inclusive_of_tax && order.price_inclusive_tax_name\n ? ` (${order.price_inclusive_tax_name}, included)`\n : \"\"}\n </p>\n <p className=\"text-muted-foreground font-medium\">\n {order.tax_in_currency}\n </p>\n </div>\n {order.points_applied_amount_in_currency != null &&\n order.points_applied_amount_in_currency > 0 && (\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">\n Points Applied\n </p>\n <p className=\"text-muted-foreground font-medium\">\n {`-${formatCurrency(sym, order.points_applied_amount_in_currency)}`}\n </p>\n </div>\n )}\n <div className=\"mt-4 flex items-center justify-between text-base font-medium\">\n <p className=\"text-muted-foreground text-sm font-medium\">Total</p>\n <p className=\"text-foreground text-base font-bold\">\n {order.total_in_currency}\n </p>\n </div>\n </div>\n </div>\n </section>\n );\n}\n\n/* ── Right column: order details ──────────────────────────────────── */\n\nfunction OrderDetailsSection({ order }: { order: orders.Order }) {\n const paymentDetails = order.payment_details;\n const cardDetails = paymentDetails?.details;\n\n return (\n <div className=\"bg-background px-8 pt-4 lg:col-span-4\">\n <div className=\"mx-auto max-w-lg lg:mx-0 lg:mr-auto\">\n {/* Order Status */}\n <div className=\"border-border mb-6 border-b pb-6\">\n <div className=\"flex flex-wrap items-center gap-3\">\n <div className=\"flex items-center gap-2\">\n <span className=\"text-muted-foreground text-sm\">Payment:</span>\n <OrderStatusBadge status={order.payment_status} />\n </div>\n <div className=\"flex items-center gap-2\">\n <span className=\"text-muted-foreground text-sm\">\n Fulfillment:\n </span>\n <OrderStatusBadge status={order.fulfillment_status} />\n </div>\n <div className=\"flex items-center gap-2\">\n <span className=\"text-muted-foreground text-sm\">Delivery:</span>\n <OrderStatusBadge status={order.delivery_status} />\n </div>\n </div>\n </div>\n\n {/* Order Info */}\n <div className=\"border-border mb-6 border-b pb-6\">\n <h3 className=\"text-foreground mb-3 text-sm/6 font-semibold\">\n Order Info\n </h3>\n <div className=\"divide-border flex divide-x\">\n <div className=\"flex-1 pr-4\">\n <div className=\"text-muted-foreground text-sm\">Order Number</div>\n <div className=\"text-foreground font-medium\">\n {order.order_number}\n </div>\n </div>\n <div className=\"flex-1 px-4\">\n <div className=\"text-muted-foreground text-sm\">Channel</div>\n <div className=\"text-foreground font-medium\">\n {startCase(order.channel)}\n </div>\n </div>\n <div className=\"flex-1 pl-4 text-right\">\n <div className=\"text-muted-foreground text-sm\">Date</div>\n <div className=\"text-foreground font-medium\">\n {new Date(order.created_at).toLocaleDateString(\"en-US\", {\n year: \"numeric\",\n month: \"short\",\n day: \"numeric\",\n })}\n </div>\n </div>\n </div>\n {order.email && (\n <div className=\"mt-3\">\n <div className=\"text-muted-foreground text-sm\">Email</div>\n <div className=\"text-foreground text-sm font-medium\">\n {order.email}\n </div>\n </div>\n )}\n </div>\n\n {/* Payment Method */}\n {paymentDetails && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Payment Method\n </div>\n <div className=\"text-foreground flex items-center gap-2 text-sm\">\n {cardDetails?.logo_url ? (\n <img\n src={cardDetails.logo_url}\n alt={cardDetails.card_type ?? \"Card\"}\n className=\"h-6 w-9 object-contain\"\n width={35}\n height={24}\n />\n ) : (\n <div className=\"bg-muted text-muted-foreground flex h-6 w-9 items-center justify-center rounded text-xs\">\n {(\n paymentDetails.payment_title ||\n paymentDetails.payment_type ||\n \"P\"\n ).charAt(0)}\n </div>\n )}\n <span className=\"font-medium\">\n {cardDetails?.card_type\n ? startCase(cardDetails.card_type)\n : paymentDetails.payment_title ||\n startCase(paymentDetails.payment_type)}\n {cardDetails?.last_four\n ? ` ending in ${cardDetails.last_four}`\n : \"\"}\n </span>\n </div>\n </div>\n )}\n\n {/* Shipping Address */}\n {order.ship_to && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Shipping Address\n </div>\n <div className=\"text-foreground flex items-start gap-2 text-sm\">\n <Truck className=\"text-muted-foreground mt-0.5 mr-1 h-4 w-4 shrink-0\" />\n <div className=\"flex flex-col\">\n {order.ship_to.name && (\n <span className=\"font-medium\">{order.ship_to.name}</span>\n )}\n {order.ship_to.address1 && (\n <span>{order.ship_to.address1}</span>\n )}\n {(order.ship_to.city ||\n order.ship_to.state ||\n order.ship_to.postal_code) && (\n <span>\n {[\n [order.ship_to.city, order.ship_to.state]\n .filter(Boolean)\n .join(\", \"),\n order.ship_to.postal_code,\n ]\n .filter(Boolean)\n .join(\" \")}\n </span>\n )}\n {order.ship_to.country_code && (\n <span>{order.ship_to.country_code}</span>\n )}\n </div>\n </div>\n </div>\n )}\n\n {/* Billing Address */}\n {order.bill_to && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Billing Address\n </div>\n <div className=\"text-foreground text-sm\">\n {order.bill_to.name && (\n <p className=\"font-medium\">{order.bill_to.name}</p>\n )}\n {order.bill_to.address1 && <p>{order.bill_to.address1}</p>}\n {(order.bill_to.city ||\n order.bill_to.state ||\n order.bill_to.postal_code) && (\n <p>\n {[\n [order.bill_to.city, order.bill_to.state]\n .filter(Boolean)\n .join(\", \"),\n order.bill_to.postal_code,\n ]\n .filter(Boolean)\n .join(\" \")}\n </p>\n )}\n {order.bill_to.country_code && (\n <p>{order.bill_to.country_code}</p>\n )}\n </div>\n </div>\n )}\n\n {/* Shipping Method */}\n {order.shipping_method && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Shipping Method\n </div>\n <div className=\"text-foreground text-sm font-medium\">\n {order.shipping_method.title}\n </div>\n {order.shipping_method.delivery_time_estimate && (\n <div className=\"text-muted-foreground mt-1 text-xs\">\n Est. {order.shipping_method.delivery_time_estimate}\n </div>\n )}\n </div>\n )}\n </div>\n </div>\n );\n}\n\n/* ── Main component ────────────────────────────────────────────────── */\n\nexport function OrderDetail({ token, onNotFound, onError }: OrderDetailProps) {\n const { data, isLoading, error } = useOrder(token);\n const order = data?.order;\n\n useEffect(() => {\n if (!isLoading && error) {\n onError?.(error as Error);\n }\n }, [isLoading, error, onError]);\n\n useEffect(() => {\n if (!isLoading && !error && !order) {\n onNotFound?.();\n }\n }, [isLoading, error, order, onNotFound]);\n\n if (isLoading) {\n return <OrderDetailSkeleton />;\n }\n\n if (!order) {\n return null;\n }\n\n return (\n <div className=\"flex flex-col lg:grid lg:grid-cols-8\">\n <OrderItemsSection order={order} />\n <OrderDetailsSection order={order} />\n </div>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"order-detail-o-C0YhaZ.mjs","names":["ordersApi.fetchOrder","ordersApi.fetchCustomerOrders"],"sources":["../../../orders/api-client/src/namespaces/orders.ts","../../../orders/core/src/context.ts","../../../orders/core/src/provider.tsx","../../../orders/core/src/query-keys.ts","../../../orders/core/src/hooks/use-order.ts","../../../orders/core/src/hooks/use-customer-orders.ts","../../../orders/core/src/utils/format-order-total.ts","../../../orders/ui/src/components/search-input.tsx","../../../orders/ui/src/components/pagination-footer.tsx","../../../orders/ui/src/components/status-badge.tsx","../../../orders/ui/src/components/table-column.tsx","../../../orders/ui/src/components/orders-list.tsx","../../../orders/ui/src/lib/format.ts","../../../orders/ui/src/components/order-status-badge.tsx","../../../orders/ui/src/components/order-detail.tsx"],"sourcesContent":["import type { FetchClient } from \"../lib/fetch-client\";\nimport type { orders } from \"../custom/orders\";\n\n/**\n * Fetch a single order by token.\n * Endpoint: GET /public/v2025-06/orders/{orderToken}\n */\nexport async function fetchOrder(\n client: FetchClient,\n orderToken: string,\n): Promise<orders.OrderResponse> {\n return client.get(`/public/v2025-06/orders/${orderToken}`);\n}\n\n/**\n * Fetch a paginated list of customer orders.\n * Endpoint: GET /v202506/orders\n */\nexport async function fetchCustomerOrders(\n client: FetchClient,\n params: orders.FetchOrdersParams,\n): Promise<orders.CustomerOrdersResponse> {\n const input: Record<string, string> = {};\n\n if (params.cursor) input[\"page[cursor]\"] = params.cursor;\n if (params.limit != null) input[\"page[limit]\"] = params.limit.toString();\n if (params.search) input.search = params.search;\n if (params.sort) input.sort = params.sort;\n if (params.status) input.status = params.status;\n if (params.type) input.type = params.type;\n if (params.customerId != null)\n input.customer_id = params.customerId.toString();\n if (params.userCompanyId != null)\n input.user_company_id = params.userCompanyId.toString();\n if (params.subscriptionId != null)\n input.subscription_id = params.subscriptionId.toString();\n if (params.startDate) input.start_date = params.startDate;\n if (params.endDate) input.end_date = params.endDate;\n if (params.withinDays != null)\n input.within_days = params.withinDays.toString();\n if (params.cartSource) input.cart_source = params.cartSource;\n if (params.countryIsos) input.country_isos = params.countryIsos;\n if (params.forceStats != null)\n input.force_stats = params.forceStats.toString();\n\n return client.get(\"/v202506/orders\", input);\n}\n","import { createContext, useContext } from \"react\";\nimport type { FetchClient } from \"@fluid-app/api-client-core\";\n\nconst OrdersClientContext = createContext<FetchClient | null>(null);\n\nexport const OrdersClientProvider = OrdersClientContext.Provider;\n\nexport function useOrdersClient(): FetchClient {\n const client = useContext(OrdersClientContext);\n if (!client) {\n throw new Error(\n \"useOrdersClient must be used within an OrdersCoreProvider\",\n );\n }\n return client;\n}\n","import type { FetchClient } from \"@fluid-app/api-client-core\";\nimport type { JSX, ReactNode } from \"react\";\nimport { OrdersClientProvider } from \"./context\";\n\nexport interface OrdersCoreProviderProps {\n client: FetchClient;\n children: ReactNode;\n}\n\nexport function OrdersCoreProvider({\n client,\n children,\n}: OrdersCoreProviderProps): JSX.Element {\n return <OrdersClientProvider value={client}>{children}</OrdersClientProvider>;\n}\n","import type { orders } from \"@fluid-app/orders-api-client\";\n\nexport const ordersKeys = {\n all: [\"orders\"] as const,\n list: (params?: orders.FetchOrdersParams) =>\n [...ordersKeys.all, \"list\", params] as const,\n detail: (orderToken: string) =>\n [...ordersKeys.all, \"detail\", orderToken] as const,\n} as const;\n","import { useQuery } from \"@tanstack/react-query\";\nimport { ordersApi } from \"@fluid-app/orders-api-client\";\nimport { ordersKeys } from \"../query-keys\";\nimport { useOrdersClient } from \"../context\";\n\nexport function useOrder(orderToken: string, options?: { enabled?: boolean }) {\n const client = useOrdersClient();\n return useQuery({\n queryKey: ordersKeys.detail(orderToken),\n queryFn: () => ordersApi.fetchOrder(client, orderToken),\n enabled: (options?.enabled ?? true) && !!orderToken,\n });\n}\n","import { useQuery } from \"@tanstack/react-query\";\nimport type { orders } from \"@fluid-app/orders-api-client\";\nimport { ordersApi } from \"@fluid-app/orders-api-client\";\nimport { ordersKeys } from \"../query-keys\";\nimport { useOrdersClient } from \"../context\";\n\nexport function useCustomerOrders(\n params: orders.FetchOrdersParams,\n options?: { enabled?: boolean },\n) {\n const client = useOrdersClient();\n return useQuery({\n queryKey: ordersKeys.list(params),\n queryFn: () => ordersApi.fetchCustomerOrders(client, params),\n enabled: options?.enabled ?? true,\n });\n}\n","import type { orders } from \"@fluid-app/orders-api-client\";\n\nexport function formatOrderTotal(order: orders.ListOrder): string {\n if (order.order_total_after_points_redemption != null) {\n return `${order.currency_symbol || \"$\"}${Number(\n order.order_total_after_points_redemption,\n ).toFixed(2)}`;\n }\n return (\n order.total_display_amount ||\n `${order.currency_symbol || \"$\"}${Number(order.amount).toFixed(2)}`\n );\n}\n","import { Input } from \"@fluid-app/ui-primitives\";\nimport { Search } from \"lucide-react\";\n\ninterface SearchInputProps {\n searchTerm: string;\n onSearchChange: (value: string) => void;\n placeholder?: string;\n}\n\nexport function SearchInput({\n searchTerm,\n onSearchChange,\n placeholder,\n}: SearchInputProps) {\n return (\n <div className=\"relative\">\n <Search className=\"text-muted-foreground absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2\" />\n <Input\n value={searchTerm}\n onChange={(e) => onSearchChange(e.target.value)}\n placeholder={placeholder}\n className=\"pl-9\"\n />\n </div>\n );\n}\n","import { cn } from \"@fluid-app/ui-primitives\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\n\nexport interface PaginationFooterProps {\n currentPage: number;\n totalPages: number;\n pageSize: number;\n totalItems: number;\n /** @deprecated No longer used. Kept for backward compatibility with subscriptions-ui. */\n maxVisiblePages?: number;\n onPageChange?: (page: number) => void;\n cursorPaginationMode?: boolean;\n hasNextPage?: boolean;\n hasPrevPage?: boolean;\n onCursorNext?: () => void;\n onCursorPrev?: () => void;\n /** @deprecated Use lucide icons directly. Kept for backward compatibility with subscriptions-ui. */\n chevronLeftIcon?: string;\n /** @deprecated Use lucide icons directly. Kept for backward compatibility with subscriptions-ui. */\n chevronRightIcon?: string;\n /** @deprecated Pagination labels are now hardcoded in English. Kept for backward compatibility. */\n t?: (key: string) => string;\n}\n\nexport function PaginationFooter({\n currentPage,\n totalPages,\n pageSize,\n totalItems,\n onPageChange,\n cursorPaginationMode,\n hasNextPage,\n hasPrevPage,\n onCursorNext,\n onCursorPrev,\n}: PaginationFooterProps) {\n const isCursor = !!cursorPaginationMode;\n\n const isPrevDisabled = isCursor ? !hasPrevPage : currentPage === 1;\n const isNextDisabled = isCursor\n ? !hasNextPage\n : totalPages === 0 || currentPage === totalPages;\n\n const handlePrevClick = () => {\n if (isCursor) {\n onCursorPrev?.();\n } else {\n onPageChange?.(currentPage - 1);\n }\n };\n\n const handleNextClick = () => {\n if (isCursor) {\n onCursorNext?.();\n } else {\n onPageChange?.(currentPage + 1);\n }\n };\n\n const displayText = (() => {\n if (isCursor) {\n return (\n <>\n Total <span className=\"font-medium\">{totalItems}</span> results\n </>\n );\n }\n const start = totalItems === 0 ? 0 : (currentPage - 1) * pageSize + 1;\n const end = Math.min(currentPage * pageSize, totalItems);\n return (\n <>\n Showing <span className=\"font-medium\">{start}</span> to{\" \"}\n <span className=\"font-medium\">{end}</span> of{\" \"}\n <span className=\"font-medium\">{totalItems}</span> results\n </>\n );\n })();\n\n const buttonBase =\n \"relative inline-flex items-center px-3 py-2 text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50\";\n\n return (\n <div className=\"border-border flex items-center justify-between border-t px-4 py-3 sm:px-6\">\n {/* Mobile prev/next */}\n <div className=\"flex flex-1 justify-between sm:hidden\">\n <button\n type=\"button\"\n onClick={handlePrevClick}\n disabled={isPrevDisabled}\n className={cn(\n buttonBase,\n \"border-border bg-background text-foreground hover:bg-accent rounded-md border\",\n )}\n >\n Previous\n </button>\n <button\n type=\"button\"\n onClick={handleNextClick}\n disabled={isNextDisabled}\n className={cn(\n buttonBase,\n \"border-border bg-background text-foreground hover:bg-accent ml-3 rounded-md border\",\n )}\n >\n Next\n </button>\n </div>\n\n {/* Desktop */}\n <div className=\"hidden sm:flex sm:flex-1 sm:items-center sm:justify-between\">\n <p className=\"text-muted-foreground text-xs\">{displayText}</p>\n <nav\n aria-label=\"Pagination\"\n className=\"isolate inline-flex -space-x-px rounded-md shadow-sm\"\n >\n <button\n type=\"button\"\n onClick={handlePrevClick}\n disabled={isPrevDisabled}\n className={cn(\n buttonBase,\n \"border-border text-muted-foreground hover:bg-accent rounded-l-md border\",\n )}\n >\n <span className=\"sr-only\">Previous</span>\n <ChevronLeft className=\"h-4 w-4\" />\n </button>\n {!isCursor && (\n <span className=\"border-border bg-background text-foreground relative inline-flex items-center border px-4 py-2 text-sm font-medium\">\n {currentPage} / {totalPages}\n </span>\n )}\n <button\n type=\"button\"\n onClick={handleNextClick}\n disabled={isNextDisabled}\n className={cn(\n buttonBase,\n \"border-border text-muted-foreground hover:bg-accent rounded-r-md border\",\n )}\n >\n <span className=\"sr-only\">Next</span>\n <ChevronRight className=\"h-4 w-4\" />\n </button>\n </nav>\n </div>\n </div>\n );\n}\n","import { cn } from \"@fluid-app/ui-primitives\";\n\nexport type BadgeColor = \"green\" | \"yellow\" | \"red\" | \"blue\" | \"gray\";\n\ntype BadgeSize = \"xs\" | \"sm\" | \"md\";\n\ninterface StatusBadgeProps {\n color: BadgeColor;\n dot?: boolean;\n size?: BadgeSize;\n className?: string;\n children: React.ReactNode;\n}\n\nconst colorStyles: Record<BadgeColor, string> = {\n green: \"bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400\",\n yellow:\n \"bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-400\",\n red: \"bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400\",\n blue: \"bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400\",\n gray: \"bg-gray-100 text-gray-800 dark:bg-gray-800 dark:text-gray-300\",\n};\n\nconst dotColorStyles: Record<BadgeColor, string> = {\n green: \"bg-green-500\",\n yellow: \"bg-yellow-500\",\n red: \"bg-red-500\",\n blue: \"bg-blue-500\",\n gray: \"bg-gray-500\",\n};\n\nconst sizeStyles: Record<BadgeSize, string> = {\n xs: \"px-1.5 py-0.5 text-[10px]\",\n sm: \"px-2 py-0.5 text-xs\",\n md: \"px-2.5 py-1 text-sm\",\n};\n\nexport function StatusBadge({\n color,\n dot,\n size = \"md\",\n className,\n children,\n}: StatusBadgeProps) {\n return (\n <span\n className={cn(\n \"inline-flex items-center gap-1 rounded-full font-medium whitespace-nowrap\",\n colorStyles[color],\n sizeStyles[size],\n className,\n )}\n >\n {dot && (\n <span\n className={cn(\"h-1.5 w-1.5 rounded-full\", dotColorStyles[color])}\n />\n )}\n {children}\n </span>\n );\n}\n","import { cn } from \"@fluid-app/ui-primitives\";\n\ninterface TableColumnProps {\n label: string;\n sortable?: boolean;\n className?: string;\n onSortClick?: (sortBy: string) => void;\n sortBy?: string;\n sortData?: {\n column: string;\n direction: \"asc\" | \"desc\";\n };\n chevronUpIcon?: string;\n chevronDownIcon?: string;\n}\n\nexport function TableColumn({\n label,\n sortable = true,\n className,\n onSortClick,\n sortBy,\n sortData,\n chevronUpIcon,\n chevronDownIcon,\n}: TableColumnProps) {\n const hideUpIcon =\n sortData?.column !== sortBy ||\n (sortData?.column === sortBy && sortData?.direction === \"asc\");\n\n const hideDownIcon =\n sortData?.column !== sortBy ||\n (sortData?.column === sortBy && sortData?.direction === \"desc\");\n\n return (\n <th\n className={cn(\n \"group cursor-pointer px-3 py-2 text-left text-xs font-medium text-gray-500 transition-colors duration-200\",\n \"hover:text-blue-600\",\n className,\n )}\n onClick={() => sortable && onSortClick?.(sortBy ?? \"\")}\n >\n <div className=\"relative flex items-center\">\n {label}\n {sortable && chevronUpIcon && chevronDownIcon && (\n <button\n className={`ml-2 inline-flex flex-col items-center justify-center group-hover:opacity-100 ${\n sortData?.column === sortBy ? \"opacity-100\" : \"opacity-0\"\n } transition-opacity duration-200`}\n >\n <div className=\"flex flex-col\">\n <img\n src={chevronUpIcon}\n alt=\"\"\n width={12}\n height={12}\n className={cn(\n \"h-2.5 w-2.5 text-gray-400 transition-colors duration-200 group-hover:text-blue-600\",\n hideUpIcon && \"opacity-0\",\n sortData?.column !== sortBy && \"group-hover:opacity-100\",\n )}\n />\n <img\n src={chevronDownIcon}\n alt=\"\"\n width={12}\n height={12}\n className={cn(\n \"h-2.5 w-2.5 text-gray-400 transition-colors duration-200 group-hover:text-blue-600\",\n hideDownIcon && \"opacity-0\",\n sortData?.column !== sortBy && \"group-hover:opacity-100\",\n )}\n />\n </div>\n </button>\n )}\n </div>\n </th>\n );\n}\n","import { useState, useCallback } from \"react\";\nimport type { orders } from \"@fluid-app/orders-api-client\";\nimport { useCustomerOrders, formatOrderTotal } from \"@fluid-app/orders-core\";\nimport { Skeleton } from \"@fluid-app/ui-primitives\";\nimport { SearchInput } from \"./search-input\";\nimport { PaginationFooter } from \"./pagination-footer\";\nimport { StatusBadge } from \"./status-badge\";\nimport { TableColumn } from \"./table-column\";\n\nexport interface OrdersListProps {\n customerId: number | undefined;\n onOrderClick: (order: orders.ListOrder) => void;\n onSubscriptionClick?: (subscriptionToken: string) => void;\n t: (key: string) => string;\n pageSize?: number;\n}\n\nexport function OrdersList({\n customerId,\n onOrderClick,\n onSubscriptionClick,\n t,\n pageSize = 10,\n}: OrdersListProps) {\n const [cursor, setCursor] = useState<string | null>(null);\n const [searchTerm, setSearchTerm] = useState(\"\");\n\n const params: orders.FetchOrdersParams = {\n customerId,\n limit: pageSize,\n search: searchTerm || undefined,\n cursor: cursor || undefined,\n sort: \"-created_at\",\n };\n\n const { data, isLoading } = useCustomerOrders(params, {\n enabled: !!customerId,\n });\n\n const handleSearchChange = useCallback((term: string) => {\n setSearchTerm(term);\n setCursor(null);\n }, []);\n\n const handleNextPage = useCallback(() => {\n const nextCursor = data?.meta?.pagination?.next_cursor;\n if (nextCursor) {\n setCursor(nextCursor);\n }\n }, [data?.meta?.pagination?.next_cursor]);\n\n const handlePrevPage = useCallback(() => {\n const prevCursor = data?.meta?.pagination?.prev_cursor;\n if (prevCursor) {\n setCursor(prevCursor);\n } else {\n setCursor(null);\n }\n }, [data?.meta?.pagination?.prev_cursor]);\n\n const ordersList = data?.orders || [];\n const pagination = data?.meta?.pagination;\n const totalItems = pagination?.total_count ?? ordersList.length;\n const totalPages = pagination?.total_pages ?? 1;\n const currentPage = pagination?.current_page ?? 1;\n const hasNextPage = !!pagination?.next_cursor;\n const hasPrevPage = !!pagination?.prev_cursor;\n\n return (\n <div className=\"border-border overflow-hidden rounded-lg border shadow-sm\">\n <div className=\"p-3 text-left\">\n <div className=\"w-full md:mr-auto md:w-1/2 lg:w-1/3\">\n <SearchInput\n searchTerm={searchTerm}\n onSearchChange={handleSearchChange}\n placeholder={t(\"search_orders\")}\n />\n </div>\n </div>\n\n {/* mobile view */}\n <div className=\"block md:hidden\">\n {isLoading ? (\n Array(5)\n .fill(0)\n .map((_, index) => (\n <div\n key={`skeleton-${index}`}\n className=\"border-border border-b p-4\"\n >\n <div className=\"flex space-x-3\">\n <Skeleton className=\"h-12 w-12 rounded-md\" />\n <div className=\"flex-1 space-y-2\">\n <Skeleton className=\"h-4 w-3/4\" />\n <Skeleton className=\"h-3 w-1/2\" />\n </div>\n </div>\n </div>\n ))\n ) : ordersList.length === 0 ? (\n <div className=\"text-muted-foreground px-3 py-8 text-center text-sm\">\n {searchTerm ? t(\"no_matching_orders\") : t(\"no_orders_found\")}\n </div>\n ) : (\n ordersList.map((order) => (\n <div\n key={order.id}\n className=\"border-border hover:bg-accent cursor-pointer border-b p-4 transition-colors duration-200 ease-in-out last:border-b-0\"\n onClick={() => onOrderClick(order)}\n >\n <div className=\"flex items-start space-x-3\">\n {order.first_item?.image_url ? (\n <img\n src={order.first_item.image_url}\n alt={t(\"no_image_available\")}\n width={48}\n height={48}\n className=\"h-12 w-12 flex-shrink-0 rounded-md object-cover\"\n />\n ) : (\n <div className=\"bg-border h-12 w-12 flex-shrink-0 rounded-md\" />\n )}\n <div className=\"w-0 min-w-0 flex-1\">\n {order.first_item?.title ? (\n <p className=\"text-foreground truncate text-sm font-medium\">\n {order.first_item.title}\n </p>\n ) : (\n <div className=\"bg-muted rounded-lg p-2\">\n <div className=\"text-muted-foreground text-xs\">\n {t(\"this_product_no_longer_exists\")}\n </div>\n </div>\n )}\n {order.subscription && (\n <StatusBadge color=\"blue\" size=\"xs\" className=\"mt-1\">\n {t(\"subscription\")}\n </StatusBadge>\n )}\n {order.subscription && onSubscriptionClick && (\n <button\n type=\"button\"\n className=\"text-foreground hover:text-foreground/80 mt-1 inline-block text-xs transition-colors duration-200 hover:underline\"\n onClick={(e) => {\n e.stopPropagation();\n onSubscriptionClick(\n order.subscription!.subscription_token,\n );\n }}\n >\n {t(\"view_subscription\")}\n </button>\n )}\n <div className=\"mt-2 grid grid-cols-2 gap-x-4 gap-y-1 text-sm\">\n <div>\n <span className=\"text-muted-foreground block text-xs\">\n {t(\"date\")}\n </span>\n <span className=\"text-muted-foreground\">\n {new Date(order.created_at).toLocaleDateString()}\n </span>\n </div>\n <div>\n <span className=\"text-muted-foreground block text-xs\">\n {t(\"total\")}\n </span>\n <span className=\"text-foreground font-medium\">\n {formatOrderTotal(order)}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n ))\n )}\n </div>\n\n {/* desktop view */}\n <div className=\"hidden overflow-x-auto md:block\">\n <table className=\"min-w-full table-fixed\">\n <colgroup>\n <col className=\"w-2/5 min-w-[240px]\" />\n <col className=\"w-1/3 min-w-[100px]\" />\n <col className=\"w-[26.67%] min-w-[100px]\" />\n </colgroup>\n <thead className=\"bg-muted\">\n <tr className=\"h-10\">\n <TableColumn label={t(\"product\")} sortable={false} />\n <TableColumn label={t(\"date\")} sortable={false} />\n <TableColumn label={t(\"total\")} sortable={false} />\n </tr>\n </thead>\n <tbody className=\"divide-border bg-background divide-y\">\n {isLoading ? (\n Array(5)\n .fill(0)\n .map((_, index) => (\n <tr key={`skeleton-${index}`}>\n <td className=\"px-3 py-4\">\n <div className=\"flex items-center space-x-2\">\n <Skeleton className=\"h-9 w-9 rounded-md\" />\n <Skeleton className=\"h-4 w-32\" />\n </div>\n </td>\n <td className=\"px-3 py-4\">\n <Skeleton className=\"h-4 w-24\" />\n </td>\n <td className=\"px-3 py-4\">\n <Skeleton className=\"h-4 w-24\" />\n </td>\n </tr>\n ))\n ) : ordersList.length === 0 ? (\n <tr>\n <td\n colSpan={3}\n className=\"text-muted-foreground px-3 py-8 text-center text-sm\"\n >\n {searchTerm ? t(\"no_matching_orders\") : t(\"no_orders_found\")}\n </td>\n </tr>\n ) : (\n ordersList.map((order) => (\n <tr\n key={order.id}\n className=\"hover:bg-accent cursor-pointer transition-colors duration-200 ease-in-out\"\n onClick={() => onOrderClick(order)}\n >\n <td className=\"text-muted-foreground px-3 py-4 text-sm\">\n <div className=\"flex max-w-[280px] flex-row items-center space-x-3\">\n {order.first_item?.image_url ? (\n <img\n src={order.first_item.image_url}\n alt={t(\"no_image_available\")}\n width={42}\n height={42}\n className=\"h-[42px] w-[42px] flex-shrink-0 rounded-md object-cover\"\n />\n ) : (\n <div className=\"bg-border ml-1 h-9 w-9 flex-shrink-0 rounded-md\" />\n )}\n <div className=\"flex min-w-0 flex-col space-y-1\">\n <div className=\"flex items-center space-x-2\">\n {order.first_item?.title ? (\n <span className=\"text-foreground truncate text-sm font-medium\">\n {order.first_item.title}\n </span>\n ) : (\n <div className=\"bg-muted w-full rounded-lg p-2\">\n <div className=\"text-muted-foreground text-xs\">\n {t(\"this_product_no_longer_exists\")}\n </div>\n </div>\n )}\n {order.subscription && (\n <StatusBadge\n color=\"blue\"\n size=\"xs\"\n className=\"flex-shrink-0\"\n >\n {t(\"subscription\")}\n </StatusBadge>\n )}\n </div>\n {order.subscription && onSubscriptionClick && (\n <button\n type=\"button\"\n className=\"text-foreground hover:text-foreground/80 text-left text-xs transition-colors duration-200 hover:underline\"\n onClick={(e) => {\n e.stopPropagation();\n onSubscriptionClick(\n order.subscription!.subscription_token,\n );\n }}\n >\n {t(\"view_subscription\")}\n </button>\n )}\n </div>\n </div>\n </td>\n <td className=\"text-muted-foreground px-3 py-4 text-sm whitespace-nowrap\">\n {new Date(order.created_at).toLocaleDateString()}\n </td>\n <td className=\"text-foreground px-3 py-4 text-sm whitespace-nowrap\">\n {formatOrderTotal(order)}\n </td>\n </tr>\n ))\n )}\n </tbody>\n </table>\n </div>\n\n <PaginationFooter\n currentPage={currentPage}\n totalPages={totalPages}\n pageSize={pageSize}\n totalItems={totalItems}\n cursorPaginationMode\n hasNextPage={hasNextPage}\n hasPrevPage={hasPrevPage}\n onCursorNext={handleNextPage}\n onCursorPrev={handlePrevPage}\n />\n </div>\n );\n}\n","export function startCase(str: string | undefined | null): string {\n if (!str) return \"\";\n return str.replace(/_/g, \" \").replace(/\\b\\w/g, (char) => char.toUpperCase());\n}\n\nexport function formatCurrency(symbol: string, value: string | number): string {\n return `${symbol}${Number(value).toFixed(2)}`;\n}\n","import { StatusBadge, type BadgeColor } from \"./status-badge\";\nimport { startCase } from \"../lib/format\";\n\nconst statusColorMap: Record<string, BadgeColor> = {\n paid: \"green\",\n fulfilled: \"green\",\n delivered: \"green\",\n complete: \"green\",\n pending: \"yellow\",\n unfulfilled: \"yellow\",\n partially_fulfilled: \"yellow\",\n processing: \"yellow\",\n refunded: \"red\",\n cancelled: \"red\",\n failed: \"red\",\n voided: \"red\",\n};\n\nexport interface OrderStatusBadgeProps {\n status: string;\n className?: string;\n}\n\nexport function OrderStatusBadge({ status, className }: OrderStatusBadgeProps) {\n const color = statusColorMap[status] ?? \"gray\";\n return (\n <StatusBadge color={color} dot size=\"sm\" className={className}>\n {startCase(status)}\n </StatusBadge>\n );\n}\n","import { useEffect } from \"react\";\nimport type { orders } from \"@fluid-app/orders-api-client\";\nimport { useOrder } from \"@fluid-app/orders-core\";\nimport { Skeleton } from \"@fluid-app/ui-primitives\";\nimport { Truck } from \"lucide-react\";\nimport { OrderStatusBadge } from \"./order-status-badge\";\nimport { StatusBadge } from \"./status-badge\";\nimport { startCase, formatCurrency } from \"../lib/format\";\n\nexport interface OrderDetailProps {\n token: string;\n onNotFound?: () => void;\n onError?: (error: Error) => void;\n}\n\n/* ── Skeleton ─────────────────────────────────────────────────────── */\n\nfunction OrderDetailSkeleton() {\n return (\n <div className=\"flex flex-col lg:grid lg:grid-cols-8\">\n {/* Left: items skeleton */}\n <div className=\"bg-muted flex flex-col items-center px-8 lg:col-span-4\">\n <div className=\"w-full max-w-lg py-6\">\n <Skeleton className=\"mb-4 h-6 w-48\" />\n <div className=\"space-y-4\">\n <div className=\"flex items-center space-x-4\">\n <Skeleton className=\"h-24 w-24 rounded\" />\n <div className=\"flex-1 space-y-2\">\n <Skeleton className=\"h-4 w-3/4\" />\n <Skeleton className=\"h-4 w-1/2\" />\n <Skeleton className=\"h-4 w-1/4\" />\n </div>\n </div>\n </div>\n <div className=\"mt-6 space-y-2\">\n <Skeleton className=\"h-4 w-full\" />\n <Skeleton className=\"h-4 w-full\" />\n <Skeleton className=\"h-4 w-full\" />\n <Skeleton className=\"h-5 w-full\" />\n </div>\n </div>\n </div>\n {/* Right: details skeleton */}\n <div className=\"bg-background px-8 pt-4 lg:col-span-4\">\n <div className=\"mx-auto max-w-lg lg:mx-0 lg:mr-auto\">\n <Skeleton className=\"mb-4 h-10 w-full rounded\" />\n <div className=\"mt-6 space-y-4\">\n <Skeleton className=\"h-5 w-40\" />\n <Skeleton className=\"h-16 w-full rounded\" />\n </div>\n <div className=\"mt-6 space-y-4\">\n <Skeleton className=\"h-5 w-40\" />\n <Skeleton className=\"h-16 w-full rounded\" />\n </div>\n <div className=\"mt-6 space-y-4\">\n <Skeleton className=\"h-5 w-40\" />\n <Skeleton className=\"h-16 w-full rounded\" />\n </div>\n </div>\n </div>\n </div>\n );\n}\n\n/* ── Left column: items & price summary ───────────────────────────── */\n\nfunction OrderItemRow({ item }: { item: orders.LegacyOrderItem }) {\n return (\n <div className=\"flex items-center space-x-4 py-4\">\n <div className=\"relative shrink-0\">\n <div className=\"bg-muted h-24 w-24 overflow-hidden rounded\">\n {item.image_url ? (\n <img\n src={item.image_url}\n alt={item.title}\n width={96}\n height={96}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div className=\"text-muted-foreground flex h-full w-full items-center justify-center\">\n No image\n </div>\n )}\n </div>\n {item.quantity > 1 && (\n <span className=\"bg-foreground text-background absolute -top-2 -right-2 z-10 flex h-6 w-6 items-center justify-center rounded-full text-xs font-medium\">\n {item.quantity}\n </span>\n )}\n </div>\n <div className=\"flex min-w-0 flex-1 flex-col space-y-0.5\">\n <p\n className=\"text-foreground truncate text-sm font-medium\"\n title={item.title}\n >\n {item.title}\n </p>\n {item.ordered_variant.length > 0 && (\n <p className=\"text-muted-foreground text-sm\">\n {item.ordered_variant.map((v) => v.value).join(\" / \")}\n </p>\n )}\n {item.sku && (\n <p className=\"text-muted-foreground text-xs\">SKU: {item.sku}</p>\n )}\n {item.subscription && (\n <StatusBadge color=\"blue\" size=\"xs\" className=\"mt-1 self-start\">\n Subscription\n </StatusBadge>\n )}\n <p className=\"text-foreground text-sm font-medium\">\n {item.display_total}\n </p>\n {item.quantity > 1 && (\n <p className=\"text-muted-foreground text-xs\">\n {item.display_price} x {item.quantity}\n </p>\n )}\n </div>\n </div>\n );\n}\n\nfunction OrderItemsSection({ order }: { order: orders.Order }) {\n const visibleItems = order.items.filter(\n (item) => item.display_to_customer !== false,\n );\n const sym = order.currency_symbol || \"$\";\n\n return (\n <section className=\"bg-muted flex w-full flex-col items-center px-8 lg:col-span-4\">\n <div className=\"flex w-full max-w-lg flex-col\">\n {/* Items header */}\n <div className=\"mt-4\">\n <h2 className=\"text-foreground mb-2 text-lg font-medium\">\n Items ({visibleItems.length})\n </h2>\n <hr className=\"border-border\" />\n </div>\n\n {/* Item rows */}\n <div className=\"divide-border divide-y\">\n {visibleItems.map((item) => (\n <OrderItemRow key={item.id} item={item} />\n ))}\n </div>\n\n {/* Pricing summary */}\n <div className=\"border-border mb-4 border-t pt-4\">\n <div className=\"flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">Subtotal</p>\n <p className=\"text-muted-foreground font-medium\">\n {order.sub_total_in_currency}\n </p>\n </div>\n {Number(order.discount) > 0 && (\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">\n Discount\n {order.discount_codes?.length\n ? ` (${order.discount_codes.join(\", \")})`\n : \"\"}\n </p>\n <p className=\"text-muted-foreground font-medium\">\n -{order.discount_in_currency}\n </p>\n </div>\n )}\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">Shipping</p>\n <p className=\"text-muted-foreground font-medium\">\n {order.free_shipping ? \"Free\" : order.shipping_total_for_display}\n </p>\n </div>\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">\n Tax\n {order.price_inclusive_of_tax && order.price_inclusive_tax_name\n ? ` (${order.price_inclusive_tax_name}, included)`\n : \"\"}\n </p>\n <p className=\"text-muted-foreground font-medium\">\n {order.tax_in_currency}\n </p>\n </div>\n {order.points_applied_amount_in_currency != null &&\n order.points_applied_amount_in_currency > 0 && (\n <div className=\"mt-2 flex justify-between text-sm\">\n <p className=\"text-muted-foreground font-medium\">\n Points Applied\n </p>\n <p className=\"text-muted-foreground font-medium\">\n {`-${formatCurrency(sym, order.points_applied_amount_in_currency)}`}\n </p>\n </div>\n )}\n <div className=\"mt-4 flex items-center justify-between text-base font-medium\">\n <p className=\"text-muted-foreground text-sm font-medium\">Total</p>\n <p className=\"text-foreground text-base font-bold\">\n {order.total_in_currency}\n </p>\n </div>\n </div>\n </div>\n </section>\n );\n}\n\n/* ── Right column: order details ──────────────────────────────────── */\n\nfunction OrderDetailsSection({ order }: { order: orders.Order }) {\n const paymentDetails = order.payment_details;\n const cardDetails = paymentDetails?.details;\n\n return (\n <div className=\"bg-background px-8 pt-4 lg:col-span-4\">\n <div className=\"mx-auto max-w-lg lg:mx-0 lg:mr-auto\">\n {/* Order Status */}\n <div className=\"border-border mb-6 border-b pb-6\">\n <div className=\"flex flex-wrap items-center gap-3\">\n <div className=\"flex items-center gap-2\">\n <span className=\"text-muted-foreground text-sm\">Payment:</span>\n <OrderStatusBadge status={order.payment_status} />\n </div>\n <div className=\"flex items-center gap-2\">\n <span className=\"text-muted-foreground text-sm\">\n Fulfillment:\n </span>\n <OrderStatusBadge status={order.fulfillment_status} />\n </div>\n <div className=\"flex items-center gap-2\">\n <span className=\"text-muted-foreground text-sm\">Delivery:</span>\n <OrderStatusBadge status={order.delivery_status} />\n </div>\n </div>\n </div>\n\n {/* Order Info */}\n <div className=\"border-border mb-6 border-b pb-6\">\n <h3 className=\"text-foreground mb-3 text-sm/6 font-semibold\">\n Order Info\n </h3>\n <div className=\"divide-border flex divide-x\">\n <div className=\"flex-1 pr-4\">\n <div className=\"text-muted-foreground text-sm\">Order Number</div>\n <div className=\"text-foreground font-medium\">\n {order.order_number}\n </div>\n </div>\n <div className=\"flex-1 pl-4 text-right\">\n <div className=\"text-muted-foreground text-sm\">Date</div>\n <div className=\"text-foreground font-medium\">\n {new Date(order.created_at).toLocaleDateString(\"en-US\", {\n year: \"numeric\",\n month: \"short\",\n day: \"numeric\",\n })}\n </div>\n </div>\n </div>\n {order.email && (\n <div className=\"mt-3\">\n <div className=\"text-muted-foreground text-sm\">Email</div>\n <div className=\"text-foreground text-sm font-medium\">\n {order.email}\n </div>\n </div>\n )}\n </div>\n\n {/* Payment Method */}\n {paymentDetails && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Payment Method\n </div>\n <div className=\"text-foreground flex items-center gap-2 text-sm\">\n {cardDetails?.logo_url ? (\n <img\n src={cardDetails.logo_url}\n alt={cardDetails.card_type ?? \"Card\"}\n className=\"h-6 w-9 object-contain\"\n width={35}\n height={24}\n />\n ) : (\n <div className=\"bg-muted text-muted-foreground flex h-6 w-9 items-center justify-center rounded text-xs\">\n {(\n paymentDetails.payment_title ||\n paymentDetails.payment_type ||\n \"P\"\n ).charAt(0)}\n </div>\n )}\n <span className=\"font-medium\">\n {cardDetails?.card_type\n ? startCase(cardDetails.card_type)\n : paymentDetails.payment_title ||\n startCase(paymentDetails.payment_type)}\n {cardDetails?.last_four\n ? ` ending in ${cardDetails.last_four}`\n : \"\"}\n </span>\n </div>\n </div>\n )}\n\n {/* Shipping Address */}\n {order.ship_to && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Shipping Address\n </div>\n <div className=\"text-foreground flex items-start gap-2 text-sm\">\n <Truck className=\"text-muted-foreground mt-0.5 mr-1 h-4 w-4 shrink-0\" />\n <div className=\"flex flex-col\">\n {order.ship_to.name && (\n <span className=\"font-medium\">{order.ship_to.name}</span>\n )}\n {order.ship_to.address1 && (\n <span>{order.ship_to.address1}</span>\n )}\n {(order.ship_to.city ||\n order.ship_to.state ||\n order.ship_to.postal_code) && (\n <span>\n {[\n [order.ship_to.city, order.ship_to.state]\n .filter(Boolean)\n .join(\", \"),\n order.ship_to.postal_code,\n ]\n .filter(Boolean)\n .join(\" \")}\n </span>\n )}\n {order.ship_to.country_code && (\n <span>{order.ship_to.country_code}</span>\n )}\n </div>\n </div>\n </div>\n )}\n\n {/* Billing Address */}\n {order.bill_to && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Billing Address\n </div>\n <div className=\"text-foreground text-sm\">\n {order.bill_to.name && (\n <p className=\"font-medium\">{order.bill_to.name}</p>\n )}\n {order.bill_to.address1 && <p>{order.bill_to.address1}</p>}\n {(order.bill_to.city ||\n order.bill_to.state ||\n order.bill_to.postal_code) && (\n <p>\n {[\n [order.bill_to.city, order.bill_to.state]\n .filter(Boolean)\n .join(\", \"),\n order.bill_to.postal_code,\n ]\n .filter(Boolean)\n .join(\" \")}\n </p>\n )}\n {order.bill_to.country_code && (\n <p>{order.bill_to.country_code}</p>\n )}\n </div>\n </div>\n )}\n\n {/* Shipping Method */}\n {order.shipping_method && (\n <div className=\"border-border mb-6 border-b pb-4\">\n <div className=\"text-muted-foreground mb-1 text-sm\">\n Shipping Method\n </div>\n <div className=\"text-foreground text-sm font-medium\">\n {order.shipping_method.title}\n </div>\n {order.shipping_method.delivery_time_estimate && (\n <div className=\"text-muted-foreground mt-1 text-xs\">\n Est. {order.shipping_method.delivery_time_estimate}\n </div>\n )}\n </div>\n )}\n </div>\n </div>\n );\n}\n\n/* ── Main component ────────────────────────────────────────────────── */\n\nexport function OrderDetail({ token, onNotFound, onError }: OrderDetailProps) {\n const { data, isLoading, error } = useOrder(token);\n const order = data?.order;\n\n useEffect(() => {\n if (!isLoading && error) {\n onError?.(error as Error);\n }\n }, [isLoading, error, onError]);\n\n useEffect(() => {\n if (!isLoading && !error && !order) {\n onNotFound?.();\n }\n }, [isLoading, error, order, onNotFound]);\n\n if (isLoading) {\n return <OrderDetailSkeleton />;\n }\n\n if (!order) {\n return null;\n }\n\n return (\n <div className=\"flex flex-col lg:grid lg:grid-cols-8\">\n <OrderItemsSection order={order} />\n <OrderDetailsSection order={order} />\n </div>\n );\n}\n"],"mappings":"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"}
|
|
@@ -4179,11 +4179,11 @@ const MediaTab = ({ config, onSelectionChange, onMediaDataChange, selectedMediaI
|
|
|
4179
4179
|
className: "space-y-4",
|
|
4180
4180
|
children: [
|
|
4181
4181
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
|
|
4182
|
-
open: previewMedia
|
|
4182
|
+
open: !!previewMedia,
|
|
4183
4183
|
onOpenChange: (open) => !open && onPreviewMediaChange?.(null),
|
|
4184
4184
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogPortal, {
|
|
4185
4185
|
container: previewContainer ?? void 0,
|
|
4186
|
-
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogOverlay, { className: "z-9999 bg-black/70 backdrop-blur-none" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.
|
|
4186
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogOverlay, { className: "z-9999 bg-black/70 backdrop-blur-none" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogContent, {
|
|
4187
4187
|
className: "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 fixed top-1/2 left-1/2 z-10000 max-h-[85vh] w-full max-w-4xl -translate-x-1/2 -translate-y-1/2 overflow-hidden bg-white shadow-xl",
|
|
4188
4188
|
style: { zIndex: 1e4 },
|
|
4189
4189
|
children: previewMedia && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
@@ -6823,12 +6823,6 @@ function PlaylistCard({ title, imageUrl, href, itemCount, isFavorited = false, i
|
|
|
6823
6823
|
//#endregion
|
|
6824
6824
|
//#region ../../shareables/ui/src/components/playlists/SearchAndSortBar.tsx
|
|
6825
6825
|
const PLAYLIST_SORT_OPTIONS = [
|
|
6826
|
-
{
|
|
6827
|
-
id: "is_favorited",
|
|
6828
|
-
label: "Favorited",
|
|
6829
|
-
sortBy: "is_favorited",
|
|
6830
|
-
sortDirection: "desc"
|
|
6831
|
-
},
|
|
6832
6826
|
{
|
|
6833
6827
|
id: "title_asc",
|
|
6834
6828
|
label: "Name (A-Z)",
|
|
@@ -6852,24 +6846,6 @@ const PLAYLIST_SORT_OPTIONS = [
|
|
|
6852
6846
|
label: "Date Created (Oldest)",
|
|
6853
6847
|
sortBy: "created_at",
|
|
6854
6848
|
sortDirection: "asc"
|
|
6855
|
-
},
|
|
6856
|
-
{
|
|
6857
|
-
id: "updated_at_desc",
|
|
6858
|
-
label: "Date Modified (Recent)",
|
|
6859
|
-
sortBy: "updated_at",
|
|
6860
|
-
sortDirection: "desc"
|
|
6861
|
-
},
|
|
6862
|
-
{
|
|
6863
|
-
id: "updated_at_asc",
|
|
6864
|
-
label: "Date Modified (Oldest)",
|
|
6865
|
-
sortBy: "updated_at",
|
|
6866
|
-
sortDirection: "asc"
|
|
6867
|
-
},
|
|
6868
|
-
{
|
|
6869
|
-
id: "shares_count",
|
|
6870
|
-
label: "Most Shared",
|
|
6871
|
-
sortBy: "shares_count",
|
|
6872
|
-
sortDirection: "desc"
|
|
6873
6849
|
}
|
|
6874
6850
|
];
|
|
6875
6851
|
function SearchAndSortBar({ searchTerm, onSearchTermChange, currentSort, onSortChange, placeholder = "Search playlists...", sortOptions = PLAYLIST_SORT_OPTIONS }) {
|
|
@@ -6969,7 +6945,7 @@ function PlaylistsListingScreen(_props) {
|
|
|
6969
6945
|
}) })
|
|
6970
6946
|
}) }), []));
|
|
6971
6947
|
const [searchTerm, setSearchTerm] = (0, react.useState)("");
|
|
6972
|
-
const [currentSort, setCurrentSort] = (0, react.useState)(PLAYLIST_SORT_OPTIONS[
|
|
6948
|
+
const [currentSort, setCurrentSort] = (0, react.useState)(PLAYLIST_SORT_OPTIONS[0]);
|
|
6973
6949
|
const [selectedIds, setSelectedIds] = (0, react.useState)(/* @__PURE__ */ new Set());
|
|
6974
6950
|
const debouncedSearch = useDebounce(searchTerm, 300);
|
|
6975
6951
|
const observerTarget = (0, react.useRef)(null);
|
|
@@ -7193,6 +7169,13 @@ function PlaylistsListingScreen(_props) {
|
|
|
7193
7169
|
})] });
|
|
7194
7170
|
}
|
|
7195
7171
|
//#endregion
|
|
7172
|
+
//#region ../../shareables/ui/src/constants.ts
|
|
7173
|
+
const NAVIGABLE_RELATEABLE_TYPES = new Set([
|
|
7174
|
+
"Product",
|
|
7175
|
+
"Page",
|
|
7176
|
+
"Medium"
|
|
7177
|
+
]);
|
|
7178
|
+
//#endregion
|
|
7196
7179
|
//#region ../../shareables/ui/src/components/SharePage/TaggedProductsList.tsx
|
|
7197
7180
|
const DEFAULT_IMAGE$3 = "https://assets.fluid.app/fluid-admin/images/we-commerce/we-commerce.png";
|
|
7198
7181
|
function resolvePrice(product) {
|
|
@@ -7203,9 +7186,9 @@ function resolvePrice(product) {
|
|
|
7203
7186
|
else if (firstVariant?.price) price = firstVariant.price;
|
|
7204
7187
|
}
|
|
7205
7188
|
if (!price) return null;
|
|
7189
|
+
const numPrice = parseFloat(price.replace(/[^0-9.-]/g, ""));
|
|
7190
|
+
if (Number.isNaN(numPrice) || numPrice <= 0) return null;
|
|
7206
7191
|
if (price.includes("$")) return price;
|
|
7207
|
-
const numPrice = parseFloat(price);
|
|
7208
|
-
if (Number.isNaN(numPrice)) return price;
|
|
7209
7192
|
return `$${numPrice.toFixed(2)}`;
|
|
7210
7193
|
}
|
|
7211
7194
|
function TaggedProductsList({ products, onProductClick }) {
|
|
@@ -7299,6 +7282,7 @@ function TaggedProductsList({ products, onProductClick }) {
|
|
|
7299
7282
|
const DEFAULT_IMAGE$2 = "https://assets.fluid.app/fluid-admin/images/we-commerce/we-commerce.png";
|
|
7300
7283
|
function getItemType(type, kind) {
|
|
7301
7284
|
if (type === "Product") return "Product";
|
|
7285
|
+
if (type === "EnrollmentPack") return "Enrollment";
|
|
7302
7286
|
if (type === "Page") return "Page";
|
|
7303
7287
|
if (kind === "video") return "Video";
|
|
7304
7288
|
if (kind === "image") return "Image";
|
|
@@ -7355,11 +7339,13 @@ function PlaylistItemsList({ items, onSelectItem, selectedItemIndex = 0, onNavig
|
|
|
7355
7339
|
const relateable = item.relateable;
|
|
7356
7340
|
const imageUrl = relateable?.image_url || relateable?.compressed_image_url || DEFAULT_IMAGE$2;
|
|
7357
7341
|
const title = relateable?.title || "Untitled";
|
|
7358
|
-
const
|
|
7342
|
+
const rawPrice = relateable?.display_price || relateable?.price;
|
|
7343
|
+
const price = rawPrice && parseFloat(rawPrice.replace(/[^0-9.-]/g, "")) > 0 ? rawPrice : null;
|
|
7359
7344
|
const itemType = getItemType(item.relateable_type, relateable?.kind);
|
|
7360
7345
|
const isVideo = relateable?.kind === "video";
|
|
7361
7346
|
const isImage = relateable?.kind === "image";
|
|
7362
7347
|
const isProduct = item.relateable_type === "Product";
|
|
7348
|
+
const isNavigable = NAVIGABLE_RELATEABLE_TYPES.has(item.relateable_type ?? "");
|
|
7363
7349
|
const videoLength = formatVideoLength(relateable?.duration);
|
|
7364
7350
|
const fileType = getFileType(relateable?.media_format, relateable?.image_url);
|
|
7365
7351
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
@@ -7382,13 +7368,19 @@ function PlaylistItemsList({ items, onSelectItem, selectedItemIndex = 0, onNavig
|
|
|
7382
7368
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
7383
7369
|
className: "flex min-w-0 flex-1 flex-col gap-1 py-1",
|
|
7384
7370
|
children: [
|
|
7385
|
-
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
|
|
7371
|
+
isNavigable ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
|
|
7386
7372
|
onClick: (e) => handleNavigateToItem(relateable?.id ?? item.id, item.relateable_type, e),
|
|
7387
7373
|
className: "group text-foreground flex items-start gap-1.5 text-left text-[15px] leading-[1.4] font-semibold hover:underline",
|
|
7388
7374
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
7389
7375
|
className: "line-clamp-2",
|
|
7390
7376
|
children: title
|
|
7391
7377
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowUpRight, { className: "text-foreground mt-0.5 h-3 w-3 shrink-0 opacity-0 transition-opacity group-hover:opacity-100" })]
|
|
7378
|
+
}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
7379
|
+
className: "text-foreground text-[15px] leading-[1.4] font-semibold",
|
|
7380
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
7381
|
+
className: "line-clamp-2",
|
|
7382
|
+
children: title
|
|
7383
|
+
})
|
|
7392
7384
|
}),
|
|
7393
7385
|
isProduct && price && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
7394
7386
|
className: "text-foreground text-[15px] leading-[1.4] font-normal",
|
|
@@ -7594,9 +7586,10 @@ function PlaylistDetailScreen({ playlistId, onNavigate }) {
|
|
|
7594
7586
|
onSelectItem: setSelectedPlaylistItemIndex,
|
|
7595
7587
|
selectedItemIndex: selectedPlaylistItemIndex,
|
|
7596
7588
|
onNavigateToItem: (itemId, relateableType) => {
|
|
7589
|
+
if (!NAVIGABLE_RELATEABLE_TYPES.has(relateableType ?? "")) return;
|
|
7597
7590
|
if (relateableType === "Product") onNavigate?.("product", String(itemId));
|
|
7598
7591
|
else if (relateableType === "Page") onNavigate?.("page", String(itemId));
|
|
7599
|
-
else onNavigate?.("media", String(itemId));
|
|
7592
|
+
else if (relateableType === "Medium") onNavigate?.("media", String(itemId));
|
|
7600
7593
|
}
|
|
7601
7594
|
})]
|
|
7602
7595
|
})
|
|
@@ -8296,6 +8289,8 @@ function computeOrderedItems(items) {
|
|
|
8296
8289
|
}
|
|
8297
8290
|
function PlaylistItemsSection({ playlistId }) {
|
|
8298
8291
|
const { showToast, filePickerClient } = useShareablesUI();
|
|
8292
|
+
const shareablesApiClient = useShareablesClient();
|
|
8293
|
+
const repContext = useRepContext();
|
|
8299
8294
|
const [filePickerOpen, setFilePickerOpen] = (0, react.useState)(false);
|
|
8300
8295
|
const { items: contextItems, updateItems, addItem, removeItem } = usePlaylistItems();
|
|
8301
8296
|
const tableItems = contextItems;
|
|
@@ -8413,9 +8408,15 @@ function PlaylistItemsSection({ playlistId }) {
|
|
|
8413
8408
|
}),
|
|
8414
8409
|
loading: () => "",
|
|
8415
8410
|
dismiss: () => {}
|
|
8416
|
-
}
|
|
8411
|
+
},
|
|
8412
|
+
shareablesClient: { media: { list: (filters) => require_src$1.getMedia(shareablesApiClient, filters ?? {}, repContext) } }
|
|
8417
8413
|
};
|
|
8418
|
-
}, [
|
|
8414
|
+
}, [
|
|
8415
|
+
filePickerClient,
|
|
8416
|
+
showToast,
|
|
8417
|
+
shareablesApiClient,
|
|
8418
|
+
repContext
|
|
8419
|
+
]);
|
|
8419
8420
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
8420
8421
|
className: "border-border bg-card rounded-lg border p-4",
|
|
8421
8422
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
@@ -9027,4 +9028,4 @@ Object.defineProperty(exports, "ShareablesUIProvider", {
|
|
|
9027
9028
|
}
|
|
9028
9029
|
});
|
|
9029
9030
|
|
|
9030
|
-
//# sourceMappingURL=src-
|
|
9031
|
+
//# sourceMappingURL=src-fXyI4AWk.cjs.map
|