@@ -10,7 +10,6 @@ import { StatusBar } from 'expo-status-bar';
1010import { useFocusEffect } from "@react-navigation/native" ;
1111import CategoryList from "../../components/Category/CategoryList" ;
1212import AddCategoryButton from "../../components/Category/AddCategoryButton" ;
13- import SearchTasksButton from "../../components/UI/SearchTasksButton" ;
1413import GlobalTaskSearch from "../../components/Task/GlobalTaskSearch" ;
1514import { useTranslation } from "react-i18next" ;
1615import { TaskCacheService } from "../../services/TaskCacheService" ;
@@ -20,6 +19,7 @@ import {
2019 ScreenContainer ,
2120 ScreenHeader ,
2221} from "../../components/UI/foundation" ;
22+ import { MaterialIcons } from "@expo/vector-icons" ;
2323
2424export default function Categories ( ) {
2525 const { t } = useTranslation ( ) ;
@@ -69,7 +69,20 @@ export default function Categories() {
6969 < ScreenContainer >
7070 < StatusBar style = "dark" />
7171
72- < ScreenHeader title = { t ( "categories.title" ) } />
72+ < ScreenHeader
73+ title = { t ( "categories.title" ) }
74+ style = { { paddingEnd : 35 } }
75+ rightActions = { (
76+ < TouchableOpacity
77+ onPress = { handleOpenSearch }
78+ style = { styles . searchIconButton }
79+ accessibilityRole = "button"
80+ accessibilityLabel = { t ( "globalTaskSearch.searchAllTasks" ) }
81+ >
82+ < MaterialIcons name = "search" size = { 22 } color = "#333333" />
83+ </ TouchableOpacity >
84+ ) }
85+ />
7386
7487 < ScrollView
7588 style = { styles . content }
@@ -85,12 +98,6 @@ export default function Categories() {
8598 }
8699 >
87100 < ContentContainer padded = { false } >
88- < View style = { styles . searchContainer } >
89- < SearchTasksButton
90- onPress = { handleOpenSearch }
91- style = { styles . searchButton }
92- />
93- </ View >
94101 < CategoryList ref = { categoryListRef } />
95102 </ ContentContainer >
96103 < View style = { styles . addButtonContainer } >
@@ -113,17 +120,23 @@ const styles = StyleSheet.create({
113120 scrollContent : {
114121 flexGrow : 1 ,
115122 } ,
116- searchContainer : {
117- flexDirection : "row" ,
123+ searchIconButton : {
124+ width : 36 ,
125+ height : 36 ,
126+ borderRadius : 18 ,
127+ backgroundColor : "#ffffff" ,
128+ borderWidth : 1 ,
129+ borderColor : "#e1e5e9" ,
130+ justifyContent : "center" ,
118131 alignItems : "center" ,
119- paddingHorizontal : 16 ,
120- marginVertical : 8 ,
121- } ,
122- searchButton : {
123- flex : 1 ,
124- marginHorizontal : 0 , // Override default margin
125- marginRight : 10 ,
126- marginVertical : 0 , // Override default margin
132+ shadowColor : "#000" ,
133+ shadowOffset : {
134+ width : 0 ,
135+ height : 2 ,
136+ } ,
137+ shadowOpacity : 0.04 ,
138+ shadowRadius : 4 ,
139+ elevation : 1 ,
127140 } ,
128141 reloadButton : {
129142 width : 44 ,
0 commit comments