@anker-in/campaign-ui 0.1.10 → 0.2.0-beta.1

package/dist/esm/components/registration/modalContainer.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/registration/modalContainer.tsx"],
+  "sourcesContent": ["import { classNames as cn } from '@anker-in/lib'\nimport { useEffect, useState, type UIEvent } from 'react'\nimport ReactModal from 'react-modal'\n\nexport type ModalContainerProps = {\n  overlayClassName?: string\n  className?: string\n  scrollClassName?: string\n  title?: string\n  titleClassName?: string\n  useAnimation?: boolean // \u4F7F\u7528\u52A8\u753B\u5C55\u793A\n  animationClassName?: string // \u52A8\u753B\u5C55\u793A\u63A7\u5236\u7684classname\n  isOpen: boolean\n  children?: any\n  onClose: () => void\n  onScrollEnd?: (event: UIEvent<HTMLDivElement>) => void\n}\n\nexport const CreditsModalContainer = ({\n  isOpen,\n  title,\n  className = '',\n  overlayClassName = '',\n  scrollClassName = '',\n  onClose,\n  onScrollEnd,\n  children,\n  useAnimation,\n  animationClassName,\n  titleClassName = '',\n  ...props\n}: ModalContainerProps): React.ReactElement => {\n  const [animationShow, setAnimationShow] = useState(false)\n\n  useEffect(() => {\n    if (!useAnimation) {\n      return\n    }\n    requestAnimationFrame(() => {\n      setAnimationShow(isOpen ?? false)\n    })\n  }, [isOpen, useAnimation])\n\n  return (\n    <ReactModal\n      isOpen={isOpen ?? false}\n      overlayClassName={cn(\n        'fixed inset-0 z-[999] flex items-center justify-center bg-black/70 leading-[1.2] md:items-end',\n        overlayClassName\n      )}\n      className={cn(\n        'min-md:max-h-[calc(100vh-96px)] relative flex min-h-[200px] flex-col overflow-hidden rounded-[16px] bg-white outline-none transition-all duration-300 md:h-[88.27vh] md:w-full md:rounded-b-none',\n        animationShow ? '' : animationClassName,\n        className\n      )}\n      onRequestClose={onClose}\n      {...props}\n    >\n      <div\n        className={cn(\n          'flex w-full shrink-0 items-center justify-between',\n          title ? 'min-l:px-[32px] h-[70px] border-b border-[#e2e2e2] px-[24px]' : 'h-[48px] px-[16px]',\n          titleClassName\n        )}\n      >\n        <div className=\"text-[18px] font-bold\">{title}</div>\n        <div\n          className=\"size-[22px] cursor-pointer\"\n          onClick={onClose}\n          onKeyDown={e => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              onClose?.()\n            }\n          }}\n          role=\"button\"\n          tabIndex={0}\n        >\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\">\n            <path\n              fillRule=\"evenodd\"\n              clipRule=\"evenodd\"\n              d=\"M16.8525 5.31015C16.4558 4.91337 15.8125 4.91338 15.4157 5.31015L11.1268 9.5991L6.83815 5.31049C6.44138 4.91372 5.79808 4.91372 5.40131 5.31049C5.00454 5.70726 5.00455 6.35055 5.40131 6.74732L9.68993 11.0359L5.40105 15.3248C5.00428 15.7216 5.00428 16.3649 5.40105 16.7616C5.79782 17.1584 6.44111 17.1584 6.83788 16.7616L11.1268 12.4728L15.416 16.762C15.8128 17.1588 16.456 17.1588 16.8528 16.762C17.2496 16.3652 17.2496 15.7219 16.8528 15.3252L12.5636 11.0359L16.8525 6.74698C17.2493 6.35021 17.2493 5.70692 16.8525 5.31015ZM16.921 6.02856C16.921 6.22992 16.8441 6.43127 16.6905 6.5849L14.465 8.8104L12.2395 11.0359L12.2395 11.0359L16.6905 6.58493C16.8441 6.43129 16.921 6.22993 16.921 6.02856ZM5.34966 6.19087C5.37992 6.3354 5.45115 6.47307 5.56336 6.58528L10.014 11.0359L10.014 11.0359L5.56336 6.58524C5.45116 6.47304 5.37992 6.33539 5.34966 6.19087ZM5.35087 16.2121C5.38193 16.3541 5.45267 16.4891 5.56309 16.5996C5.87037 16.9068 6.36856 16.9068 6.67583 16.5996L11.1268 12.1486L15.578 16.5999C15.8853 16.9072 16.3835 16.9072 16.6908 16.5999C16.8498 16.4409 16.9265 16.2307 16.9209 16.0223C16.9265 16.2307 16.8498 16.4409 16.6908 16.5999C16.3835 16.9072 15.8853 16.9072 15.578 16.5999L11.1268 12.1487L6.67583 16.5996C6.36856 16.9069 5.87037 16.9069 5.56309 16.5996C5.45267 16.4892 5.38192 16.3541 5.35087 16.2121Z\"\n              fill=\"#333333\"\n            />\n          </svg>\n        </div>\n      </div>\n      <div\n        className={cn(\n          'my-[32px] flex-1 overflow-auto overscroll-contain px-[24px] md:mb-[48px]',\n          !title && 'mt-0',\n          'min-l:px-[32px]',\n          scrollClassName\n        )}\n        onScroll={event => {\n          const targetElement = event.target as HTMLDivElement\n\n          if (targetElement.scrollHeight <= targetElement.clientHeight) {\n            return\n          }\n\n          if (targetElement.scrollTop + targetElement.clientHeight >= targetElement.scrollHeight - 50) {\n            onScrollEnd && onScrollEnd(event)\n          }\n        }}\n      >\n        {children}\n      </div>\n    </ReactModal>\n  )\n}\n"],
+  "mappings": "AA0DM,OAOE,OAAAA,EAPF,QAAAC,MAAA,oBA1DN,OAAS,cAAcC,MAAU,gBACjC,OAAS,aAAAC,EAAW,YAAAC,MAA8B,QAClD,OAAOC,MAAgB,cAgBhB,MAAMC,EAAwB,CAAC,CACpC,OAAAC,EACA,MAAAC,EACA,UAAAC,EAAY,GACZ,iBAAAC,EAAmB,GACnB,gBAAAC,EAAkB,GAClB,QAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,mBAAAC,EACA,eAAAC,EAAiB,GACjB,GAAGC,CACL,IAA+C,CAC7C,KAAM,CAACC,EAAeC,CAAgB,EAAIhB,EAAS,EAAK,EAExD,OAAAD,EAAU,IAAM,CACTY,GAGL,sBAAsB,IAAM,CAC1BK,EAAiBb,GAAU,EAAK,CAClC,CAAC,CACH,EAAG,CAACA,EAAQQ,CAAY,CAAC,EAGvBd,EAACI,EAAA,CACC,OAAQE,GAAU,GAClB,iBAAkBL,EAChB,gGACAQ,CACF,EACA,UAAWR,EACT,mMACAiB,EAAgB,GAAKH,EACrBP,CACF,EACA,eAAgBG,EACf,GAAGM,EAEJ,UAAAjB,EAAC,OACC,UAAWC,EACT,oDACAM,EAAQ,+DAAiE,qBACzES,CACF,EAEA,UAAAjB,EAAC,OAAI,UAAU,wBAAyB,SAAAQ,EAAM,EAC9CR,EAAC,OACC,UAAU,6BACV,QAASY,EACT,UAAW,GAAK,EACV,EAAE,MAAQ,SAAW,EAAE,MAAQ,OACjC,EAAE,eAAe,EACjBA,IAAU,EAEd,EACA,KAAK,SACL,SAAU,EAEV,SAAAZ,EAAC,OAAI,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAC,QACC,SAAS,UACT,SAAS,UACT,EAAE,syCACF,KAAK,UACP,EACF,EACF,GACF,EACAA,EAAC,OACC,UAAWE,EACT,2EACA,CAACM,GAAS,OACV,kBACAG,CACF,EACA,SAAUU,GAAS,CACjB,MAAMC,EAAgBD,EAAM,OAExBC,EAAc,cAAgBA,EAAc,cAI5CA,EAAc,UAAYA,EAAc,cAAgBA,EAAc,aAAe,IACvFT,GAAeA,EAAYQ,CAAK,CAEpC,EAEC,SAAAP,EACH,GACF,CAEJ",
+  "names": ["jsx", "jsxs", "cn", "useEffect", "useState", "ReactModal", "CreditsModalContainer", "isOpen", "title", "className", "overlayClassName", "scrollClassName", "onClose", "onScrollEnd", "children", "useAnimation", "animationClassName", "titleClassName", "props", "animationShow", "setAnimationShow", "event", "targetElement"]
+}

