https://www.epicweb.dev/_next/static/chunks/5240-c907a9113ebb3123.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5240],{75240:(e,s,t)=>{t.d(s,{Ay:()=>B,KY:()=>M,V6:()=>H});var a=t(91238),l=t(49062),r=t(48979),n=t(9236),i=t.n(n),d=t(29712);t(36218);var c=t(79634),o=t(47315),u=t.n(o),p=t(3389),m=t(4162),h=t(88866),x=t(22060),g=t(61613),f=t(33248),b=t.n(f),j=t(2841),y=t(11230),v=t.n(y),w=t(19982),N=t(31833),_=t(88515),k=t(19181),I=t(72051),C=t(2099),P=t(95178),A=t(7618),D=t(20710),S=t(7611),F=t(15606),T=t(45734),R=t(7539),W=t(42880),q=t(5545),E=t(79499),L=t(64351);let B=e=>{var s,t,n;let{purchases:c=[],product:o,existingPurchase:h,userId:f}=e,b=(0,T.useRouter)(),{data:y,status:v}=(0,m.useSession)(),C=!!b.query.upgrade,A=C||!!b.query.welcome,D=c.filter(e=>e.productId===o.productId&&["Valid","Restricted"].includes(e.status)),F=D[0],[q,E]=l.useState(F.bulkCoupon?h:F),{data:L,refetch:B}=d.i.purchaseUserTransfer.forPurchaseId.useQuery({id:F.id}),U=!F.bulkCoupon&&!!(null==L?void 0:L.filter(e=>["AVAILABLE","INITIATED","COMPLETED"].includes(e.transferState)).length),{merchantCoupon:Y}=(0,P.tb)(),{data:$,status:z}=d.i.pricing.formatted.useQuery({productId:o.productId,quantity:1,merchantCoupon:Y||void 0}),{data:Q}=d.i.purchases.getPurchaseById.useQuery({purchaseId:null==$?void 0:$.upgradeFromPurchaseId}),K=(null==Q?void 0:Q.status)==="Restricted",{scrollY:X}=(0,_.L)(),Z=(0,k.G)(X,[0,600],["0deg","-3deg"]),ee=(null==o||null==(s=o.welcomeVideo)?void 0:s.muxPlaybackId)||"uAWjlKTFcFwHpqUzpwbBehoa00aS3iIO77Wm2g9hJb4A",es=(null==o||null==(t=o.welcomeVideo)?void 0:t.poster)||"https://res.cloudinary.com/epic-web/image/upload/v1697358228/after-purchase-video-poster.jpg",et=["react-fundamentals","react-hooks","advanced-react-apis","react-suspense","advanced-react-patterns","react-performance","react-server-components","epic-react-v1-classic","react-interviews-with-experts"],ea=["testing-javascript-classic"];return(0,a.jsxs)(r.A,{meta:{title:o.title},children:[A?(0,a.jsxs)(I.P.div,{style:{transformOrigin:"top center",transformPerspective:300,rotateX:Z},className:"relative mx-auto mt-8 flex w-full max-w-screen-lg flex-col items-center px-5",children:[(0,a.jsxs)("section",{className:"relative flex w-full flex-col-reverse overflow-hidden rounded-md border border-white/5 bg-gradient-to-tr from-primary to-indigo-500 text-primary-foreground selection:bg-gray-900 md:grid md:grid-cols-8",children:[(0,a.jsxs)("div",{className:"col-span-4 flex flex-col justify-between p-5 pt-8 sm:p-8 md:pt-8",children:[(0,a.jsxs)("div",{className:"space-y-3",children:[(0,a.jsxs)("p",{className:"text-xl font-semibold",children:["Hey ",(null==y||null==(n=y.user)?void 0:n.name)||"there"," ",(0,a.jsx)("span",{role:"img","aria-label":"waving hand",children:"\uD83D\uDC4B"})]}),C?(0,a.jsx)(w.A,{children:(0,a.jsxs)("p",{children:["You've succesfully upgraded ",F.product.name,"! Below, you'll find everything you need to manage your purchase and access related information. If you have any questions or need assistance at any point, please don't hesitate to"," ",(0,a.jsx)(u(),{className:"text-white underline",href:"/contact",children:"contact us"}),"."]})}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("p",{children:(0,a.jsxs)(w.A,{children:["Welcome to ","Epic Web Dev","! We're thrilled to have you here. Below, you'll find everything you need to manage your purchase and access related information. If you have any questions or need assistance at any point, please don't hesitate to"," ",(0,a.jsx)(u(),{className:"text-white underline",href:"/contact",children:"contact us"}),"."]})}),(0,a.jsx)("p",{children:(0,a.jsxs)(w.A,{children:["Ready to dive in? Our"," ",(0,a.jsx)(u(),{href:"/get-started",className:"text-white underline",target:"_blank",children:"Getting Started guide"})," ","will help you get started smoothly."]})})]})]}),(0,a.jsxs)("div",{className:"mt-10 flex items-center space-x-2",children:[(0,a.jsx)(S.$n,{size:"sm",className:"bg-white font-medium text-gray-900 shadow-soft-md hover:bg-gray-200",asChild:!0,children:(0,a.jsx)(u(),{href:"/get-started",target:"_blank",children:"Get Started"})}),(0,a.jsx)(S.$n,{size:"sm",className:"bg-gray-900 font-medium text-white shadow-soft-md hover:bg-gray-800",asChild:!0,children:(0,a.jsxs)(u(),{href:"https://kcd.im/discord",target:"_blank",children:[(0,a.jsx)(R.upD,{className:"mr-1 h-4 w-4"}),"Join Discord"]})})]})]}),(0,a.jsx)("div",{className:"col-span-4 flex w-full items-center justify-center p-5 sm:p-8 md:pl-0",children:(0,a.jsx)(W.Ay,{playbackId:ee,className:"w-full rounded shadow-xl",accentColor:"#3b82f6",poster:es,metadata:{video_title:"".concat(o.title," - Welcome Video")}})})]}),(0,a.jsx)("div",{className:"h-1 w-[99%] rounded-b-md bg-primary brightness-125 dark:brightness-75","aria-hidden":!0}),(0,a.jsx)("div",{className:"h-1 w-[98%] rounded-b-md bg-primary brightness-150 dark:brightness-50","aria-hidden":!0})]}):null,(0,a.jsxs)("main",{"data-product-page":"",className:"mx-auto flex w-full max-w-screen-lg flex-col gap-10 lg:flex-row",children:[(0,a.jsxs)("article",{className:"w-full max-w-4xl px-5 pb-0 pt-16 sm:pb-16",children:[A?null:(0,a.jsxs)(u(),{href:"/products",className:"group mb-10 inline-flex gap-1 text-sm opacity-75 transition hover:opacity-100",children:[(0,a.jsx)("span",{className:"transition group-hover:-translate-x-1",children:"←"})," ",(0,a.jsx)("span",{children:"All Products"})]}),(0,a.jsxs)("header",{className:"",children:[(0,a.jsx)(H,{children:(()=>{switch(!0){case K:return"Purchased: Regional License";case!!F.bulkCoupon:return"Purchased: Team License"}})()}),(0,a.jsx)("h1",{className:"font-text pt-5 text-3xl font-semibold sm:text-4xl",children:(0,a.jsx)(w.A,{children:o.title})})]}),(0,a.jsxs)("div",{className:"",children:[F.bulkCoupon&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(G,{children:"Invite your team"}),(0,a.jsx)(p.A,{className:"[&_[data-redeem]>[data-sr-button]]:bg-primary [&_[data-redeem]>[data-sr-button]]:text-base [&_[data-redeem]>[data-sr-button]]:!text-primary-foreground [&_[data-redeem]]:flex [&_[data-redeem]]:w-full [&_[data-redeem]]:!justify-end [&_[data-sr-button]]:border-none  [&_[data-sr-button]]:bg-secondary [&_[data-sr-button]]:text-sm [&_[data-sr-button]]:font-medium [&_[data-sr-button]]:!text-foreground dark:[&_[data-sr-button]]:!text-white [&_input]:!border-border [&_input]:!bg-input [&_input]:selection:!text-white dark:[&_input]:!bg-input",session:y,purchase:D[0],existingPurchase:h,setPersonalPurchase:E}),(0,a.jsx)(G,{children:"Team members"}),(0,a.jsx)(g.Z,{session:y,purchase:F,existingPurchase:h,setPersonalPurchase:E})]}),(0,a.jsx)(M,{purchase:F}),U&&L&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(G,{children:"Purchase Transfer"}),(0,a.jsx)(j.m,{className:"[&_h2]:hidden",purchaseUserTransfers:L,refetch:B})]}),(0,a.jsx)(G,{children:"Invoices"}),(0,a.jsx)("div",{className:"overflow-x-auto scrollbar-thin",children:(0,a.jsx)(O,{purchasesForCurrentProduct:D})}),K?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(G,{className:"pt-10",children:"Regional License"}),(0,a.jsx)(V,{purchaseToUpgrade:Q,formattedPrice:$,formattedPriceStatus:z,product:o,purchase:F,userId:F.userId})]}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(G,{children:"Buy more seats"}),(0,a.jsx)("p",{className:"pb-5",children:"Want to get the rest of your team onboard and learning? You can always buy more seats and receive a cumulative discount."}),(0,a.jsx)(x.A,{className:"flex [&>fieldset]:flex-col [&>fieldset]:sm:flex-row [&_[data-full-price]]:line-through [&_[data-percent-off]]:text-primary dark:[&_[data-percent-off]]:text-blue-300 [&_[data-price-container]]:!flex [&_[data-price-container]]:!w-full [&_[data-price-discounted]]:flex [&_[data-price-discounted]]:items-center [&_[data-price-discounted]]:gap-2 [&_[data-price-discounted]]:pl-3 [&_[data-price-discounted]]:text-base [&_[data-price-discounted]]:font-medium [&_[data-price]]:flex [&_[data-price]]:text-2xl [&_[data-price]]:font-bold [&_[data-pricing-product-header]]:w-full [&_[data-pricing-product]]:w-full [&_button]:!bg-primary [&_button]:!px-4 [&_button]:!py-1.5 [&_button]:!font-medium [&_button]:!text-primary-foreground [&_input]:text-sm [&_sup]:top-2.5 [&_sup]:pr-1 [&_sup]:opacity-75",productId:F.productId,userId:f})]})]})]}),(0,a.jsxs)("aside",{className:"flex flex-shrink-0 flex-col items-center py-10 pr-5 md:mb-0 lg:min-h-screen lg:w-4/12 lg:items-end",children:[o.image&&(0,a.jsx)(i(),{className:"rounded-full",src:o.image.url,alt:o.title,width:300,height:300}

