72 lines
2.0 KiB
TypeScript
72 lines
2.0 KiB
TypeScript
import { ThemedText } from "@/components/themed-text";
|
|
import { ThemedView } from "@/components/themed-view";
|
|
import { IconSymbol } from "@/components/ui/icon-symbol";
|
|
import { Colors } from "@/constants/theme";
|
|
import { useTheme } from "@/context/ThemeContext";
|
|
import { useRouter } from "expo-router";
|
|
import React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { StyleSheet, TouchableOpacity } from "react-native";
|
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
|
|
export function HomeHeader() {
|
|
const router = useRouter();
|
|
const { theme } = useTheme();
|
|
const { t } = useTranslation();
|
|
const iconColor = theme === "light" ? Colors.light.icon : Colors.dark.icon;
|
|
|
|
return (
|
|
<ThemedView style={styles.container}>
|
|
<SafeAreaView edges={["top"]} style={styles.safeArea}>
|
|
<ThemedView style={styles.headerContent}>
|
|
<ThemedText type="title" style={styles.title}>
|
|
{t("home.title")}
|
|
</ThemedText>
|
|
<ThemedView style={styles.actions}>
|
|
<TouchableOpacity
|
|
style={styles.iconButton}
|
|
onPress={() => router.push("/search")}
|
|
>
|
|
<IconSymbol name="search" size={24} color={iconColor} />
|
|
</TouchableOpacity>
|
|
<TouchableOpacity
|
|
style={styles.iconButton}
|
|
onPress={() => router.push("/profile")}
|
|
>
|
|
<IconSymbol name="person-circle" size={24} color={iconColor} />
|
|
</TouchableOpacity>
|
|
</ThemedView>
|
|
</ThemedView>
|
|
</SafeAreaView>
|
|
</ThemedView>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
paddingTop: 0,
|
|
},
|
|
safeArea: {
|
|
paddingBottom: 10,
|
|
paddingHorizontal: 16,
|
|
},
|
|
headerContent: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
justifyContent: "space-between",
|
|
paddingTop: 8,
|
|
},
|
|
title: {
|
|
fontSize: 24,
|
|
fontWeight: "bold",
|
|
},
|
|
actions: {
|
|
flexDirection: "row",
|
|
gap: 16,
|
|
alignItems: "center",
|
|
},
|
|
iconButton: {
|
|
padding: 4,
|
|
},
|
|
});
|