UNPKG

@clerk/clerk-js

Version:
1 lines • 6.95 kB
"use strict";(globalThis.webpackChunk_clerk_clerk_js=globalThis.webpackChunk_clerk_clerk_js||[]).push([["711"],{8317:function(e,t,r){r.r(t),r.d(t,{OrganizationPaymentAttemptPage:()=>n});var a=r(9109),o=r(1576),i=r(2264);let n=()=>(0,a.tZ)(o.SubscriberTypeContext.Provider,{value:"organization",children:(0,a.tZ)(i.PaymentAttemptPage,{})})},2264:function(e,t,r){r.r(t),r.d(t,{PaymentAttemptPage:()=>B,PaymentAttemptsList:()=>d});var a=r(9109),o=r(6600),i=r(9082),n=r(5913),l=r(1576),c=r(4204),s=r(4676);let d=()=>{let{data:e,isLoading:t,count:r}=(0,l.usePaymentAttempts)(),i=(0,l.useSubscriberTypeLocalizationRoot)();return(0,a.tZ)(o.wQ,{page:1,onPageChange:e=>{},itemCount:r,pageCount:1,itemsPerPage:10,isLoading:t,emptyStateLocalizationKey:(0,c.localizationKeys)(`${i}.billingPage.paymentHistorySection.empty`),headers:[(0,c.localizationKeys)(`${i}.billingPage.paymentHistorySection.tableHeader__date`),(0,c.localizationKeys)(`${i}.billingPage.paymentHistorySection.tableHeader__amount`),(0,c.localizationKeys)(`${i}.billingPage.paymentHistorySection.tableHeader__status`)],rows:e.map(e=>(0,a.tZ)(p,{paymentAttempt:e},e.id))})},p=({paymentAttempt:e})=>{let{id:t,amount:r,failedAt:l,paidAt:d,updatedAt:p,status:m}=e,{navigate:y}=(0,s.useRouter)();return(0,a.BX)(o.Uk,{onClick:()=>{y(`payment-attempt/${t}`)},children:[(0,a.BX)(c.Td,{sx:{cursor:"pointer"},children:[(0,a.tZ)(c.Text,{variant:"subtitle",children:(0,i.p)(d||l||p,"long")}),(0,a.tZ)(c.Text,{colorScheme:"secondary",variant:"caption",truncate:!0,sx:e=>({marginTop:e.space.$0x5}),children:(0,n.L)(t)})]}),(0,a.tZ)(c.Td,{sx:{cursor:"pointer"},children:(0,a.BX)(c.Text,{children:[r.currencySymbol,r.amountFormatted]})}),(0,a.tZ)(c.Td,{children:(0,a.tZ)(c.Badge,{colorScheme:"paid"===m?"success":"failed"===m?"danger":"primary",sx:{textTransform:"capitalize"},children:m})})]})};var m=r(3799),y=r(7901),u=r(9117),h=r(2654),g=r(8e3),b=r(8018),x=r(2464),$=r(4174);let B=()=>{let{params:e,navigate:t}=(0,s.useRouter)(),r=(0,b.sC)(),{organization:o}=(0,m.o8)(),l=(0,b.xr)(),{t:d,translateError:p}=(0,c.useLocalizations)(),x=(0,m.cL)(),{data:$,isLoading:B,error:A}=(0,y.default)(e.paymentAttemptId?{type:"payment-attempt",id:e.paymentAttemptId,orgId:"organization"===r?o?.id:void 0}:null,()=>x.billing.getPaymentAttempt({id:e.paymentAttemptId,orgId:"organization"===r?o?.id:void 0})),Z=$?.subscriptionItem;return B?(0,a.tZ)(c.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",height:"100%"},children:(0,a.tZ)(c.Spinner,{colorScheme:"primary",sx:{margin:"auto",display:"block"},elementDescriptor:c.descriptors.spinner})}):(0,a.BX)(a.HY,{children:[(0,a.tZ)(h.h.Root,{sx:e=>({borderBlockEndWidth:e.borderWidths.$normal,borderBlockEndStyle:e.borderStyles.$solid,borderBlockEndColor:e.colors.$borderAlpha100,marginBlockEnd:e.space.$4,paddingBlockEnd:e.space.$4}),children:(0,a.tZ)(h.h.BackLink,{onClick:()=>void t("../../",{searchParams:new URLSearchParams("tab=payments")}),children:(0,a.tZ)(h.h.Title,{localizationKey:(0,c.localizationKeys)(`${l}.billingPage.start.headerTitle__payments`),textVariant:"h2"})})}),$?(0,a.BX)(c.Box,{elementDescriptor:c.descriptors.paymentAttemptRoot,as:"article",sx:e=>({borderWidth:e.borderWidths.$normal,borderStyle:e.borderStyles.$solid,borderColor:e.colors.$borderAlpha100,borderRadius:e.radii.$lg,overflow:"clip"}),children:[(0,a.BX)(c.Box,{elementDescriptor:c.descriptors.paymentAttemptHeader,as:"header",sx:e=>({padding:e.space.$4,background:e.colors.$neutralAlpha25,display:"flex",justifyContent:"space-between",alignItems:"flex-start"}),children:[(0,a.BX)(c.Span,{elementDescriptor:c.descriptors.paymentAttemptHeaderTitleContainer,children:[(0,a.tZ)(c.Heading,{elementDescriptor:c.descriptors.paymentAttemptHeaderTitle,textVariant:"h2",localizationKey:(0,i.p)($.paidAt||$.failedAt||$.updatedAt,"long")}),(0,a.BX)(c.Span,{sx:e=>({display:"flex",alignItems:"center",gap:e.space.$0x25,color:e.colors.$colorMutedForeground}),children:[(0,a.tZ)(S,{copyLabel:"Copy payment attempt ID",text:$.id}),(0,a.tZ)(c.Text,{colorScheme:"secondary",variant:"subtitle",children:(0,n.L)($.id)})]})]}),(0,a.tZ)(c.Badge,{elementDescriptor:c.descriptors.paymentAttemptHeaderBadge,colorScheme:"paid"===$.status?"success":"failed"===$.status?"danger":"primary",sx:{textTransform:"capitalize"},children:$.status})]}),(0,a.tZ)(c.Box,{elementDescriptor:c.descriptors.paymentAttemptBody,sx:e=>({padding:e.space.$4}),children:Z&&(0,a.BX)(g.a.Root,{children:[(0,a.BX)(g.a.Group,{children:[(0,a.tZ)(g.a.Title,{title:Z.plan.name}),(0,a.tZ)(g.a.Description,{prefix:"annual"===Z.planPeriod?"x12":void 0,text:`${Z.plan.currencySymbol}${"month"===Z.planPeriod?Z.plan.amountFormatted:Z.plan.annualMonthlyAmountFormatted}`})]}),(0,a.BX)(g.a.Group,{borderTop:!0,variant:"tertiary",children:[(0,a.tZ)(g.a.Title,{title:(0,c.localizationKeys)("commerce.subtotal")}),(0,a.tZ)(g.a.Description,{text:`${Z.amount?.currencySymbol}${Z.amount?.amountFormatted}`})]}),Z.credit&&Z.credit.amount.amount>0&&(0,a.BX)(g.a.Group,{variant:"tertiary",children:[(0,a.tZ)(g.a.Title,{title:(0,c.localizationKeys)("commerce.credit")}),(0,a.tZ)(g.a.Description,{text:`- ${Z.credit.amount.currencySymbol}${Z.credit.amount.amountFormatted}`})]})]})}),(0,a.BX)(c.Box,{elementDescriptor:c.descriptors.paymentAttemptFooter,as:"footer",sx:e=>({paddingInline:e.space.$4,paddingBlock:e.space.$3,background:e.colors.$neutralAlpha25,borderBlockStartWidth:e.borderWidths.$normal,borderBlockStartStyle:e.borderStyles.$solid,borderBlockStartColor:e.colors.$borderAlpha100,display:"flex",justifyContent:"space-between"}),children:[(0,a.tZ)(c.Text,{variant:"h3",localizationKey:(0,c.localizationKeys)("commerce.totalDue"),elementDescriptor:c.descriptors.paymentAttemptFooterLabel}),(0,a.BX)(c.Span,{elementDescriptor:c.descriptors.paymentAttemptFooterValueContainer,sx:e=>({display:"flex",alignItems:"center",gap:e.space.$2x5}),children:[(0,a.tZ)(c.Text,{variant:"caption",colorScheme:"secondary",elementDescriptor:c.descriptors.paymentAttemptFooterCurrency,sx:{textTransform:"uppercase"},children:$.amount.currency}),(0,a.BX)(c.Text,{variant:"h3",elementDescriptor:c.descriptors.paymentAttemptFooterValue,children:[$.amount.currencySymbol,$.amount.amountFormatted]})]})]})]}):(0,a.tZ)(c.Box,{sx:{display:"flex",justifyContent:"center",alignItems:"center",height:"100%"},children:(0,a.tZ)(u.b,{variant:"danger",colorScheme:"danger",children:A?p(A.errors[0]):d((0,c.localizationKeys)(`${l}.billingPage.paymentHistorySection.notFound`))})})]})};function S({text:e,copyLabel:t="Copy"}){let{onCopy:r,hasCopied:o}=(0,x.VP)(e);return(0,a.tZ)(c.Button,{elementDescriptor:c.descriptors.paymentAttemptCopyButton,variant:"unstyled",onClick:r,sx:e=>({color:"inherit",width:e.sizes.$4,height:e.sizes.$4,padding:0,borderRadius:e.radii.$sm,"&:focus-visible":{outline:"2px solid",outlineColor:e.colors.$colorRing}}),focusRing:!1,"aria-label":o?"Copied":t,children:(0,a.tZ)(c.Icon,{size:"sm",icon:o?$.Jr:$.CK,"aria-hidden":!0})})}}}]);