@commercelayer/react-components/lib/cjs/components/orders/OrderList.js

The Official Commerce Layer React Components

"use client";
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.OrderList=OrderList;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),OrderListChildrenContext_1=tslib_1.__importDefault(require("../../context/OrderListChildrenContext")),OrderListPaginationContext_1=tslib_1.__importDefault(require("../../context/OrderListPaginationContext")),react_table_1=require("@tanstack/react-table"),icons_1=require("../../utils/icons"),filterChildren_1=tslib_1.__importDefault(require("../../utils/filterChildren")),rowComponents=["OrderListRow","OrderListEmpty"],paginationComponents=["OrderListPaginationInfo","OrderListPaginationButtons"];function OrderList(_a){var _b,_c,_d,_e,_f,{id,type="orders",children,columns,loadingElement,showActions=!1,showPagination=!1,sortBy=[{id:"number",desc:!0}],pageSize=10,paginationContainerClassName,actionsComponent,actionsContainerClassName,theadClassName,rowTrClassName}=_a,p=tslib_1.__rest(_a,["id","type","children","columns","loadingElement","showActions","showPagination","sortBy","pageSize","paginationContainerClassName","actionsComponent","actionsContainerClassName","theadClassName","rowTrClassName"]);const[loading,setLoading]=(0,react_1.useState)(!0),[sorting,setSorting]=(0,react_1.useState)(sortBy),[{pageIndex,pageSize:currentPageSize},setPagination]=(0,react_1.useState)({pageIndex:0,pageSize}),{orders,subscriptions,getCustomerOrders,getCustomerSubscriptions}=(0,react_1.useContext)(CustomerContext_1.default);(0,react_1.useEffect)(()=>{type==="orders"&&getCustomerOrders!=null&&getCustomerOrders({pageNumber:pageIndex+1,pageSize:currentPageSize}),type==="subscriptions"&&getCustomerSubscriptions!=null&&getCustomerSubscriptions({pageNumber:pageIndex+1,pageSize:currentPageSize,id})},[pageIndex,currentPageSize,id!=null]);const data=(0,react_1.useMemo)(()=>{var _a2;return type==="orders"?orders??[]:id==null?subscriptions??[]:((_a2=subscriptions?.[0])===null||_a2===void 0?void 0:_a2.type)==="orders"?subscriptions:[]},[orders,subscriptions]),cols=(0,react_1.useMemo)(()=>columns,[columns]),pagination=(0,react_1.useMemo)(()=>({pageIndex,pageSize:currentPageSize}),[pageIndex,currentPageSize]),pageCount=(_c=(_b=orders?.pageCount)!==null&&_b!==void 0?_b:subscriptions?.pageCount)!==null&&_c!==void 0?_c:-1,table=(0,react_table_1.useReactTable)({data,columns:cols,getSortedRowModel:(0,react_table_1.getSortedRowModel)(),getCoreRowModel:(0,react_table_1.getCoreRowModel)(),getPaginationRowModel:(0,react_table_1.getPaginationRowModel)(),manualPagination:!0,pageCount,state:{sorting,pagination},onSortingChange:setSorting,onPaginationChange:setPagination}),TableHtmlElement="table",TheadHtmlElement="thead",TbodyHtmlElement="tbody",ThHtmlElement="th",TrHtmlElement="tr";(0,react_1.useEffect)(()=>(type==="orders"&&orders!=null&&setLoading(!1),type==="subscriptions"&&subscriptions!=null&&setLoading(!1),()=>{setLoading(!0)}),[orders,subscriptions]);const LoadingComponent=loadingElement||(0,jsx_runtime_1.jsx)("div",{children:"Loading..."}),headerComponent=table.getHeaderGroups().map(headerGroup=>{const columnsComponents=headerGroup.headers.map((header,k)=>{var _a2,_b2,_c2,_d2;const sortLabel=header.column.getIsSorted()!==!1?header.column.getIsSorted():"";return(0,jsx_runtime_1.jsx)(ThHtmlElement,{"data-testid":`thead-${k}`,"data-sort":`${sortLabel||""}`,className:(_a2=columns[k])===null||_a2===void 0?void 0:_a2.className,children:(0,jsx_runtime_1.jsxs)("span",{className:`${(_c2=(_b2=columns[k])===null||_b2===void 0?void 0:_b2.titleClassName)!==null&&_c2!==void 0?_c2:""} ${header.column.getCanSort()?"cursor-pointer select-none":""}`,onClick:header.column.getToggleSortingHandler(),children:[(0,react_table_1.flexRender)(header.column.columnDef.header,header.getContext()),(_d2={asc:icons_1.sortAscIcon,desc:icons_1.sortDescIcon}[header.column.getIsSorted()])!==null&&_d2!==void 0?_d2:null]})},header.id)});return(0,jsx_runtime_1.jsx)(TrHtmlElement,{children:columnsComponents},headerGroup.id)}),rowsComponents=(0,filterChildren_1.default)({children,filterBy:rowComponents,componentName:"OrderList"}),components=table.getRowModel().rows.map(row=>{const childProps={type,orders:type==="orders"?orders:subscriptions,order:row.original,row,showActions,actionsComponent,actionsContainerClassName};return(0,jsx_runtime_1.jsx)(TrHtmlElement,{className:rowTrClassName,children:(0,jsx_runtime_1.jsx)(OrderListChildrenContext_1.default.Provider,{value:childProps,children:rowsComponents})},row.id)}),pagComponents=(0,filterChildren_1.default)({children,filterBy:paginationComponents,componentName:"OrderList"}),totalRows=type==="orders"?(_d=orders?.meta.recordCount)!==null&&_d!==void 0?_d:0:(_e=subscriptions?.meta.recordCount)!==null&&_e!==void 0?_e:0,Pagination=()=>showPagination?(0,jsx_runtime_1.jsx)(OrderListPaginationContext_1.default.Provider,{value:{canNextPage:table.getCanNextPage(),canPreviousPage:table.getCanPreviousPage(),gotoPage:table.setPageIndex,nextPage:table.nextPage,pageCount:table.getPageCount(),pageIndex:table.getState().pagination.pageIndex,pageOptions:table.getPageOptions(),pageSize:table.getState().pagination.pageSize,previousPage:table.previousPage,setPageSize:table.setPageSize,totalRows},children:pagComponents}):null;return loading&&(orders==null||subscriptions==null)?(0,jsx_runtime_1.jsx)(jsx_runtime_1.Fragment,{children:LoadingComponent}):((_f=type==="orders"?orders:subscriptions)===null||_f===void 0?void 0:_f.length)===0?(0,jsx_runtime_1.jsxs)(OrderListChildrenContext_1.default.Provider,{value:{orders:type==="orders"?orders:subscriptions},children:[rowsComponents,(0,jsx_runtime_1.jsx)(Pagination,{})]}):(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)(TableHtmlElement,Object.assign({},p,{children:[(0,jsx_runtime_1.jsx)(TheadHtmlElement,{className:theadClassName,children:headerComponent}),(0,jsx_runtime_1.jsx)(TbodyHtmlElement,{children:components})]})),totalRows<=pageSize?null:(0,jsx_runtime_1.jsx)("div",{className:paginationContainerClassName,children:(0,jsx_runtime_1.jsx)(Pagination,{})})]})}exports.default=OrderList;