From 683cab97963e7fcd9d444a2de7b2e12e7f7d9ca0 Mon Sep 17 00:00:00 2001
From: Adrian Castro <22133246+castdrian@users.noreply.github.com>
Date: Mon, 1 Apr 2024 22:50:41 +0200
Subject: [PATCH] fix: use safe insets for header

---
 apps/expo/src/components/layout/Header.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/apps/expo/src/components/layout/Header.tsx b/apps/expo/src/components/layout/Header.tsx
index 2bfcab7..067bfe5 100644
--- a/apps/expo/src/components/layout/Header.tsx
+++ b/apps/expo/src/components/layout/Header.tsx
@@ -1,4 +1,5 @@
 import { Linking } from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { FontAwesome6, MaterialIcons } from "@expo/vector-icons";
 import { Circle, View } from "tamagui";
 
@@ -6,8 +7,15 @@ import { DISCORD_LINK, GITHUB_LINK } from "~/constants/core";
 import { BrandPill } from "../BrandPill";
 
 export function Header() {
+  const insets = useSafeAreaInsets();
+
   return (
-    <View alignItems="center" gap="$3" flexDirection="row">
+    <View
+      paddingTop={insets.top}
+      alignItems="center"
+      gap="$3"
+      flexDirection="row"
+    >
       <BrandPill />
 
       <Circle