complated

components/ui/CompanyList.tsx

@@ -44,7 +44,9 @@ export default function CompanyList({ query }: { query: string }) {
       initialPageParam: 1,
     });
 
-  const allCompanies = data?.pages.flatMap((page) => page.results) ?? [];
+  const allCompanies = data?.pages
+    .flatMap((page) => page.results)
+    .filter((company) => company.company_name);
 
   const handlePresentModal = useCallback((company: CompanyResponse) => {
     setSelectedCompany(company);
@@ -79,6 +81,7 @@ export default function CompanyList({ query }: { query: string }) {
       <FlatList
         data={allCompanies}
         keyExtractor={(item) => item.id.toString()}
+        contentContainerStyle={{ paddingBottom: 70 }}
         renderItem={({ item }) => (
           <TouchableOpacity
             style={[styles.card, isDark ? styles.darkCard : styles.lightCard]}
@@ -92,14 +95,19 @@ export default function CompanyList({ query }: { query: string }) {
               </Text>
               <ChevronRight size={20} color={isDark ? '#64748b' : '#94a3b8'} />
             </View>
-            <View style={styles.cardLocation}>
-              <MapPin size={16} color={isDark ? '#64748b' : '#94a3b8'} />
-              <Text
-                style={[styles.cardLocationText, isDark ? styles.darkSubText : styles.lightSubText]}
-              >
-                {item.country_name}, {item.region_name}
-              </Text>
-            </View>
+            {item.country_name && (
+              <View style={styles.cardLocation}>
+                <MapPin size={16} color={isDark ? '#64748b' : '#94a3b8'} />
+                <Text
+                  style={[
+                    styles.cardLocationText,
+                    isDark ? styles.darkSubText : styles.lightSubText,
+                  ]}
+                >
+                  {item.country_name}, {item.region_name}
+                </Text>
+              </View>
+            )}
           </TouchableOpacity>
         )}
         onEndReached={() => hasNextPage && !isFetchingNextPage && fetchNextPage()}

components/ui/CountriesList.tsx

@@ -75,7 +75,7 @@ export default function CountriesList({ search }: { search: string }) {
     <FlatList
       data={allCountries}
       keyExtractor={(item) => item.id.toString()}
-      contentContainerStyle={{ gap: 5 }}
+      contentContainerStyle={{ gap: 5, paddingBottom: 80 }}
       onEndReached={loadMore}
       onEndReachedThreshold={0.4}
       ListFooterComponent={

components/ui/FilterUI.tsx

@@ -18,7 +18,7 @@ import CategorySelect from './CategorySelect';
 interface FilterUIProps {
   back: () => void;
   onApply?: (data: any) => void;
-  setStep: Dispatch<SetStateAction<'filter' | 'items'>>;
+  setStep: (value: 'filter' | 'items') => void;
   setFiltered: Dispatch<SetStateAction<any[]>>;
 }
 
@@ -280,7 +280,7 @@ export default function FilterUI({ back, onApply, setStep, setFiltered }: Filter
     }
 
     let data: any[] = [];
-    let onSelect: (id: string) => void = () => {};
+    let onSelect: (id: string) => void = () => { };
     let selectedId = '';
 
     switch (activeSheet) {

components/ui/FilteredItems.tsx

@@ -244,7 +244,7 @@ const styles = StyleSheet.create({
   backButton: {
     flexDirection: 'row',
     alignItems: 'center',
-    marginBottom: 16,
+    marginBottom: 5,
     padding: 10,
     borderRadius: 12,
     alignSelf: 'flex-start',
@@ -257,7 +257,7 @@ const styles = StyleSheet.create({
     backgroundColor: '#ffffff',
   },
   backText: { fontSize: 16, color: '#3b82f6', fontWeight: '600' },
-  listContainer: { gap: 12 },
+  listContainer: { gap: 12, paddingBottom: 50 },
   itemCard: {
     borderRadius: 12,
     padding: 16,
@@ -293,7 +293,7 @@ const styles = StyleSheet.create({
   },
 
   // Detail
-  detailTitle: { fontSize: 26, fontWeight: '700', marginBottom: 16 },
+  detailTitle: { fontSize: 26, fontWeight: '700', marginBottom: 10 },
   companyImage: {
     width: '100%',
     height: 220,

components/ui/ProductList.tsx

@@ -148,8 +148,8 @@ export default function ProductList({ query }: Props) {
         keyExtractor={(item) => item.id.toString()}
         renderItem={renderItem}
         numColumns={2}
-        columnWrapperStyle={{ justifyContent: 'space-between', marginBottom: 8 }}
-        contentContainerStyle={{}}
+        columnWrapperStyle={{ justifyContent: 'space-between', marginBottom: 20 }}
+        contentContainerStyle={{ paddingBottom: 60 }}
         onEndReached={() => hasNextPage && !isFetchingNextPage && fetchNextPage()}
         onEndReachedThreshold={0.4}
         ListFooterComponent={