package/dist/esm/debug-env.d.ts

@@ -0,0 +1,7 @@
+export declare const debugEnv: () => {
+    BRAND: string;
+    ENV: string | undefined;
+    STOREFRONT_TOKEN: string | undefined;
+    STORE_DOMAIN: string | undefined;
+    METAFIELD_PREFIX: string;
+};

package/dist/esm/debug-env.js

@@ -0,0 +1,2 @@
+const _=()=>(console.log("=== Campaign UI Environment Variables Debug ==="),console.log("NEXT_PUBLIC_BRAND:",process.env.NEXT_PUBLIC_BRAND),console.log("NEXT_PUBLIC_ENV:",process.env.NEXT_PUBLIC_ENV),console.log("NEXT_PUBLIC_I18N_SHOPIFY_STOREFRONT_TOKEN:",process.env.NEXT_PUBLIC_I18N_SHOPIFY_STOREFRONT_TOKEN),console.log("NEXT_PUBLIC_I18N_SHOPIFY_STORE_DOMAIN:",process.env.NEXT_PUBLIC_I18N_SHOPIFY_STORE_DOMAIN),console.log("NEXT_PUBLIC_METAFIELD_NAMESPACE_PREFIX:",process.env.NEXT_PUBLIC_METAFIELD_NAMESPACE_PREFIX),console.log("==============================================="),{BRAND:process.env.NEXT_PUBLIC_BRAND||"soundcore",ENV:process.env.NEXT_PUBLIC_ENV,STOREFRONT_TOKEN:process.env.NEXT_PUBLIC_I18N_SHOPIFY_STOREFRONT_TOKEN,STORE_DOMAIN:process.env.NEXT_PUBLIC_I18N_SHOPIFY_STORE_DOMAIN,METAFIELD_PREFIX:process.env.NEXT_PUBLIC_METAFIELD_NAMESPACE_PREFIX||""});export{_ as debugEnv};
+//# sourceMappingURL=debug-env.js.map

package/dist/esm/debug-env.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/debug-env.ts"],
+  "sourcesContent": ["// \u8C03\u8BD5\u73AF\u5883\u53D8\u91CF\u5DE5\u5177\nexport const debugEnv = () => {\n  console.log('=== Campaign UI Environment Variables Debug ===')\n  console.log('NEXT_PUBLIC_BRAND:', process.env.NEXT_PUBLIC_BRAND)\n  console.log('NEXT_PUBLIC_ENV:', process.env.NEXT_PUBLIC_ENV)\n  console.log('NEXT_PUBLIC_I18N_SHOPIFY_STOREFRONT_TOKEN:', process.env.NEXT_PUBLIC_I18N_SHOPIFY_STOREFRONT_TOKEN)\n  console.log('NEXT_PUBLIC_I18N_SHOPIFY_STORE_DOMAIN:', process.env.NEXT_PUBLIC_I18N_SHOPIFY_STORE_DOMAIN)\n  console.log('NEXT_PUBLIC_METAFIELD_NAMESPACE_PREFIX:', process.env.NEXT_PUBLIC_METAFIELD_NAMESPACE_PREFIX)\n  console.log('===============================================')\n  \n  return {\n    BRAND: process.env.NEXT_PUBLIC_BRAND || 'soundcore',\n    ENV: process.env.NEXT_PUBLIC_ENV,\n    STOREFRONT_TOKEN: process.env.NEXT_PUBLIC_I18N_SHOPIFY_STOREFRONT_TOKEN,\n    STORE_DOMAIN: process.env.NEXT_PUBLIC_I18N_SHOPIFY_STORE_DOMAIN,\n    METAFIELD_PREFIX: process.env.NEXT_PUBLIC_METAFIELD_NAMESPACE_PREFIX || ''\n  }\n}\n"],
+  "mappings": "AACO,MAAMA,EAAW,KACtB,QAAQ,IAAI,iDAAiD,EAC7D,QAAQ,IAAI,qBAAsB,QAAQ,IAAI,iBAAiB,EAC/D,QAAQ,IAAI,mBAAoB,QAAQ,IAAI,eAAe,EAC3D,QAAQ,IAAI,6CAA8C,QAAQ,IAAI,yCAAyC,EAC/G,QAAQ,IAAI,yCAA0C,QAAQ,IAAI,qCAAqC,EACvG,QAAQ,IAAI,0CAA2C,QAAQ,IAAI,sCAAsC,EACzG,QAAQ,IAAI,iDAAiD,EAEtD,CACL,MAAO,QAAQ,IAAI,mBAAqB,YACxC,IAAK,QAAQ,IAAI,gBACjB,iBAAkB,QAAQ,IAAI,0CAC9B,aAAc,QAAQ,IAAI,sCAC1B,iBAAkB,QAAQ,IAAI,wCAA0C,EAC1E",
+  "names": ["debugEnv"]
+}

