remove InfoCircle, alf places that used it

src/components/Post/Embed/PostPlaceholder.tsx

@@ -1,33 +1,29 @@
-import {StyleSheet, View} from 'react-native'
+import {View} from 'react-native'
 
-import {usePalette} from '#/lib/hooks/usePalette'
-import {InfoCircleIcon} from '#/lib/icons'
-import {Text} from '#/view/com/util/text/Text'
 import {atoms as a, useTheme} from '#/alf'
+import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfoIcon} from '#/components/icons/CircleInfo'
+import {Text} from '#/components/Typography'
 
 export function PostPlaceholder({children}: {children: React.ReactNode}) {
   const t = useTheme()
-  const pal = usePalette('default')
+
   return (
     <View
-      style={[styles.errorContainer, a.border, t.atoms.border_contrast_low]}>
-      <InfoCircleIcon size={18} style={pal.text} />
-      <Text type="lg" style={pal.text}>
+      style={[
+        a.flex_row,
+        a.gap_xs,
+        a.rounded_md,
+        a.py_md,
+        a.px_md,
+        a.mt_sm,
+        a.align_center,
+        a.border,
+        t.atoms.border_contrast_low,
+      ]}>
+      <CircleInfoIcon size="md" style={t.atoms.text_contrast_medium} />
+      <Text style={[a.text_md, t.atoms.text_contrast_medium, a.italic]}>
         {children}
       </Text>
     </View>
   )
 }
-
-const styles = StyleSheet.create({
-  errorContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: 4,
-    borderRadius: 8,
-    marginTop: 8,
-    paddingVertical: 14,
-    paddingHorizontal: 14,
-    borderWidth: StyleSheet.hairlineWidth,
-  },
-})

src/lib/icons.tsx

@@ -72,30 +72,3 @@ export function ComposeIcon2({
     </Svg>
   )
 }
-
-export function InfoCircleIcon({
-  style,
-  size,
-  strokeWidth = 1.5,
-}: {
-  style?: StyleProp<TextStyle>
-  size?: string | number
-  strokeWidth?: number
-}) {
-  return (
-    <Svg
-      fill="none"
-      viewBox="0 0 24 24"
-      strokeWidth={strokeWidth}
-      stroke="currentColor"
-      width={size}
-      height={size}
-      style={style}>
-      <Path
-        strokeLinecap="round"
-        strokeLinejoin="round"
-        d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z"
-      />
-    </Svg>
-  )
-}

src/view/com/posts/DiscoverFallbackHeader.tsx

@@ -1,39 +1,35 @@
 import {View} from 'react-native'
-import {Trans} from '@lingui/macro'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 
-import {usePalette} from '#/lib/hooks/usePalette'
-import {InfoCircleIcon} from '#/lib/icons'
-import {TextLink} from '../util/Link'
-import {Text} from '../util/text/Text'
+import {atoms as a, useTheme} from '#/alf'
+import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfoIcon} from '#/components/icons/CircleInfo'
+import {InlineLinkText} from '#/components/Link'
+import {Text} from '#/components/Typography'
 
 export function DiscoverFallbackHeader() {
-  const pal = usePalette('default')
+  const t = useTheme()
+  const {_} = useLingui()
+
   return (
-    <View
-      style={[
-        {
-          flexDirection: 'row',
-          alignItems: 'center',
-          paddingVertical: 12,
-          paddingHorizontal: 12,
-          borderTopWidth: 1,
-        },
-        pal.border,
-        pal.viewLight,
-      ]}>
-      <View style={{width: 68, paddingLeft: 12}}>
-        <InfoCircleIcon size={36} style={pal.textLight} strokeWidth={1.5} />
+    <View style={[a.flex_row, a.py_lg, t.atoms.bg_contrast_25]}>
+      <View
+        style={[
+          {width: 70, paddingLeft: 18, paddingRight: 10},
+          a.align_center,
+        ]}>
+        <CircleInfoIcon width={36} style={t.atoms.text_contrast_medium} />
       </View>
-      <View style={{flex: 1}}>
-        <Text type="md" style={pal.text}>
+      <View style={[a.flex_1, a.pr_lg]}>
+        <Text style={[a.text_md, a.leading_snug]}>
           <Trans>
             We ran out of posts from your follows. Here's the latest from{' '}
-            <TextLink
-              type="md-medium"
-              href="/profile/bsky.app/feed/whats-hot"
-              text="Discover"
-              style={pal.link}
-            />
+            <InlineLinkText
+              label={_(msg`Discover`)}
+              to="/profile/bsky.app/feed/whats-hot"
+              style={[a.text_md, a.leading_snug, a.font_medium]}>
+              Discover
+            </InlineLinkText>
             .
           </Trans>
         </Text>