chore(ui): announcement cleanup

src/homepageExperience/ClickThroughAnnouncementHandler.tsx

@@ -1,19 +1,14 @@
 // Libraries
 import {FC, useEffect} from 'react'
-import {useSelector, useDispatch} from 'react-redux'
+import {useDispatch} from 'react-redux'
 import {useLocalStorageState} from 'use-local-storage-state'
 
-// Selectors
-import {selectCurrentIdentity} from 'src/identity/selectors'
-
 // Utils
 import {showOverlay, dismissOverlay} from 'src/overlays/actions/overlays'
-import {isFlagEnabled} from 'src/shared/utils/featureFlag'
 import {event} from 'src/cloud/utils/reporting'
 
 export enum AnnouncementID {
-  MqttEol = 'mqttEolClickThroughAnnouncement',
-  PriceIncrease = 'pricingClickThroughAnnouncement',
+  None = 'none',
 }
 
 enum AnnouncementState {
@@ -23,7 +18,6 @@ enum AnnouncementState {
 
 export const ClickThroughAnnouncementHandler: FC = () => {
   const dispatch = useDispatch()
-  const {account} = useSelector(selectCurrentIdentity)
 
   const [announcementState, setAnnouncementState] = useLocalStorageState(
     'clickThroughAnnouncement',
@@ -51,6 +45,10 @@ export const ClickThroughAnnouncementHandler: FC = () => {
   }
 
   const handleDisplayAnnouncement = (announcementID: string): void => {
+    if (announcementID === AnnouncementID.None) {
+      return null
+    }
+
     initAnnouncement(announcementID)
 
     if (announcementState[announcementID] === AnnouncementState.Display) {
@@ -66,27 +64,8 @@ export const ClickThroughAnnouncementHandler: FC = () => {
   }
 
   useEffect(() => {
-    // MQTT Audience: Cloud users with MQTT feature flag enabled
-    const isMqttAudience = isFlagEnabled('subscriptionsUI')
-
-    // PAYG Pricing Increase Audience: Pay As You Go & Direct Signups
-    const isPaygAccount = account.type === 'pay_as_you_go'
-    const isDirectSignup = account.billingProvider === 'zuora'
-    const isPriceIncreaseAudience = isPaygAccount && isDirectSignup
-
-    // Sequentially display announcements in order of priority
-    if (
-      isMqttAudience &&
-      announcementState[AnnouncementID.MqttEol] !== AnnouncementState.Dismissed
-    ) {
-      handleDisplayAnnouncement(AnnouncementID.MqttEol)
-    } else if (
-      isPriceIncreaseAudience &&
-      announcementState[AnnouncementID.PriceIncrease] !==
-        AnnouncementState.Dismissed
-    ) {
-      handleDisplayAnnouncement(AnnouncementID.PriceIncrease)
-    }
+    // Sequentially display announcements in order of priority (use AnnouncementID.None to disable)
+    handleDisplayAnnouncement(AnnouncementID.None)
   }, [announcementState])
 
   return null

src/me/components/ClickThroughAnnouncementOverlay.tsx

@@ -4,8 +4,6 @@ import {useSelector} from 'react-redux'
 
 // Components
 import {Overlay} from '@influxdata/clockface'
-import {PaygPriceIncreaseAnnouncement} from 'src/me/components/announcements/PaygPriceIncreaseAnnouncement'
-import {MqttEolAnnouncement} from 'src/me/components/announcements/MqttEolAnnouncement'
 
 // Utils
 import {event} from 'src/cloud/utils/reporting'
@@ -20,43 +18,17 @@ interface ClickThroughAnnouncementOverlayProps {
 
 export const ClickThroughAnnouncementOverlay: FC<
   ClickThroughAnnouncementOverlayProps
-> = ({onClose}) => {
+> = () => {
   const {announcementID} = useSelector(getOverlayParams)
 
   useEffect(() => {
     event(`${announcementID}.displayed`)
   }, [])
 
-  const handleDetailsClick = () => {
-    event(`${announcementID}.details.clicked`)
-  }
-
-  const handleContactUsClick = () => {
-    event(`${announcementID}.contactUs.clicked`)
-  }
-
-  const handleAcknowledgeClick = () => {
-    event(`${announcementID}.acknowledge.clicked`)
-    onClose()
-  }
-
   const announcementContents = (): JSX.Element => {
     switch (announcementID) {
-      case AnnouncementID.PriceIncrease:
-        return (
-          <PaygPriceIncreaseAnnouncement
-            handleAcknowledgeClick={handleAcknowledgeClick}
-            handleContactUsClick={handleContactUsClick}
-            handleDetailsClick={handleDetailsClick}
-          />
-        )
-      case AnnouncementID.MqttEol:
-        return (
-          <MqttEolAnnouncement
-            handleAcknowledgeClick={handleAcknowledgeClick}
-            handleDetailsClick={handleDetailsClick}
-          />
-        )
+      case AnnouncementID.None:
+        return null
       default:
         return null
     }