package/dist/esm/index.d.ts

@@ -1 +1,2 @@
-export * from './components/index.js';
+export * from './components';
+export * from './templates';

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export*from"./components/index.js";
+export*from"./components";export*from"./templates";
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.ts"],
-  "sourcesContent": ["export * from './components/index.js'\n"],
-  "mappings": "AAAA,WAAc",
+  "sourcesContent": ["export * from './components'\nexport * from './templates'\n"],
+  "mappings": "AAAA,WAAc,eACd,WAAc",
   "names": []
 }

package/dist/esm/stories/chat.stories.d.ts

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import { Chat } from '../components/index.js';
+import { Chat } from '../components/index';
 import '../styles/chat.css';
 type Story = StoryObj<typeof meta>;
 declare const meta: Meta<typeof Chat>;

package/dist/esm/stories/chat.stories.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import"react";import{Chat as e}from"../components/index.js";import"../styles/chat.css";const a={title:"Campaign/Chat",component:e,args:{title:"DTC Live Chat",runtimeUrl:"https://beta-api-livechat.anker.com",shopifyDomain:"soundcoreusa.myshopify.com"},tags:["autodocs"],decorators:[o=>t("div",{style:{height:"700px"},children:t(o,{})})]};var m=a;const n={args:{title:"DTC Live Chat",runtimeUrl:"https://beta-api-livechat.anker.com",shopifyDomain:"soundcoreusa.myshopify.com",userId:"arno7",showResponseButton:"follow",lang:{popupTip:"Hi ! Welcome to soundcore Innovations live chat\uFF01",popupTipTimeout:[3e3,6e3]}}};export{n as Default,m as default};
+import{jsx as t}from"react/jsx-runtime";import{Chat as e}from"../components/index";import"../styles/chat.css";const a={title:"Campaign/Chat",component:e,args:{title:"DTC Live Chat",runtimeUrl:"https://beta-api-livechat.anker.com",shopifyDomain:"soundcoreusa.myshopify.com"},tags:["autodocs"],decorators:[o=>t("div",{style:{height:"700px"},children:t(o,{})})]};var m=a;const n={args:{title:"DTC Live Chat",runtimeUrl:"https://beta-api-livechat.anker.com",shopifyDomain:"soundcoreusa.myshopify.com",userId:"arno7",showResponseButton:"follow",lang:{popupTip:"Hi ! Welcome to soundcore Innovations live chat\uFF01",popupTipTimeout:[3e3,6e3]}}};export{n as Default,m as default};
 //# sourceMappingURL=chat.stories.js.map

package/dist/esm/stories/chat.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/stories/chat.stories.tsx"],
-  "sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport { Chat } from '../components/index.js'\nimport '../styles/chat.css'\n\ntype Story = StoryObj<typeof meta>\n\n// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export\nconst meta: Meta<typeof Chat> = {\n  // \u540C\u65F6\u5B9A\u4E49\u4E86\u9875\u9762\u5DE6\u4FA7\u83DC\u5355\n  title: 'Campaign/Chat',\n  component: Chat,\n  args: {\n    title: 'DTC Live Chat',\n    runtimeUrl: 'https://beta-api-livechat.anker.com',\n    shopifyDomain: 'soundcoreusa.myshopify.com',\n  },\n  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs\n  tags: ['autodocs'],\n  // More on argTypes: https://storybook.js.org/docs/api/argtypes\n  decorators: [\n    Story => (\n      <div style={{ height: '700px' }}>\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof Chat>\n\nexport default meta\n\nexport const Default: Story = {\n  args: {\n    title: 'DTC Live Chat',\n    runtimeUrl: 'https://beta-api-livechat.anker.com',\n    shopifyDomain: 'soundcoreusa.myshopify.com',\n    userId: 'arno7',\n    showResponseButton: 'follow',\n    lang: { popupTip: 'Hi ! Welcome to soundcore Innovations live chat\uFF01', popupTipTimeout: [3000, 6000] },\n  },\n}\n"],
-  "mappings": "AAuBQ,cAAAA,MAAA,oBAvBR,MAAkB,QAElB,OAAS,QAAAC,MAAY,yBACrB,MAAO,qBAKP,MAAMC,EAA0B,CAE9B,MAAO,gBACP,UAAWD,EACX,KAAM,CACJ,MAAO,gBACP,WAAY,sCACZ,cAAe,4BACjB,EAEA,KAAM,CAAC,UAAU,EAEjB,WAAY,CACVE,GACEH,EAAC,OAAI,MAAO,CAAE,OAAQ,OAAQ,EAC5B,SAAAA,EAACG,EAAA,EAAM,EACT,CAEJ,CACF,EAEA,IAAOC,EAAQF,EAER,MAAMG,EAAiB,CAC5B,KAAM,CACJ,MAAO,gBACP,WAAY,sCACZ,cAAe,6BACf,OAAQ,QACR,mBAAoB,SACpB,KAAM,CAAE,SAAU,wDAAoD,gBAAiB,CAAC,IAAM,GAAI,CAAE,CACtG,CACF",
+  "sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport { Chat } from '../components/index'\nimport '../styles/chat.css'\n\ntype Story = StoryObj<typeof meta>\n\n// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export\nconst meta: Meta<typeof Chat> = {\n  // \u540C\u65F6\u5B9A\u4E49\u4E86\u9875\u9762\u5DE6\u4FA7\u83DC\u5355\n  title: 'Campaign/Chat',\n  component: Chat,\n  args: {\n    title: 'DTC Live Chat',\n    runtimeUrl: 'https://beta-api-livechat.anker.com',\n    shopifyDomain: 'soundcoreusa.myshopify.com',\n  },\n  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs\n  tags: ['autodocs'],\n  // More on argTypes: https://storybook.js.org/docs/api/argtypes\n  decorators: [\n    Story => (\n      <div style={{ height: '700px' }}>\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof Chat>\n\nexport default meta\n\nexport const Default: Story = {\n  args: {\n    title: 'DTC Live Chat',\n    runtimeUrl: 'https://beta-api-livechat.anker.com',\n    shopifyDomain: 'soundcoreusa.myshopify.com',\n    userId: 'arno7',\n    showResponseButton: 'follow',\n    lang: { popupTip: 'Hi ! Welcome to soundcore Innovations live chat\uFF01', popupTipTimeout: [3000, 6000] },\n  },\n}\n"],
+  "mappings": "AAuBQ,cAAAA,MAAA,oBArBR,OAAS,QAAAC,MAAY,sBACrB,MAAO,qBAKP,MAAMC,EAA0B,CAE9B,MAAO,gBACP,UAAWD,EACX,KAAM,CACJ,MAAO,gBACP,WAAY,sCACZ,cAAe,4BACjB,EAEA,KAAM,CAAC,UAAU,EAEjB,WAAY,CACVE,GACEH,EAAC,OAAI,MAAO,CAAE,OAAQ,OAAQ,EAC5B,SAAAA,EAACG,EAAA,EAAM,EACT,CAEJ,CACF,EAEA,IAAOC,EAAQF,EAER,MAAMG,EAAiB,CAC5B,KAAM,CACJ,MAAO,gBACP,WAAY,sCACZ,cAAe,6BACf,OAAQ,QACR,mBAAoB,SACpB,KAAM,CAAE,SAAU,wDAAoD,gBAAiB,CAAC,IAAM,GAAI,CAAE,CACtG,CACF",
   "names": ["jsx", "Chat", "meta", "Story", "chat_stories_default", "Default"]
 }