1),(null==o?void 0:o.type)==="self-paced"&&o.modules&&(0,a.jsx)("div",{className:"pt-10",children:(()=>{if(!(null==o?void 0:o.modules))return null;if("megabundle-2024"!==o.slug)return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("span",{className:"block pb-4 text-sm font-semibold uppercase",children:"Workshops"}),o.modules.map(e=>(0,a.jsx)(N.dD,{moduleSlug:e.slug,children:(0,a.jsx)(J,{module:e})},e.slug))]});let e=(null==o?void 0:o.modules)?{epicWeb:o.modules.filter(e=>!et.includes(e.slug)&&!ea.includes(e.slug)),epicReact:o.modules.filter(e=>et.includes(e.slug)),testingJs:o.modules.filter(e=>ea.includes(e.slug))}:null;return e?(0,a.jsx)(a.Fragment,{children:Object.entries(e).map(e=>{let[s,t]=e;return 0===t.length?null:(0,a.jsxs)("div",{children:[(0,a.jsx)("span",{className:"block py-4 text-sm font-semibold uppercase",children:{epicReact:"Epic React",testingJs:"Testing JavaScript",epicWeb:"Epic Web"}[s]}),t.map(e=>{let t=((e,s)=>{switch(s){case"epicReact":switch(e.slug){case"react-interviews-with-experts":return{...e,slug:"https://www.epicreact.dev/bonuses/interviews-with-experts"};case"epic-react-v1-classic":return{...e,slug:"https://www.epicreact.dev/learn"};default:return{...e,slug:"https://www.epicreact.dev/workshops/".concat(e.slug)}}case"testingJs":return{...e,slug:"https://testingjavascript.com"};default:return e}})(e,s);return(0,a.jsx)(N.dD,{moduleSlug:t.slug,skipQuery:!0,children:(0,a.jsx)(J,{module:t})},t.slug)})]},s)})}):null})()})]})]})]})},M=e=>{let{purchase:s}=e,{availableBonuses:t}=(0,E.H)(null==s?void 0:s.id);return s&&0!==t.length?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(G,{children:"Available bonuses"}),(0,a.jsx)("ul",{className:"space-y-10 sm:space-y-3",children:t.map(e=>(0,a.jsxs)("li",{className:"flex flex-col items-center justify-center gap-3 text-center sm:flex-row sm:justify-start sm:text-left",children:[(null==e?void 0:e.image)&&(0,a.jsx)(i(),{src:e.image,alt:e.title,width:58,height:58}),(0,a.jsxs)("div",{children:[(0,a.jsx)("h3",{className:"text-lg font-medium",children:e.title}),e.description&&(0,a.jsx)(q.$,{className:"prose dark:prose-invert prose-p:opacity-90",components:{a:e=>(0,a.jsx)("a",{...e,target:"_blank",rel:"noopener"})},children:e.description})]}),(0,a.jsx)(U,{bonus:e,purchaseId:s.id})]},e.slug))})]}):null},U=e=>{let{bonus:s,purchaseId:t}=e,{mutate:l}=d.i.bonuses.redeemBonus.useMutation({onSettled:async e=>{switch(console.log(e),null==e?void 0:e.status){case"claimed":(0,C.u)("claimed bonus",{bonus:s.slug}),L.Ay.success("You've successfully claimed ".concat(s.title,"! Please check your inbox to log in. \uD83C\uDF89"));break;case"error":(0,C.u)("claimed bonus failed",{bonus:s.slug}),L.Ay.success("Please check your inbox to log in to ".concat(s.title,". \uD83D\uDCE7"));break;default:(0,L.Ay)("Something went wrong. It's our fault. Please email ".concat("[email protected]"," if you need support."))}}});return(0,a.jsx)(S.$n,{className:"sm:ml-auto",size:"sm",onClick:()=>{l({bonusSlug:s.slug,purchaseId:t})},children:"Redeem"})},V=e=>{var s;let{formattedPrice:t,userId:l,formattedPriceStatus:r}=e,n=(0,D.X)({userId:l,quantity:null==t?void 0:t.quantity,productId:null==t?void 0:t.id,bulk:!!(null==t?void 0:t.bulk),couponId:null==t||null==(s=t.appliedMerchantCoupon)?void 0:s.id,upgradeFromPurchaseId:null==t?void 0:t.upgradeFromPurchaseId});return(0,a.jsxs)("div",{children:[(0,a.jsx)("p",{className:"pb-3",children:"You've purchased a regional license for lower price. You can upgrade to get full access to all materials and bonuses from anywhere in the world."}),(0,a.jsxs)("form",{action:n,method:"POST",className:"mt-4 flex w-full flex-col items-center justify-between gap-3 rounded border bg-white p-5 dark:bg-gray-900 sm:flex-row",children:[(0,a.jsx)(A.kb,{className:"flex [&_[data-full-price]]:line-through [&_[data-percent-off]]:text-primary dark:[&_[data-percent-off]]:text-blue-300 [&_[data-price-discounted]]:flex [&_[data-price-discounted]]:items-center [&_[data-price-discounted]]:gap-2 [&_[data-price-discounted]]:pl-3 [&_[data-price-discounted]]:text-base [&_[data-price-discounted]]:font-medium [&_[data-price]]:flex [&_[data-price]]:text-2xl [&_[data-price]]:font-bold [&_sup]:top-2.5 [&_sup]:pr-1 [&_sup]:opacity-75",formattedPrice:t,status:r}),(0,a.jsx)(S.$n,{type:"submit",children:"Upgrade to full license"})]})]})},J=e=>{let{module:s}=e,t=(0,N.hD)(),{sections:l,slug:r}=s,n=((null==t?void 0:t.completedLessonCount)||0)>0,d=null==t?void 0:t.nextSection,c=null==t?void 0:t.nextLesson,o=l&&l[0],p=(null==o?void 0:o.lessons)&&(null==o?void 0:o.lessons[0])||(null==s?void 0:s.lessons)&&s.lessons[0],m=null==p?void 0:p._type,h=(null==s?void 0:s.sections)&&(null==s?void 0:s.lessons)&&(Q(null==s?void 0:s.sections).length||(null==s?void 0:s.lessons.length)),x=r.startsWith("http"),g=x?e=>{let{children:s,href:t}=e;return(0,a.jsx)("a",{href:t,className:"font-semibold hover:underline",target:"_blank",rel:"noopener noreferrer",children:s})}:e=>{let{children:s,href:t}=e;return(0,a.jsx)(u(),{href:t,className:"font-semibold hover:underline",children:s})};return(0,a.jsxs)("div",{className:"flex items-center gap-3 py-2",children:[s.image.url&&(0,a.jsx)(i(),{src:s.image.url,alt:s.title,width:80,height:80}),(0,a.jsxs)("div",{className:"flex flex-col",children:[(0,a.jsx)(g,{href:x?r:"/".concat(b()(s.moduleType),"/").concat(r),children:s.title}),(0,a.jsxs)("div",{className:"text-sm text-gray-600 dark:text-gray-300",children:[s.sections&&(0,a.jsx)("span",{children:(null==s?void 0:s.sections.length)>1&&"".concat(s.sections.length," sections")})," ",(null==s?void 0:s.sections)&&(null==s?void 0:s.lessons)&&(0,a.jsxs)("span",{children:[h," ",m?b()(m,h):null]})]}),(0,a.jsx)("div",{className:"pt-0.5",children:n&&!x&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(u(),{href:o&&l?{pathname:"/".concat(b()(s.moduleType),"/[module]/[section]/[lesson]"),query:{module:r,section:n?null==d?void 0:d.slug:o.slug,lesson:n?null==c?void 0:c.slug:null==p?void 0:p.slug}}:{pathname:"/".concat(b()(s.moduleType),"/[module]/[lesson]"),query:{module:r,lesson:n?null==c?void 0:c.slug:null==p?void 0:p.slug}},className:v()("flex font-medium text-blue-600 hover:underline dark:text-blue-300"),onClick:()=>{(0,C.u)("clicked start learning",{module:r})},children:n?"Continue":"Start"}),(0,a.jsxs)("div",{className:"relative flex w-full items-center justify-between gap-1",children:[(0,a.jsxs)("div",{className:"pr-1 text-xs font-semibold text-gray-600 dark:text-gray-300",children:[null==t?void 0:t.percentComplete,"%"]}),(0,a.jsx)("div",{className:"h-1 w-full bg-gray-200 dark:bg-gray-800",children:(0,a.jsx)("div",{className:"h-1 bg-blue-500 dark:bg-blue-400",style:{width:(null==t?void 0:t.percentComplete)+"%"}})})]})]})})]})]})},O=e=>{let{purchasesForCurrentProduct:s}=e;return(0,a.jsxs)("table",{className:"min-w-full divide-y divide-gray-200 dark:divide-gray-800",children:[(0,a.jsx)("thead",{children:(0,a.jsxs)("tr",{children:[(0,a.jsx)("th",{scope:"col",className:"py-3.5 pl-4 pr-3 text-left text-sm font-semibold uppercase sm:pl-0",children:"date"}),(0,a.jsx)("th",{scope:"col",className:"px-3 py-3.5 text-left text-sm font-semibold uppercase",children:"seats"}),(0,a.jsx)("th",{scope:"col",className:"px-3 py-3.5 text-left text-sm font-semibold uppercase",children:"price"}),(0,a.jsx)("th",{scope:"col",className:"px-3 py-3.5 text-left text-sm font-semibold uppercase",children:"status"}),(0,a.jsx)("th",{scope:"col",className:"px-3 py-3.5 text-left text-sm font-semibold uppercase",children:"Invoice"})]})}),(0,a.jsx)("tbody",{className:"divide-y divide-gray-200 dark:divide-gray-800",children:s.map(e=>(0,a.jsx)(Y,{purchase:e},e.id))})]})},Y=e=>{var s,t;let{purchase:l}=e,{data:r,status:n}=d.i.invoices.getChargeDetails.useQuery({merchantChargeId:l.merchantChargeId}),i=null!=(t=null==r||null==(s=r.result)?void 0:s.quantity)?t:1;return(0,a.jsxs)("tr",{children:[(0,a.jsx)("td",{className:"whitespace-nowrap py-4 pl-4 pr-3 text-base font-medium sm:pl-0",children:(0,c.A)(new Date(l.createdAt),"MMMM dd, y")}),(0,a.jsx)("td",{className:"whitespace-nowrap px-3 py-4 text-base",children:"loading"===n?(0,a.jsx)(h.A,{className:"w-4"}):i}),(0,a.jsx)("td",{className:"whitespace-nowrap px-3 py-4 text-base",children:(0,a.jsx)($,{amount:Number(l.totalAmount)})}),(0,a.jsx)("td",{className:"whitespace-nowrap px-3 py-4 text-base",children:"Restricted"===l.status?"Region restricted":l.status}),(0,a.jsx)("td",{className:(0,F.cn)("flex justify-end whitespace-nowrap py-4 pl-3 text-base",{"justify-end":l.merchantChargeId,"justify-start":!l.merchantChargeId}),children:l.merchantChargeId?(0,a.jsx)(S.$n,{size:"sm",asChild:!0,variant:"secondary",className:"w-full",children:(0,a.jsx)(u(),{href:"/invoices/".concat(l.merchantChargeId),children:"View"})}):"Not available"})]},l.id)},$=e=>{let{amount:s,className:t="",withUsd:l=!0}=e,{dollars:r,cents:n}=z(s);return(0,a.jsxs)("div",{className:t,children:[l&&(0,a.jsx)("sup",{className:"relative !-top-1 pr-0.5 text-gray-600 dark:text-gray-400",children:"USD"}),(0,a.jsx)("span",{className:"font-medium",children:r}),(0,a.jsx)("sup",{className:"!-top-1 pl-0.5 text-gray-600 dark:text-gray-400",children:n})]})},z=function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,s=new Intl.NumberFormat("en-US",{style:"currency",currency:"USD"}).format(e).split(".");return{dollars:s[0],cents:s[1]}},Q=e=>e.flatMap(e=>e.lessons||[]),G=e=>{let{children:s,className:t}=e;return(0,a.jsx)("h2",{className:(0,F.cn)("relative mt-4 flex items-center pb-3 pt-10 text-lg font-semibold text-black after:ml-5 after:h-px after:w-full after:bg-gray-200 after:content-[''] dark:text-white dark:after:bg-gray-800 sm:text-xl",t),children:(0,a.jsx)("span",{className:"flex-shrink-0",children:s})})},H=e=>{let{className:s,children:t="purchased"}=e;return(0,a.jsx)("div",{className:(0,F.cn)("inline-flex rounded-full border border-emerald-600/75 bg-gradient-to-tr from-teal-500 to-emerald-500 px-3 py-1 font-mono text-xs font-semibold uppercase tracking-wide text-white shadow-inner dark:border-emerald-500 dark:from-teal-600 dar

1k:to-emerald-600",s),children:(0,a.jsx)("span",{className:"drop-shadow-md",children:t})})}}}]);
2//# sourceMappingURL=5240-c907a9113ebb3123.js.map