don't load feed data if we already have it

src/components/Post/Embed/FeedEmbed.tsx

@@ -1,10 +1,9 @@
 import React from 'react'
-import {StyleSheet} from 'react-native'
 import {moderateFeedGenerator} from '@atproto/api'
 
-import {usePalette} from '#/lib/hooks/usePalette'
 import {useModerationOpts} from '#/state/preferences/moderation-opts'
 import {FeedSourceCard} from '#/view/com/feeds/FeedSourceCard'
+import {atoms as a, useTheme} from '#/alf'
 import {ContentHider} from '#/components/moderation/ContentHider'
 import {type EmbedType} from '#/types/bsky/post'
 import {type CommonProps} from './types'
@@ -14,11 +13,18 @@ export function FeedEmbed({
 }: CommonProps & {
   embed: EmbedType<'feed'>
 }) {
-  const pal = usePalette('default')
+  const t = useTheme()
   return (
     <FeedSourceCard
       feedUri={embed.view.uri}
-      style={[pal.view, pal.border, styles.customFeedOuter]}
+      feedData={embed.view}
+      style={[
+        t.atoms.bg,
+        t.atoms.border_contrast_low,
+        a.p_md,
+        a.rounded_sm,
+        a.border,
+      ]}
       showLikes
     />
   )
@@ -41,12 +47,3 @@ export function ModeratedFeedEmbed({
     </ContentHider>
   )
 }
-
-const styles = StyleSheet.create({
-  customFeedOuter: {
-    borderWidth: StyleSheet.hairlineWidth,
-    borderRadius: 8,
-    paddingHorizontal: 12,
-    paddingVertical: 12,
-  },
-})

src/view/com/feeds/FeedSourceCard.tsx

@@ -2,12 +2,17 @@ import React from 'react'
 import {
   Linking,
   Pressable,
-  StyleProp,
+  type StyleProp,
   StyleSheet,
   View,
-  ViewStyle,
+  type ViewStyle,
 } from 'react-native'
-import {AtUri} from '@atproto/api'
+import {
+  type $Typed,
+  AppBskyFeedDefs,
+  type AppBskyGraphDefs,
+  AtUri,
+} from '@atproto/api'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {msg, Plural, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
@@ -17,34 +22,31 @@ import {usePalette} from '#/lib/hooks/usePalette'
 import {sanitizeHandle} from '#/lib/strings/handles'
 import {s} from '#/lib/styles'
 import {logger} from '#/logger'
-import {FeedSourceInfo, useFeedSourceInfoQuery} from '#/state/queries/feed'
+import {
+  type FeedSourceInfo,
+  hydrateFeedGenerator,
+  hydrateList,
+  useFeedSourceInfoQuery,
+} from '#/state/queries/feed'
 import {
   useAddSavedFeedsMutation,
   usePreferencesQuery,
-  UsePreferencesQueryResponse,
   useRemoveFeedMutation,
 } from '#/state/queries/preferences'
 import {FeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
+import {Text} from '#/view/com/util/text/Text'
 import * as Toast from '#/view/com/util/Toast'
-import {useTheme} from '#/alf'
+import {UserAvatar} from '#/view/com/util/UserAvatar'
-import {atoms as a} from '#/alf'
+import {atoms as a, useTheme} from '#/alf'
 import {shouldClickOpenNewTab} from '#/components/Link'
 import * as Prompt from '#/components/Prompt'
 import {RichText} from '#/components/RichText'
-import {Text} from '../util/text/Text'
-import {UserAvatar} from '../util/UserAvatar'
 
-export function FeedSourceCard({
+type FeedSourceCardProps = {
-  feedUri,
-  style,
-  showSaveBtn = false,
-  showDescription = false,
-  showLikes = false,
-  pinOnSave = false,
-  showMinimalPlaceholder,
-  hideTopBorder,
-}: {
   feedUri: string
+  feedData?:
+    | $Typed<AppBskyFeedDefs.GeneratorView>
+    | $Typed<AppBskyGraphDefs.ListView>
   style?: StyleProp<ViewStyle>
   showSaveBtn?: boolean
   showDescription?: boolean
@@ -52,30 +54,40 @@ export function FeedSourceCard({
   pinOnSave?: boolean
   showMinimalPlaceholder?: boolean
   hideTopBorder?: boolean
-}) {
+}
-  const {data: preferences} = usePreferencesQuery()
-  const {data: feed} = useFeedSourceInfoQuery({uri: feedUri})
 
-  return (
+export function FeedSourceCard({
-    <FeedSourceCardLoaded
+  feedUri,
-      feedUri={feedUri}
+  feedData,
-      feed={feed}
+  ...props
-      preferences={preferences}
+}: FeedSourceCardProps) {
-      style={style}
+  if (feedData) {
-      showSaveBtn={showSaveBtn}
+    let feed: FeedSourceInfo
-      showDescription={showDescription}
+    if (AppBskyFeedDefs.isGeneratorView(feedData)) {
-      showLikes={showLikes}
+      feed = hydrateFeedGenerator(feedData)
-      pinOnSave={pinOnSave}
+    } else {
-      showMinimalPlaceholder={showMinimalPlaceholder}
+      feed = hydrateList(feedData)
-      hideTopBorder={hideTopBorder}
+    }
-    />
+    return <FeedSourceCardLoaded feedUri={feedUri} feed={feed} {...props} />
-  )
+  } else {
+    return <FeedSourceCardWithoutData feedUri={feedUri} {...props} />
+  }
+}
+
+export function FeedSourceCardWithoutData({
+  feedUri,
+  ...props
+}: Omit<FeedSourceCardProps, 'feedData'>) {
+  const {data: feed} = useFeedSourceInfoQuery({
+    uri: feedUri,
+  })
+
+  return <FeedSourceCardLoaded feedUri={feedUri} feed={feed} {...props} />
 }
 
 export function FeedSourceCardLoaded({
   feedUri,
   feed,
-  preferences,
   style,
   showSaveBtn = false,
   showDescription = false,
@@ -86,7 +98,6 @@ export function FeedSourceCardLoaded({
 }: {
   feedUri: string
   feed?: FeedSourceInfo
-  preferences?: UsePreferencesQueryResponse
   style?: StyleProp<ViewStyle>
   showSaveBtn?: boolean
   showDescription?: boolean
@@ -95,6 +106,7 @@ export function FeedSourceCardLoaded({
   showMinimalPlaceholder?: boolean
   hideTopBorder?: boolean
 }) {
+  const {data: preferences} = usePreferencesQuery()
   const t = useTheme()
   const pal = usePalette('default')
   const {_} = useLingui()
@@ -248,7 +260,7 @@ export function FeedSourceCardLoaded({
             <Text emoji style={[pal.text, s.bold]} numberOfLines={1}>
               {feed.displayName}
             </Text>
-            <Text style={[pal.textLight]} numberOfLines={1}>
+            <Text type="sm" style={[pal.textLight]} numberOfLines={1}>
               {feed.type === 'feed' ? (
                 <Trans>Feed by {sanitizeHandle(feed.creatorHandle, '@')}</Trans>
               ) : (