package/dist/esm/templates/credits.d.ts

@@ -0,0 +1,58 @@
+import { HeadlessConfig } from '@anker-in/lib';
+import { DTC_TASK_TYPE } from '../components/credits/context/const';
+import { CreditsPageCommon } from '../components/credits/type';
+import { CreditsBannerCopy } from '../components/credits/creditsBanner';
+import { CreditsInfoCardCopy } from '../components/credits/creditsInfoCard';
+import { CreditsBenefitsCopy } from '../components/credits/creditsBenefits';
+import { CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysToGetCredits';
+import { CreditsRedeemListCopy } from '../components/credits/creditsRedeemList';
+import { CreditsCashCopy } from '../components/credits/creditsCash';
+import { CreditsFaqCopy } from '../components/credits/creditsFaq';
+export declare enum ComponentKey {
+    Banner = "banner",
+    InfoCard = "infoCard",
+    Benefits = "benefits",
+    WaysToGetCredits = "waysToGetCredits",
+    RedeemList = "redeemList",
+    SpendCreditsLikeCash = "spendCreditsLikeCash",
+    Faqs = "faqs"
+}
+export type CreditsTemplateProps = {
+    headlessConfig: HeadlessConfig;
+    siteConfig: {
+        registrationsSettings: {
+            authCodeActivate: any;
+        };
+        taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>;
+    };
+    pageConfig: {
+        order: ComponentKey[];
+        common: CreditsPageCommon;
+        components: {
+            [ComponentKey.Banner]?: CreditsBannerCopy;
+            [ComponentKey.InfoCard]?: CreditsInfoCardCopy;
+            [ComponentKey.Benefits]?: CreditsBenefitsCopy;
+            [ComponentKey.WaysToGetCredits]?: CreditsWaysToGetCreditsCopy;
+            [ComponentKey.RedeemList]?: CreditsRedeemListCopy;
+            [ComponentKey.SpendCreditsLikeCash]?: CreditsCashCopy;
+            [ComponentKey.Faqs]?: CreditsFaqCopy;
+        };
+    };
+    userContext: {
+        profile: any;
+        removeProfile: () => void;
+        isLoadingProfile: boolean;
+        creditInfo: any;
+        customer: any;
+        customerLoading: boolean;
+        fetchCreditInfo: () => void;
+    };
+    registrationContext: {
+        openSignUpPopup: () => void;
+        openSignInPopup: () => void;
+    };
+    gtm: {
+        pageGroup: string;
+    };
+};
+export declare const CreditsTemplate: ({ headlessConfig, siteConfig, userContext, pageConfig, registrationContext, gtm, }: CreditsTemplateProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/templates/credits.js

@@ -0,0 +1,2 @@
+import{Fragment as L,jsx as o,jsxs as v}from"react/jsx-runtime";import{classNames as C,HeadlessProvider as m}from"@anker-in/lib";import{RegistrationProvider as f}from"../components/registration/context/provider";import{CreditsProvider as y}from"../components/credits/context/provider";import{CreditsBanner as c}from"../components/credits/creditsBanner";import{CreditsInfoCard as l}from"../components/credits/creditsInfoCard";import{CreditsBenefits as g}from"../components/credits/creditsBenefits";import{CreditsWaysToGetCredits as P}from"../components/credits/creditsWaysToGetCredits";import{CreditsRedeemList as T}from"../components/credits/creditsRedeemList";import{CreditsCash as u}from"../components/credits/creditsCash";import{CreditsFaq as h}from"../components/credits/creditsFaq";var I=(e=>(e.Banner="banner",e.InfoCard="infoCard",e.Benefits="benefits",e.WaysToGetCredits="waysToGetCredits",e.RedeemList="redeemList",e.SpendCreditsLikeCash="spendCreditsLikeCash",e.Faqs="faqs",e))(I||{});const O=({headlessConfig:d,siteConfig:s,userContext:r,pageConfig:i,registrationContext:t,gtm:n})=>o(m,{headlessConfig:d,children:o(f,{copy:s.registrationsSettings,email:r?.profile?.email,children:o(y,{profile:r?.profile,removeProfile:r?.removeProfile,isLoadingProfile:r?.isLoadingProfile,openSignInPopup:t.openSignInPopup,openSignUpPopup:t.openSignUpPopup,creditInfo:r?.creditInfo,taskIdToTypeMapping:s.taskIdToTypeMapping,customer:r?.customer,fetchCreditInfo:r?.fetchCreditInfo,customerLoading:r?.customerLoading,gtm:n,pageCommon:i.common,children:o("div",{className:C("bg-[#f5f5f7] leading-[1.2]"),children:i.order.map(p=>{const e=i.components?.[p];return e?v(L,{children:[a=>{switch(a){case"banner":return o(c,{copy:e});case"infoCard":return o(l,{copy:e});case"benefits":return o(g,{copy:e});case"waysToGetCredits":return o(P,{copy:e});case"redeemList":return o(T,{copy:e});case"spendCreditsLikeCash":return o(u,{copy:e});case"faqs":return o(h,{copy:e});default:return null}},o("div",{className:"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16"})]}):null})})})})});export{I as ComponentKey,O as CreditsTemplate};
+//# sourceMappingURL=credits.js.map

package/dist/esm/templates/credits.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/templates/credits.tsx"],
+  "sourcesContent": ["import { classNames, HeadlessConfig, HeadlessProvider } from '@anker-in/lib'\nimport { RegistrationProvider } from '../components/registration/context/provider'\n\nimport { DTC_TASK_TYPE } from '../components/credits/context/const'\nimport { CreditsProvider } from '../components/credits/context/provider'\nimport { CreditsPageCommon } from '../components/credits/type'\n\nimport { CreditsBanner, CreditsBannerCopy } from '../components/credits/creditsBanner'\nimport { CreditsInfoCard, CreditsInfoCardCopy } from '../components/credits/creditsInfoCard'\nimport { CreditsBenefits, CreditsBenefitsCopy } from '../components/credits/creditsBenefits'\nimport { CreditsWaysToGetCredits, CreditsWaysToGetCreditsCopy } from '../components/credits/creditsWaysToGetCredits'\nimport { CreditsRedeemList, CreditsRedeemListCopy } from '../components/credits/creditsRedeemList'\nimport { CreditsCash, CreditsCashCopy } from '../components/credits/creditsCash'\nimport { CreditsFaq, CreditsFaqCopy } from '../components/credits/creditsFaq'\n\nexport enum ComponentKey {\n  Banner = 'banner',\n  InfoCard = 'infoCard',\n  Benefits = 'benefits',\n  WaysToGetCredits = 'waysToGetCredits',\n  RedeemList = 'redeemList',\n  SpendCreditsLikeCash = 'spendCreditsLikeCash',\n  Faqs = 'faqs',\n}\nexport type CreditsTemplateProps = {\n  headlessConfig: HeadlessConfig\n  siteConfig: {\n    registrationsSettings: {\n      authCodeActivate: any\n    }\n    taskIdToTypeMapping: Record<string, DTC_TASK_TYPE>\n  }\n  pageConfig: {\n    order: ComponentKey[]\n    common: CreditsPageCommon\n    components: {\n      [ComponentKey.Banner]?: CreditsBannerCopy\n      [ComponentKey.InfoCard]?: CreditsInfoCardCopy\n      [ComponentKey.Benefits]?: CreditsBenefitsCopy\n      [ComponentKey.WaysToGetCredits]?: CreditsWaysToGetCreditsCopy\n      [ComponentKey.RedeemList]?: CreditsRedeemListCopy\n      [ComponentKey.SpendCreditsLikeCash]?: CreditsCashCopy\n      [ComponentKey.Faqs]?: CreditsFaqCopy\n    }\n  }\n  userContext: {\n    profile: any\n    removeProfile: () => void\n    isLoadingProfile: boolean\n    creditInfo: any\n    customer: any\n    customerLoading: boolean\n    fetchCreditInfo: () => void\n  }\n  registrationContext: {\n    openSignUpPopup: () => void\n    openSignInPopup: () => void\n  }\n  gtm: {\n    pageGroup: string\n  }\n}\n\nexport const CreditsTemplate = ({\n  headlessConfig,\n  siteConfig,\n  userContext,\n  pageConfig,\n  registrationContext,\n  gtm,\n}: CreditsTemplateProps) => {\n  return (\n    <HeadlessProvider headlessConfig={headlessConfig}>\n      <RegistrationProvider copy={siteConfig.registrationsSettings} email={userContext?.profile?.email}>\n        <CreditsProvider\n          profile={userContext?.profile}\n          removeProfile={userContext?.removeProfile}\n          isLoadingProfile={userContext?.isLoadingProfile}\n          openSignInPopup={registrationContext.openSignInPopup}\n          openSignUpPopup={registrationContext.openSignUpPopup}\n          creditInfo={userContext?.creditInfo}\n          taskIdToTypeMapping={siteConfig.taskIdToTypeMapping}\n          customer={userContext?.customer}\n          fetchCreditInfo={userContext?.fetchCreditInfo}\n          customerLoading={userContext?.customerLoading}\n          gtm={gtm}\n          pageCommon={pageConfig.common}\n        >\n          <div className={classNames('bg-[#f5f5f7] leading-[1.2]')}>\n            {pageConfig.order.map(item => {\n              const componentCopy = pageConfig.components?.[item]\n              if (!componentCopy) return null\n              return (\n                <>\n                  {(item: ComponentKey) => {\n                    switch (item) {\n                      case 'banner':\n                        return <CreditsBanner copy={componentCopy as CreditsBannerCopy} />\n                      case 'infoCard':\n                        return <CreditsInfoCard copy={componentCopy as CreditsInfoCardCopy} />\n                      case 'benefits':\n                        return <CreditsBenefits copy={componentCopy as CreditsBenefitsCopy} />\n                      case 'waysToGetCredits':\n                        return <CreditsWaysToGetCredits copy={componentCopy as CreditsWaysToGetCreditsCopy} />\n                      case 'redeemList':\n                        return <CreditsRedeemList copy={componentCopy as CreditsRedeemListCopy} />\n                      case 'spendCreditsLikeCash':\n                        return <CreditsCash copy={componentCopy as CreditsCashCopy} />\n                      case 'faqs':\n                        return <CreditsFaq copy={componentCopy as CreditsFaqCopy} />\n                      default:\n                        return null\n                    }\n                  }}\n                  <div className=\"laptop:h-16 desktop:h-[96px] lg-desktop:h-[128px] tablet:h-16 h-16\" />\n                </>\n              )\n            })}\n          </div>\n        </CreditsProvider>\n      </RegistrationProvider>\n    </HeadlessProvider>\n  )\n}\n"],
+  "mappings": "AA6FgB,mBAAAA,EAIe,OAAAC,EAJf,QAAAC,MAAA,oBA7FhB,OAAS,cAAAC,EAA4B,oBAAAC,MAAwB,gBAC7D,OAAS,wBAAAC,MAA4B,8CAGrC,OAAS,mBAAAC,MAAuB,yCAGhC,OAAS,iBAAAC,MAAwC,sCACjD,OAAS,mBAAAC,MAA4C,wCACrD,OAAS,mBAAAC,MAA4C,wCACrD,OAAS,2BAAAC,MAA4D,gDACrE,OAAS,qBAAAC,MAAgD,0CACzD,OAAS,eAAAC,MAAoC,oCAC7C,OAAS,cAAAC,MAAkC,mCAEpC,IAAKC,OACVA,EAAA,OAAS,SACTA,EAAA,SAAW,WACXA,EAAA,SAAW,WACXA,EAAA,iBAAmB,mBACnBA,EAAA,WAAa,aACbA,EAAA,qBAAuB,uBACvBA,EAAA,KAAO,OAPGA,OAAA,IAgDL,MAAMC,EAAkB,CAAC,CAC9B,eAAAC,EACA,WAAAC,EACA,YAAAC,EACA,WAAAC,EACA,oBAAAC,EACA,IAAAC,CACF,IAEIpB,EAACG,EAAA,CAAiB,eAAgBY,EAChC,SAAAf,EAACI,EAAA,CAAqB,KAAMY,EAAW,sBAAuB,MAAOC,GAAa,SAAS,MACzF,SAAAjB,EAACK,EAAA,CACC,QAASY,GAAa,QACtB,cAAeA,GAAa,cAC5B,iBAAkBA,GAAa,iBAC/B,gBAAiBE,EAAoB,gBACrC,gBAAiBA,EAAoB,gBACrC,WAAYF,GAAa,WACzB,oBAAqBD,EAAW,oBAChC,SAAUC,GAAa,SACvB,gBAAiBA,GAAa,gBAC9B,gBAAiBA,GAAa,gBAC9B,IAAKG,EACL,WAAYF,EAAW,OAEvB,SAAAlB,EAAC,OAAI,UAAWE,EAAW,4BAA4B,EACpD,SAAAgB,EAAW,MAAM,IAAIG,GAAQ,CAC5B,MAAMC,EAAgBJ,EAAW,aAAaG,CAAI,EAClD,OAAKC,EAEHrB,EAAAF,EAAA,CACG,UAACsB,GAAuB,CACvB,OAAQA,EAAM,CACZ,IAAK,SACH,OAAOrB,EAACM,EAAA,CAAc,KAAMgB,EAAoC,EAClE,IAAK,WACH,OAAOtB,EAACO,EAAA,CAAgB,KAAMe,EAAsC,EACtE,IAAK,WACH,OAAOtB,EAACQ,EAAA,CAAgB,KAAMc,EAAsC,EACtE,IAAK,mBACH,OAAOtB,EAACS,EAAA,CAAwB,KAAMa,EAA8C,EACtF,IAAK,aACH,OAAOtB,EAACU,EAAA,CAAkB,KAAMY,EAAwC,EAC1E,IAAK,uBACH,OAAOtB,EAACW,EAAA,CAAY,KAAMW,EAAkC,EAC9D,IAAK,OACH,OAAOtB,EAACY,EAAA,CAAW,KAAMU,EAAiC,EAC5D,QACE,OAAO,IACX,CACF,EACAtB,EAAC,OAAI,UAAU,qEAAqE,GACtF,EAxByB,IA0B7B,CAAC,EACH,EACF,EACF,EACF",
+  "names": ["Fragment", "jsx", "jsxs", "classNames", "HeadlessProvider", "RegistrationProvider", "CreditsProvider", "CreditsBanner", "CreditsInfoCard", "CreditsBenefits", "CreditsWaysToGetCredits", "CreditsRedeemList", "CreditsCash", "CreditsFaq", "ComponentKey", "CreditsTemplate", "headlessConfig", "siteConfig", "userContext", "pageConfig", "registrationContext", "gtm", "item", "componentCopy"]
+}

package/dist/esm/templates/index.d.ts

@@ -0,0 +1 @@
+export * from './credits';

package/dist/esm/templates/index.js

@@ -0,0 +1,2 @@
+export*from"./credits";
+//# sourceMappingURL=index.js.map

package/dist/esm/templates/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/templates/index.ts"],
+  "sourcesContent": ["export * from './credits'\n"],
+  "mappings": "AAAA,WAAc",
+  "names": []
+}

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@anker-in/campaign-ui",
-  "version": "0.1.10",
-  "type": "commonjs",
+  "version": "0.2.0-beta.1",
+  "description": "Campaign UI components and utilities for Anker projects",
   "main": "./dist/cjs/index.js",
