complated

screens/home/lib/hook.ts

@@ -0,0 +1,15 @@
+import { create } from "zustand";
+
+type HomeStore = {
+    showFilter: boolean;
+    setShowFilter: (value: boolean) => void;
+    step: 'filter' | 'items';
+    setStep: (value: 'filter' | 'items') => void;
+}
+
+export const useHomeStore = create<HomeStore>((set) => ({
+    showFilter: false,
+    setShowFilter: (value: boolean) => set({ showFilter: value }),
+    step: 'filter',
+    setStep: (value: 'filter' | 'items') => set({ step: value }),
+}))

screens/home/lib/types.ts

@@ -22,7 +22,7 @@ export interface ProductResponse {
     id: number;
     file: string;
   }[];
-  category: { id: number; name: string; icon: string }[];
+  category: { id: number; name: string; icon_name: string | null }[];
 }
 
 export interface CompanyBody {
@@ -42,7 +42,7 @@ export interface CompanyBody {
 
 export interface CompanyResponse {
   id: number;
-  company_name: string;
+  company_name: string | null;
   country_name: string;
   region_name: string;
   district_name: string;
@@ -99,6 +99,7 @@ export interface States {
       districts: { id: number; name: string; code: string }[];
     }[];
     code: string;
+    flag: string;
   }[];
 }
 

screens/home/ui/HomeScreen.tsx

@@ -9,7 +9,7 @@ import SearchTabs from '@/components/ui/SearchTabs';
 import { useTabSearch } from '@/hooks/useSearch';
 import { TabKey } from '@/types';
 import { useQueryClient } from '@tanstack/react-query';
-import { Stack } from 'expo-router';
+import { StatusBar } from 'expo-status-bar';
 import { Filter, Search } from 'lucide-react-native';
 import React, { useCallback, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -25,6 +25,7 @@ import {
 } from 'react-native';
 import { GestureHandlerRootView, RefreshControl } from 'react-native-gesture-handler';
 import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
+import { useHomeStore } from '../lib/hook';
 
 function Loading() {
   return (
@@ -37,12 +38,12 @@ function Loading() {
 export default function HomeScreen() {
   const { isDark } = useTheme();
   const [activeTab, setActiveTab] = useState<TabKey>('products');
-  const [step, setStep] = useState<'filter' | 'items'>('filter');
+
   const [query, setQuery] = useState('');
-  const [showFilter, setShowFilter] = useState(false);
   const [refreshing, setRefreshing] = useState(false);
   const [filtered, setFiltered] = useState<{ id: number; company_name: string }[]>([]);
   const { t } = useTranslation();
+  const { showFilter, setShowFilter, step, setStep } = useHomeStore();
 
   const queryClient = useQueryClient();
 
@@ -115,10 +116,7 @@ export default function HomeScreen() {
           />
         }
       >
-        <Stack.Screen options={{ headerShown: false }} />
-
         <View style={styles.content}>
-          {/* Qidiruv va filter */}
           <View style={styles.searchSection}>
             <View
               style={[
@@ -169,8 +167,12 @@ export default function HomeScreen() {
         presentationStyle="pageSheet"
         onRequestClose={handleCloseFilter}
       >
-        <SafeAreaProvider>
-          <SafeAreaView style={{ flex: 1 }}>
+        <SafeAreaProvider style={{ flex: 1 }}>
+          <SafeAreaView style={{ flex: 1, backgroundColor: isDark ? '#0f172a' : '#fff' }}>
+            <StatusBar
+              style={isDark ? 'light' : 'dark'}
+              backgroundColor={isDark ? '#0f172a' : '#fff'}
+            />
             <FilterUI back={handleCloseFilter} setStep={setStep} setFiltered={setFiltered} />
           </SafeAreaView>
         </SafeAreaProvider>