@anker-in/campaign-ui 0.5.0-beta.27 → 0.5.0-beta.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/memberPopup/panels/EarnCredits/index.js +1 -1
- package/dist/cjs/components/memberPopup/panels/EarnCredits/index.js.map +2 -2
- package/dist/esm/components/memberPopup/panels/EarnCredits/index.js +1 -1
- package/dist/esm/components/memberPopup/panels/EarnCredits/index.js.map +2 -2
- package/package.json +1 -1
- package/src/components/memberPopup/panels/EarnCredits/index.tsx +2 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var b=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var
|
|
1
|
+
"use strict";var b=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var z=(s,t)=>{for(var n in t)b(s,n,{get:t[n],enumerable:!0})},D=(s,t,n,f)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of R(t))!y.call(s,r)&&r!==n&&b(s,r,{get:()=>t[r],enumerable:!(f=M(t,r))||f.enumerable});return s};var F=s=>D(b({},"__esModule",{value:!0}),s);var j={};z(j,{default:()=>W});module.exports=F(j);var e=require("react/jsx-runtime"),p=require("react"),d=require("@anker-in/lib"),_=require("../../context/provider"),E=require("../../context/viewStack"),P=require("./hooks/useSubscribed"),i=require("../../type"),c=require("../../icons"),v=require("../../../credits/context/utils"),L=require("../../../../constants"),g=require("@anker-in/headless-ui");function O({id:s,className:t}){switch(s){case i.EarnCreditsTaskType.Activate:return(0,e.jsx)(c.IconLock,{className:t});case i.EarnCreditsTaskType.Subscribe:return(0,e.jsx)(c.IconSubscription,{className:t});case i.EarnCreditsTaskType.Shop:return(0,e.jsx)(c.IconBag,{className:t});case i.EarnCreditsTaskType.CompleteProfile:return(0,e.jsx)(c.IconOrders,{className:t})}}function V({copy:s}){const{profile:t,openSignUpPopup:n,alpcConfig:f,creditInfo:r,fetchCreditInfo:B,isSubscribeSuccess:C,isActivateSuccess:k,isProfileCompleteSuccess:x}=(0,_.useMemberPopupContext)(),{pushView:u}=(0,E.useViewStack)(),{locale:A}=f,{brand:N}=(0,d.useHeadlessContext)(),w=L.ROUNDED_BRANDS.includes(N);(0,p.useEffect)(()=>{t?.user_id&&B(t.user_id)},[]);const o=!!t,h=(0,P.useSubscribed)({userId:t?.user_id,brand:N,email:t?.email,locale:A,apiBaseUrl:f.apiBaseUrl}),S=(0,p.useMemo)(()=>x||!!(t?.first_name||t?.last_name)&&!!t?.phone_number&&!!t?.dob,[t,x]);function m(a){const l={[i.EarnCreditsTaskType.Activate]:"activate",[i.EarnCreditsTaskType.CompleteProfile]:"complete_profile",[i.EarnCreditsTaskType.Subscribe]:"subscribe",[i.EarnCreditsTaskType.Shop]:"shop"};(0,d.gaTrack)({event:"ga4Event",event_name:"lp_button",event_parameters:{position:"earn_credits",button_name:l[a],info:"Member Floating Window"}})}const T=(0,p.useMemo)(()=>({[i.EarnCreditsTaskType.Activate]:{finished:!!t?.activated||k,onClick:o?()=>{m(i.EarnCreditsTaskType.Activate),u({type:i.MemberPopupPanelType.Activate})}:n},[i.EarnCreditsTaskType.CompleteProfile]:{finished:S,onClick:o?()=>{m(i.EarnCreditsTaskType.CompleteProfile),u({type:i.MemberPopupPanelType.CompleteProfile})}:n},[i.EarnCreditsTaskType.Subscribe]:{finished:h||C,onClick:o?()=>{m(i.EarnCreditsTaskType.Subscribe),u({type:i.MemberPopupPanelType.SubscribeEmail})}:n},[i.EarnCreditsTaskType.Shop]:{finished:!1,link:s.goShopLink,onClick:o?()=>m(i.EarnCreditsTaskType.Shop):n}}),[t,o,k,x,S,h,C,n,u,s.goShopLink]),I=(0,p.useMemo)(()=>s.list.map(a=>{const l=T[a.id];if(!l)return null;const U=l.finished?s.completed:o?H(a.id,s):s.joinNow;return{...a,...l,buttonLabel:U}}).filter(Boolean),[s,T,o]);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:s.title&&(0,e.jsx)("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:s.title})}),o&&(0,e.jsxs)("div",{className:(0,d.classNames)("flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]",w?"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:s.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,v.numberFormat)(r?.available_credit??0)}),(0,e.jsx)("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:s.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:s.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,v.numberFormat)(r?.pending_credit??0)}),(0,e.jsx)("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:s.creditUnit??"ankercredits"})]})]})]})]}),(0,e.jsxs)("div",{className:"flex flex-col gap-[16px]",children:[s.subtitle&&(0,e.jsx)("p",{className:"text-[16px] font-[700] text-[#1e2024]",children:s.subtitle}),(0,e.jsx)("div",{className:"flex flex-col",children:I.map((a,l)=>(0,e.jsxs)("div",{className:"relative py-[16px]",children:[l>0&&(0,e.jsx)("div",{className:"absolute left-0 right-0 top-0 h-px bg-[#dadce0]"}),(0,e.jsxs)("div",{className:(0,d.classNames)("flex items-center gap-[12px]"),children:[(0,e.jsx)(O,{id:a.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:a.title}),a.credits&&(0,e.jsx)("div",{className:"mt-[4px] text-[14px] font-bold text-[#4A4C56]",children:a.credits})]}),!a.finished&&a.link&&o?(0,e.jsx)(g.Button,{as:"a",size:"base",href:a.link,target:"_blank",rel:"noopener noreferrer",onClick:()=>m(a.id),children:a.buttonLabel}):(0,e.jsx)(g.Button,{size:"base",disabled:a.finished,onClick:a.finished?void 0:a.onClick,children:a.buttonLabel})]})]},l))})]})]})}function H(s,t){switch(s){case i.EarnCreditsTaskType.Activate:return t.activate;case i.EarnCreditsTaskType.CompleteProfile:return t.completeProfileLabel;case i.EarnCreditsTaskType.Subscribe:return t.subscribeLabel;case i.EarnCreditsTaskType.Shop:return t.shopNow}}var W=V;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/components/memberPopup/panels/EarnCredits/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useEffect, useMemo } from 'react'\nimport { gaTrack, 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'\nimport { Button } from '@anker-in/headless-ui'\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}\n\nfunction EarnCredits({ copy }: Props) {\n const {\n profile,\n openSignUpPopup,\n alpcConfig,\n creditInfo,\n fetchCreditInfo,\n isSubscribeSuccess,\n isActivateSuccess,\n isProfileCompleteSuccess,\n } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n useEffect(() => {\n if (profile?.user_id) fetchCreditInfo(profile.user_id)\n }, [])\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 function trackTaskButton(taskId: EarnCreditsTaskType) {\n const taskButtonNameMap: Record<EarnCreditsTaskType, string> = {\n [EarnCreditsTaskType.Activate]: 'activate',\n [EarnCreditsTaskType.CompleteProfile]: 'complete_profile',\n [EarnCreditsTaskType.Subscribe]: 'subscribe',\n [EarnCreditsTaskType.Shop]: 'shop',\n }\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n position: 'earn_credits',\n button_name: taskButtonNameMap[taskId],\n info: 'Member Floating Window',\n },\n })\n }\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 trackTaskButton(EarnCreditsTaskType.Activate)\n pushView({\n type: MemberPopupPanelType.Activate,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.CompleteProfile)\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.Subscribe)\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? () => trackTaskButton(EarnCreditsTaskType.Shop) : 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]')}>\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.credits && <div className=\"mt-[4px] text-[14px] font-bold text-[#4A4C56]\">{item.credits}</div>}\n </div>\n {!item.finished && item.link && isLogin ? (\n <Button\n as=\"a\"\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n onClick={() => trackTaskButton(item.id)}\n >\n {item.buttonLabel}\n </Button>\n ) : (\n <Button disabled={item.finished} onClick={!item.finished ? item.onClick : undefined}>\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 { useEffect, useMemo } from 'react'\nimport { gaTrack, 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'\nimport { Button } from '@anker-in/headless-ui'\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}\n\nfunction EarnCredits({ copy }: Props) {\n const {\n profile,\n openSignUpPopup,\n alpcConfig,\n creditInfo,\n fetchCreditInfo,\n isSubscribeSuccess,\n isActivateSuccess,\n isProfileCompleteSuccess,\n } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n useEffect(() => {\n if (profile?.user_id) fetchCreditInfo(profile.user_id)\n }, [])\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 function trackTaskButton(taskId: EarnCreditsTaskType) {\n const taskButtonNameMap: Record<EarnCreditsTaskType, string> = {\n [EarnCreditsTaskType.Activate]: 'activate',\n [EarnCreditsTaskType.CompleteProfile]: 'complete_profile',\n [EarnCreditsTaskType.Subscribe]: 'subscribe',\n [EarnCreditsTaskType.Shop]: 'shop',\n }\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n position: 'earn_credits',\n button_name: taskButtonNameMap[taskId],\n info: 'Member Floating Window',\n },\n })\n }\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 trackTaskButton(EarnCreditsTaskType.Activate)\n pushView({\n type: MemberPopupPanelType.Activate,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.CompleteProfile)\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.Subscribe)\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? () => trackTaskButton(EarnCreditsTaskType.Shop) : 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]')}>\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.credits && <div className=\"mt-[4px] text-[14px] font-bold text-[#4A4C56]\">{item.credits}</div>}\n </div>\n {!item.finished && item.link && isLogin ? (\n <Button\n as=\"a\"\n size=\"base\"\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n onClick={() => trackTaskButton(item.id)}\n >\n {item.buttonLabel}\n </Button>\n ) : (\n <Button size=\"base\" disabled={item.finished} onClick={!item.finished ? item.onClick : undefined}>\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", "import_headless_ui", "TaskIcon", "id", "className", "EarnCredits", "copy", "profile", "openSignUpPopup", "alpcConfig", "creditInfo", "fetchCreditInfo", "isSubscribeSuccess", "isActivateSuccess", "isProfileCompleteSuccess", "pushView", "locale", "brand", "rounded", "isLogin", "isSubscribed", "profileCompleted", "trackTaskButton", "taskId", "taskButtonNameMap", "taskStates", "list", "item", "state", "buttonLabel", "getNotFinishedLabel", "cn", "idx"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useEffect as A,useMemo as f}from"react";import{gaTrack as w,classNames as h,useHeadlessContext as I}from"@anker-in/lib";import{useMemberPopupContext as U}from"../../context/provider";import{useViewStack as M}from"../../context/viewStack";import{useSubscribed as R}from"./hooks/useSubscribed";import{EarnCreditsTaskType as
|
|
1
|
+
import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useEffect as A,useMemo as f}from"react";import{gaTrack as w,classNames as h,useHeadlessContext as I}from"@anker-in/lib";import{useMemberPopupContext as U}from"../../context/provider";import{useViewStack as M}from"../../context/viewStack";import{useSubscribed as R}from"./hooks/useSubscribed";import{EarnCreditsTaskType as s,MemberPopupPanelType as m}from"../../type";import{IconBag as y,IconLock as z,IconSubscription as D,IconOrders as F}from"../../icons";import{numberFormat as S}from"../../../credits/context/utils";import{ROUNDED_BRANDS as O}from"../../../../constants";import{Button as T}from"@anker-in/headless-ui";function V({id:i,className:e}){switch(i){case s.Activate:return t(z,{className:e});case s.Subscribe:return t(D,{className:e});case s.Shop:return t(y,{className:e});case s.CompleteProfile:return t(F,{className:e})}}function H({copy:i}){const{profile:e,openSignUpPopup:l,alpcConfig:u,creditInfo:x,fetchCreditInfo:_,isSubscribeSuccess:b,isActivateSuccess:v,isProfileCompleteSuccess:p}=U(),{pushView:d}=M(),{locale:E}=u,{brand:g}=I(),P=O.includes(g);A(()=>{e?.user_id&&_(e.user_id)},[]);const o=!!e,C=R({userId:e?.user_id,brand:g,email:e?.email,locale:E,apiBaseUrl:u.apiBaseUrl}),k=f(()=>p||!!(e?.first_name||e?.last_name)&&!!e?.phone_number&&!!e?.dob,[e,p]);function c(a){const r={[s.Activate]:"activate",[s.CompleteProfile]:"complete_profile",[s.Subscribe]:"subscribe",[s.Shop]:"shop"};w({event:"ga4Event",event_name:"lp_button",event_parameters:{position:"earn_credits",button_name:r[a],info:"Member Floating Window"}})}const N=f(()=>({[s.Activate]:{finished:!!e?.activated||v,onClick:o?()=>{c(s.Activate),d({type:m.Activate})}:l},[s.CompleteProfile]:{finished:k,onClick:o?()=>{c(s.CompleteProfile),d({type:m.CompleteProfile})}:l},[s.Subscribe]:{finished:C||b,onClick:o?()=>{c(s.Subscribe),d({type:m.SubscribeEmail})}:l},[s.Shop]:{finished:!1,link:i.goShopLink,onClick:o?()=>c(s.Shop):l}}),[e,o,v,p,k,C,b,l,d,i.goShopLink]),L=f(()=>i.list.map(a=>{const r=N[a.id];if(!r)return null;const B=r.finished?i.completed:o?W(a.id,i):i.joinNow;return{...a,...r,buttonLabel:B}}).filter(Boolean),[i,N,o]);return n("div",{className:"flex flex-col gap-[16px]",children:[n("div",{className:"flex flex-col gap-[16px]",children:[t("div",{className:"flex flex-col gap-[8px]",children:i.title&&t("h2",{className:"text-[24px] font-[700] leading-[1.2] text-[#080a0f]",children:i.title})}),o&&n("div",{className:h("flex items-center gap-[12px] bg-[#f5f6f7] p-[16px]",P?"rounded-[8px]":"rounded-none"),children:[n("div",{className:"flex flex-1 flex-col gap-[4px]",children:[t("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:i.balanceLabel??"AnkerCredits Balance"}),n("div",{className:"flex items-end gap-[4px]",children:[t("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:S(x?.available_credit??0)}),t("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:i.creditUnit??"ankercredits"})]})]}),t("div",{className:"h-full w-px bg-[#dadce0]"}),n("div",{className:"flex flex-1 flex-col gap-[4px]",children:[t("div",{className:"text-[14px] font-[700] text-[#1e2024]",children:i.comingSoonLabel??"Coming Soon"}),n("div",{className:"flex items-end gap-[4px]",children:[t("span",{className:"text-[24px] font-[700] leading-[1.2] text-[#1e2024]",children:S(x?.pending_credit??0)}),t("span",{className:"text-[14px] font-[700] leading-[1.4] text-[#1e2024]",children:i.creditUnit??"ankercredits"})]})]})]})]}),n("div",{className:"flex flex-col gap-[16px]",children:[i.subtitle&&t("p",{className:"text-[16px] font-[700] text-[#1e2024]",children:i.subtitle}),t("div",{className:"flex flex-col",children:L.map((a,r)=>n("div",{className:"relative py-[16px]",children:[r>0&&t("div",{className:"absolute left-0 right-0 top-0 h-px bg-[#dadce0]"}),n("div",{className:h("flex items-center gap-[12px]"),children:[t(V,{id:a.id,className:"size-[24px] shrink-0"}),n("div",{className:"flex-1",children:[t("div",{className:"text-[16px] font-[700] text-[#1e2024]",children:a.title}),a.credits&&t("div",{className:"mt-[4px] text-[14px] font-bold text-[#4A4C56]",children:a.credits})]}),!a.finished&&a.link&&o?t(T,{as:"a",size:"base",href:a.link,target:"_blank",rel:"noopener noreferrer",onClick:()=>c(a.id),children:a.buttonLabel}):t(T,{size:"base",disabled:a.finished,onClick:a.finished?void 0:a.onClick,children:a.buttonLabel})]})]},r))})]})]})}function W(i,e){switch(i){case s.Activate:return e.activate;case s.CompleteProfile:return e.completeProfileLabel;case s.Subscribe:return e.subscribeLabel;case s.Shop:return e.shopNow}}var ee=H;export{ee as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/components/memberPopup/panels/EarnCredits/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useEffect, useMemo } from 'react'\nimport { gaTrack, 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'\nimport { Button } from '@anker-in/headless-ui'\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}\n\nfunction EarnCredits({ copy }: Props) {\n const {\n profile,\n openSignUpPopup,\n alpcConfig,\n creditInfo,\n fetchCreditInfo,\n isSubscribeSuccess,\n isActivateSuccess,\n isProfileCompleteSuccess,\n } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n useEffect(() => {\n if (profile?.user_id) fetchCreditInfo(profile.user_id)\n }, [])\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 function trackTaskButton(taskId: EarnCreditsTaskType) {\n const taskButtonNameMap: Record<EarnCreditsTaskType, string> = {\n [EarnCreditsTaskType.Activate]: 'activate',\n [EarnCreditsTaskType.CompleteProfile]: 'complete_profile',\n [EarnCreditsTaskType.Subscribe]: 'subscribe',\n [EarnCreditsTaskType.Shop]: 'shop',\n }\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n position: 'earn_credits',\n button_name: taskButtonNameMap[taskId],\n info: 'Member Floating Window',\n },\n })\n }\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 trackTaskButton(EarnCreditsTaskType.Activate)\n pushView({\n type: MemberPopupPanelType.Activate,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.CompleteProfile)\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.Subscribe)\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? () => trackTaskButton(EarnCreditsTaskType.Shop) : 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]')}>\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.credits && <div className=\"mt-[4px] text-[14px] font-bold text-[#4A4C56]\">{item.credits}</div>}\n </div>\n {!item.finished && item.link && isLogin ? (\n <Button\n as=\"a\"\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n onClick={() => trackTaskButton(item.id)}\n >\n {item.buttonLabel}\n </Button>\n ) : (\n <Button disabled={item.finished} onClick={!item.finished ? item.onClick : undefined}>\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 { useEffect, useMemo } from 'react'\nimport { gaTrack, 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'\nimport { Button } from '@anker-in/headless-ui'\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}\n\nfunction EarnCredits({ copy }: Props) {\n const {\n profile,\n openSignUpPopup,\n alpcConfig,\n creditInfo,\n fetchCreditInfo,\n isSubscribeSuccess,\n isActivateSuccess,\n isProfileCompleteSuccess,\n } = useMemberPopupContext()\n const { pushView } = useViewStack()\n const { locale } = alpcConfig\n const { brand } = useHeadlessContext()\n const rounded = ROUNDED_BRANDS.includes(brand)\n\n useEffect(() => {\n if (profile?.user_id) fetchCreditInfo(profile.user_id)\n }, [])\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 function trackTaskButton(taskId: EarnCreditsTaskType) {\n const taskButtonNameMap: Record<EarnCreditsTaskType, string> = {\n [EarnCreditsTaskType.Activate]: 'activate',\n [EarnCreditsTaskType.CompleteProfile]: 'complete_profile',\n [EarnCreditsTaskType.Subscribe]: 'subscribe',\n [EarnCreditsTaskType.Shop]: 'shop',\n }\n gaTrack({\n event: 'ga4Event',\n event_name: 'lp_button',\n event_parameters: {\n position: 'earn_credits',\n button_name: taskButtonNameMap[taskId],\n info: 'Member Floating Window',\n },\n })\n }\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 trackTaskButton(EarnCreditsTaskType.Activate)\n pushView({\n type: MemberPopupPanelType.Activate,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.CompleteProfile]: {\n finished: profileCompleted,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.CompleteProfile)\n pushView({\n type: MemberPopupPanelType.CompleteProfile,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Subscribe]: {\n finished: isSubscribed || isSubscribeSuccess,\n onClick: isLogin\n ? () => {\n trackTaskButton(EarnCreditsTaskType.Subscribe)\n pushView({\n type: MemberPopupPanelType.SubscribeEmail,\n })\n }\n : openSignUpPopup,\n },\n [EarnCreditsTaskType.Shop]: {\n finished: false,\n link: copy.goShopLink,\n onClick: isLogin ? () => trackTaskButton(EarnCreditsTaskType.Shop) : 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]')}>\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.credits && <div className=\"mt-[4px] text-[14px] font-bold text-[#4A4C56]\">{item.credits}</div>}\n </div>\n {!item.finished && item.link && isLogin ? (\n <Button\n as=\"a\"\n size=\"base\"\n href={item.link}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n onClick={() => trackTaskButton(item.id)}\n >\n {item.buttonLabel}\n </Button>\n ) : (\n <Button size=\"base\" disabled={item.finished} onClick={!item.finished ? item.onClick : undefined}>\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", "useEffect", "useMemo", "gaTrack", "cn", "useHeadlessContext", "useMemberPopupContext", "useViewStack", "useSubscribed", "EarnCreditsTaskType", "MemberPopupPanelType", "IconBag", "IconLock", "IconSubscription", "IconOrders", "numberFormat", "ROUNDED_BRANDS", "Button", "TaskIcon", "id", "className", "EarnCredits", "copy", "profile", "openSignUpPopup", "alpcConfig", "creditInfo", "fetchCreditInfo", "isSubscribeSuccess", "isActivateSuccess", "isProfileCompleteSuccess", "pushView", "locale", "brand", "rounded", "isLogin", "isSubscribed", "profileCompleted", "trackTaskButton", "taskId", "taskButtonNameMap", "taskStates", "list", "item", "state", "buttonLabel", "getNotFinishedLabel", "idx", "EarnCredits_default"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -213,6 +213,7 @@ function EarnCredits({ copy }: Props) {
|
|
|
213
213
|
{!item.finished && item.link && isLogin ? (
|
|
214
214
|
<Button
|
|
215
215
|
as="a"
|
|
216
|
+
size="base"
|
|
216
217
|
href={item.link}
|
|
217
218
|
target="_blank"
|
|
218
219
|
rel="noopener noreferrer"
|
|
@@ -221,7 +222,7 @@ function EarnCredits({ copy }: Props) {
|
|
|
221
222
|
{item.buttonLabel}
|
|
222
223
|
</Button>
|
|
223
224
|
) : (
|
|
224
|
-
<Button disabled={item.finished} onClick={!item.finished ? item.onClick : undefined}>
|
|
225
|
+
<Button size="base" disabled={item.finished} onClick={!item.finished ? item.onClick : undefined}>
|
|
225
226
|
{item.buttonLabel}
|
|
226
227
|
</Button>
|
|
227
228
|
)}
|