-  "types": "./dist/cjs/index.d.ts",
   "module": "./dist/esm/index.js",
+  "types": "./dist/esm/index.d.ts",
   "exports": {
     ".": {
       "require": {
@@ -16,15 +16,17 @@
         "default": "./dist/esm/index.js"
       }
     },
-    "./*": "./*",
-    "./chat.css": "./src/styles/chat.css"
+    "./tailwind.config": "./tailwind.config.ts",
+    "./style.css": "./style.css",
+    "./chat.css": "./src/styles/chat.css",
+    "./*": "./*"
   },
-  "description": "",
   "files": [
     "src/**",
     "dist/**",
     "styles/**",
     "*.css",
+    "tailwind.config.ts",
     "README.md",
     "CONTRIBUTING.md"
   ],
@@ -33,23 +35,6 @@
     "**/*.css",
     "**/**/*.css"
   ],
-  "scripts": {
-    "dev": "pnpm run dev:css & pnpm run dev:js:esm & pnpm run dev:js:cjs & pnpm run dev:js:esm:types & pnpm run dev:js:cjs:types",
-    "dev:js:cjs": "node esbuild-cjs.mjs watch=true",
-    "dev:js:cjs:types": "tsc --watch --incremental --outdir dist/cjs",
-    "dev:js:esm": "node esbuild-esm.mjs watch=true",
-    "dev:js:esm:types": "tsc --watch --incremental --outdir dist/esm",
-    "dev:css": "postcss src/styles/global.css -o style.css --watch",
-    "build": "pnpm run build:css & pnpm run build:js:esm & pnpm run build:js:cjs & pnpm run build:js:esm:types & pnpm run build:js:cjs:types",
-    "build:js:cjs": "node esbuild-cjs.mjs",
-    "build:js:cjs:types": "tsc --outdir dist/cjs",
-    "build:js:esm": "node esbuild-esm.mjs",
-    "build:js:esm:types": "tsc --outdir dist/esm",
-    "build:css": "postcss src/styles/chat.css -o style.css",
-    "lint": "eslint \"src/**/*.ts*\"",
-    "test": "echo run @anker-in/campaign-ui tests",
-    "clean": "rm -rf .turbo node_modules dist style.css"
-  },
   "keywords": [],
   "author": "",
   "license": "ISC",
