@anker-in/campaign-ui 0.5.0-beta.8 → 0.5.0-beta.9

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.
Files changed (11) hide show
  1. package/dist/cjs/components/memberPopup/panels/ConsumeCredits/index.js +1 -1
  2. package/dist/cjs/components/memberPopup/panels/ConsumeCredits/index.js.map +3 -3
  3. package/dist/cjs/components/memberPopup/panels/EarnCredits/index.js +1 -1
  4. package/dist/cjs/components/memberPopup/panels/EarnCredits/index.js.map +2 -2
  5. package/dist/esm/components/memberPopup/panels/ConsumeCredits/index.js +1 -1
  6. package/dist/esm/components/memberPopup/panels/ConsumeCredits/index.js.map +3 -3
  7. package/dist/esm/components/memberPopup/panels/EarnCredits/index.js +1 -1
  8. package/dist/esm/components/memberPopup/panels/EarnCredits/index.js.map +2 -2
  9. package/package.json +1 -1
  10. package/src/components/memberPopup/panels/ConsumeCredits/index.tsx +6 -2
  11. package/src/components/memberPopup/panels/EarnCredits/index.tsx +1 -1
package/dist/cjs/components/memberPopup/panels/ConsumeCredits/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var h=Object.defineProperty;var j=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var q=(t,s)=>{for(var a in s)h(t,a,{get:s[a],enumerable:!0})},J=(t,s,a,l)=>{if(s&&typeof s=="object"||typeof s=="function")for(let o of G(s))!H.call(t,o)&&o!==a&&h(t,o,{get:()=>s[o],enumerable:!(l=j(s,o))||l.enumerable});return t};var K=t=>J(h({},"__esModule",{value:!0}),t);var X={};q(X,{default:()=>W});module.exports=K(X);var r=require("react/jsx-runtime"),f=require("react"),v=require("@anker-in/headless-ui"),p=require("@anker-in/lib"),D=require("../../context/provider"),k=require("../../context/viewStack"),A=require("./hooks/useRedeemableList"),M=require("./hooks/useRedeemAndBuy"),n=require("../../type"),g=require("../../../credits/context/utils"),O=require("../../../../constants");function Q({copy:t,onClose:s}){const{profile:a,creditInfo:l,openSignUpPopup:o,alpcConfig:b}=(0,D.useMemberPopupContext)(),{pushView:y}=(0,k.useViewStack)(),{brand:U}=(0,p.useHeadlessContext)(),I=O.ROUNDED_BRANDS.includes(U),[P,R]=(0,f.useState)(""),[E,w]=(0,f.useState)(null),m=!!a,{redeemableList:_,listLoading:L}=(0,A.useRedeemableList)(b),{trigger:S}=(0,M.useRedeemAndBuy)(b),$=t.list.map(e=>e.product?.handle).filter(Boolean),{data:B}=(0,p.useProductsByHandles)({handles:$}),z=(0,f.useMemo)(()=>t.list.map(e=>{const i=_.find(c=>String(c.id)===String(e.redeemId));if(!i)return null;const d=Number(l?.available_credit??0),C=m&&!!a?.activated&&i.consume_credits>d,x=i.is_limited&&(!i.remaining_inventory||i.remaining_inventory<=0);let u,N;return(e.type===n.ConsumeCreditsItemType.RedeemAndBuy||e.type===n.ConsumeCreditsItemType.Product)&&e.product&&(u=B?.find(c=>c.handle===e.product.handle),N=u?.variants?.find(c=>c.sku===e.product.sku)??u?.variants?.[0],e.type===n.ConsumeCreditsItemType.RedeemAndBuy&&(!u||!N))?null:{...e,alpcData:i,insufficient:C,soldOut:x,product:u,variant:N}}).filter(Boolean),[t.list,_,l,a,m,B]);function F(e){return m?e.soldOut?t.soldOut:t.btnRedeem:t.unlockRewards}function T(e){return e.type===n.ConsumeCreditsItemType.GiftCard||e.type===n.ConsumeCreditsItemType.Product?e.insufficient:e.soldOut||e.insufficient}async function V(e){if(!m){o();return}if(!a?.activated){y({type:n.MemberPopupPanelType.Activate});return}if(e.type===n.ConsumeCreditsItemType.GiftCard||e.type===n.ConsumeCreditsItemType.Product){t.creditsPage?.url&&window.open(t.creditsPage.url,"_blank","noopener,noreferrer");return}if(e.type===n.ConsumeCreditsItemType.Coupon)y({type:n.MemberPopupPanelType.RedeemCoupon,props:{itemTitle:e.title,itemCredits:e.alpcData.consume_credits,itemImage:t.imageMapping?.[e.type]?{url:t.imageMapping[e.type].url,alt:e.image?.alt}:e.image,itemValue:e.value,itemOff:t.off,itemRules:e.rules,redeemId:Number(e.redeemId),userId:a?.user_id,alpcConfig:b}});else{R(""),w(e.redeemId);try{await S({productVariant:e.variant,redeemId:Number(e.redeemId),userId:a?.user_id})}catch(i){R(i?.message??t.redeemModal.commonError)}finally{w(null)}}}return(0,r.jsx)(r.Fragment,{children:(0,r.jsxs)("div",{className:"flex flex-1 flex-col gap-[12px]",children:[(0,r.jsxs)("div",{className:"flex flex-col gap-[8px]",children:[t.title&&(0,r.jsx)("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title}),t.subtitle&&(0,r.jsx)("p",{className:"text-[16px] font-[700] leading-snug text-[#4a4c56]",children:t.subtitle})]}),t.insufficientCredits&&l&&(0,r.jsxs)("div",{className:"text-[14px] font-[700] text-[#1d1d1f]",children:[t.insufficientCredits,": ",(0,g.numberFormat)(l.available_credit)," ",t.pointUnit]}),P&&(0,r.jsx)("div",{className:"text-[14px] font-[700] text-[#f84d4f]",children:P}),L?(0,r.jsx)("div",{className:"flex flex-1 items-center justify-center py-[32px]",children:(0,r.jsx)("div",{className:"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent"})}):(0,r.jsx)("div",{className:"flex flex-col",children:z.map((e,i)=>{const d=!!e.product;return(0,r.jsxs)("div",{className:"relative py-[16px]",children:[i>0&&(0,r.jsx)("div",{className:"absolute inset-x-0 top-0 h-px bg-[#dadce0]"}),(0,r.jsxs)("div",{className:"flex items-center gap-[12px]",children:[(()=>{const C=t.imageMapping?.[e.type]?.url,x=d?e.variant?.image?.url??e.product?.images?.[0]?.url??e.image?.url:C??e.image?.url,u=d?e.variant?.image?.altText??e.product?.images?.[0]?.alt??e.image?.alt??"":e.image?.alt??"";return x?(0,r.jsxs)("div",{className:(0,p.classNames)("relative size-[64px] shrink-0 overflow-hidden",I?"rounded-[4px]":"rounded-none"),children:[(0,r.jsx)(v.Picture,{source:x,alt:u,className:"flex size-full items-center justify-center",imgClassName:d?"object-cover":"h-full w-auto object-contain"}),!d&&e.value&&(0,r.jsxs)("div",{className:"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white",children:[e.value," ",t.off]})]}):null})(),(0,r.jsxs)("div",{className:"min-w-0 flex-1",children:[(0,r.jsx)("div",{className:"text-[16px] font-[700] text-[#1e2024] line-clamp-2",children:d&&e.product?.title?e.product.title:e.title}),(0,r.jsx)("div",{className:"mt-[4px] text-[14px] text-[#666]",children:d&&e.price!=null?`${(0,g.numberFormat)(e.alpcData.consume_credits)} ${t.pointUnit??""} + $${Number(e.price).toFixed(2)}`:`${(0,g.numberFormat)(e.alpcData.consume_credits)} ${t.pointUnit??""}`})]}),(0,r.jsxs)("div",{className:"relative group",children:[(0,r.jsx)(v.Button,{className:(0,p.classNames)("bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",I?"rounded-[4px]":"rounded-none"),disabled:T(e),loading:E===e.redeemId,onClick:()=>V(e),children:F(e)}),e.insufficient&&(0,r.jsx)("div",{className:"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block",children:(0,r.jsxs)("div",{className:"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow",children:[(0,r.jsx)("p",{className:"text-pretty tracking-[-0.02em] text-[14px]",children:t.insufficientCredits}),(0,r.jsx)("div",{className:"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]"})]})})]})]})]},i)})}),t.creditsPage?.url&&(0,r.jsx)("a",{href:t.creditsPage.url,target:"_blank",rel:"noopener noreferrer",className:"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline",children:t.creditsPage.label??"Go to Credits Page"})]})})}var W=Q;
1
+ "use strict";var h=Object.defineProperty;var H=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var J=Object.prototype.hasOwnProperty;var K=(t,i)=>{for(var a in i)h(t,a,{get:i[a],enumerable:!0})},Q=(t,i,a,l)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of q(i))!J.call(t,o)&&o!==a&&h(t,o,{get:()=>i[o],enumerable:!(l=H(i,o))||l.enumerable});return t};var W=t=>Q(h({},"__esModule",{value:!0}),t);var Z={};K(Z,{default:()=>Y});module.exports=W(Z);var r=require("react/jsx-runtime"),c=require("react"),g=require("@anker-in/headless-ui"),p=require("@anker-in/lib"),D=require("../../context/provider"),k=require("../../context/viewStack"),A=require("./hooks/useRedeemableList"),S=require("./hooks/useRedeemAndBuy"),n=require("../../type"),v=require("../../../credits/context/utils"),M=require("../../../../constants");function X({copy:t,onClose:i}){const{profile:a,creditInfo:l,openSignUpPopup:o,alpcConfig:b}=(0,D.useMemberPopupContext)(),{pushView:y}=(0,k.useViewStack)(),{brand:O}=(0,p.useHeadlessContext)(),I=M.ROUNDED_BRANDS.includes(O),[P,R]=(0,c.useState)(""),[U,w]=(0,c.useState)(null),[E,L]=(0,c.useState)(!1),m=!!a,{redeemableList:_,listLoading:$}=(0,A.useRedeemableList)(b),{trigger:z}=(0,S.useRedeemAndBuy)(b),F=t.list.map(e=>e.product?.handle).filter(Boolean),{data:B}=(0,p.useProductsByHandles)({handles:F}),T=(0,c.useMemo)(()=>t.list.map(e=>{const s=_.find(f=>String(f.id)===String(e.redeemId));if(!s)return null;const d=Number(l?.available_credit??0),C=m&&!!a?.activated&&s.consume_credits>d,x=s.is_limited&&(!s.remaining_inventory||s.remaining_inventory<=0);let u,N;return(e.type===n.ConsumeCreditsItemType.RedeemAndBuy||e.type===n.ConsumeCreditsItemType.Product)&&e.product&&(u=B?.find(f=>f.handle===e.product.handle),N=u?.variants?.find(f=>f.sku===e.product.sku)??u?.variants?.[0],e.type===n.ConsumeCreditsItemType.RedeemAndBuy&&(!u||!N))?null:{...e,alpcData:s,insufficient:C,soldOut:x,product:u,variant:N}}).filter(Boolean),[t.list,_,l,a,m,B]);function V(e){return m?e.soldOut?t.soldOut:t.btnRedeem:t.unlockRewards}function j(e){return e.type===n.ConsumeCreditsItemType.GiftCard||e.type===n.ConsumeCreditsItemType.Product?e.insufficient:e.soldOut||e.insufficient}async function G(e){if(!m){o();return}if(!a?.activated&&!E){y({type:n.MemberPopupPanelType.Activate,props:{onSuccess:()=>L(!0)}});return}if(e.type===n.ConsumeCreditsItemType.GiftCard||e.type===n.ConsumeCreditsItemType.Product){t.creditsPage?.url&&window.open(t.creditsPage.url,"_blank","noopener,noreferrer");return}if(e.type===n.ConsumeCreditsItemType.Coupon)y({type:n.MemberPopupPanelType.RedeemCoupon,props:{itemTitle:e.title,itemCredits:e.alpcData.consume_credits,itemImage:t.imageMapping?.[e.type]?{url:t.imageMapping[e.type].url,alt:e.image?.alt}:e.image,itemValue:e.value,itemOff:t.off,itemRules:e.rules,redeemId:Number(e.redeemId),userId:a?.user_id,alpcConfig:b}});else{R(""),w(e.redeemId);try{await z({productVariant:e.variant,redeemId:Number(e.redeemId),userId:a?.user_id})}catch(s){R(s?.message??t.redeemModal.commonError)}finally{w(null)}}}return(0,r.jsx)(r.Fragment,{children:(0,r.jsxs)("div",{className:"flex flex-1 flex-col gap-[12px]",children:[(0,r.jsxs)("div",{className:"flex flex-col gap-[8px]",children:[t.title&&(0,r.jsx)("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title}),t.subtitle&&(0,r.jsx)("p",{className:"text-[16px] font-[700] leading-snug text-[#4a4c56]",children:t.subtitle})]}),t.insufficientCredits&&l&&(0,r.jsxs)("div",{className:"text-[14px] font-[700] text-[#1d1d1f]",children:[t.insufficientCredits,": ",(0,v.numberFormat)(l.available_credit)," ",t.pointUnit]}),P&&(0,r.jsx)("div",{className:"text-[14px] font-[700] text-[#f84d4f]",children:P}),$?(0,r.jsx)("div",{className:"flex flex-1 items-center justify-center py-[32px]",children:(0,r.jsx)("div",{className:"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent"})}):(0,r.jsx)("div",{className:"flex flex-col",children:T.map((e,s)=>{const d=!!e.product;return(0,r.jsxs)("div",{className:"relative py-[16px]",children:[s>0&&(0,r.jsx)("div",{className:"absolute inset-x-0 top-0 h-px bg-[#dadce0]"}),(0,r.jsxs)("div",{className:"flex items-center gap-[12px]",children:[(()=>{const C=t.imageMapping?.[e.type]?.url,x=d?e.variant?.image?.url??e.product?.images?.[0]?.url??e.image?.url:C??e.image?.url,u=d?e.variant?.image?.altText??e.product?.images?.[0]?.alt??e.image?.alt??"":e.image?.alt??"";return x?(0,r.jsxs)("div",{className:(0,p.classNames)("relative size-[64px] shrink-0 overflow-hidden",I?"rounded-[4px]":"rounded-none"),children:[(0,r.jsx)(g.Picture,{source:x,alt:u,className:"flex size-full items-center justify-center",imgClassName:d?"object-cover":"h-full w-auto object-contain"}),!d&&e.value&&(0,r.jsxs)("div",{className:"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white",children:[e.value," ",t.off]})]}):null})(),(0,r.jsxs)("div",{className:"min-w-0 flex-1",children:[(0,r.jsx)("div",{className:"text-[16px] font-[700] text-[#1e2024] line-clamp-2",children:d&&e.product?.title?e.product.title:e.title}),(0,r.jsx)("div",{className:"mt-[4px] text-[14px] text-[#666]",children:d&&e.price!=null?`${(0,v.numberFormat)(e.alpcData.consume_credits)} ${t.pointUnit??""} + $${Number(e.price).toFixed(2)}`:`${(0,v.numberFormat)(e.alpcData.consume_credits)} ${t.pointUnit??""}`})]}),(0,r.jsxs)("div",{className:"relative group",children:[(0,r.jsx)(g.Button,{className:(0,p.classNames)("bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",I?"rounded-[4px]":"rounded-none"),disabled:j(e),loading:U===e.redeemId,onClick:()=>G(e),children:V(e)}),e.insufficient&&(0,r.jsx)("div",{className:"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block",children:(0,r.jsxs)("div",{className:"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow",children:[(0,r.jsx)("p",{className:"text-pretty tracking-[-0.02em] text-[14px]",children:t.insufficientCredits}),(0,r.jsx)("div",{className:"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]"})]})})]})]})]},s)})}),t.creditsPage?.url&&(0,r.jsx)("a",{href:t.creditsPage.url,target:"_blank",rel:"noopener noreferrer",className:"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline",children:t.creditsPage.label??"Go to Credits Page"})]})})}var Y=X;
2
2
  //# sourceMappingURL=index.js.map
package/dist/cjs/components/memberPopup/panels/ConsumeCredits/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../src/components/memberPopup/panels/ConsumeCredits/index.tsx"],
4
- "sourcesContent": ["import { useMemo, useState } from 'react'\nimport { Picture, Button } from '@anker-in/headless-ui'\nimport { classNames as cn, useProductsByHandles, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useRedeemableList } from './hooks/useRedeemableList'\nimport { useRedeemAndBuy } from './hooks/useRedeemAndBuy'\nimport {\n ConsumeCreditsItemType,\n MemberPopupPanelType,\n type ConsumeCreditsopy,\n type ConsumeCreditsItem,\n} from '../../type'\nimport { numberFormat } from '../../../credits/context/utils'\nimport type { ConsumeCreditRuleResponse } from '../../../credits/context/response'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\ntype EnrichedItem = ConsumeCreditsItem & {\n alpcData: ConsumeCreditRuleResponse\n insufficient: boolean\n soldOut: boolean\n product?: any\n variant?: any\n}\n\ntype Props = {\n copy: ConsumeCreditsopy\n onClose: () => void\n}\n\nfunction ConsumeCredits({ copy, onClose }: Props) {\n const { profile, creditInfo, openSignUpPopup, alpcConfig } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n const [redeemAndBuyError, setRedeemAndBuyError] = useState('')\n const [loadingId, setLoadingId] = useState<string | number | null>(null)\n\n const isLogin = !!profile\n const { redeemableList, listLoading } = useRedeemableList(alpcConfig)\n const { trigger: redeemAndBuy } = useRedeemAndBuy(alpcConfig)\n\n const handles = copy.list.map(item => item.product?.handle).filter(Boolean) as string[]\n const { data: products } = useProductsByHandles({ handles })\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const alpcData = redeemableList.find(r => String(r.id) === String(item.redeemId))\n if (!alpcData) return null\n\n const availableCredit = Number(creditInfo?.available_credit ?? 0)\n const insufficient = isLogin && !!profile?.activated && alpcData.consume_credits > availableCredit\n const soldOut = alpcData.is_limited && (!alpcData.remaining_inventory || alpcData.remaining_inventory <= 0)\n\n let product\n let variant\n if (\n (item.type === ConsumeCreditsItemType.RedeemAndBuy ||\n item.type === ConsumeCreditsItemType.Product) &&\n item.product\n ) {\n product = products?.find((p: any) => p.handle === item.product!.handle)\n variant = product?.variants?.find((v: any) => v.sku === item.product!.sku) ?? product?.variants?.[0]\n if (item.type === ConsumeCreditsItemType.RedeemAndBuy && (!product || !variant)) return null\n }\n\n return { ...item, alpcData, insufficient, soldOut, product, variant }\n })\n .filter(Boolean) as EnrichedItem[]\n }, [copy.list, redeemableList, creditInfo, profile, isLogin, products])\n\n function getButtonLabel(item: (typeof list)[number]) {\n if (!isLogin) return copy.unlockRewards\n if (item.soldOut) return copy.soldOut\n return copy.btnRedeem\n }\n\n function isDisabled(item: (typeof list)[number]) {\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n return item.insufficient\n }\n return item.soldOut || item.insufficient\n }\n\n async function handleRedeem(item: (typeof list)[number]) {\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n if (!profile?.activated) {\n pushView({ type: MemberPopupPanelType.Activate })\n return\n }\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n if (copy.creditsPage?.url) {\n window.open(copy.creditsPage.url, '_blank', 'noopener,noreferrer')\n }\n return\n }\n if (item.type === ConsumeCreditsItemType.Coupon) {\n pushView({\n type: MemberPopupPanelType.RedeemCoupon,\n props: {\n itemTitle: item.title,\n itemCredits: item.alpcData.consume_credits,\n itemImage: copy.imageMapping?.[item.type]\n ? { url: copy.imageMapping[item.type]!.url, alt: item.image?.alt }\n : item.image,\n itemValue: item.value,\n itemOff: copy.off,\n itemRules: item.rules,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n alpcConfig,\n },\n })\n } else {\n setRedeemAndBuyError('')\n setLoadingId(item.redeemId)\n try {\n await redeemAndBuy({\n productVariant: item.variant,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n })\n } catch (e: any) {\n setRedeemAndBuyError(e?.message ?? copy.redeemModal.commonError)\n } finally {\n setLoadingId(null)\n }\n }\n }\n\n return (\n <>\n <div className=\"flex flex-1 flex-col gap-[12px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n {copy.subtitle && <p className=\"text-[16px] font-[700] leading-snug text-[#4a4c56]\">{copy.subtitle}</p>}\n </div>\n\n {copy.insufficientCredits && creditInfo && (\n <div className=\"text-[14px] font-[700] text-[#1d1d1f]\">\n {copy.insufficientCredits}: {numberFormat(creditInfo.available_credit)} {copy.pointUnit}\n </div>\n )}\n {redeemAndBuyError && <div className=\"text-[14px] font-[700] text-[#f84d4f]\">{redeemAndBuyError}</div>}\n\n {listLoading ? (\n <div className=\"flex flex-1 items-center justify-center py-[32px]\">\n <div className=\"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent\" />\n </div>\n ) : (\n <div className=\"flex flex-col\">\n {list.map((item, idx) => {\n const hasProduct = !!item.product\n return (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute inset-x-0 top-0 h-px bg-[#dadce0]\" />}\n <div className=\"flex items-center gap-[12px]\">\n {(() => {\n const mappedImgUrl = copy.imageMapping?.[item.type]?.url\n const imgUrl = hasProduct\n ? (item.variant?.image?.url ?? item.product?.images?.[0]?.url ?? item.image?.url)\n : (mappedImgUrl ?? item.image?.url)\n const imgAlt = hasProduct\n ? (item.variant?.image?.altText ?? item.product?.images?.[0]?.alt ?? item.image?.alt ?? '')\n : (item.image?.alt ?? '')\n if (!imgUrl) return null\n return (\n <div className={cn('relative size-[64px] shrink-0 overflow-hidden', rounded ? 'rounded-[4px]' : 'rounded-none')}>\n <Picture\n source={imgUrl}\n alt={imgAlt}\n className=\"flex size-full items-center justify-center\"\n imgClassName={hasProduct ? 'object-cover' : 'h-full w-auto object-contain'}\n />\n {!hasProduct && item.value && (\n <div className=\"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white\">\n {item.value} {copy.off}\n </div>\n )}\n </div>\n )\n })()}\n <div className=\"min-w-0 flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024] line-clamp-2\">\n {hasProduct && item.product?.title\n ? item.product.title\n : item.title}\n </div>\n <div className=\"mt-[4px] text-[14px] text-[#666]\">\n {hasProduct && item.price != null\n ? `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''} + $${Number(item.price).toFixed(2)}`\n : `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''}`}\n </div>\n </div>\n <div className=\"relative group\">\n <Button\n className={cn('bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white', rounded ? 'rounded-[4px]' : 'rounded-none')}\n disabled={isDisabled(item)}\n loading={loadingId === item.redeemId}\n onClick={() => handleRedeem(item)}\n >\n {getButtonLabel(item)}\n </Button>\n {item.insufficient && (\n <div className=\"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block\">\n <div className=\"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow\">\n <p className=\"text-pretty tracking-[-0.02em] text-[14px]\">{copy.insufficientCredits}</p>\n <div className=\"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n })}\n </div>\n )}\n\n {copy.creditsPage?.url && (\n <a\n href={copy.creditsPage.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline\"\n >\n {copy.creditsPage.label ?? 'Go to Credits Page'}\n </a>\n )}\n </div>\n </>\n )\n}\n\nexport default ConsumeCredits\n"],
5
- "mappings": "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",
6
- "names": ["ConsumeCredits_exports", "__export", "ConsumeCredits_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_headless_ui", "import_lib", "import_provider", "import_viewStack", "import_useRedeemableList", "import_useRedeemAndBuy", "import_type", "import_utils", "import_constants", "ConsumeCredits", "copy", "onClose", "profile", "creditInfo", "openSignUpPopup", "alpcConfig", "pushView", "brand", "rounded", "redeemAndBuyError", "setRedeemAndBuyError", "loadingId", "setLoadingId", "isLogin", "redeemableList", "listLoading", "redeemAndBuy", "handles", "item", "products", "list", "alpcData", "r", "availableCredit", "insufficient", "soldOut", "product", "variant", "p", "v", "getButtonLabel", "isDisabled", "handleRedeem", "e", "idx", "hasProduct", "mappedImgUrl", "imgUrl", "imgAlt", "cn"]
4
+ "sourcesContent": ["import { useMemo, useState } from 'react'\nimport { Picture, Button } from '@anker-in/headless-ui'\nimport { classNames as cn, useProductsByHandles, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useRedeemableList } from './hooks/useRedeemableList'\nimport { useRedeemAndBuy } from './hooks/useRedeemAndBuy'\nimport {\n ConsumeCreditsItemType,\n MemberPopupPanelType,\n type ConsumeCreditsopy,\n type ConsumeCreditsItem,\n} from '../../type'\nimport { numberFormat } from '../../../credits/context/utils'\nimport type { ConsumeCreditRuleResponse } from '../../../credits/context/response'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\ntype EnrichedItem = ConsumeCreditsItem & {\n alpcData: ConsumeCreditRuleResponse\n insufficient: boolean\n soldOut: boolean\n product?: any\n variant?: any\n}\n\ntype Props = {\n copy: ConsumeCreditsopy\n onClose: () => void\n}\n\nfunction ConsumeCredits({ copy, onClose }: Props) {\n const { profile, creditInfo, openSignUpPopup, alpcConfig } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n const [redeemAndBuyError, setRedeemAndBuyError] = useState('')\n const [loadingId, setLoadingId] = useState<string | number | null>(null)\n const [isActivateSuccess, setIsActivateSuccess] = useState(false)\n\n const isLogin = !!profile\n const { redeemableList, listLoading } = useRedeemableList(alpcConfig)\n const { trigger: redeemAndBuy } = useRedeemAndBuy(alpcConfig)\n\n const handles = copy.list.map(item => item.product?.handle).filter(Boolean) as string[]\n const { data: products } = useProductsByHandles({ handles })\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const alpcData = redeemableList.find(r => String(r.id) === String(item.redeemId))\n if (!alpcData) return null\n\n const availableCredit = Number(creditInfo?.available_credit ?? 0)\n const insufficient = isLogin && !!profile?.activated && alpcData.consume_credits > availableCredit\n const soldOut = alpcData.is_limited && (!alpcData.remaining_inventory || alpcData.remaining_inventory <= 0)\n\n let product\n let variant\n if (\n (item.type === ConsumeCreditsItemType.RedeemAndBuy ||\n item.type === ConsumeCreditsItemType.Product) &&\n item.product\n ) {\n product = products?.find((p: any) => p.handle === item.product!.handle)\n variant = product?.variants?.find((v: any) => v.sku === item.product!.sku) ?? product?.variants?.[0]\n if (item.type === ConsumeCreditsItemType.RedeemAndBuy && (!product || !variant)) return null\n }\n\n return { ...item, alpcData, insufficient, soldOut, product, variant }\n })\n .filter(Boolean) as EnrichedItem[]\n }, [copy.list, redeemableList, creditInfo, profile, isLogin, products])\n\n function getButtonLabel(item: (typeof list)[number]) {\n if (!isLogin) return copy.unlockRewards\n if (item.soldOut) return copy.soldOut\n return copy.btnRedeem\n }\n\n function isDisabled(item: (typeof list)[number]) {\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n return item.insufficient\n }\n return item.soldOut || item.insufficient\n }\n\n async function handleRedeem(item: (typeof list)[number]) {\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n if (!profile?.activated && !isActivateSuccess) {\n pushView({\n type: MemberPopupPanelType.Activate,\n props: { onSuccess: () => setIsActivateSuccess(true) },\n })\n return\n }\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n if (copy.creditsPage?.url) {\n window.open(copy.creditsPage.url, '_blank', 'noopener,noreferrer')\n }\n return\n }\n if (item.type === ConsumeCreditsItemType.Coupon) {\n pushView({\n type: MemberPopupPanelType.RedeemCoupon,\n props: {\n itemTitle: item.title,\n itemCredits: item.alpcData.consume_credits,\n itemImage: copy.imageMapping?.[item.type]\n ? { url: copy.imageMapping[item.type]!.url, alt: item.image?.alt }\n : item.image,\n itemValue: item.value,\n itemOff: copy.off,\n itemRules: item.rules,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n alpcConfig,\n },\n })\n } else {\n setRedeemAndBuyError('')\n setLoadingId(item.redeemId)\n try {\n await redeemAndBuy({\n productVariant: item.variant,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n })\n } catch (e: any) {\n setRedeemAndBuyError(e?.message ?? copy.redeemModal.commonError)\n } finally {\n setLoadingId(null)\n }\n }\n }\n\n return (\n <>\n <div className=\"flex flex-1 flex-col gap-[12px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n {copy.subtitle && <p className=\"text-[16px] font-[700] leading-snug text-[#4a4c56]\">{copy.subtitle}</p>}\n </div>\n\n {copy.insufficientCredits && creditInfo && (\n <div className=\"text-[14px] font-[700] text-[#1d1d1f]\">\n {copy.insufficientCredits}: {numberFormat(creditInfo.available_credit)} {copy.pointUnit}\n </div>\n )}\n {redeemAndBuyError && <div className=\"text-[14px] font-[700] text-[#f84d4f]\">{redeemAndBuyError}</div>}\n\n {listLoading ? (\n <div className=\"flex flex-1 items-center justify-center py-[32px]\">\n <div className=\"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent\" />\n </div>\n ) : (\n <div className=\"flex flex-col\">\n {list.map((item, idx) => {\n const hasProduct = !!item.product\n return (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute inset-x-0 top-0 h-px bg-[#dadce0]\" />}\n <div className=\"flex items-center gap-[12px]\">\n {(() => {\n const mappedImgUrl = copy.imageMapping?.[item.type]?.url\n const imgUrl = hasProduct\n ? (item.variant?.image?.url ?? item.product?.images?.[0]?.url ?? item.image?.url)\n : (mappedImgUrl ?? item.image?.url)\n const imgAlt = hasProduct\n ? (item.variant?.image?.altText ?? item.product?.images?.[0]?.alt ?? item.image?.alt ?? '')\n : (item.image?.alt ?? '')\n if (!imgUrl) return null\n return (\n <div className={cn('relative size-[64px] shrink-0 overflow-hidden', rounded ? 'rounded-[4px]' : 'rounded-none')}>\n <Picture\n source={imgUrl}\n alt={imgAlt}\n className=\"flex size-full items-center justify-center\"\n imgClassName={hasProduct ? 'object-cover' : 'h-full w-auto object-contain'}\n />\n {!hasProduct && item.value && (\n <div className=\"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white\">\n {item.value} {copy.off}\n </div>\n )}\n </div>\n )\n })()}\n <div className=\"min-w-0 flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024] line-clamp-2\">\n {hasProduct && item.product?.title\n ? item.product.title\n : item.title}\n </div>\n <div className=\"mt-[4px] text-[14px] text-[#666]\">\n {hasProduct && item.price != null\n ? `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''} + $${Number(item.price).toFixed(2)}`\n : `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''}`}\n </div>\n </div>\n <div className=\"relative group\">\n <Button\n className={cn('bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white', rounded ? 'rounded-[4px]' : 'rounded-none')}\n disabled={isDisabled(item)}\n loading={loadingId === item.redeemId}\n onClick={() => handleRedeem(item)}\n >\n {getButtonLabel(item)}\n </Button>\n {item.insufficient && (\n <div className=\"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block\">\n <div className=\"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow\">\n <p className=\"text-pretty tracking-[-0.02em] text-[14px]\">{copy.insufficientCredits}</p>\n <div className=\"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n })}\n </div>\n )}\n\n {copy.creditsPage?.url && (\n <a\n href={copy.creditsPage.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline\"\n >\n {copy.creditsPage.label ?? 'Go to Credits Page'}\n </a>\n )}\n </div>\n </>\n )\n}\n\nexport default ConsumeCredits\n"],
5
+ "mappings": "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",
6
+ "names": ["ConsumeCredits_exports", "__export", "ConsumeCredits_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_headless_ui", "import_lib", "import_provider", "import_viewStack", "import_useRedeemableList", "import_useRedeemAndBuy", "import_type", "import_utils", "import_constants", "ConsumeCredits", "copy", "onClose", "profile", "creditInfo", "openSignUpPopup", "alpcConfig", "pushView", "brand", "rounded", "redeemAndBuyError", "setRedeemAndBuyError", "loadingId", "setLoadingId", "isActivateSuccess", "setIsActivateSuccess", "isLogin", "redeemableList", "listLoading", "redeemAndBuy", "handles", "item", "products", "list", "alpcData", "r", "availableCredit", "insufficient", "soldOut", "product", "variant", "p", "v", "getButtonLabel", "isDisabled", "handleRedeem", "e", "idx", "hasProduct", "mappedImgUrl", "imgUrl", "imgAlt", "cn"]
7
7
  }
package/dist/cjs/components/memberPopup/panels/EarnCredits/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var g=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var F=(t,s)=>{for(var d in s)g(t,d,{get:s[d],enumerable:!0})},O=(t,s,d,f)=>{if(s&&typeof s=="object"||typeof s=="function")for(let o of R(s))!y.call(t,o)&&o!==d&&g(t,o,{get:()=>s[o],enumerable:!(f=M(s,o))||f.enumerable});return t};var V=t=>O(g({},"__esModule",{value:!0}),t);var G={};F(G,{default:()=>q});module.exports=V(G);var e=require("react/jsx-runtime"),m=require("react"),p=require("@anker-in/lib"),w=require("../../context/provider"),P=require("../../context/viewStack"),E=require("./hooks/useSubscribed"),n=require("../../type"),r=require("../../icons"),N=require("../../../credits/context/utils"),T=require("../../../../constants");function z({id:t,className:s}){switch(t){case n.EarnCreditsTaskType.Activate:return(0,e.jsx)(r.IconLock,{className:s});case n.EarnCreditsTaskType.Subscribe:return(0,e.jsx)(r.IconSubscription,{className:s});case n.EarnCreditsTaskType.Shop:return(0,e.jsx)(r.IconBag,{className:s});case n.EarnCreditsTaskType.CompleteProfile:return(0,e.jsx)(r.IconOrders,{className:s})}}function H({copy:t,onClose:s,isSubscribeSuccess:d=!1,isActivateSuccess:f=!1,isProfileCompleteSuccess:o=!1,onSubscribeSuccess:I,onActivateSuccess:_,onProfileCompleteSuccess:A}){const{profile:a,openSignUpPopup:x,alpcConfig:h,creditInfo:b}=(0,w.useMemberPopupContext)(),{pushView:u}=(0,P.useViewStack)(),{locale:B}=h,{brand:C}=(0,p.useHeadlessContext)(),v=T.ROUNDED_BRANDS.includes(C);console.log("creditInfo",b);const l=!!a,k=(0,E.useSubscribed)({userId:a?.user_id,brand:C,email:a?.email,locale:B,apiBaseUrl:h.apiBaseUrl}),S=(0,m.useMemo)(()=>o||!!(a?.first_name||a?.last_name)&&!!a?.phone_number&&!!a?.dob,[a,o]),L=(0,m.useMemo)(()=>({[n.EarnCreditsTaskType.Activate]:{finished:!!a?.activated||f,onClick:l?()=>u({type:n.MemberPopupPanelType.Activate,props:{onSuccess:_}}):x},[n.EarnCreditsTaskType.CompleteProfile]:{finished:S,onClick:l?()=>u({type:n.MemberPopupPanelType.CompleteProfile,props:{onSuccess:A}}):x},[n.EarnCreditsTaskType.Subscribe]:{finished:k||d,onClick:l?()=>u({type:n.MemberPopupPanelType.SubscribeEmail,props:{onSuccess:I}}):x},[n.EarnCreditsTaskType.Shop]:{finished:!1,link:t.goShopLink,onClick:l?void 0:x}}),[a,l,f,o,S,k,d,x,u,t.goShopLink]),U=(0,m.useMemo)(()=>t.list.map(i=>{const c=L[i.id];if(!c)return null;const D=c.finished?t.completed:l?j(i.id,t):t.joinNow;return{...i,...c,buttonLabel:D}}).filter(Boolean),[t,L,l]);return(0,e.jsxs)("div",{className:"flex flex-col gap-[16px]",children:[(0,e.jsxs)("div",{className:"flex flex-col gap-[16px]",children:[(0,e.jsx)("div",{className:"flex flex-col gap-[8px]",children:t.title&&(0,e.jsx)("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title})}),l&&(0,e.jsxs)("div",{className:(0,p.classNames)("flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]",v?"rounded-[8px]":"rounded-none"),children:[(0,e.jsxs)("div",{className:"flex flex-1 flex-col gap-[4px]",children:[(0,e.jsx)("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.balanceLabel??"AnkerCredits Balance"}),(0,e.jsxs)("div",{className:"flex items-end gap-[4px]",children:[(0,e.jsx)("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:(0,N.numberFormat)(b?.available_credit??0)}),(0,e.jsx)("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]}),(0,e.jsx)("div",{className:"h-full w-px bg-[#dadce0]"}),(0,e.jsxs)("div",{className:"flex flex-1 flex-col gap-[4px]",children:[(0,e.jsx)("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.comingSoonLabel??"Coming Soon"}),(0,e.jsxs)("div",{className:"flex items-end gap-[4px]",children:[(0,e.jsx)("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:(0,N.numberFormat)(b?.pending_credit??0)}),(0,e.jsx)("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]})]})]}),(0,e.jsxs)("div",{className:"flex flex-col gap-[16px]",children:[t.subtitle&&(0,e.jsx)("p",{className:"text-[16px] font-[700] text-[#1e2024]",children:t.subtitle}),(0,e.jsx)("div",{className:"flex flex-col",children:U.map((i,c)=>(0,e.jsxs)("div",{className:"relative py-[16px]",children:[c>0&&(0,e.jsx)("div",{className:"absolute left-0 right-0 top-0 h-px bg-[#dadce0]"}),(0,e.jsxs)("div",{className:(0,p.classNames)("flex items-center gap-[12px]",i.finished&&"opacity-60"),children:[(0,e.jsx)(z,{id:i.id,className:"size-[24px] shrink-0"}),(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)("div",{className:"text-[16px] font-[700] text-[#1e2024]",children:i.title}),i.description&&(0,e.jsx)("div",{className:"mt-[4px] text-[14px] font-[700] text-[#4a4c56]",children:i.description})]}),!i.finished&&i.link?(0,e.jsx)("a",{href:i.link,target:"_blank",rel:"noopener noreferrer",className:(0,p.classNames)("cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",v?"rounded-[4px]":"rounded-none"),children:i.buttonLabel}):(0,e.jsx)("button",{className:(0,p.classNames)("cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",i.finished?"bg-[#767880]":"bg-[#080a0f]",v?"rounded-[4px]":"rounded-none"),disabled:i.finished,onClick:i.finished?void 0:i.onClick,children:i.buttonLabel})]})]},c))})]})]})}function j(t,s){switch(t){case n.EarnCreditsTaskType.Activate:return s.activate;case n.EarnCreditsTaskType.CompleteProfile:return s.completeProfileLabel;case n.EarnCreditsTaskType.Subscribe:return s.subscribeLabel;case n.EarnCreditsTaskType.Shop:return s.shopNow}}var q=H;
1
+ "use strict";var g=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var F=(t,s)=>{for(var d in s)g(t,d,{get:s[d],enumerable:!0})},O=(t,s,d,f)=>{if(s&&typeof s=="object"||typeof s=="function")for(let o of R(s))!y.call(t,o)&&o!==d&&g(t,o,{get:()=>s[o],enumerable:!(f=M(s,o))||f.enumerable});return t};var V=t=>O(g({},"__esModule",{value:!0}),t);var G={};F(G,{default:()=>q});module.exports=V(G);var e=require("react/jsx-runtime"),m=require("react"),p=require("@anker-in/lib"),w=require("../../context/provider"),P=require("../../context/viewStack"),E=require("./hooks/useSubscribed"),n=require("../../type"),r=require("../../icons"),N=require("../../../credits/context/utils"),T=require("../../../../constants");function z({id:t,className:s}){switch(t){case n.EarnCreditsTaskType.Activate:return(0,e.jsx)(r.IconLock,{className:s});case n.EarnCreditsTaskType.Subscribe:return(0,e.jsx)(r.IconSubscription,{className:s});case n.EarnCreditsTaskType.Shop:return(0,e.jsx)(r.IconBag,{className:s});case n.EarnCreditsTaskType.CompleteProfile:return(0,e.jsx)(r.IconOrders,{className:s})}}function H({copy:t,onClose:s,isSubscribeSuccess:d=!1,isActivateSuccess:f=!1,isProfileCompleteSuccess:o=!1,onSubscribeSuccess:I,onActivateSuccess:_,onProfileCompleteSuccess:A}){const{profile:a,openSignUpPopup:x,alpcConfig:h,creditInfo:b}=(0,w.useMemberPopupContext)(),{pushView:u}=(0,P.useViewStack)(),{locale:B}=h,{brand:C}=(0,p.useHeadlessContext)(),v=T.ROUNDED_BRANDS.includes(C);console.log("creditInfo",b);const l=!!a,k=(0,E.useSubscribed)({userId:a?.user_id,brand:C,email:a?.email,locale:B,apiBaseUrl:h.apiBaseUrl}),S=(0,m.useMemo)(()=>o||!!(a?.first_name||a?.last_name)&&!!a?.phone_number&&!!a?.dob,[a,o]),L=(0,m.useMemo)(()=>({[n.EarnCreditsTaskType.Activate]:{finished:!!a?.activated||f,onClick:l?()=>u({type:n.MemberPopupPanelType.Activate,props:{onSuccess:_}}):x},[n.EarnCreditsTaskType.CompleteProfile]:{finished:S,onClick:l?()=>u({type:n.MemberPopupPanelType.CompleteProfile,props:{onSuccess:A}}):x},[n.EarnCreditsTaskType.Subscribe]:{finished:k||d,onClick:l?()=>u({type:n.MemberPopupPanelType.SubscribeEmail,props:{onSuccess:I}}):x},[n.EarnCreditsTaskType.Shop]:{finished:!1,link:t.goShopLink,onClick:l?void 0:x}}),[a,l,f,o,S,k,d,x,u,t.goShopLink]),U=(0,m.useMemo)(()=>t.list.map(i=>{const c=L[i.id];if(!c)return null;const D=c.finished?t.completed:l?j(i.id,t):t.joinNow;return{...i,...c,buttonLabel:D}}).filter(Boolean),[t,L,l]);return(0,e.jsxs)("div",{className:"flex flex-col gap-[16px]",children:[(0,e.jsxs)("div",{className:"flex flex-col gap-[16px]",children:[(0,e.jsx)("div",{className:"flex flex-col gap-[8px]",children:t.title&&(0,e.jsx)("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title})}),l&&(0,e.jsxs)("div",{className:(0,p.classNames)("flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]",v?"rounded-[8px]":"rounded-none"),children:[(0,e.jsxs)("div",{className:"flex flex-1 flex-col gap-[4px]",children:[(0,e.jsx)("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.balanceLabel??"AnkerCredits Balance"}),(0,e.jsxs)("div",{className:"flex items-end gap-[4px]",children:[(0,e.jsx)("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:(0,N.numberFormat)(b?.available_credit??0)}),(0,e.jsx)("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]}),(0,e.jsx)("div",{className:"h-full w-px bg-[#dadce0]"}),(0,e.jsxs)("div",{className:"flex flex-1 flex-col gap-[4px]",children:[(0,e.jsx)("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.comingSoonLabel??"Coming Soon"}),(0,e.jsxs)("div",{className:"flex items-end gap-[4px]",children:[(0,e.jsx)("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:(0,N.numberFormat)(b?.pending_credit??0)}),(0,e.jsx)("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]})]})]}),(0,e.jsxs)("div",{className:"flex flex-col gap-[16px]",children:[t.subtitle&&(0,e.jsx)("p",{className:"text-[16px] font-[700] text-[#1e2024]",children:t.subtitle}),(0,e.jsx)("div",{className:"flex flex-col",children:U.map((i,c)=>(0,e.jsxs)("div",{className:"relative py-[16px]",children:[c>0&&(0,e.jsx)("div",{className:"absolute left-0 right-0 top-0 h-px bg-[#dadce0]"}),(0,e.jsxs)("div",{className:(0,p.classNames)("flex items-center gap-[12px]",i.finished&&"opacity-60"),children:[(0,e.jsx)(z,{id:i.id,className:"size-[24px] shrink-0"}),(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)("div",{className:"text-[16px] font-[700] text-[#1e2024]",children:i.title}),i.description&&(0,e.jsx)("div",{className:"mt-[4px] text-[14px] font-[700] text-[#4a4c56]",children:i.description})]}),!i.finished&&i.link&&l?(0,e.jsx)("a",{href:i.link,target:"_blank",rel:"noopener noreferrer",className:(0,p.classNames)("cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",v?"rounded-[4px]":"rounded-none"),children:i.buttonLabel}):(0,e.jsx)("button",{className:(0,p.classNames)("cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",i.finished?"bg-[#767880]":"bg-[#080a0f]",v?"rounded-[4px]":"rounded-none"),disabled:i.finished,onClick:i.finished?void 0:i.onClick,children:i.buttonLabel})]})]},c))})]})]})}function j(t,s){switch(t){case n.EarnCreditsTaskType.Activate:return s.activate;case n.EarnCreditsTaskType.CompleteProfile:return s.completeProfileLabel;case n.EarnCreditsTaskType.Subscribe:return s.subscribeLabel;case n.EarnCreditsTaskType.Shop:return s.shopNow}}var q=H;
2
2
  //# sourceMappingURL=index.js.map
package/dist/cjs/components/memberPopup/panels/EarnCredits/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../src/components/memberPopup/panels/EarnCredits/index.tsx"],
4
- "sourcesContent": ["import { useMemo } from 'react'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useSubscribed } from './hooks/useSubscribed'\nimport { EarnCreditsTaskType, MemberPopupPanelType, type EarnCreditsCopy } from '../../type'\nimport { IconBag, IconLock, IconSubscription, IconOrders } from '../../icons'\nimport { numberFormat } from '../../../credits/context/utils'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\nfunction TaskIcon({ id, className }: { id: EarnCreditsTaskType; className?: string }) {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return <IconLock className={className} />\n case EarnCreditsTaskType.Subscribe:\n return <IconSubscription className={className} />\n case EarnCreditsTaskType.Shop:\n return <IconBag className={className} />\n case EarnCreditsTaskType.CompleteProfile:\n return <IconOrders className={className} />\n }\n}\n\ntype Props = {\n copy: EarnCreditsCopy\n onClose: () => void\n isSubscribeSuccess?: boolean\n isActivateSuccess?: boolean\n isProfileCompleteSuccess?: boolean\n onSubscribeSuccess?: () => void\n onActivateSuccess?: () => void\n onProfileCompleteSuccess?: () => void\n}\n\nfunction EarnCredits({\n copy,\n onClose,\n isSubscribeSuccess = false,\n isActivateSuccess = false,\n isProfileCompleteSuccess = false,\n onSubscribeSuccess,\n onActivateSuccess,\n onProfileCompleteSuccess,\n}: Props) {\n const { profile, openSignUpPopup, alpcConfig, creditInfo } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n console.log('creditInfo', creditInfo)\n\n const isLogin = !!profile\n\n const isSubscribed = useSubscribed({\n userId: profile?.user_id,\n brand: brand,\n email: profile?.email,\n locale,\n apiBaseUrl: alpcConfig.apiBaseUrl,\n })\n\n const profileCompleted = useMemo(() => {\n return (\n isProfileCompleteSuccess ||\n (!!(profile?.first_name || profile?.last_name) && !!profile?.phone_number && !!profile?.dob)\n )\n }, [profile, isProfileCompleteSuccess])\n\n const taskStates: Record<EarnCreditsTaskType, { finished: boolean; onClick?: () => void; link?: string }> = useMemo(\n () => ({\n [EarnCreditsTaskType.Activate]: {\n finished: !!profile?.activated || isActivateSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.Activate,\n props: { onSuccess: onActivateSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n props: { onSuccess: onProfileCompleteSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n props: { onSuccess: onSubscribeSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? undefined : openSignUpPopup,\n },\n }),\n [\n profile,\n isLogin,\n isActivateSuccess,\n isProfileCompleteSuccess,\n profileCompleted,\n isSubscribed,\n isSubscribeSuccess,\n openSignUpPopup,\n pushView,\n copy.goShopLink,\n ]\n )\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const state = taskStates[item.id]\n if (!state) return null\n const buttonLabel = state.finished\n ? copy.completed\n : isLogin\n ? getNotFinishedLabel(item.id, copy)\n : copy.joinNow\n return { ...item, ...state, buttonLabel }\n })\n .filter(Boolean) as ((typeof copy.list)[number] & {\n finished: boolean\n onClick?: () => void\n link?: string\n buttonLabel: string\n })[]\n }, [copy, taskStates, isLogin])\n\n return (\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n </div>\n\n {isLogin && (\n <div\n className={cn(\n 'flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]',\n rounded ? 'rounded-[8px]' : 'rounded-none'\n )}\n >\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.balanceLabel ?? 'AnkerCredits Balance'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.available_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n <div className=\"h-full w-px bg-[#dadce0]\" />\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.comingSoonLabel ?? 'Coming Soon'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.pending_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n </div>\n )}\n </div>\n\n <div className=\"flex flex-col gap-[16px]\">\n {copy.subtitle && <p className=\"text-[16px] font-[700] text-[#1e2024]\">{copy.subtitle}</p>}\n\n <div className=\"flex flex-col\">\n {list.map((item, idx) => (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute left-0 right-0 top-0 h-px bg-[#dadce0]\" />}\n <div className={cn('flex items-center gap-[12px]', item.finished && 'opacity-60')}>\n <TaskIcon id={item.id} className=\"size-[24px] shrink-0\" />\n <div className=\"flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024]\">{item.title}</div>\n {item.description && (\n <div className=\"mt-[4px] text-[14px] font-[700] text-[#4a4c56]\">{item.description}</div>\n )}\n </div>\n {!item.finished && item.link ? (\n <a\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={cn(\n 'cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n >\n {item.buttonLabel}\n </a>\n ) : (\n <button\n className={cn(\n 'cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n item.finished ? 'bg-[#767880]' : 'bg-[#080a0f]',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n disabled={item.finished}\n onClick={!item.finished ? item.onClick : undefined}\n >\n {item.buttonLabel}\n </button>\n )}\n </div>\n </div>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\nfunction getNotFinishedLabel(id: EarnCreditsTaskType, copy: EarnCreditsCopy): string {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return copy.activate\n case EarnCreditsTaskType.CompleteProfile:\n return copy.completeProfileLabel\n case EarnCreditsTaskType.Subscribe:\n return copy.subscribeLabel\n case EarnCreditsTaskType.Shop:\n return copy.shopNow\n }\n}\n\nexport default EarnCredits\n"],
5
- "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAaa,IAAAI,EAAA,6BAbbC,EAAwB,iBACxBC,EAAqD,yBACrDC,EAAsC,kCACtCC,EAA6B,mCAC7BC,EAA8B,iCAC9BC,EAAgF,sBAChFC,EAAgE,uBAChEC,EAA6B,0CAC7BC,EAA+B,iCAE/B,SAASC,EAAS,CAAE,GAAAC,EAAI,UAAAC,CAAU,EAAoD,CACpF,OAAQD,EAAI,CACV,KAAK,sBAAoB,SACvB,SAAO,OAAC,YAAS,UAAWC,EAAW,EACzC,KAAK,sBAAoB,UACvB,SAAO,OAAC,oBAAiB,UAAWA,EAAW,EACjD,KAAK,sBAAoB,KACvB,SAAO,OAAC,WAAQ,UAAWA,EAAW,EACxC,KAAK,sBAAoB,gBACvB,SAAO,OAAC,cAAW,UAAWA,EAAW,CAC7C,CACF,CAaA,SAASC,EAAY,CACnB,KAAAC,EACA,QAAAC,EACA,mBAAAC,EAAqB,GACrB,kBAAAC,EAAoB,GACpB,yBAAAC,EAA2B,GAC3B,mBAAAC,EACA,kBAAAC,EACA,yBAAAC,CACF,EAAU,CACR,KAAM,CAAE,QAAAC,EAAS,gBAAAC,EAAiB,WAAAC,EAAY,WAAAC,CAAW,KAAI,yBAAsB,EAC7E,CAAE,SAAAC,CAAS,KAAI,gBAAa,EAC5B,CAAE,OAAAC,CAAO,EAAIH,EACb,CAAE,MAAAI,CAAM,KAAI,sBAAmB,EAC/BC,EAAU,iBAAe,SAASD,CAAK,EAE7C,QAAQ,IAAI,aAAcH,CAAU,EAEpC,MAAMK,EAAU,CAAC,CAACR,EAEZS,KAAe,iBAAc,CACjC,OAAQT,GAAS,QACjB,MAAOM,EACP,MAAON,GAAS,MAChB,OAAAK,EACA,WAAYH,EAAW,UACzB,CAAC,EAEKQ,KAAmB,WAAQ,IAE7Bd,GACC,CAAC,EAAEI,GAAS,YAAcA,GAAS,YAAc,CAAC,CAACA,GAAS,cAAgB,CAAC,CAACA,GAAS,IAEzF,CAACA,EAASJ,CAAwB,CAAC,EAEhCe,KAAsG,WAC1G,KAAO,CACL,CAAC,sBAAoB,QAAQ,EAAG,CAC9B,SAAU,CAAC,CAACX,GAAS,WAAaL,EAClC,QAASa,EACL,IACEJ,EAAS,CACP,KAAM,uBAAqB,SAC3B,MAAO,CAAE,UAAWN,CAAkB,CACxC,CAAC,EACHG,CACN,EACA,CAAC,sBAAoB,eAAe,EAAG,CACrC,SAAUS,EACV,QAASF,EACL,IACEJ,EAAS,CACP,KAAM,uBAAqB,gBAC3B,MAAO,CAAE,UAAWL,CAAyB,CAC/C,CAAC,EACHE,CACN,EACA,CAAC,sBAAoB,SAAS,EAAG,CAC/B,SAAUQ,GAAgBf,EAC1B,QAASc,EACL,IACEJ,EAAS,CACP,KAAM,uBAAqB,eAC3B,MAAO,CAAE,UAAWP,CAAmB,CACzC,CAAC,EACHI,CACN,EACA,CAAC,sBAAoB,IAAI,EAAG,CAC1B,SAAU,GACV,KAAMT,EAAK,WACX,QAASgB,EAAU,OAAYP,CACjC,CACF,GACA,CACED,EACAQ,EACAb,EACAC,EACAc,EACAD,EACAf,EACAO,EACAG,EACAZ,EAAK,UACP,CACF,EAEMoB,KAAO,WAAQ,IACZpB,EAAK,KACT,IAAIqB,GAAQ,CACX,MAAMC,EAAQH,EAAWE,EAAK,EAAE,EAChC,GAAI,CAACC,EAAO,OAAO,KACnB,MAAMC,EAAcD,EAAM,SACtBtB,EAAK,UACLgB,EACEQ,EAAoBH,EAAK,GAAIrB,CAAI,EACjCA,EAAK,QACX,MAAO,CAAE,GAAGqB,EAAM,GAAGC,EAAO,YAAAC,CAAY,CAC1C,CAAC,EACA,OAAO,OAAO,EAMhB,CAACvB,EAAMmB,EAAYH,CAAO,CAAC,EAE9B,SACE,QAAC,OAAI,UAAU,2BACb,qBAAC,OAAI,UAAU,2BACb,oBAAC,OAAI,UAAU,0BACZ,SAAAhB,EAAK,UAAS,OAAC,MAAG,UAAU,sDAAuD,SAAAA,EAAK,MAAM,EACjG,EAECgB,MACC,QAAC,OACC,aAAW,EAAAS,YACT,qDACAV,EAAU,gBAAkB,cAC9B,EAEA,qBAAC,OAAI,UAAU,iCACb,oBAAC,OAAI,UAAU,wCAAyC,SAAAf,EAAK,cAAgB,uBAAuB,KACpG,QAAC,OAAI,UAAU,2BACb,oBAAC,QAAK,UAAU,sDACb,4BAAaW,GAAY,kBAAoB,CAAC,EACjD,KACA,OAAC,QAAK,UAAU,sDACb,SAAAX,EAAK,YAAc,eACtB,GACF,GACF,KACA,OAAC,OAAI,UAAU,2BAA2B,KAC1C,QAAC,OAAI,UAAU,iCACb,oBAAC,OAAI,UAAU,wCAAyC,SAAAA,EAAK,iBAAmB,cAAc,KAC9F,QAAC,OAAI,UAAU,2BACb,oBAAC,QAAK,UAAU,sDACb,4BAAaW,GAAY,gBAAkB,CAAC,EAC/C,KACA,OAAC,QAAK,UAAU,sDACb,SAAAX,EAAK,YAAc,eACtB,GACF,GACF,GACF,GAEJ,KAEA,QAAC,OAAI,UAAU,2BACZ,UAAAA,EAAK,aAAY,OAAC,KAAE,UAAU,wCAAyC,SAAAA,EAAK,SAAS,KAEtF,OAAC,OAAI,UAAU,gBACZ,SAAAoB,EAAK,IAAI,CAACC,EAAMK,OACf,QAAC,OAAc,UAAU,qBACtB,UAAAA,EAAM,MAAK,OAAC,OAAI,UAAU,kDAAkD,KAC7E,QAAC,OAAI,aAAW,EAAAD,YAAG,+BAAgCJ,EAAK,UAAY,YAAY,EAC9E,oBAACzB,EAAA,CAAS,GAAIyB,EAAK,GAAI,UAAU,uBAAuB,KACxD,QAAC,OAAI,UAAU,SACb,oBAAC,OAAI,UAAU,wCAAyC,SAAAA,EAAK,MAAM,EAClEA,EAAK,gBACJ,OAAC,OAAI,UAAU,iDAAkD,SAAAA,EAAK,YAAY,GAEtF,EACC,CAACA,EAAK,UAAYA,EAAK,QACtB,OAAC,KACC,KAAMA,EAAK,KACX,OAAO,SACP,IAAI,sBACJ,aAAW,EAAAI,YACT,0HACAV,EAAU,gBAAkB,cAC9B,EAEC,SAAAM,EAAK,YACR,KAEA,OAAC,UACC,aAAW,EAAAI,YACT,6GACAJ,EAAK,SAAW,eAAiB,eACjCN,EAAU,gBAAkB,cAC9B,EACA,SAAUM,EAAK,SACf,QAAUA,EAAK,SAA0B,OAAfA,EAAK,QAE9B,SAAAA,EAAK,YACR,GAEJ,IAnCQK,CAoCV,CACD,EACH,GACF,GACF,CAEJ,CAEA,SAASF,EAAoB3B,EAAyBG,EAA+B,CACnF,OAAQH,EAAI,CACV,KAAK,sBAAoB,SACvB,OAAOG,EAAK,SACd,KAAK,sBAAoB,gBACvB,OAAOA,EAAK,qBACd,KAAK,sBAAoB,UACvB,OAAOA,EAAK,eACd,KAAK,sBAAoB,KACvB,OAAOA,EAAK,OAChB,CACF,CAEA,IAAOhB,EAAQe",
4
+ "sourcesContent": ["import { useMemo } from 'react'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useSubscribed } from './hooks/useSubscribed'\nimport { EarnCreditsTaskType, MemberPopupPanelType, type EarnCreditsCopy } from '../../type'\nimport { IconBag, IconLock, IconSubscription, IconOrders } from '../../icons'\nimport { numberFormat } from '../../../credits/context/utils'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\nfunction TaskIcon({ id, className }: { id: EarnCreditsTaskType; className?: string }) {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return <IconLock className={className} />\n case EarnCreditsTaskType.Subscribe:\n return <IconSubscription className={className} />\n case EarnCreditsTaskType.Shop:\n return <IconBag className={className} />\n case EarnCreditsTaskType.CompleteProfile:\n return <IconOrders className={className} />\n }\n}\n\ntype Props = {\n copy: EarnCreditsCopy\n onClose: () => void\n isSubscribeSuccess?: boolean\n isActivateSuccess?: boolean\n isProfileCompleteSuccess?: boolean\n onSubscribeSuccess?: () => void\n onActivateSuccess?: () => void\n onProfileCompleteSuccess?: () => void\n}\n\nfunction EarnCredits({\n copy,\n onClose,\n isSubscribeSuccess = false,\n isActivateSuccess = false,\n isProfileCompleteSuccess = false,\n onSubscribeSuccess,\n onActivateSuccess,\n onProfileCompleteSuccess,\n}: Props) {\n const { profile, openSignUpPopup, alpcConfig, creditInfo } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n console.log('creditInfo', creditInfo)\n\n const isLogin = !!profile\n\n const isSubscribed = useSubscribed({\n userId: profile?.user_id,\n brand: brand,\n email: profile?.email,\n locale,\n apiBaseUrl: alpcConfig.apiBaseUrl,\n })\n\n const profileCompleted = useMemo(() => {\n return (\n isProfileCompleteSuccess ||\n (!!(profile?.first_name || profile?.last_name) && !!profile?.phone_number && !!profile?.dob)\n )\n }, [profile, isProfileCompleteSuccess])\n\n const taskStates: Record<EarnCreditsTaskType, { finished: boolean; onClick?: () => void; link?: string }> = useMemo(\n () => ({\n [EarnCreditsTaskType.Activate]: {\n finished: !!profile?.activated || isActivateSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.Activate,\n props: { onSuccess: onActivateSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n props: { onSuccess: onProfileCompleteSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n props: { onSuccess: onSubscribeSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? undefined : openSignUpPopup,\n },\n }),\n [\n profile,\n isLogin,\n isActivateSuccess,\n isProfileCompleteSuccess,\n profileCompleted,\n isSubscribed,\n isSubscribeSuccess,\n openSignUpPopup,\n pushView,\n copy.goShopLink,\n ]\n )\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const state = taskStates[item.id]\n if (!state) return null\n const buttonLabel = state.finished\n ? copy.completed\n : isLogin\n ? getNotFinishedLabel(item.id, copy)\n : copy.joinNow\n return { ...item, ...state, buttonLabel }\n })\n .filter(Boolean) as ((typeof copy.list)[number] & {\n finished: boolean\n onClick?: () => void\n link?: string\n buttonLabel: string\n })[]\n }, [copy, taskStates, isLogin])\n\n return (\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n </div>\n\n {isLogin && (\n <div\n className={cn(\n 'flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]',\n rounded ? 'rounded-[8px]' : 'rounded-none'\n )}\n >\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.balanceLabel ?? 'AnkerCredits Balance'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.available_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n <div className=\"h-full w-px bg-[#dadce0]\" />\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.comingSoonLabel ?? 'Coming Soon'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.pending_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n </div>\n )}\n </div>\n\n <div className=\"flex flex-col gap-[16px]\">\n {copy.subtitle && <p className=\"text-[16px] font-[700] text-[#1e2024]\">{copy.subtitle}</p>}\n\n <div className=\"flex flex-col\">\n {list.map((item, idx) => (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute left-0 right-0 top-0 h-px bg-[#dadce0]\" />}\n <div className={cn('flex items-center gap-[12px]', item.finished && 'opacity-60')}>\n <TaskIcon id={item.id} className=\"size-[24px] shrink-0\" />\n <div className=\"flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024]\">{item.title}</div>\n {item.description && (\n <div className=\"mt-[4px] text-[14px] font-[700] text-[#4a4c56]\">{item.description}</div>\n )}\n </div>\n {!item.finished && item.link && isLogin ? (\n <a\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={cn(\n 'cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n >\n {item.buttonLabel}\n </a>\n ) : (\n <button\n className={cn(\n 'cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n item.finished ? 'bg-[#767880]' : 'bg-[#080a0f]',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n disabled={item.finished}\n onClick={!item.finished ? item.onClick : undefined}\n >\n {item.buttonLabel}\n </button>\n )}\n </div>\n </div>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\nfunction getNotFinishedLabel(id: EarnCreditsTaskType, copy: EarnCreditsCopy): string {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return copy.activate\n case EarnCreditsTaskType.CompleteProfile:\n return copy.completeProfileLabel\n case EarnCreditsTaskType.Subscribe:\n return copy.subscribeLabel\n case EarnCreditsTaskType.Shop:\n return copy.shopNow\n }\n}\n\nexport default EarnCredits\n"],
5
+ "mappings": "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",
6
6
  "names": ["EarnCredits_exports", "__export", "EarnCredits_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_lib", "import_provider", "import_viewStack", "import_useSubscribed", "import_type", "import_icons", "import_utils", "import_constants", "TaskIcon", "id", "className", "EarnCredits", "copy", "onClose", "isSubscribeSuccess", "isActivateSuccess", "isProfileCompleteSuccess", "onSubscribeSuccess", "onActivateSuccess", "onProfileCompleteSuccess", "profile", "openSignUpPopup", "alpcConfig", "creditInfo", "pushView", "locale", "brand", "rounded", "isLogin", "isSubscribed", "profileCompleted", "taskStates", "list", "item", "state", "buttonLabel", "getNotFinishedLabel", "cn", "idx"]
7
7
  }
package/dist/esm/components/memberPopup/panels/ConsumeCredits/index.js CHANGED
@@ -1,2 +1,2 @@
1
- import{Fragment as K,jsx as r,jsxs as a}from"react/jsx-runtime";import{useMemo as S,useState as P}from"react";import{Picture as $,Button as z}from"@anker-in/headless-ui";import{classNames as R,useProductsByHandles as F,useHeadlessContext as T}from"@anker-in/lib";import{useMemberPopupContext as V}from"../../context/provider";import{useViewStack as j}from"../../context/viewStack";import{useRedeemableList as G}from"./hooks/useRedeemableList";import{useRedeemAndBuy as H}from"./hooks/useRedeemAndBuy";import{ConsumeCreditsItemType as s,MemberPopupPanelType as w}from"../../type";import{numberFormat as g}from"../../../credits/context/utils";import{ROUNDED_BRANDS as q}from"../../../../constants";function J({copy:t,onClose:Q}){const{profile:l,creditInfo:u,openSignUpPopup:_,alpcConfig:f}=V(),{pushView:v}=j(),{brand:B}=T(),b=q.includes(B),[C,N]=P(""),[D,h]=P(null),p=!!l,{redeemableList:y,listLoading:k}=G(f),{trigger:A}=H(f),M=t.list.map(e=>e.product?.handle).filter(Boolean),{data:I}=F({handles:M}),O=S(()=>t.list.map(e=>{const n=y.find(o=>String(o.id)===String(e.redeemId));if(!n)return null;const i=Number(u?.available_credit??0),m=p&&!!l?.activated&&n.consume_credits>i,c=n.is_limited&&(!n.remaining_inventory||n.remaining_inventory<=0);let d,x;return(e.type===s.RedeemAndBuy||e.type===s.Product)&&e.product&&(d=I?.find(o=>o.handle===e.product.handle),x=d?.variants?.find(o=>o.sku===e.product.sku)??d?.variants?.[0],e.type===s.RedeemAndBuy&&(!d||!x))?null:{...e,alpcData:n,insufficient:m,soldOut:c,product:d,variant:x}}).filter(Boolean),[t.list,y,u,l,p,I]);function U(e){return p?e.soldOut?t.soldOut:t.btnRedeem:t.unlockRewards}function E(e){return e.type===s.GiftCard||e.type===s.Product?e.insufficient:e.soldOut||e.insufficient}async function L(e){if(!p){_();return}if(!l?.activated){v({type:w.Activate});return}if(e.type===s.GiftCard||e.type===s.Product){t.creditsPage?.url&&window.open(t.creditsPage.url,"_blank","noopener,noreferrer");return}if(e.type===s.Coupon)v({type:w.RedeemCoupon,props:{itemTitle:e.title,itemCredits:e.alpcData.consume_credits,itemImage:t.imageMapping?.[e.type]?{url:t.imageMapping[e.type].url,alt:e.image?.alt}:e.image,itemValue:e.value,itemOff:t.off,itemRules:e.rules,redeemId:Number(e.redeemId),userId:l?.user_id,alpcConfig:f}});else{N(""),h(e.redeemId);try{await A({productVariant:e.variant,redeemId:Number(e.redeemId),userId:l?.user_id})}catch(n){N(n?.message??t.redeemModal.commonError)}finally{h(null)}}}return r(K,{children:a("div",{className:"flex flex-1 flex-col gap-[12px]",children:[a("div",{className:"flex flex-col gap-[8px]",children:[t.title&&r("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title}),t.subtitle&&r("p",{className:"text-[16px] font-[700] leading-snug text-[#4a4c56]",children:t.subtitle})]}),t.insufficientCredits&&u&&a("div",{className:"text-[14px] font-[700] text-[#1d1d1f]",children:[t.insufficientCredits,": ",g(u.available_credit)," ",t.pointUnit]}),C&&r("div",{className:"text-[14px] font-[700] text-[#f84d4f]",children:C}),k?r("div",{className:"flex flex-1 items-center justify-center py-[32px]",children:r("div",{className:"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent"})}):r("div",{className:"flex flex-col",children:O.map((e,n)=>{const i=!!e.product;return a("div",{className:"relative py-[16px]",children:[n>0&&r("div",{className:"absolute inset-x-0 top-0 h-px bg-[#dadce0]"}),a("div",{className:"flex items-center gap-[12px]",children:[(()=>{const m=t.imageMapping?.[e.type]?.url,c=i?e.variant?.image?.url??e.product?.images?.[0]?.url??e.image?.url:m??e.image?.url,d=i?e.variant?.image?.altText??e.product?.images?.[0]?.alt??e.image?.alt??"":e.image?.alt??"";return c?a("div",{className:R("relative size-[64px] shrink-0 overflow-hidden",b?"rounded-[4px]":"rounded-none"),children:[r($,{source:c,alt:d,className:"flex size-full items-center justify-center",imgClassName:i?"object-cover":"h-full w-auto object-contain"}),!i&&e.value&&a("div",{className:"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white",children:[e.value," ",t.off]})]}):null})(),a("div",{className:"min-w-0 flex-1",children:[r("div",{className:"text-[16px] font-[700] text-[#1e2024] line-clamp-2",children:i&&e.product?.title?e.product.title:e.title}),r("div",{className:"mt-[4px] text-[14px] text-[#666]",children:i&&e.price!=null?`${g(e.alpcData.consume_credits)} ${t.pointUnit??""} + $${Number(e.price).toFixed(2)}`:`${g(e.alpcData.consume_credits)} ${t.pointUnit??""}`})]}),a("div",{className:"relative group",children:[r(z,{className:R("bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",b?"rounded-[4px]":"rounded-none"),disabled:E(e),loading:D===e.redeemId,onClick:()=>L(e),children:U(e)}),e.insufficient&&r("div",{className:"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block",children:a("div",{className:"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow",children:[r("p",{className:"text-pretty tracking-[-0.02em] text-[14px]",children:t.insufficientCredits}),r("div",{className:"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]"})]})})]})]})]},n)})}),t.creditsPage?.url&&r("a",{href:t.creditsPage.url,target:"_blank",rel:"noopener noreferrer",className:"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline",children:t.creditsPage.label??"Go to Credits Page"})]})})}var se=J;export{se as default};
1
+ import{Fragment as W,jsx as r,jsxs as a}from"react/jsx-runtime";import{useMemo as z,useState as v}from"react";import{Picture as F,Button as T}from"@anker-in/headless-ui";import{classNames as R,useProductsByHandles as V,useHeadlessContext as j}from"@anker-in/lib";import{useMemberPopupContext as G}from"../../context/provider";import{useViewStack as H}from"../../context/viewStack";import{useRedeemableList as q}from"./hooks/useRedeemableList";import{useRedeemAndBuy as J}from"./hooks/useRedeemAndBuy";import{ConsumeCreditsItemType as i,MemberPopupPanelType as w}from"../../type";import{numberFormat as g}from"../../../credits/context/utils";import{ROUNDED_BRANDS as K}from"../../../../constants";function Q({copy:t,onClose:X}){const{profile:l,creditInfo:u,openSignUpPopup:_,alpcConfig:f}=G(),{pushView:b}=H(),{brand:B}=j(),C=K.includes(B),[N,h]=v(""),[D,y]=v(null),[k,A]=v(!1),p=!!l,{redeemableList:I,listLoading:S}=q(f),{trigger:M}=J(f),O=t.list.map(e=>e.product?.handle).filter(Boolean),{data:P}=V({handles:O}),U=z(()=>t.list.map(e=>{const n=I.find(o=>String(o.id)===String(e.redeemId));if(!n)return null;const s=Number(u?.available_credit??0),m=p&&!!l?.activated&&n.consume_credits>s,c=n.is_limited&&(!n.remaining_inventory||n.remaining_inventory<=0);let d,x;return(e.type===i.RedeemAndBuy||e.type===i.Product)&&e.product&&(d=P?.find(o=>o.handle===e.product.handle),x=d?.variants?.find(o=>o.sku===e.product.sku)??d?.variants?.[0],e.type===i.RedeemAndBuy&&(!d||!x))?null:{...e,alpcData:n,insufficient:m,soldOut:c,product:d,variant:x}}).filter(Boolean),[t.list,I,u,l,p,P]);function E(e){return p?e.soldOut?t.soldOut:t.btnRedeem:t.unlockRewards}function L(e){return e.type===i.GiftCard||e.type===i.Product?e.insufficient:e.soldOut||e.insufficient}async function $(e){if(!p){_();return}if(!l?.activated&&!k){b({type:w.Activate,props:{onSuccess:()=>A(!0)}});return}if(e.type===i.GiftCard||e.type===i.Product){t.creditsPage?.url&&window.open(t.creditsPage.url,"_blank","noopener,noreferrer");return}if(e.type===i.Coupon)b({type:w.RedeemCoupon,props:{itemTitle:e.title,itemCredits:e.alpcData.consume_credits,itemImage:t.imageMapping?.[e.type]?{url:t.imageMapping[e.type].url,alt:e.image?.alt}:e.image,itemValue:e.value,itemOff:t.off,itemRules:e.rules,redeemId:Number(e.redeemId),userId:l?.user_id,alpcConfig:f}});else{h(""),y(e.redeemId);try{await M({productVariant:e.variant,redeemId:Number(e.redeemId),userId:l?.user_id})}catch(n){h(n?.message??t.redeemModal.commonError)}finally{y(null)}}}return r(W,{children:a("div",{className:"flex flex-1 flex-col gap-[12px]",children:[a("div",{className:"flex flex-col gap-[8px]",children:[t.title&&r("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title}),t.subtitle&&r("p",{className:"text-[16px] font-[700] leading-snug text-[#4a4c56]",children:t.subtitle})]}),t.insufficientCredits&&u&&a("div",{className:"text-[14px] font-[700] text-[#1d1d1f]",children:[t.insufficientCredits,": ",g(u.available_credit)," ",t.pointUnit]}),N&&r("div",{className:"text-[14px] font-[700] text-[#f84d4f]",children:N}),S?r("div",{className:"flex flex-1 items-center justify-center py-[32px]",children:r("div",{className:"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent"})}):r("div",{className:"flex flex-col",children:U.map((e,n)=>{const s=!!e.product;return a("div",{className:"relative py-[16px]",children:[n>0&&r("div",{className:"absolute inset-x-0 top-0 h-px bg-[#dadce0]"}),a("div",{className:"flex items-center gap-[12px]",children:[(()=>{const m=t.imageMapping?.[e.type]?.url,c=s?e.variant?.image?.url??e.product?.images?.[0]?.url??e.image?.url:m??e.image?.url,d=s?e.variant?.image?.altText??e.product?.images?.[0]?.alt??e.image?.alt??"":e.image?.alt??"";return c?a("div",{className:R("relative size-[64px] shrink-0 overflow-hidden",C?"rounded-[4px]":"rounded-none"),children:[r(F,{source:c,alt:d,className:"flex size-full items-center justify-center",imgClassName:s?"object-cover":"h-full w-auto object-contain"}),!s&&e.value&&a("div",{className:"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white",children:[e.value," ",t.off]})]}):null})(),a("div",{className:"min-w-0 flex-1",children:[r("div",{className:"text-[16px] font-[700] text-[#1e2024] line-clamp-2",children:s&&e.product?.title?e.product.title:e.title}),r("div",{className:"mt-[4px] text-[14px] text-[#666]",children:s&&e.price!=null?`${g(e.alpcData.consume_credits)} ${t.pointUnit??""} + $${Number(e.price).toFixed(2)}`:`${g(e.alpcData.consume_credits)} ${t.pointUnit??""}`})]}),a("div",{className:"relative group",children:[r(T,{className:R("bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",C?"rounded-[4px]":"rounded-none"),disabled:L(e),loading:D===e.redeemId,onClick:()=>$(e),children:E(e)}),e.insufficient&&r("div",{className:"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block",children:a("div",{className:"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow",children:[r("p",{className:"text-pretty tracking-[-0.02em] text-[14px]",children:t.insufficientCredits}),r("div",{className:"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]"})]})})]})]})]},n)})}),t.creditsPage?.url&&r("a",{href:t.creditsPage.url,target:"_blank",rel:"noopener noreferrer",className:"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline",children:t.creditsPage.label??"Go to Credits Page"})]})})}var le=Q;export{le as default};
2
2
  //# sourceMappingURL=index.js.map
package/dist/esm/components/memberPopup/panels/ConsumeCredits/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../src/components/memberPopup/panels/ConsumeCredits/index.tsx"],
4
- "sourcesContent": ["import { useMemo, useState } from 'react'\nimport { Picture, Button } from '@anker-in/headless-ui'\nimport { classNames as cn, useProductsByHandles, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useRedeemableList } from './hooks/useRedeemableList'\nimport { useRedeemAndBuy } from './hooks/useRedeemAndBuy'\nimport {\n ConsumeCreditsItemType,\n MemberPopupPanelType,\n type ConsumeCreditsopy,\n type ConsumeCreditsItem,\n} from '../../type'\nimport { numberFormat } from '../../../credits/context/utils'\nimport type { ConsumeCreditRuleResponse } from '../../../credits/context/response'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\ntype EnrichedItem = ConsumeCreditsItem & {\n alpcData: ConsumeCreditRuleResponse\n insufficient: boolean\n soldOut: boolean\n product?: any\n variant?: any\n}\n\ntype Props = {\n copy: ConsumeCreditsopy\n onClose: () => void\n}\n\nfunction ConsumeCredits({ copy, onClose }: Props) {\n const { profile, creditInfo, openSignUpPopup, alpcConfig } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n const [redeemAndBuyError, setRedeemAndBuyError] = useState('')\n const [loadingId, setLoadingId] = useState<string | number | null>(null)\n\n const isLogin = !!profile\n const { redeemableList, listLoading } = useRedeemableList(alpcConfig)\n const { trigger: redeemAndBuy } = useRedeemAndBuy(alpcConfig)\n\n const handles = copy.list.map(item => item.product?.handle).filter(Boolean) as string[]\n const { data: products } = useProductsByHandles({ handles })\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const alpcData = redeemableList.find(r => String(r.id) === String(item.redeemId))\n if (!alpcData) return null\n\n const availableCredit = Number(creditInfo?.available_credit ?? 0)\n const insufficient = isLogin && !!profile?.activated && alpcData.consume_credits > availableCredit\n const soldOut = alpcData.is_limited && (!alpcData.remaining_inventory || alpcData.remaining_inventory <= 0)\n\n let product\n let variant\n if (\n (item.type === ConsumeCreditsItemType.RedeemAndBuy ||\n item.type === ConsumeCreditsItemType.Product) &&\n item.product\n ) {\n product = products?.find((p: any) => p.handle === item.product!.handle)\n variant = product?.variants?.find((v: any) => v.sku === item.product!.sku) ?? product?.variants?.[0]\n if (item.type === ConsumeCreditsItemType.RedeemAndBuy && (!product || !variant)) return null\n }\n\n return { ...item, alpcData, insufficient, soldOut, product, variant }\n })\n .filter(Boolean) as EnrichedItem[]\n }, [copy.list, redeemableList, creditInfo, profile, isLogin, products])\n\n function getButtonLabel(item: (typeof list)[number]) {\n if (!isLogin) return copy.unlockRewards\n if (item.soldOut) return copy.soldOut\n return copy.btnRedeem\n }\n\n function isDisabled(item: (typeof list)[number]) {\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n return item.insufficient\n }\n return item.soldOut || item.insufficient\n }\n\n async function handleRedeem(item: (typeof list)[number]) {\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n if (!profile?.activated) {\n pushView({ type: MemberPopupPanelType.Activate })\n return\n }\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n if (copy.creditsPage?.url) {\n window.open(copy.creditsPage.url, '_blank', 'noopener,noreferrer')\n }\n return\n }\n if (item.type === ConsumeCreditsItemType.Coupon) {\n pushView({\n type: MemberPopupPanelType.RedeemCoupon,\n props: {\n itemTitle: item.title,\n itemCredits: item.alpcData.consume_credits,\n itemImage: copy.imageMapping?.[item.type]\n ? { url: copy.imageMapping[item.type]!.url, alt: item.image?.alt }\n : item.image,\n itemValue: item.value,\n itemOff: copy.off,\n itemRules: item.rules,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n alpcConfig,\n },\n })\n } else {\n setRedeemAndBuyError('')\n setLoadingId(item.redeemId)\n try {\n await redeemAndBuy({\n productVariant: item.variant,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n })\n } catch (e: any) {\n setRedeemAndBuyError(e?.message ?? copy.redeemModal.commonError)\n } finally {\n setLoadingId(null)\n }\n }\n }\n\n return (\n <>\n <div className=\"flex flex-1 flex-col gap-[12px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n {copy.subtitle && <p className=\"text-[16px] font-[700] leading-snug text-[#4a4c56]\">{copy.subtitle}</p>}\n </div>\n\n {copy.insufficientCredits && creditInfo && (\n <div className=\"text-[14px] font-[700] text-[#1d1d1f]\">\n {copy.insufficientCredits}: {numberFormat(creditInfo.available_credit)} {copy.pointUnit}\n </div>\n )}\n {redeemAndBuyError && <div className=\"text-[14px] font-[700] text-[#f84d4f]\">{redeemAndBuyError}</div>}\n\n {listLoading ? (\n <div className=\"flex flex-1 items-center justify-center py-[32px]\">\n <div className=\"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent\" />\n </div>\n ) : (\n <div className=\"flex flex-col\">\n {list.map((item, idx) => {\n const hasProduct = !!item.product\n return (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute inset-x-0 top-0 h-px bg-[#dadce0]\" />}\n <div className=\"flex items-center gap-[12px]\">\n {(() => {\n const mappedImgUrl = copy.imageMapping?.[item.type]?.url\n const imgUrl = hasProduct\n ? (item.variant?.image?.url ?? item.product?.images?.[0]?.url ?? item.image?.url)\n : (mappedImgUrl ?? item.image?.url)\n const imgAlt = hasProduct\n ? (item.variant?.image?.altText ?? item.product?.images?.[0]?.alt ?? item.image?.alt ?? '')\n : (item.image?.alt ?? '')\n if (!imgUrl) return null\n return (\n <div className={cn('relative size-[64px] shrink-0 overflow-hidden', rounded ? 'rounded-[4px]' : 'rounded-none')}>\n <Picture\n source={imgUrl}\n alt={imgAlt}\n className=\"flex size-full items-center justify-center\"\n imgClassName={hasProduct ? 'object-cover' : 'h-full w-auto object-contain'}\n />\n {!hasProduct && item.value && (\n <div className=\"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white\">\n {item.value} {copy.off}\n </div>\n )}\n </div>\n )\n })()}\n <div className=\"min-w-0 flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024] line-clamp-2\">\n {hasProduct && item.product?.title\n ? item.product.title\n : item.title}\n </div>\n <div className=\"mt-[4px] text-[14px] text-[#666]\">\n {hasProduct && item.price != null\n ? `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''} + $${Number(item.price).toFixed(2)}`\n : `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''}`}\n </div>\n </div>\n <div className=\"relative group\">\n <Button\n className={cn('bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white', rounded ? 'rounded-[4px]' : 'rounded-none')}\n disabled={isDisabled(item)}\n loading={loadingId === item.redeemId}\n onClick={() => handleRedeem(item)}\n >\n {getButtonLabel(item)}\n </Button>\n {item.insufficient && (\n <div className=\"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block\">\n <div className=\"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow\">\n <p className=\"text-pretty tracking-[-0.02em] text-[14px]\">{copy.insufficientCredits}</p>\n <div className=\"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n })}\n </div>\n )}\n\n {copy.creditsPage?.url && (\n <a\n href={copy.creditsPage.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline\"\n >\n {copy.creditsPage.label ?? 'Go to Credits Page'}\n </a>\n )}\n </div>\n </>\n )\n}\n\nexport default ConsumeCredits\n"],
5
- "mappings": "AA8II,mBAAAA,EAGqB,OAAAC,EADjB,QAAAC,MAFJ,oBA9IJ,OAAS,WAAAC,EAAS,YAAAC,MAAgB,QAClC,OAAS,WAAAC,EAAS,UAAAC,MAAc,wBAChC,OAAS,cAAcC,EAAI,wBAAAC,EAAsB,sBAAAC,MAA0B,gBAC3E,OAAS,yBAAAC,MAA6B,yBACtC,OAAS,gBAAAC,MAAoB,0BAC7B,OAAS,qBAAAC,MAAyB,4BAClC,OAAS,mBAAAC,MAAuB,0BAChC,OACE,0BAAAC,EACA,wBAAAC,MAGK,aACP,OAAS,gBAAAC,MAAoB,iCAE7B,OAAS,kBAAAC,MAAsB,wBAe/B,SAASC,EAAe,CAAE,KAAAC,EAAM,QAAAC,CAAQ,EAAU,CAChD,KAAM,CAAE,QAAAC,EAAS,WAAAC,EAAY,gBAAAC,EAAiB,WAAAC,CAAW,EAAId,EAAsB,EAC7E,CAAE,SAAAe,CAAS,EAAId,EAAa,EAC5B,CAAE,MAAAe,CAAM,EAAIjB,EAAmB,EAC/BkB,EAAUV,EAAe,SAASS,CAAK,EAEvC,CAACE,EAAmBC,CAAoB,EAAIzB,EAAS,EAAE,EACvD,CAAC0B,EAAWC,CAAY,EAAI3B,EAAiC,IAAI,EAEjE4B,EAAU,CAAC,CAACX,EACZ,CAAE,eAAAY,EAAgB,YAAAC,CAAY,EAAItB,EAAkBY,CAAU,EAC9D,CAAE,QAASW,CAAa,EAAItB,EAAgBW,CAAU,EAEtDY,EAAUjB,EAAK,KAAK,IAAIkB,GAAQA,EAAK,SAAS,MAAM,EAAE,OAAO,OAAO,EACpE,CAAE,KAAMC,CAAS,EAAI9B,EAAqB,CAAE,QAAA4B,CAAQ,CAAC,EAErDG,EAAOpC,EAAQ,IACZgB,EAAK,KACT,IAAIkB,GAAQ,CACX,MAAMG,EAAWP,EAAe,KAAKQ,GAAK,OAAOA,EAAE,EAAE,IAAM,OAAOJ,EAAK,QAAQ,CAAC,EAChF,GAAI,CAACG,EAAU,OAAO,KAEtB,MAAME,EAAkB,OAAOpB,GAAY,kBAAoB,CAAC,EAC1DqB,EAAeX,GAAW,CAAC,CAACX,GAAS,WAAamB,EAAS,gBAAkBE,EAC7EE,EAAUJ,EAAS,aAAe,CAACA,EAAS,qBAAuBA,EAAS,qBAAuB,GAEzG,IAAIK,EACAC,EACJ,OACGT,EAAK,OAASvB,EAAuB,cACpCuB,EAAK,OAASvB,EAAuB,UACvCuB,EAAK,UAELQ,EAAUP,GAAU,KAAMS,GAAWA,EAAE,SAAWV,EAAK,QAAS,MAAM,EACtES,EAAUD,GAAS,UAAU,KAAMG,GAAWA,EAAE,MAAQX,EAAK,QAAS,GAAG,GAAKQ,GAAS,WAAW,CAAC,EAC/FR,EAAK,OAASvB,EAAuB,eAAiB,CAAC+B,GAAW,CAACC,IAAiB,KAGnF,CAAE,GAAGT,EAAM,SAAAG,EAAU,aAAAG,EAAc,QAAAC,EAAS,QAAAC,EAAS,QAAAC,CAAQ,CACtE,CAAC,EACA,OAAO,OAAO,EAChB,CAAC3B,EAAK,KAAMc,EAAgBX,EAAYD,EAASW,EAASM,CAAQ,CAAC,EAEtE,SAASW,EAAeZ,EAA6B,CACnD,OAAKL,EACDK,EAAK,QAAgBlB,EAAK,QACvBA,EAAK,UAFSA,EAAK,aAG5B,CAEA,SAAS+B,EAAWb,EAA6B,CAC/C,OACEA,EAAK,OAASvB,EAAuB,UACrCuB,EAAK,OAASvB,EAAuB,QAE9BuB,EAAK,aAEPA,EAAK,SAAWA,EAAK,YAC9B,CAEA,eAAec,EAAad,EAA6B,CACvD,GAAI,CAACL,EAAS,CACZT,EAAgB,EAChB,MACF,CACA,GAAI,CAACF,GAAS,UAAW,CACvBI,EAAS,CAAE,KAAMV,EAAqB,QAAS,CAAC,EAChD,MACF,CACA,GACEsB,EAAK,OAASvB,EAAuB,UACrCuB,EAAK,OAASvB,EAAuB,QACrC,CACIK,EAAK,aAAa,KACpB,OAAO,KAAKA,EAAK,YAAY,IAAK,SAAU,qBAAqB,EAEnE,MACF,CACA,GAAIkB,EAAK,OAASvB,EAAuB,OACvCW,EAAS,CACP,KAAMV,EAAqB,aAC3B,MAAO,CACL,UAAWsB,EAAK,MAChB,YAAaA,EAAK,SAAS,gBAC3B,UAAWlB,EAAK,eAAekB,EAAK,IAAI,EACpC,CAAE,IAAKlB,EAAK,aAAakB,EAAK,IAAI,EAAG,IAAK,IAAKA,EAAK,OAAO,GAAI,EAC/DA,EAAK,MACT,UAAWA,EAAK,MAChB,QAASlB,EAAK,IACd,UAAWkB,EAAK,MAChB,SAAU,OAAOA,EAAK,QAAQ,EAC9B,OAAQhB,GAAS,QACjB,WAAAG,CACF,CACF,CAAC,MACI,CACLK,EAAqB,EAAE,EACvBE,EAAaM,EAAK,QAAQ,EAC1B,GAAI,CACF,MAAMF,EAAa,CACjB,eAAgBE,EAAK,QACrB,SAAU,OAAOA,EAAK,QAAQ,EAC9B,OAAQhB,GAAS,OACnB,CAAC,CACH,OAAS+B,EAAQ,CACfvB,EAAqBuB,GAAG,SAAWjC,EAAK,YAAY,WAAW,CACjE,QAAE,CACAY,EAAa,IAAI,CACnB,CACF,CACF,CAEA,OACE9B,EAAAD,EAAA,CACE,SAAAE,EAAC,OAAI,UAAU,kCACb,UAAAA,EAAC,OAAI,UAAU,0BACZ,UAAAiB,EAAK,OAASlB,EAAC,MAAG,UAAU,sDAAuD,SAAAkB,EAAK,MAAM,EAC9FA,EAAK,UAAYlB,EAAC,KAAE,UAAU,qDAAsD,SAAAkB,EAAK,SAAS,GACrG,EAECA,EAAK,qBAAuBG,GAC3BpB,EAAC,OAAI,UAAU,wCACZ,UAAAiB,EAAK,oBAAoB,KAAGH,EAAaM,EAAW,gBAAgB,EAAE,IAAEH,EAAK,WAChF,EAEDS,GAAqB3B,EAAC,OAAI,UAAU,wCAAyC,SAAA2B,EAAkB,EAE/FM,EACCjC,EAAC,OAAI,UAAU,oDACb,SAAAA,EAAC,OAAI,UAAU,2FAA2F,EAC5G,EAEAA,EAAC,OAAI,UAAU,gBACd,SAAAsC,EAAK,IAAI,CAACF,EAAMgB,IAAQ,CACvB,MAAMC,EAAa,CAAC,CAACjB,EAAK,QAC1B,OACAnC,EAAC,OAAc,UAAU,qBACtB,UAAAmD,EAAM,GAAKpD,EAAC,OAAI,UAAU,6CAA6C,EACxEC,EAAC,OAAI,UAAU,+BACX,eAAM,CACN,MAAMqD,EAAepC,EAAK,eAAekB,EAAK,IAAI,GAAG,IAC/CmB,EAASF,EACVjB,EAAK,SAAS,OAAO,KAAOA,EAAK,SAAS,SAAS,CAAC,GAAG,KAAOA,EAAK,OAAO,IAC1EkB,GAAgBlB,EAAK,OAAO,IAC3BoB,EAASH,EACVjB,EAAK,SAAS,OAAO,SAAWA,EAAK,SAAS,SAAS,CAAC,GAAG,KAAOA,EAAK,OAAO,KAAO,GACrFA,EAAK,OAAO,KAAO,GACxB,OAAKmB,EAEHtD,EAAC,OAAI,UAAWK,EAAG,gDAAiDoB,EAAU,gBAAkB,cAAc,EAC5G,UAAA1B,EAACI,EAAA,CACC,OAAQmD,EACR,IAAKC,EACL,UAAU,6CACV,aAAcH,EAAa,eAAiB,+BAC9C,EACC,CAACA,GAAcjB,EAAK,OACnBnC,EAAC,OAAI,UAAU,mFACZ,UAAAmC,EAAK,MAAM,IAAElB,EAAK,KACrB,GAEJ,EAdkB,IAgBtB,GAAG,EACHjB,EAAC,OAAI,UAAU,iBACb,UAAAD,EAAC,OAAI,UAAU,qDACZ,SAAAqD,GAAcjB,EAAK,SAAS,MACzBA,EAAK,QAAQ,MACbA,EAAK,MACX,EACApC,EAAC,OAAI,UAAU,mCACZ,SAAAqD,GAAcjB,EAAK,OAAS,KACzB,GAAGrB,EAAaqB,EAAK,SAAS,eAAe,CAAC,IAAIlB,EAAK,WAAa,EAAE,OAAO,OAAOkB,EAAK,KAAK,EAAE,QAAQ,CAAC,CAAC,GAC1G,GAAGrB,EAAaqB,EAAK,SAAS,eAAe,CAAC,IAAIlB,EAAK,WAAa,EAAE,GAC5E,GACF,EACAjB,EAAC,OAAI,UAAU,iBACb,UAAAD,EAACK,EAAA,CACC,UAAWC,EAAG,6FAA8FoB,EAAU,gBAAkB,cAAc,EACtJ,SAAUuB,EAAWb,CAAI,EACzB,QAASP,IAAcO,EAAK,SAC5B,QAAS,IAAMc,EAAad,CAAI,EAE/B,SAAAY,EAAeZ,CAAI,EACtB,EACCA,EAAK,cACJpC,EAAC,OAAI,UAAU,qGACb,SAAAC,EAAC,OAAI,UAAU,0EACb,UAAAD,EAAC,KAAE,UAAU,6CAA8C,SAAAkB,EAAK,oBAAoB,EACpFlB,EAAC,OAAI,UAAU,oGAAoG,GACrH,EACF,GAEJ,GACF,IA1DQoD,CA2DV,CAEF,CAAC,EACH,EAGClC,EAAK,aAAa,KACjBlB,EAAC,KACC,KAAMkB,EAAK,YAAY,IACvB,OAAO,SACP,IAAI,sBACJ,UAAU,qEAET,SAAAA,EAAK,YAAY,OAAS,qBAC7B,GAEJ,EACF,CAEJ,CAEA,IAAOuC,GAAQxC",
6
- "names": ["Fragment", "jsx", "jsxs", "useMemo", "useState", "Picture", "Button", "cn", "useProductsByHandles", "useHeadlessContext", "useMemberPopupContext", "useViewStack", "useRedeemableList", "useRedeemAndBuy", "ConsumeCreditsItemType", "MemberPopupPanelType", "numberFormat", "ROUNDED_BRANDS", "ConsumeCredits", "copy", "onClose", "profile", "creditInfo", "openSignUpPopup", "alpcConfig", "pushView", "brand", "rounded", "redeemAndBuyError", "setRedeemAndBuyError", "loadingId", "setLoadingId", "isLogin", "redeemableList", "listLoading", "redeemAndBuy", "handles", "item", "products", "list", "alpcData", "r", "availableCredit", "insufficient", "soldOut", "product", "variant", "p", "v", "getButtonLabel", "isDisabled", "handleRedeem", "e", "idx", "hasProduct", "mappedImgUrl", "imgUrl", "imgAlt", "ConsumeCredits_default"]
4
+ "sourcesContent": ["import { useMemo, useState } from 'react'\nimport { Picture, Button } from '@anker-in/headless-ui'\nimport { classNames as cn, useProductsByHandles, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useRedeemableList } from './hooks/useRedeemableList'\nimport { useRedeemAndBuy } from './hooks/useRedeemAndBuy'\nimport {\n ConsumeCreditsItemType,\n MemberPopupPanelType,\n type ConsumeCreditsopy,\n type ConsumeCreditsItem,\n} from '../../type'\nimport { numberFormat } from '../../../credits/context/utils'\nimport type { ConsumeCreditRuleResponse } from '../../../credits/context/response'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\ntype EnrichedItem = ConsumeCreditsItem & {\n alpcData: ConsumeCreditRuleResponse\n insufficient: boolean\n soldOut: boolean\n product?: any\n variant?: any\n}\n\ntype Props = {\n copy: ConsumeCreditsopy\n onClose: () => void\n}\n\nfunction ConsumeCredits({ copy, onClose }: Props) {\n const { profile, creditInfo, openSignUpPopup, alpcConfig } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n const [redeemAndBuyError, setRedeemAndBuyError] = useState('')\n const [loadingId, setLoadingId] = useState<string | number | null>(null)\n const [isActivateSuccess, setIsActivateSuccess] = useState(false)\n\n const isLogin = !!profile\n const { redeemableList, listLoading } = useRedeemableList(alpcConfig)\n const { trigger: redeemAndBuy } = useRedeemAndBuy(alpcConfig)\n\n const handles = copy.list.map(item => item.product?.handle).filter(Boolean) as string[]\n const { data: products } = useProductsByHandles({ handles })\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const alpcData = redeemableList.find(r => String(r.id) === String(item.redeemId))\n if (!alpcData) return null\n\n const availableCredit = Number(creditInfo?.available_credit ?? 0)\n const insufficient = isLogin && !!profile?.activated && alpcData.consume_credits > availableCredit\n const soldOut = alpcData.is_limited && (!alpcData.remaining_inventory || alpcData.remaining_inventory <= 0)\n\n let product\n let variant\n if (\n (item.type === ConsumeCreditsItemType.RedeemAndBuy ||\n item.type === ConsumeCreditsItemType.Product) &&\n item.product\n ) {\n product = products?.find((p: any) => p.handle === item.product!.handle)\n variant = product?.variants?.find((v: any) => v.sku === item.product!.sku) ?? product?.variants?.[0]\n if (item.type === ConsumeCreditsItemType.RedeemAndBuy && (!product || !variant)) return null\n }\n\n return { ...item, alpcData, insufficient, soldOut, product, variant }\n })\n .filter(Boolean) as EnrichedItem[]\n }, [copy.list, redeemableList, creditInfo, profile, isLogin, products])\n\n function getButtonLabel(item: (typeof list)[number]) {\n if (!isLogin) return copy.unlockRewards\n if (item.soldOut) return copy.soldOut\n return copy.btnRedeem\n }\n\n function isDisabled(item: (typeof list)[number]) {\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n return item.insufficient\n }\n return item.soldOut || item.insufficient\n }\n\n async function handleRedeem(item: (typeof list)[number]) {\n if (!isLogin) {\n openSignUpPopup()\n return\n }\n if (!profile?.activated && !isActivateSuccess) {\n pushView({\n type: MemberPopupPanelType.Activate,\n props: { onSuccess: () => setIsActivateSuccess(true) },\n })\n return\n }\n if (\n item.type === ConsumeCreditsItemType.GiftCard ||\n item.type === ConsumeCreditsItemType.Product\n ) {\n if (copy.creditsPage?.url) {\n window.open(copy.creditsPage.url, '_blank', 'noopener,noreferrer')\n }\n return\n }\n if (item.type === ConsumeCreditsItemType.Coupon) {\n pushView({\n type: MemberPopupPanelType.RedeemCoupon,\n props: {\n itemTitle: item.title,\n itemCredits: item.alpcData.consume_credits,\n itemImage: copy.imageMapping?.[item.type]\n ? { url: copy.imageMapping[item.type]!.url, alt: item.image?.alt }\n : item.image,\n itemValue: item.value,\n itemOff: copy.off,\n itemRules: item.rules,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n alpcConfig,\n },\n })\n } else {\n setRedeemAndBuyError('')\n setLoadingId(item.redeemId)\n try {\n await redeemAndBuy({\n productVariant: item.variant,\n redeemId: Number(item.redeemId),\n userId: profile?.user_id,\n })\n } catch (e: any) {\n setRedeemAndBuyError(e?.message ?? copy.redeemModal.commonError)\n } finally {\n setLoadingId(null)\n }\n }\n }\n\n return (\n <>\n <div className=\"flex flex-1 flex-col gap-[12px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n {copy.subtitle && <p className=\"text-[16px] font-[700] leading-snug text-[#4a4c56]\">{copy.subtitle}</p>}\n </div>\n\n {copy.insufficientCredits && creditInfo && (\n <div className=\"text-[14px] font-[700] text-[#1d1d1f]\">\n {copy.insufficientCredits}: {numberFormat(creditInfo.available_credit)} {copy.pointUnit}\n </div>\n )}\n {redeemAndBuyError && <div className=\"text-[14px] font-[700] text-[#f84d4f]\">{redeemAndBuyError}</div>}\n\n {listLoading ? (\n <div className=\"flex flex-1 items-center justify-center py-[32px]\">\n <div className=\"size-[32px] animate-spin rounded-full border-[3px] border-[#080a0f] border-t-transparent\" />\n </div>\n ) : (\n <div className=\"flex flex-col\">\n {list.map((item, idx) => {\n const hasProduct = !!item.product\n return (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute inset-x-0 top-0 h-px bg-[#dadce0]\" />}\n <div className=\"flex items-center gap-[12px]\">\n {(() => {\n const mappedImgUrl = copy.imageMapping?.[item.type]?.url\n const imgUrl = hasProduct\n ? (item.variant?.image?.url ?? item.product?.images?.[0]?.url ?? item.image?.url)\n : (mappedImgUrl ?? item.image?.url)\n const imgAlt = hasProduct\n ? (item.variant?.image?.altText ?? item.product?.images?.[0]?.alt ?? item.image?.alt ?? '')\n : (item.image?.alt ?? '')\n if (!imgUrl) return null\n return (\n <div className={cn('relative size-[64px] shrink-0 overflow-hidden', rounded ? 'rounded-[4px]' : 'rounded-none')}>\n <Picture\n source={imgUrl}\n alt={imgAlt}\n className=\"flex size-full items-center justify-center\"\n imgClassName={hasProduct ? 'object-cover' : 'h-full w-auto object-contain'}\n />\n {!hasProduct && item.value && (\n <div className=\"absolute bottom-[16px] left-[4px] text-[12px] font-[800] leading-none text-white\">\n {item.value} {copy.off}\n </div>\n )}\n </div>\n )\n })()}\n <div className=\"min-w-0 flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024] line-clamp-2\">\n {hasProduct && item.product?.title\n ? item.product.title\n : item.title}\n </div>\n <div className=\"mt-[4px] text-[14px] text-[#666]\">\n {hasProduct && item.price != null\n ? `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''} + $${Number(item.price).toFixed(2)}`\n : `${numberFormat(item.alpcData.consume_credits)} ${copy.pointUnit ?? ''}`}\n </div>\n </div>\n <div className=\"relative group\">\n <Button\n className={cn('bg-[#080a0f] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white', rounded ? 'rounded-[4px]' : 'rounded-none')}\n disabled={isDisabled(item)}\n loading={loadingId === item.redeemId}\n onClick={() => handleRedeem(item)}\n >\n {getButtonLabel(item)}\n </Button>\n {item.insufficient && (\n <div className=\"pointer-events-none absolute right-0 top-full z-[100] mt-[10px] hidden w-[200px] group-hover:block\">\n <div className=\"relative bg-[#6D6D6F] p-[16px] text-[14px] font-[700] text-white shadow\">\n <p className=\"text-pretty tracking-[-0.02em] text-[14px]\">{copy.insufficientCredits}</p>\n <div className=\"absolute -top-[8px] right-[20px] size-[16px] origin-top-left rotate-45 rounded-[2px] bg-[#6D6D6F]\" />\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n )\n })}\n </div>\n )}\n\n {copy.creditsPage?.url && (\n <a\n href={copy.creditsPage.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"mt-auto self-start text-[14px] font-[700] text-[#080a0f] underline\"\n >\n {copy.creditsPage.label ?? 'Go to Credits Page'}\n </a>\n )}\n </div>\n </>\n )\n}\n\nexport default ConsumeCredits\n"],
5
+ "mappings": "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",
6
+ "names": ["Fragment", "jsx", "jsxs", "useMemo", "useState", "Picture", "Button", "cn", "useProductsByHandles", "useHeadlessContext", "useMemberPopupContext", "useViewStack", "useRedeemableList", "useRedeemAndBuy", "ConsumeCreditsItemType", "MemberPopupPanelType", "numberFormat", "ROUNDED_BRANDS", "ConsumeCredits", "copy", "onClose", "profile", "creditInfo", "openSignUpPopup", "alpcConfig", "pushView", "brand", "rounded", "redeemAndBuyError", "setRedeemAndBuyError", "loadingId", "setLoadingId", "isActivateSuccess", "setIsActivateSuccess", "isLogin", "redeemableList", "listLoading", "redeemAndBuy", "handles", "item", "products", "list", "alpcData", "r", "availableCredit", "insufficient", "soldOut", "product", "variant", "p", "v", "getButtonLabel", "isDisabled", "handleRedeem", "e", "idx", "hasProduct", "mappedImgUrl", "imgUrl", "imgAlt", "ConsumeCredits_default"]
7
7
  }
package/dist/esm/components/memberPopup/panels/EarnCredits/index.js CHANGED
@@ -1,2 +1,2 @@
1
- import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useMemo as m}from"react";import{classNames as c,useHeadlessContext as A}from"@anker-in/lib";import{useMemberPopupContext as B}from"../../context/provider";import{useViewStack as U}from"../../context/viewStack";import{useSubscribed as D}from"./hooks/useSubscribed";import{EarnCreditsTaskType as i,MemberPopupPanelType as b}from"../../type";import{IconBag as M,IconLock as R,IconSubscription as y,IconOrders as F}from"../../icons";import{numberFormat as L}from"../../../credits/context/utils";import{ROUNDED_BRANDS as O}from"../../../../constants";function V({id:t,className:a}){switch(t){case i.Activate:return e(R,{className:a});case i.Subscribe:return e(y,{className:a});case i.Shop:return e(M,{className:a});case i.CompleteProfile:return e(F,{className:a})}}function z({copy:t,onClose:a,isSubscribeSuccess:v=!1,isActivateSuccess:g=!1,isProfileCompleteSuccess:f=!1,onSubscribeSuccess:w,onActivateSuccess:P,onProfileCompleteSuccess:E}){const{profile:o,openSignUpPopup:d,alpcConfig:N,creditInfo:x}=B(),{pushView:p}=U(),{locale:T}=N,{brand:h}=A(),u=O.includes(h);console.log("creditInfo",x);const l=!!o,C=D({userId:o?.user_id,brand:h,email:o?.email,locale:T,apiBaseUrl:N.apiBaseUrl}),k=m(()=>f||!!(o?.first_name||o?.last_name)&&!!o?.phone_number&&!!o?.dob,[o,f]),S=m(()=>({[i.Activate]:{finished:!!o?.activated||g,onClick:l?()=>p({type:b.Activate,props:{onSuccess:P}}):d},[i.CompleteProfile]:{finished:k,onClick:l?()=>p({type:b.CompleteProfile,props:{onSuccess:E}}):d},[i.Subscribe]:{finished:C||v,onClick:l?()=>p({type:b.SubscribeEmail,props:{onSuccess:w}}):d},[i.Shop]:{finished:!1,link:t.goShopLink,onClick:l?void 0:d}}),[o,l,g,f,k,C,v,d,p,t.goShopLink]),I=m(()=>t.list.map(s=>{const r=S[s.id];if(!r)return null;const _=r.finished?t.completed:l?H(s.id,t):t.joinNow;return{...s,...r,buttonLabel:_}}).filter(Boolean),[t,S,l]);return n("div",{className:"flex flex-col gap-[16px]",children:[n("div",{className:"flex flex-col gap-[16px]",children:[e("div",{className:"flex flex-col gap-[8px]",children:t.title&&e("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title})}),l&&n("div",{className:c("flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]",u?"rounded-[8px]":"rounded-none"),children:[n("div",{className:"flex flex-1 flex-col gap-[4px]",children:[e("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.balanceLabel??"AnkerCredits Balance"}),n("div",{className:"flex items-end gap-[4px]",children:[e("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:L(x?.available_credit??0)}),e("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]}),e("div",{className:"h-full w-px bg-[#dadce0]"}),n("div",{className:"flex flex-1 flex-col gap-[4px]",children:[e("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.comingSoonLabel??"Coming Soon"}),n("div",{className:"flex items-end gap-[4px]",children:[e("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:L(x?.pending_credit??0)}),e("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]})]})]}),n("div",{className:"flex flex-col gap-[16px]",children:[t.subtitle&&e("p",{className:"text-[16px] font-[700] text-[#1e2024]",children:t.subtitle}),e("div",{className:"flex flex-col",children:I.map((s,r)=>n("div",{className:"relative py-[16px]",children:[r>0&&e("div",{className:"absolute left-0 right-0 top-0 h-px bg-[#dadce0]"}),n("div",{className:c("flex items-center gap-[12px]",s.finished&&"opacity-60"),children:[e(V,{id:s.id,className:"size-[24px] shrink-0"}),n("div",{className:"flex-1",children:[e("div",{className:"text-[16px] font-[700] text-[#1e2024]",children:s.title}),s.description&&e("div",{className:"mt-[4px] text-[14px] font-[700] text-[#4a4c56]",children:s.description})]}),!s.finished&&s.link?e("a",{href:s.link,target:"_blank",rel:"noopener noreferrer",className:c("cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",u?"rounded-[4px]":"rounded-none"),children:s.buttonLabel}):e("button",{className:c("cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",s.finished?"bg-[#767880]":"bg-[#080a0f]",u?"rounded-[4px]":"rounded-none"),disabled:s.finished,onClick:s.finished?void 0:s.onClick,children:s.buttonLabel})]})]},r))})]})]})}function H(t,a){switch(t){case i.Activate:return a.activate;case i.CompleteProfile:return a.completeProfileLabel;case i.Subscribe:return a.subscribeLabel;case i.Shop:return a.shopNow}}var Z=z;export{Z as default};
1
+ import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useMemo as m}from"react";import{classNames as c,useHeadlessContext as A}from"@anker-in/lib";import{useMemberPopupContext as B}from"../../context/provider";import{useViewStack as U}from"../../context/viewStack";import{useSubscribed as D}from"./hooks/useSubscribed";import{EarnCreditsTaskType as i,MemberPopupPanelType as b}from"../../type";import{IconBag as M,IconLock as R,IconSubscription as y,IconOrders as F}from"../../icons";import{numberFormat as L}from"../../../credits/context/utils";import{ROUNDED_BRANDS as O}from"../../../../constants";function V({id:t,className:a}){switch(t){case i.Activate:return e(R,{className:a});case i.Subscribe:return e(y,{className:a});case i.Shop:return e(M,{className:a});case i.CompleteProfile:return e(F,{className:a})}}function z({copy:t,onClose:a,isSubscribeSuccess:v=!1,isActivateSuccess:g=!1,isProfileCompleteSuccess:f=!1,onSubscribeSuccess:w,onActivateSuccess:P,onProfileCompleteSuccess:E}){const{profile:o,openSignUpPopup:d,alpcConfig:N,creditInfo:x}=B(),{pushView:p}=U(),{locale:T}=N,{brand:h}=A(),u=O.includes(h);console.log("creditInfo",x);const l=!!o,C=D({userId:o?.user_id,brand:h,email:o?.email,locale:T,apiBaseUrl:N.apiBaseUrl}),k=m(()=>f||!!(o?.first_name||o?.last_name)&&!!o?.phone_number&&!!o?.dob,[o,f]),S=m(()=>({[i.Activate]:{finished:!!o?.activated||g,onClick:l?()=>p({type:b.Activate,props:{onSuccess:P}}):d},[i.CompleteProfile]:{finished:k,onClick:l?()=>p({type:b.CompleteProfile,props:{onSuccess:E}}):d},[i.Subscribe]:{finished:C||v,onClick:l?()=>p({type:b.SubscribeEmail,props:{onSuccess:w}}):d},[i.Shop]:{finished:!1,link:t.goShopLink,onClick:l?void 0:d}}),[o,l,g,f,k,C,v,d,p,t.goShopLink]),I=m(()=>t.list.map(s=>{const r=S[s.id];if(!r)return null;const _=r.finished?t.completed:l?H(s.id,t):t.joinNow;return{...s,...r,buttonLabel:_}}).filter(Boolean),[t,S,l]);return n("div",{className:"flex flex-col gap-[16px]",children:[n("div",{className:"flex flex-col gap-[16px]",children:[e("div",{className:"flex flex-col gap-[8px]",children:t.title&&e("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:t.title})}),l&&n("div",{className:c("flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]",u?"rounded-[8px]":"rounded-none"),children:[n("div",{className:"flex flex-1 flex-col gap-[4px]",children:[e("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.balanceLabel??"AnkerCredits Balance"}),n("div",{className:"flex items-end gap-[4px]",children:[e("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:L(x?.available_credit??0)}),e("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]}),e("div",{className:"h-full w-px bg-[#dadce0]"}),n("div",{className:"flex flex-1 flex-col gap-[4px]",children:[e("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:t.comingSoonLabel??"Coming Soon"}),n("div",{className:"flex items-end gap-[4px]",children:[e("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:L(x?.pending_credit??0)}),e("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:t.creditUnit??"ankercredits"})]})]})]})]}),n("div",{className:"flex flex-col gap-[16px]",children:[t.subtitle&&e("p",{className:"text-[16px] font-[700] text-[#1e2024]",children:t.subtitle}),e("div",{className:"flex flex-col",children:I.map((s,r)=>n("div",{className:"relative py-[16px]",children:[r>0&&e("div",{className:"absolute left-0 right-0 top-0 h-px bg-[#dadce0]"}),n("div",{className:c("flex items-center gap-[12px]",s.finished&&"opacity-60"),children:[e(V,{id:s.id,className:"size-[24px] shrink-0"}),n("div",{className:"flex-1",children:[e("div",{className:"text-[16px] font-[700] text-[#1e2024]",children:s.title}),s.description&&e("div",{className:"mt-[4px] text-[14px] font-[700] text-[#4a4c56]",children:s.description})]}),!s.finished&&s.link&&l?e("a",{href:s.link,target:"_blank",rel:"noopener noreferrer",className:c("cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",u?"rounded-[4px]":"rounded-none"),children:s.buttonLabel}):e("button",{className:c("cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white",s.finished?"bg-[#767880]":"bg-[#080a0f]",u?"rounded-[4px]":"rounded-none"),disabled:s.finished,onClick:s.finished?void 0:s.onClick,children:s.buttonLabel})]})]},r))})]})]})}function H(t,a){switch(t){case i.Activate:return a.activate;case i.CompleteProfile:return a.completeProfileLabel;case i.Subscribe:return a.subscribeLabel;case i.Shop:return a.shopNow}}var Z=z;export{Z as default};
2
2
  //# sourceMappingURL=index.js.map
package/dist/esm/components/memberPopup/panels/EarnCredits/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../src/components/memberPopup/panels/EarnCredits/index.tsx"],
4
- "sourcesContent": ["import { useMemo } from 'react'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useSubscribed } from './hooks/useSubscribed'\nimport { EarnCreditsTaskType, MemberPopupPanelType, type EarnCreditsCopy } from '../../type'\nimport { IconBag, IconLock, IconSubscription, IconOrders } from '../../icons'\nimport { numberFormat } from '../../../credits/context/utils'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\nfunction TaskIcon({ id, className }: { id: EarnCreditsTaskType; className?: string }) {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return <IconLock className={className} />\n case EarnCreditsTaskType.Subscribe:\n return <IconSubscription className={className} />\n case EarnCreditsTaskType.Shop:\n return <IconBag className={className} />\n case EarnCreditsTaskType.CompleteProfile:\n return <IconOrders className={className} />\n }\n}\n\ntype Props = {\n copy: EarnCreditsCopy\n onClose: () => void\n isSubscribeSuccess?: boolean\n isActivateSuccess?: boolean\n isProfileCompleteSuccess?: boolean\n onSubscribeSuccess?: () => void\n onActivateSuccess?: () => void\n onProfileCompleteSuccess?: () => void\n}\n\nfunction EarnCredits({\n copy,\n onClose,\n isSubscribeSuccess = false,\n isActivateSuccess = false,\n isProfileCompleteSuccess = false,\n onSubscribeSuccess,\n onActivateSuccess,\n onProfileCompleteSuccess,\n}: Props) {\n const { profile, openSignUpPopup, alpcConfig, creditInfo } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n console.log('creditInfo', creditInfo)\n\n const isLogin = !!profile\n\n const isSubscribed = useSubscribed({\n userId: profile?.user_id,\n brand: brand,\n email: profile?.email,\n locale,\n apiBaseUrl: alpcConfig.apiBaseUrl,\n })\n\n const profileCompleted = useMemo(() => {\n return (\n isProfileCompleteSuccess ||\n (!!(profile?.first_name || profile?.last_name) && !!profile?.phone_number && !!profile?.dob)\n )\n }, [profile, isProfileCompleteSuccess])\n\n const taskStates: Record<EarnCreditsTaskType, { finished: boolean; onClick?: () => void; link?: string }> = useMemo(\n () => ({\n [EarnCreditsTaskType.Activate]: {\n finished: !!profile?.activated || isActivateSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.Activate,\n props: { onSuccess: onActivateSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n props: { onSuccess: onProfileCompleteSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n props: { onSuccess: onSubscribeSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? undefined : openSignUpPopup,\n },\n }),\n [\n profile,\n isLogin,\n isActivateSuccess,\n isProfileCompleteSuccess,\n profileCompleted,\n isSubscribed,\n isSubscribeSuccess,\n openSignUpPopup,\n pushView,\n copy.goShopLink,\n ]\n )\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const state = taskStates[item.id]\n if (!state) return null\n const buttonLabel = state.finished\n ? copy.completed\n : isLogin\n ? getNotFinishedLabel(item.id, copy)\n : copy.joinNow\n return { ...item, ...state, buttonLabel }\n })\n .filter(Boolean) as ((typeof copy.list)[number] & {\n finished: boolean\n onClick?: () => void\n link?: string\n buttonLabel: string\n })[]\n }, [copy, taskStates, isLogin])\n\n return (\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n </div>\n\n {isLogin && (\n <div\n className={cn(\n 'flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]',\n rounded ? 'rounded-[8px]' : 'rounded-none'\n )}\n >\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.balanceLabel ?? 'AnkerCredits Balance'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.available_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n <div className=\"h-full w-px bg-[#dadce0]\" />\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.comingSoonLabel ?? 'Coming Soon'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.pending_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n </div>\n )}\n </div>\n\n <div className=\"flex flex-col gap-[16px]\">\n {copy.subtitle && <p className=\"text-[16px] font-[700] text-[#1e2024]\">{copy.subtitle}</p>}\n\n <div className=\"flex flex-col\">\n {list.map((item, idx) => (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute left-0 right-0 top-0 h-px bg-[#dadce0]\" />}\n <div className={cn('flex items-center gap-[12px]', item.finished && 'opacity-60')}>\n <TaskIcon id={item.id} className=\"size-[24px] shrink-0\" />\n <div className=\"flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024]\">{item.title}</div>\n {item.description && (\n <div className=\"mt-[4px] text-[14px] font-[700] text-[#4a4c56]\">{item.description}</div>\n )}\n </div>\n {!item.finished && item.link ? (\n <a\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={cn(\n 'cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n >\n {item.buttonLabel}\n </a>\n ) : (\n <button\n className={cn(\n 'cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n item.finished ? 'bg-[#767880]' : 'bg-[#080a0f]',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n disabled={item.finished}\n onClick={!item.finished ? item.onClick : undefined}\n >\n {item.buttonLabel}\n </button>\n )}\n </div>\n </div>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\nfunction getNotFinishedLabel(id: EarnCreditsTaskType, copy: EarnCreditsCopy): string {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return copy.activate\n case EarnCreditsTaskType.CompleteProfile:\n return copy.completeProfileLabel\n case EarnCreditsTaskType.Subscribe:\n return copy.subscribeLabel\n case EarnCreditsTaskType.Shop:\n return copy.shopNow\n }\n}\n\nexport default EarnCredits\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { useMemo } from 'react'\nimport { classNames as cn, useHeadlessContext } from '@anker-in/lib'\nimport { useMemberPopupContext } from '../../context/provider'\nimport { useViewStack } from '../../context/viewStack'\nimport { useSubscribed } from './hooks/useSubscribed'\nimport { EarnCreditsTaskType, MemberPopupPanelType, type EarnCreditsCopy } from '../../type'\nimport { IconBag, IconLock, IconSubscription, IconOrders } from '../../icons'\nimport { numberFormat } from '../../../credits/context/utils'\nimport { ROUNDED_BRANDS } from '../../../../constants'\n\nfunction TaskIcon({ id, className }: { id: EarnCreditsTaskType; className?: string }) {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return <IconLock className={className} />\n case EarnCreditsTaskType.Subscribe:\n return <IconSubscription className={className} />\n case EarnCreditsTaskType.Shop:\n return <IconBag className={className} />\n case EarnCreditsTaskType.CompleteProfile:\n return <IconOrders className={className} />\n }\n}\n\ntype Props = {\n copy: EarnCreditsCopy\n onClose: () => void\n isSubscribeSuccess?: boolean\n isActivateSuccess?: boolean\n isProfileCompleteSuccess?: boolean\n onSubscribeSuccess?: () => void\n onActivateSuccess?: () => void\n onProfileCompleteSuccess?: () => void\n}\n\nfunction EarnCredits({\n copy,\n onClose,\n isSubscribeSuccess = false,\n isActivateSuccess = false,\n isProfileCompleteSuccess = false,\n onSubscribeSuccess,\n onActivateSuccess,\n onProfileCompleteSuccess,\n}: Props) {\n const { profile, openSignUpPopup, alpcConfig, creditInfo } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n console.log('creditInfo', creditInfo)\n\n const isLogin = !!profile\n\n const isSubscribed = useSubscribed({\n userId: profile?.user_id,\n brand: brand,\n email: profile?.email,\n locale,\n apiBaseUrl: alpcConfig.apiBaseUrl,\n })\n\n const profileCompleted = useMemo(() => {\n return (\n isProfileCompleteSuccess ||\n (!!(profile?.first_name || profile?.last_name) && !!profile?.phone_number && !!profile?.dob)\n )\n }, [profile, isProfileCompleteSuccess])\n\n const taskStates: Record<EarnCreditsTaskType, { finished: boolean; onClick?: () => void; link?: string }> = useMemo(\n () => ({\n [EarnCreditsTaskType.Activate]: {\n finished: !!profile?.activated || isActivateSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.Activate,\n props: { onSuccess: onActivateSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n props: { onSuccess: onProfileCompleteSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () =>\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n props: { onSuccess: onSubscribeSuccess },\n })\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? undefined : openSignUpPopup,\n },\n }),\n [\n profile,\n isLogin,\n isActivateSuccess,\n isProfileCompleteSuccess,\n profileCompleted,\n isSubscribed,\n isSubscribeSuccess,\n openSignUpPopup,\n pushView,\n copy.goShopLink,\n ]\n )\n\n const list = useMemo(() => {\n return copy.list\n .map(item => {\n const state = taskStates[item.id]\n if (!state) return null\n const buttonLabel = state.finished\n ? copy.completed\n : isLogin\n ? getNotFinishedLabel(item.id, copy)\n : copy.joinNow\n return { ...item, ...state, buttonLabel }\n })\n .filter(Boolean) as ((typeof copy.list)[number] & {\n finished: boolean\n onClick?: () => void\n link?: string\n buttonLabel: string\n })[]\n }, [copy, taskStates, isLogin])\n\n return (\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[16px]\">\n <div className=\"flex flex-col gap-[8px]\">\n {copy.title && <h2 className=\"text-[24px] font-[700] leading-[1.2] text-[#080a0f]\">{copy.title}</h2>}\n </div>\n\n {isLogin && (\n <div\n className={cn(\n 'flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]',\n rounded ? 'rounded-[8px]' : 'rounded-none'\n )}\n >\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.balanceLabel ?? 'AnkerCredits Balance'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.available_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n <div className=\"h-full w-px bg-[#dadce0]\" />\n <div className=\"flex flex-1 flex-col gap-[4px]\">\n <div className=\"text-[14px] font-[700] text-[#1e2024]\">{copy.comingSoonLabel ?? 'Coming Soon'}</div>\n <div className=\"flex items-end gap-[4px]\">\n <span className=\"text-[24px] font-[700] leading-[1.2] text-[#1e2024]\">\n {numberFormat(creditInfo?.pending_credit ?? 0)}\n </span>\n <span className=\"text-[14px] font-[700] leading-[1.4] text-[#1e2024]\">\n {copy.creditUnit ?? 'ankercredits'}\n </span>\n </div>\n </div>\n </div>\n )}\n </div>\n\n <div className=\"flex flex-col gap-[16px]\">\n {copy.subtitle && <p className=\"text-[16px] font-[700] text-[#1e2024]\">{copy.subtitle}</p>}\n\n <div className=\"flex flex-col\">\n {list.map((item, idx) => (\n <div key={idx} className=\"relative py-[16px]\">\n {idx > 0 && <div className=\"absolute left-0 right-0 top-0 h-px bg-[#dadce0]\" />}\n <div className={cn('flex items-center gap-[12px]', item.finished && 'opacity-60')}>\n <TaskIcon id={item.id} className=\"size-[24px] shrink-0\" />\n <div className=\"flex-1\">\n <div className=\"text-[16px] font-[700] text-[#1e2024]\">{item.title}</div>\n {item.description && (\n <div className=\"mt-[4px] text-[14px] font-[700] text-[#4a4c56]\">{item.description}</div>\n )}\n </div>\n {!item.finished && item.link && isLogin ? (\n <a\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={cn(\n 'cursor-pointer bg-[#080a0f] min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n >\n {item.buttonLabel}\n </a>\n ) : (\n <button\n className={cn(\n 'cursor-pointer min-w-[118px] px-[20px] pb-[10px] pt-[11px] text-[14px] font-[700] leading-[1.2] text-white',\n item.finished ? 'bg-[#767880]' : 'bg-[#080a0f]',\n rounded ? 'rounded-[4px]' : 'rounded-none'\n )}\n disabled={item.finished}\n onClick={!item.finished ? item.onClick : undefined}\n >\n {item.buttonLabel}\n </button>\n )}\n </div>\n </div>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\nfunction getNotFinishedLabel(id: EarnCreditsTaskType, copy: EarnCreditsCopy): string {\n switch (id) {\n case EarnCreditsTaskType.Activate:\n return copy.activate\n case EarnCreditsTaskType.CompleteProfile:\n return copy.completeProfileLabel\n case EarnCreditsTaskType.Subscribe:\n return copy.subscribeLabel\n case EarnCreditsTaskType.Shop:\n return copy.shopNow\n }\n}\n\nexport default EarnCredits\n"],
5
+ "mappings": "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",
6
6
  "names": ["jsx", "jsxs", "useMemo", "cn", "useHeadlessContext", "useMemberPopupContext", "useViewStack", "useSubscribed", "EarnCreditsTaskType", "MemberPopupPanelType", "IconBag", "IconLock", "IconSubscription", "IconOrders", "numberFormat", "ROUNDED_BRANDS", "TaskIcon", "id", "className", "EarnCredits", "copy", "onClose", "isSubscribeSuccess", "isActivateSuccess", "isProfileCompleteSuccess", "onSubscribeSuccess", "onActivateSuccess", "onProfileCompleteSuccess", "profile", "openSignUpPopup", "alpcConfig", "creditInfo", "pushView", "locale", "brand", "rounded", "isLogin", "isSubscribed", "profileCompleted", "taskStates", "list", "item", "state", "buttonLabel", "getNotFinishedLabel", "idx", "EarnCredits_default"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/campaign-ui",
3
- "version": "0.5.0-beta.08",
3
+ "version": "0.5.0-beta.09",
4
4
  "description": "Campaign UI components and utilities for Anker projects",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",
package/src/components/memberPopup/panels/ConsumeCredits/index.tsx CHANGED
@@ -36,6 +36,7 @@ function ConsumeCredits({ copy, onClose }: Props) {
36
36
 
37
37
  const [redeemAndBuyError, setRedeemAndBuyError] = useState('')
38
38
  const [loadingId, setLoadingId] = useState<string | number | null>(null)
39
+ const [isActivateSuccess, setIsActivateSuccess] = useState(false)
39
40
 
40
41
  const isLogin = !!profile
41
42
  const { redeemableList, listLoading } = useRedeemableList(alpcConfig)
@@ -92,8 +93,11 @@ function ConsumeCredits({ copy, onClose }: Props) {
92
93
  openSignUpPopup()
93
94
  return
94
95
  }
95
- if (!profile?.activated) {
96
- pushView({ type: MemberPopupPanelType.Activate })
96
+ if (!profile?.activated && !isActivateSuccess) {
97
+ pushView({
98
+ type: MemberPopupPanelType.Activate,
99
+ props: { onSuccess: () => setIsActivateSuccess(true) },
100
+ })
97
101
  return
98
102
  }
99
103
  if (
package/src/components/memberPopup/panels/EarnCredits/index.tsx CHANGED
@@ -195,7 +195,7 @@ function EarnCredits({
195
195
  <div className="mt-[4px] text-[14px] font-[700] text-[#4a4c56]">{item.description}</div>
196
196
  )}
197
197
  </div>
198
- {!item.finished && item.link ? (
198
+ {!item.finished && item.link && isLogin ? (
199
199
  <a
200
200
  href={item.link}
201
201
  target="_blank"