A few more UX tweaks

src/lib/constants.ts

@@ -110,26 +110,20 @@ export async function DEFAULT_FEEDS(
     }
   } else if (serviceUrl.includes('staging')) {
     return {
-      pinned: [
+      pinned: [STAGING_DEFAULT_FEED('whats-hot')],
-        STAGING_DEFAULT_FEED('skyline'),
-        STAGING_DEFAULT_FEED('whats-hot'),
-      ],
       saved: [
         STAGING_DEFAULT_FEED('bsky-team'),
-        STAGING_DEFAULT_FEED('skyline'),
+        STAGING_DEFAULT_FEED('with-friends'),
         STAGING_DEFAULT_FEED('whats-hot'),
         STAGING_DEFAULT_FEED('hot-classic'),
       ],
     }
   } else {
     return {
-      pinned: [
+      pinned: [STAGING_DEFAULT_FEED('whats-hot')],
-        STAGING_DEFAULT_FEED('skyline'),
-        STAGING_DEFAULT_FEED('whats-hot'),
-      ],
       saved: [
         STAGING_DEFAULT_FEED('bsky-team'),
-        STAGING_DEFAULT_FEED('skyline'),
+        STAGING_DEFAULT_FEED('with-friends'),
         STAGING_DEFAULT_FEED('whats-hot'),
         STAGING_DEFAULT_FEED('hot-classic'),
       ],

src/view/com/feeds/SavedFeeds.tsx

@@ -8,7 +8,7 @@ import {FlatList} from 'view/com/util/Views'
 import {Text} from 'view/com/util/text/Text'
 import {isDesktopWeb} from 'platform/detection'
 import {s} from 'lib/styles'
-import {Link} from 'view/com/util/Link'
+import {Link, TextLink} from 'view/com/util/Link'
 import {CustomFeed} from './CustomFeed'
 
 export const SavedFeeds = observer(
@@ -52,14 +52,35 @@ export const SavedFeeds = observer(
 
     const renderListFooterComponent = useCallback(() => {
       return (
-        <Link
+        <>
-          style={[styles.footerLink, pal.border]}
+          <Link
-          href="/settings/saved-feeds">
+            style={[styles.footerLink, pal.border]}
-          <FontAwesomeIcon icon="cog" size={18} color={pal.colors.icon} />
+            href="/settings/saved-feeds">
-          <Text type="lg-medium" style={pal.textLight}>
+            <FontAwesomeIcon icon="cog" size={18} color={pal.colors.icon} />
-            Settings
+            <Text type="lg-medium" style={pal.textLight}>
-          </Text>
+              Change Order
-        </Link>
+            </Text>
+          </Link>
+          <View
+            style={[
+              pal.border,
+              !isDesktopWeb && s.flex1,
+              pal.viewLight,
+              styles.empty,
+            ]}>
+            <Text type="sm" style={[pal.text]}>
+              Feeds are custom algorithms that users build with a little coding
+              expertise.{' '}
+              <TextLink
+                type="sm"
+                style={pal.link}
+                href="https://github.com/bluesky-social/feed-generator"
+                text="See this guide"
+              />{' '}
+              for more information.
+            </Text>
+          </View>
+        </>
       )
     }, [pal])
 

src/view/com/pager/FeedsTabBar.web.tsx

@@ -28,7 +28,7 @@ const FeedsTabBarDesktop = observer(
   ) => {
     const store = useStores()
     const items = useMemo(
-      () => ['Following', ...store.me.savedFeeds.pinnedFeedNames, 'My feeds'],
+      () => ['Following', ...store.me.savedFeeds.pinnedFeedNames, 'My Feeds'],
       [store.me.savedFeeds.pinnedFeedNames],
     )
     const pal = usePalette('default')

src/view/com/pager/FeedsTabBarMobile.tsx

@@ -33,7 +33,7 @@ export const FeedsTabBar = observer(
     }, [store])
 
     const items = useMemo(
-      () => ['Following', ...store.me.savedFeeds.pinnedFeedNames, 'My feeds'],
+      () => ['Following', ...store.me.savedFeeds.pinnedFeedNames, 'My Feeds'],
       [store.me.savedFeeds.pinnedFeedNames],
     )