@@ -59,24 +44,29 @@
     "@babel/preset-typescript": "^7.24.6",
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^14.3.1",
+    "@types/crypto-js": "^4.2.2",
     "@types/jest": "^29.5.12",
     "@types/node": "^20",
     "babel-jest": "^29.7.0",
-    "esbuild": "^0.20.2",
-    "esbuild-style-plugin": "^1.6.3",
+    "esbuild": "^0.19.0",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-require-extensions": "^0.1.3",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "postcss-cli": "^11.0.0",
     "react-test-renderer": "^18.3.1",
-    "stylelint": "^16.6.0"
+    "stylelint": "^16.6.0",
+    "tsup": "^8.4.0",
+    "typescript": "^5.0.0"
+  },
+  "peerDependencies": {
+    "crypto-js": "^4.1.1"
   },
   "dependencies": {
-    "@copilotkit/react-core": "1.8.11",
-    "@copilotkit/react-ui": "1.8.11",
-    "@copilotkit/runtime-client-gql": "1.8.11",
-    "@copilotkit/shared": "1.8.11",
+    "@copilotkit/react-core": "1.1.2",
+    "@copilotkit/react-ui": "1.1.2",
+    "@copilotkit/runtime-client-gql": "1.1.2",
+    "@copilotkit/shared": "1.1.2",
     "@monaco-editor/react": "^4.6.0",
     "@radix-ui/react-checkbox": "^1.0.4",
     "@radix-ui/react-dialog": "^1.0.5",
@@ -88,13 +78,37 @@
     "autoprefixer": "^10.4.19",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
+    "crypto-js": "^4.2.0",
+    "dayjs": "^1.11.7",
     "gsap": "^3.12.5",
     "monaco-editor": "^0.52.0",
     "postcss": "^8.4.38",
-    "react": "^18.3.1",
     "react-codepen-embed": "^1.1.0",
-    "react-dom": "^18.3.1",
+    "swiper": "^11.1.3",
     "tailwind-merge": "^2.3.0",
-    "tailwindcss": "^3.4.3"
+    "tailwindcss": "^3.4.3",
+    "@anker-in/lib": "1.1.0",
+    "@anker-in/headless-ui": "1.0.26"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "exclude": [
+    "dist/**/*"
+  ],
+  "scripts": {
+    "dev": "pnpm run dev:css & tsup --watch",
+    "dev:css": "postcss src/styles/global.css -o style.css --watch",
+    "build": "pnpm run build:css & pnpm run build:js:esm & pnpm run build:js:cjs & pnpm run build:js:esm:types & pnpm run build:js:cjs:types",
+    "build:js:cjs": "node esbuild-cjs.mjs",
+    "build:js:cjs:types": "tsc --outdir dist/cjs",
+    "build:js:esm": "node esbuild-esm.mjs",
+    "build:js:esm:types": "tsc --outdir dist/esm",
+    "build:css": "postcss src/styles/global.css -o style.css",
+    "lint": "eslint \"src/**/*.ts*\"",
+    "test": "echo run @anker-in/campaign-ui tests",
+    "type-check": "tsc --noEmit",
+    "clean": "rm -rf .turbo node_modules dist style.css"
   }
 }

