@anker-in/campaign-ui 0.2.10-beta.11 → 0.2.10-beta.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/campaign-ui",
-  "version": "0.2.10-beta.11",
+  "version": "0.2.10-beta.13",
   "type": "commonjs",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",
@@ -84,8 +84,8 @@
     "react-codepen-embed": "^1.1.0",
     "tailwind-merge": "^2.3.0",
     "tailwindcss": "^3.4.3",
-    "@anker-in/shopify": "^0.0.0-beta.4",
-    "@anker-in/headless-ui": "1.0.19"
+    "@anker-in/headless-ui": "1.0.19",
+    "@anker-in/shopify": "^0.0.0-beta.4"
   },
   "peerDependencies": {
     "react": "^18.3.1",

package/src/components/credits/creditsInfoCard/index.tsx

@@ -7,6 +7,7 @@ import { numberFormat } from '../context/utils'
 import ActivitiesModal from '../modal/activitiesModal'
 import MyRewardsModal, { type MyRewardsMetafields } from '../modal/MyRewardsModal'
 import { type MyActivitiesMetafields } from '../modal/activitiesModal'
+import { gaNormalClick } from '@utils/track'
 
 type ButtonConfig = {
   text: string
@@ -30,7 +31,7 @@ export function CreditsInfoCard({ data }: InfoCardProps) {
   const [hover, setHover] = useState<boolean>(false)
 
   const handleButtonClick = useCallback((buttonConfig: ButtonConfig) => {
-    // gaNormalClick({ position: 'info_card', label: buttonConfig.text })
+    gaNormalClick({ position: 'info_card', label: buttonConfig.text })
 
     if (buttonConfig.type) {
       switch (buttonConfig.type) {

package/src/components/credits/modal/MyRewardsModal.tsx

@@ -26,12 +26,15 @@ export interface MyRewardsMetafields {
   pendingTip: string
   processingTip: string
   ShippedTip: string
-  emptyListImageUrl: string
   emptyListLabel: string
   pointUnit: string
   code: string
   copied: string
   copy: string
+  emptyListImage: {
+    url: string
+    alt?: string
+  }
 }
 interface MyRewardsModalProps extends ModalContainerProps {
   data: MyRewardsMetafields
@@ -39,6 +42,7 @@ interface MyRewardsModalProps extends ModalContainerProps {
 
 function MyRewardsModal({ data, ...props }: MyRewardsModalProps) {
   const [activeTab, setActiveTab] = useState(AlpcConsumeType.Coupon)
+  console.log('data123', data)
 
   const [couponPage, setCouponPage] = useState(1)
   const [productPage, setProductPage] = useState(1)
@@ -238,7 +242,11 @@ function MyRewardsModal({ data, ...props }: MyRewardsModalProps) {
       <div className="mt-[24px] overflow-auto overscroll-contain px-[24px] md:px-[16px]">
         {!list.length && !couponIsLoading && !productIsLoading && (
           <div className="flex h-full flex-col items-center justify-center">
-            <Picture className="mb-[12px] w-[160px]" src={data?.emptyListImageUrl}></Picture>
+            <Picture
+              className="mb-[12px] w-[160px]"
+              source={data?.emptyListImage?.url}
+              alt={data?.emptyListImage?.alt || 'empty list image'}
+            ></Picture>
             <div className="text-[16px] font-semibold leading-[1.4]">{data?.emptyListLabel}</div>
           </div>
         )}

package/src/components/credits/modal/activitiesModal.tsx

@@ -30,7 +30,10 @@ export interface MyActivitiesMetafields {
   firstPurchaseTask: string
   uploadReceiptTask: string
   shoppingTask: string
-  emptyListImageUrl: string
+  emptyListImage: {
+    url: string
+    alt?: string
+  }
   emptyListLabel: string
 }
 
@@ -200,7 +203,11 @@ function ActivitiesModal({ data, ...props }: ActivitiesModalProps) {
         )}
         {!list.length && !isLoading && (
           <div className="flex h-full flex-col items-center justify-center">
-            <Picture className="mb-[16px] h-[120px] w-[160px]" src={data?.emptyListImageUrl}></Picture>
+            <Picture
+              className="mb-[16px] h-[120px] w-[160px]"
+              source={data?.emptyListImage?.url}
+              alt={data?.emptyListImage?.alt || 'empty list image'}
+            ></Picture>
             <div className="leading-1.4 text-[16px] font-semibold">{data?.emptyListLabel}</div>
           </div>
         )}

package/src/helpers/track.ts

@@ -25,6 +25,18 @@ export const gaTrack = (data: any) => {
   }
 }
 
+export function gaNormalClick({ position, label }: { position: string; label: string }) {
+  gaTrack({
+    event: 'ga4Event',
+    event_name: 'lp_button',
+    event_parameters: {
+      page_group: 'soundcoreCredits Rewards Program',
+      position: position,
+      button_name: label,
+    },
+  })
+}
+
 // facebook 埋点
 export const fbq = (...args: any[]) => {
   if (window.fbq) {