feat: add advStatus to user preferences and update related components

Author: medyo

src/App.tsx

@@ -25,8 +25,14 @@ const intersectionCallback = (entries: IntersectionObserverEntry[]) => {
 
 export const App = () => {
   const [showOnboarding, setShowOnboarding] = useState(true)
-  const { onboardingCompleted, maxVisibleCards, isDNDModeActive, DNDDuration, setDNDDuration } =
-    useUserPreferences()
+  const {
+    onboardingCompleted,
+    maxVisibleCards,
+    setAdvStatus,
+    isDNDModeActive,
+    DNDDuration,
+    setDNDDuration,
+  } = useUserPreferences()
 
   useLayoutEffect(() => {
     document.documentElement.style.setProperty('--max-visible-cards', maxVisibleCards.toString())
@@ -38,6 +44,7 @@ export const App = () => {
     setupIdentification()
     const adVerifier = async () => {
       const status = await verifyAdvStatus()
+      setAdvStatus(status)
       identifyAdvBlocked(status)
     }
     adVerifier()

src/features/MarketingBanner/components/MarketingBanner.tsx

@@ -19,7 +19,7 @@ import { Campaign, MarketingConfig } from '../types'
 export const MarketingBanner = () => {
   const { setCampaignClosed, closedCampaigns } = useMarketingConfigStore()
   const { isConnected } = useAuth()
-  const { userSelectedTags, cards, firstSeenDate } = useUserPreferences()
+  const { userSelectedTags, cards, firstSeenDate, advStatus } = useUserPreferences()
   const [availableCampaigns, setAvailableCampaigns] = useState<Campaign[]>([])
   const { data: marketingConfig } = useGetMarketingConfig({
     config: {
@@ -28,6 +28,7 @@ export const MarketingBanner = () => {
     },
   })
   const isMobile = useMediaQuery({ maxWidth: 767 })
+
   const userAtttributes = useMemo(() => {
     return {
       platform: isWebOrExtensionVersion(),
@@ -38,10 +39,11 @@ export const MarketingBanner = () => {
       userTags: userSelectedTags.map((tag) => tag.label),
       cards: cards.map((card) => card.name),
       firstSeenDate,
+      adv: advStatus,
       isConnected,
       usageInDays: diffBetweenTwoDatesInDays(firstSeenDate, Date.now()),
     }
-  }, [userSelectedTags, firstSeenDate, cards])
+  }, [userSelectedTags, firstSeenDate, cards, advStatus])
 
   useEffect(() => {
     if (marketingConfig && marketingConfig.version === 1) {

src/stores/preferences.ts

@@ -28,6 +28,7 @@ export type UserPreferencesState = {
   cardsSettings: Record<string, CardSettingsType>
   firstSeenDate: number
   userCustomCards: SupportedCardType[]
+  advStatus: boolean
   DNDDuration: DNDDuration
 }
 
@@ -48,6 +49,7 @@ type UserPreferencesStoreActions = {
   isDNDModeActive: () => boolean
   addSearchEngine: (searchEngine: SearchEngineType) => void
   removeSearchEngine: (searchEngineUrl: string) => void
+  setAdvStatus: (status: boolean) => void
 }
 
 const defaultStorage: StateStorage = {
@@ -174,6 +176,7 @@ export const useUserPreferences = create(
       ],
       userCustomCards: [],
       DNDDuration: 'never',
+      advStatus: false,
       setSearchEngine: (searchEngine: string) => set({ searchEngine: searchEngine }),
       setListingMode: (listingMode: ListingMode) => set({ listingMode: listingMode }),
       setTheme: (theme: Theme) => set({ theme: theme }),
@@ -234,6 +237,7 @@ export const useUserPreferences = create(
             searchEngines: state.searchEngines.filter((se) => se.url !== searchEngineUrl),
           }
         }),
+      setAdvStatus: (status) => set({ advStatus: status }),
     }),
     {
       name: 'preferences_storage',