prevent duplicate keys in feed tab bar (#2666)
parent
faf48db679
commit
28455f49dc
|
@ -88,11 +88,17 @@ function FeedsTabBarTablet(
|
||||||
const navigation = useNavigation<NavigationProp>()
|
const navigation = useNavigation<NavigationProp>()
|
||||||
const {headerMinimalShellTransform} = useMinimalShellMode()
|
const {headerMinimalShellTransform} = useMinimalShellMode()
|
||||||
const {headerHeight} = useShellLayout()
|
const {headerHeight} = useShellLayout()
|
||||||
const pinnedDisplayNames = hasSession ? feeds.map(f => f.displayName) : []
|
|
||||||
const showFeedsLinkInTabBar = hasSession && !hasPinnedCustom
|
const items = React.useMemo(() => {
|
||||||
const items = showFeedsLinkInTabBar
|
if (!hasSession) return []
|
||||||
? pinnedDisplayNames.concat('Feeds ✨')
|
|
||||||
: pinnedDisplayNames
|
const pinnedNames = feeds.map(f => f.displayName)
|
||||||
|
|
||||||
|
if (!hasPinnedCustom) {
|
||||||
|
return pinnedNames.concat('Feeds ✨')
|
||||||
|
}
|
||||||
|
return pinnedNames
|
||||||
|
}, [hasSession, hasPinnedCustom, feeds])
|
||||||
|
|
||||||
const onPressDiscoverFeeds = React.useCallback(() => {
|
const onPressDiscoverFeeds = React.useCallback(() => {
|
||||||
if (isWeb) {
|
if (isWeb) {
|
||||||
|
@ -105,13 +111,13 @@ function FeedsTabBarTablet(
|
||||||
|
|
||||||
const onSelect = React.useCallback(
|
const onSelect = React.useCallback(
|
||||||
(index: number) => {
|
(index: number) => {
|
||||||
if (showFeedsLinkInTabBar && index === items.length - 1) {
|
if (hasSession && !hasPinnedCustom && index === items.length - 1) {
|
||||||
onPressDiscoverFeeds()
|
onPressDiscoverFeeds()
|
||||||
} else if (props.onSelect) {
|
} else if (props.onSelect) {
|
||||||
props.onSelect(index)
|
props.onSelect(index)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[items.length, onPressDiscoverFeeds, props, showFeedsLinkInTabBar],
|
[items.length, onPressDiscoverFeeds, props, hasSession, hasPinnedCustom],
|
||||||
)
|
)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
|
@ -36,11 +36,17 @@ export function FeedsTabBar(
|
||||||
const {feeds, hasPinnedCustom} = usePinnedFeedsInfos()
|
const {feeds, hasPinnedCustom} = usePinnedFeedsInfos()
|
||||||
const {headerHeight} = useShellLayout()
|
const {headerHeight} = useShellLayout()
|
||||||
const {headerMinimalShellTransform} = useMinimalShellMode()
|
const {headerMinimalShellTransform} = useMinimalShellMode()
|
||||||
const pinnedDisplayNames = hasSession ? feeds.map(f => f.displayName) : []
|
|
||||||
const showFeedsLinkInTabBar = hasSession && !hasPinnedCustom
|
const items = React.useMemo(() => {
|
||||||
const items = showFeedsLinkInTabBar
|
if (!hasSession) return []
|
||||||
? pinnedDisplayNames.concat('Feeds ✨')
|
|
||||||
: pinnedDisplayNames
|
const pinnedNames = feeds.map(f => f.displayName)
|
||||||
|
|
||||||
|
if (!hasPinnedCustom) {
|
||||||
|
return pinnedNames.concat('Feeds ✨')
|
||||||
|
}
|
||||||
|
return pinnedNames
|
||||||
|
}, [hasSession, hasPinnedCustom, feeds])
|
||||||
|
|
||||||
const onPressFeedsLink = React.useCallback(() => {
|
const onPressFeedsLink = React.useCallback(() => {
|
||||||
if (isWeb) {
|
if (isWeb) {
|
||||||
|
@ -53,13 +59,13 @@ export function FeedsTabBar(
|
||||||
|
|
||||||
const onSelect = React.useCallback(
|
const onSelect = React.useCallback(
|
||||||
(index: number) => {
|
(index: number) => {
|
||||||
if (showFeedsLinkInTabBar && index === items.length - 1) {
|
if (hasSession && !hasPinnedCustom && index === items.length - 1) {
|
||||||
onPressFeedsLink()
|
onPressFeedsLink()
|
||||||
} else if (props.onSelect) {
|
} else if (props.onSelect) {
|
||||||
props.onSelect(index)
|
props.onSelect(index)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[items.length, onPressFeedsLink, props, showFeedsLinkInTabBar],
|
[items.length, onPressFeedsLink, props, hasSession, hasPinnedCustom],
|
||||||
)
|
)
|
||||||
|
|
||||||
const onPressAvi = React.useCallback(() => {
|
const onPressAvi = React.useCallback(() => {
|
||||||
|
|
|
@ -78,7 +78,7 @@ export function TabBar({
|
||||||
return (
|
return (
|
||||||
<PressableWithHover
|
<PressableWithHover
|
||||||
testID={`${testID}-selector-${i}`}
|
testID={`${testID}-selector-${i}`}
|
||||||
key={item}
|
key={`${item}-${i}`}
|
||||||
onLayout={e => onItemLayout(e, i)}
|
onLayout={e => onItemLayout(e, i)}
|
||||||
style={[styles.item, selected && indicatorStyle]}
|
style={[styles.item, selected && indicatorStyle]}
|
||||||
hoverStyle={pal.viewLight}
|
hoverStyle={pal.viewLight}
|
||||||
|
|
Loading…
Reference in New Issue