Update overlay color and text color handling

src/features/liveEvents/components/DiscoverFeedLiveEventFeedsAndTrendingBanner.tsx

@@ -3,7 +3,7 @@ import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {useTrendingSettings} from '#/state/preferences/trending'
-import {atoms as a, useLayoutBreakpoints, useTheme} from '#/alf'
+import {atoms as a, useLayoutBreakpoints} from '#/alf'
 import {Button} from '#/components/Button'
 import {DotGrid_Stroke2_Corner0_Rounded as EllipsisIcon} from '#/components/icons/DotGrid'
 import {TrendingInterstitial} from '#/components/interstitials/Trending'
@@ -37,7 +37,6 @@ export function DiscoverFeedLiveEventFeedsAndTrendingBanner() {
 }
 
 function Inner({feed}: {feed: LiveEventFeed}) {
-  const t = useTheme()
   const {_} = useLingui()
   const optionsMenuControl = useDialogControl()
 
@@ -70,11 +69,7 @@ function Inner({feed}: {feed: LiveEventFeed}) {
                 />
                 <EllipsisIcon
                   size="sm"
-                  fill={
-                    feed.images.wide.textColor === 'light'
-                      ? t.palette.white
-                      : t.palette.black
-                  }
+                  fill={feed.images.wide.textColor}
                   style={[a.z_20]}
                 />
               </>

src/features/liveEvents/components/LiveEventFeedCardWide.tsx

@@ -28,7 +28,8 @@ export function LiveEventFeedCardWide({
   const {gtPhone} = useBreakpoints()
 
   const image = feed.images.wide
-  const textColor = feed.images.wide.textColor === 'light' ? 'white' : 'black'
+  const overlayColor = image.overlayColor
+  const textColor = image.textColor
   const url = useMemo(() => {
     // Validated in multiple places on the backend
     if (isBskyCustomFeedUrl(feed.url)) {
@@ -70,7 +71,7 @@ export function LiveEventFeedCardWide({
             />
 
             <LinearGradient
-              colors={[image.overlayColor, utils.alpha(image.overlayColor, 0)]}
+              colors={[overlayColor, utils.alpha(overlayColor, 0)]}
               locations={[0, 1]}
               start={{x: 0, y: 0}}
               end={{x: 1, y: 0}}
@@ -87,10 +88,7 @@ export function LiveEventFeedCardWide({
 
             <View style={[a.flex_1, a.justify_end]}>
               <LinearGradient
-                colors={[
-                  image.overlayColor,
-                  utils.alpha(image.overlayColor, 0),
-                ]}
+                colors={[overlayColor, utils.alpha(overlayColor, 0)]}
                 locations={[0, 1]}
                 start={{x: 0, y: 0}}
                 end={{x: 1, y: 0}}