From df501d870cb75d61aa5449c4471f44458f3ff633 Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Thu, 18 Apr 2024 10:46:49 -0500 Subject: [PATCH] Restore Feeds sparkle, fix line height --- src/state/queries/feed.ts | 25 ++++++++++++++++++------- src/view/com/home/HomeHeader.tsx | 7 ++++++- src/view/com/pager/TabBar.tsx | 16 ++++++++++------ 3 files changed, 34 insertions(+), 14 deletions(-) diff --git a/src/state/queries/feed.ts b/src/state/queries/feed.ts index 7562404d4c..ae83384e8b 100644 --- a/src/state/queries/feed.ts +++ b/src/state/queries/feed.ts @@ -23,6 +23,7 @@ import {getAgent, useSession} from '#/state/session' import {router} from '#/routes' export type FeedSourceFeedInfo = { + isPrimaryAlgorithm: boolean type: 'feed' uri: string route: { @@ -41,6 +42,7 @@ export type FeedSourceFeedInfo = { } export type FeedSourceListInfo = { + isPrimaryAlgorithm: boolean type: 'list' uri: string route: { @@ -71,6 +73,7 @@ const feedSourceNSIDs = { export function hydrateFeedGenerator( view: AppBskyFeedDefs.GeneratorView, + options?: Pick, ): FeedSourceInfo { const urip = new AtUri(view.uri) const collection = @@ -79,6 +82,7 @@ export function hydrateFeedGenerator( const route = router.matchPath(href) return { + isPrimaryAlgorithm: options?.isPrimaryAlgorithm ?? false, type: 'feed', uri: view.uri, cid: view.cid, @@ -110,6 +114,7 @@ export function hydrateList(view: AppBskyGraphDefs.ListView): FeedSourceInfo { const route = router.matchPath(href) return { + isPrimaryAlgorithm: false, type: 'list', uri: view.uri, route: { @@ -205,6 +210,7 @@ export function useSearchPopularFeedsMutation() { * The following feed, with fallbacks to Discover */ const HOME_FEED_STUB: FeedSourceInfo = { + isPrimaryAlgorithm: false, type: 'feed', displayName: 'Following', uri: 'home', @@ -221,7 +227,8 @@ const HOME_FEED_STUB: FeedSourceInfo = { likeCount: 0, likeUri: '', } -const DISCOVER_FEED_STUB: FeedSourceInfo = { +const PWI_DISCOVER_FEED_STUB: FeedSourceInfo = { + isPrimaryAlgorithm: true, type: 'feed', displayName: 'Discover', uri: DISCOVER_FEED_URI, @@ -273,7 +280,7 @@ export function usePinnedFeedsInfos() { (hasSession ? 'authed:' : 'unauthed:') + allUris.join(','), ], queryFn: async () => { - let resolved = new Map() + let resolved = new Map() // Get all feeds. We can do this in a batch. let feedsPromise = Promise.resolve() @@ -302,14 +309,16 @@ export function usePinnedFeedsInfos() { }), ) - let result = [hasSession ? HOME_FEED_STUB : DISCOVER_FEED_STUB] + let result = [hasSession ? HOME_FEED_STUB : PWI_DISCOVER_FEED_STUB] await Promise.allSettled([feedsPromise, ...listsPromises]) // if primary algo is enabled and was fetched, add it to the front of the list if (primaryAlgo?.enabled && primaryAlgo?.uri) { - if (resolved.has(primaryAlgo.uri)) { - result = [resolved.get(primaryAlgo.uri), ...result] + const feedInfo = resolved.get(primaryAlgo.uri) + if (feedInfo) { + feedInfo.isPrimaryAlgorithm = true + result = [feedInfo, ...result] } } @@ -322,10 +331,12 @@ export function usePinnedFeedsInfos() { // order the feeds/lists in the order they were pinned for (let pinnedUri of pinnedUrisSansPrimary) { - if (resolved.has(pinnedUri)) { - result.push(resolved.get(pinnedUri)) + const feedInfo = resolved.get(pinnedUri) + if (feedInfo) { + result.push(feedInfo) } } + console.log(result) return result }, diff --git a/src/view/com/home/HomeHeader.tsx b/src/view/com/home/HomeHeader.tsx index 24e9551c91..62802ff981 100644 --- a/src/view/com/home/HomeHeader.tsx +++ b/src/view/com/home/HomeHeader.tsx @@ -24,7 +24,12 @@ export function HomeHeader( const hasPinnedCustom = React.useMemo(() => { if (!hasSession) return false - return feeds.some(tab => !['home', 'following'].includes(tab.uri)) + return feeds.some(tab => { + const isFollowing = ['home', 'following'].includes(tab.uri) + const isPrimaryAlgo = tab.isPrimaryAlgorithm + const isCustom = !isFollowing && !isPrimaryAlgo + return isCustom + }) }, [feeds, hasSession]) const items = React.useMemo(() => { diff --git a/src/view/com/pager/TabBar.tsx b/src/view/com/pager/TabBar.tsx index ff8acd60cc..5791e26a97 100644 --- a/src/view/com/pager/TabBar.tsx +++ b/src/view/com/pager/TabBar.tsx @@ -1,11 +1,12 @@ -import React, {useRef, useMemo, useEffect, useState, useCallback} from 'react' -import {StyleSheet, View, ScrollView, LayoutChangeEvent} from 'react-native' -import {Text} from '../util/text/Text' -import {PressableWithHover} from '../util/PressableWithHover' +import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react' +import {LayoutChangeEvent, ScrollView, StyleSheet, View} from 'react-native' + +import {isNative} from '#/platform/detection' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {PressableWithHover} from '../util/PressableWithHover' +import {Text} from '../util/text/Text' import {DraggableScrollView} from './DraggableScrollView' -import {isNative} from '#/platform/detection' export interface TabBarProps { testID?: string @@ -139,7 +140,10 @@ export function TabBar({ + style={[ + selected ? pal.text : pal.textLight, + {lineHeight: 20}, + ]}> {item}