From b09a86d905bb4882c728d85dca6ca9718077be2d Mon Sep 17 00:00:00 2001
From: Innei <tukon479@gmail.com>
Date: Fri, 28 Feb 2025 12:08:17 +0800
Subject: [PATCH] fix(mobile): simplify header back button interactions

- Remove redundant TouchableOpacity wrapping for DefaultHeaderBackButton
- Directly render DefaultHeaderBackButton in multiple components
- Improve header navigation component simplicity

Signed-off-by: Innei <tukon479@gmail.com>
---
 apps/mobile/src/components/ui/icon/feed-icon.tsx          | 3 +++
 apps/mobile/src/modules/entry-content/EntryTitle.tsx      | 7 ++-----
 .../src/modules/screen/TimelineSelectorProvider.tsx       | 8 +++-----
 3 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/apps/mobile/src/components/ui/icon/feed-icon.tsx b/apps/mobile/src/components/ui/icon/feed-icon.tsx
index 8ac059302..284ea1b35 100644
--- a/apps/mobile/src/components/ui/icon/feed-icon.tsx
+++ b/apps/mobile/src/components/ui/icon/feed-icon.tsx
@@ -60,6 +60,9 @@ export function FeedIcon({
     }
   }, [fallback, feed, siteUrl])
 
+  if (!src) {
+    return null
+  }
   return (
     <ProxiedImage
       proxy={{
diff --git a/apps/mobile/src/modules/entry-content/EntryTitle.tsx b/apps/mobile/src/modules/entry-content/EntryTitle.tsx
index 2ef896ad5..79f165e52 100644
--- a/apps/mobile/src/modules/entry-content/EntryTitle.tsx
+++ b/apps/mobile/src/modules/entry-content/EntryTitle.tsx
@@ -1,9 +1,8 @@
 import { useTypeScriptHappyCallback } from "@follow/hooks"
 import { useHeaderHeight } from "@react-navigation/elements"
 import { useQuery } from "@tanstack/react-query"
-import { router } from "expo-router"
 import { useCallback, useContext, useEffect, useState } from "react"
-import { Text, TouchableOpacity, useWindowDimensions, View } from "react-native"
+import { Text, useWindowDimensions, View } from "react-native"
 import type { SharedValue } from "react-native-reanimated"
 import Animated, {
   interpolate,
@@ -204,9 +203,7 @@ const EntryLeftGroup = ({ canGoBack, entryId, titleOpacityShareValue }: EntryLef
   })
   return (
     <View className="flex-row items-center justify-center">
-      <TouchableOpacity hitSlop={10} onPress={() => router.back()}>
-        <DefaultHeaderBackButton canGoBack={canGoBack} />
-      </TouchableOpacity>
+      <DefaultHeaderBackButton canGoBack={canGoBack} />
 
       {!hideRecentReader && (
         <Animated.View style={animatedOpacity} className="absolute left-[32px] z-10 flex-row gap-2">
diff --git a/apps/mobile/src/modules/screen/TimelineSelectorProvider.tsx b/apps/mobile/src/modules/screen/TimelineSelectorProvider.tsx
index cb956b7dd..ba9950a58 100644
--- a/apps/mobile/src/modules/screen/TimelineSelectorProvider.tsx
+++ b/apps/mobile/src/modules/screen/TimelineSelectorProvider.tsx
@@ -1,6 +1,6 @@
-import { router, useLocalSearchParams } from "expo-router"
+import { useLocalSearchParams } from "expo-router"
 import { useMemo } from "react"
-import { Share, TouchableOpacity, useAnimatedValue, View } from "react-native"
+import { Share, useAnimatedValue, View } from "react-native"
 import { useColor } from "react-native-uikit-colors"
 
 import { DefaultHeaderBackButton } from "@/src/components/layouts/header/NavigationHeader"
@@ -44,9 +44,7 @@ export function TimelineSelectorProvider({ children }: { children: React.ReactNo
                 )
               : () => (
                   <View style={{ width: HEADER_ACTIONS_GROUP_WIDTH }}>
-                    <TouchableOpacity hitSlop={10} onPress={() => router.back()}>
-                      <DefaultHeaderBackButton canGoBack={true} />
-                    </TouchableOpacity>
+                    <DefaultHeaderBackButton canGoBack={true} />
                   </View>
                 ),
           [isTimeline, isSubscriptions],