package/src/components/chat/button.tsx

@@ -1,6 +1,6 @@
 import { useChatContext } from '@copilotkit/react-ui'
 
-import type { ButtonProps } from './props.js'
+import type { ButtonProps } from './props'
 
 const DefaultButton = ({ setOpen }: ButtonProps) => {
   const context = useChatContext()

package/src/components/chat/index.tsx

@@ -3,12 +3,12 @@ import React, { useMemo } from 'react'
 import { useCallback, useState, useEffect } from 'react'
 import { CopilotKit } from '@copilotkit/react-core'
 import { CopilotPopup } from '@copilotkit/react-ui'
-import DefaultButton from './button.js'
-import Messages from './messages.js'
-import ResponseButton from './response.js'
-import Suggestions from './suggestions.js'
-import { CopilotAction } from './action.js'
-import fetcher from '../../helpers/fetcher.js'
+import DefaultButton from './button'
+import Messages from './messages'
+import ResponseButton from './response'
+import Suggestions from './suggestions'
+import { CopilotAction } from './action'
+import { fetcher } from '@anker-in/lib'
 
 export interface ChatProps {
   title: string

package/src/components/chat/messages.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useMemo, useState } from 'react'
-import type { MessagesProps } from './props.js'
+import type { MessagesProps } from './props'
 import { useChatContext } from '@copilotkit/react-ui'
-import { Markdown } from './markdown.js'
+import { Markdown } from './markdown'
 import { type RenderFunctionStatus, useCopilotContext } from '@copilotkit/react-core'
 import {
   MessageStatusCode,

package/src/components/chat/response.tsx

@@ -8,10 +8,7 @@ const ResponseButton = ({ messagesId }: { messagesId: string }) => {
 
   return (
     !isLoading && (
-      <button
-        onClick={() => (isLoading ? stopGeneration() : reloadMessages(messagesId))}
-        className="copilotKitResponseButton"
-      >
+      <button onClick={() => (isLoading ? stopGeneration() : reloadMessages())} className="copilotKitResponseButton">
         {isLoading ? context.labels.stopGenerating : context.labels.regenerateResponse}
         <span>{isLoading ? context.icons.stopIcon : context.icons.regenerateIcon}</span>
       </button>

package/src/components/chat/suggestions.tsx

@@ -1,7 +1,7 @@
 import { useCopilotChat } from '@copilotkit/react-core'
 import { Role, TextMessage } from '@copilotkit/runtime-client-gql'
 
-import type { SuggestionsProps, ChatSuggestions } from './props.js'
+import type { SuggestionsProps, ChatSuggestions } from './props'
 
 const Suggestions = ({ currentSuggestions }: ChatSuggestions) => {
   const { appendMessage } = useCopilotChat()

package/src/components/credits/const.ts

@@ -0,0 +1 @@
+export const roundedBrands = ['eufy', 'soundcore']

package/src/components/credits/context/const.ts

@@ -0,0 +1,104 @@
+export enum CreditType {
+  All = 0,
+  Earned = 1,
+  Deducted = 2,
+  Expired = 3,
+}
+
+export enum ConsumeType {
+  Coupon = 'coupon',
+  GiftCard = 'giftCard',
+  GoGift = 'goGift',
+  Product = 'product',
+  ShippingCoupon = 'shippingCoupon',
+}
+
+export enum AlpcConsumeType {
+  Coupon = 1,
+  Product = 2,
+}
+
+export enum TaskType {
+  Program = 1,
+  Operation = 2,
+  Redeem = 3,
+}
+
+export enum DTC_TASK_TYPE {
+  FirstPurchase = 'firstPurchase',
+  UploadReceipt = 'uploadReceipt',
+  Shopping = 'shopping',
+}
+
+export enum TaskSubType {
+  Activation = 1, // 激活事件
+  UpdateName = 2, // 完善姓名
+  UpdatePhone = 3, // 更新手机号
+  UpdateBirthday = 4, // 更新生日
+  Subscription = 5, // 订阅
+  UpadteAppName = 7, // 完善APP姓名
+  Refund = 3000, // 购物送积分任务退款
+  ProductUnApproved = 5000, // 兑换商品审核不通过
+}
+
+export enum CouponType {
+  FixedMount = 'fixed_amount',
+  Percent = 'percent',
+}
+
+export enum RewardType {
+  Received = 0,
+  Pending = 1,
+  ApproveSuccess = 2,
+  ApproveFail = 3,
+  Unfulfilled = 4,
+  Fulfilled = 5,
+  Failed = 6,
+}
+
+export enum AlpcErrorCode {
+  CodeLpcRedeemFailed = 180001,
+  //user not found
+  CodeLpcUserNotFound = 180002,
+  //credit rule not found
+  CodeLpcCreditRuleNotFound = 180003,
+  //unknown error
+  CodeLpcUnknownError = 180004,
+  // not enough credits
+  CodeLpcNotEnoughCredits = 180005,
+  // user migrate
+  CodeLpcUserMigrate = 180006,
+  // 库存不足
+  CodeLpcRuleInventoryNotEnough = 180007,
+  // 兑换次数限制
+  CodeLpcShopifyCouponRuleRedeemLimit = 180009,
+  // 跨区兑换错误（非欧兑换欧洲的）
+  CodeCrossSiteError = 180011,
+}
+
+export const ALPC_COUNTRY_MAP = new Map<string, string>([
+  ['eu-en', 'eu'],
+  ['eu-de', 'de'],
+])
+
+export enum ApprovalStatus {
+  Pending = 0,
+  Success = 1,
+  Failed = 2,
+  DoubleConfirm = 3,
+}
+
+export const PRICE_SYMBOL = {
+  us: '$',
+  uk: '£',
+  ca: '$',
+  eu: '€',
+  pl: 'zł',
+  fr: '€',
+  de: '€',
+  vn: '₫',
+  cl: '$',
+  sg: '$',
+  ae: 'AED',
+  es: '€',
+}

package/src/components/credits/context/hooks/useActivities.ts

@@ -0,0 +1,70 @@
+import { useCallback, useEffect, useState } from 'react'
+
+import { useAlpcMutation } from './useAlpcFetch'
+import type { CreditLogResponse } from '../response'
+import { useCreditsContext } from '../provider'
+import { useHeadlessContext } from '@anker-in/lib'
+
+function useActivities({ page, pageSize, options = {} }: { page: number; pageSize: number; options?: any }) {
+  const { profile, isLoadingProfile } = useCreditsContext()
+  const { brand } = useHeadlessContext()
+  const [activities, setActivities] = useState<CreditLogResponse[]>([])
+  const [total, setTotal] = useState(0)
+
+  const [currentPage, setCurrentPage] = useState(0)
+
+  const { isMutating: isLoading, trigger } = useAlpcMutation<
+    {
+      data: {
+        total: number
+        creditLogs: CreditLogResponse[]
+      }
+    },
+    {
+      page: number
+      page_size: number
+      user_id: string
+    }
+  >({
+    url: `/v1/credit/log`,
+    initData: {
+      brand,
+    },
+  })
+
+  const getActivities = useCallback(async () => {
+    const params = {
+      page: page,
+      page_size: pageSize,
+      user_id: profile?.user_id,
+      ...options,
+    }
+
+    trigger(params, {
+      onSuccess(responseData) {
+        setCurrentPage(page)
+        setTotal(responseData?.data?.total)
+        setActivities(activities.concat(responseData?.data?.creditLogs || []))
+      },
+    })
+  }, [activities, profile, page, pageSize, options, trigger])
+
+  useEffect(() => {
+    if (isLoadingProfile || !profile || isLoading) {
+      return
+    }
+
+    if (page !== currentPage && page) {
+      getActivities()
+    }
+  }, [getActivities, isLoadingProfile, isLoading, profile, page, currentPage])
+
+  return {
+    activities,
+    isLoading,
+    total,
+    canNext: total > activities.length && !isLoading,
+  }
+}
+
+export default useActivities