From 267f72f84c6a5979eae696dae8fddee25188c1bb Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Fri, 15 Mar 2024 21:06:13 +0000
Subject: ui(mobile): New header style in the app

---
 apps/mobile/components/bookmarks/BookmarkList.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

(limited to 'apps/mobile/components/bookmarks/BookmarkList.tsx')

diff --git a/apps/mobile/components/bookmarks/BookmarkList.tsx b/apps/mobile/components/bookmarks/BookmarkList.tsx
index 48272fb3..04a3d922 100644
--- a/apps/mobile/components/bookmarks/BookmarkList.tsx
+++ b/apps/mobile/components/bookmarks/BookmarkList.tsx
@@ -1,20 +1,22 @@
 import { useEffect, useRef, useState } from "react";
-import { Text, View, Keyboard } from "react-native";
+import { Keyboard, Text, View } from "react-native";
 import Animated, { LinearTransition } from "react-native-reanimated";
 import { api } from "@/lib/trpc";
+import { useScrollToTop } from "@react-navigation/native";
 
 import FullPageSpinner from "../ui/FullPageSpinner";
 import BookmarkCard from "./BookmarkCard";
-import { useScrollToTop } from '@react-navigation/native';
 
 export default function BookmarkList({
   favourited,
   archived,
   ids,
+  header
 }: {
   favourited?: boolean;
   archived?: boolean;
   ids?: string[];
+  header?: React.ReactElement;
 }) {
   const apiUtils = api.useUtils();
   const [refreshing, setRefreshing] = useState(false);
@@ -44,13 +46,14 @@ export default function BookmarkList({
     <Animated.FlatList
       ref={flatListRef}
       itemLayoutAnimation={LinearTransition}
+      ListHeaderComponent={header}
       contentContainerStyle={{
         gap: 15,
         marginBottom: 15,
       }}
       renderItem={(b) => <BookmarkCard bookmark={b.item} />}
       ListEmptyComponent={
-        <View className="h-full pt-4 items-center justify-center">
+        <View className="items-center justify-center pt-4">
           <Text className="text-xl">No Bookmarks</Text>
         </View>
       }
-- 
cgit v1.2.3-70-g09d2

