Revize e49b1f44

Implementation of multiselect component, search page finished with listview
re #10478

src/pages/SearchPage.tsx

@@ -1 @@
-import { Center, KeyboardAvoidingView, ScrollView, Text, VStack } from "native-base"
+import {
+    Button,
+    Center,
+    ChevronDownIcon,
+    ChevronUpIcon, ScrollView,
+    VStack
+} from "native-base"
 import ListView from "../components/listView/ListView"
 import SearchForm from "../components/search/SearchForm"
-import { Platform } from "react-native"
+import { useEffect, useState } from "react"
+import {
+    fetchArtists, fetchCities, fetchCountries, fetchInstitutions,
+    fetchInventories,
+    fetchNationalities,
+    fetchPlans,
+    fetchSubjects, fetchTechniques
+} from "../stores/actions/searchFormThunks"
+import { useDispatch } from "react-redux"
+import { AppDispatch } from "../stores/store"
+import { log } from "../logging/logger"
 
 const SearchPage = () => {
+    const [isFilterOpen, setIsFilterOpen] = useState(true)
+
+    const dispatch = useDispatch<AppDispatch>()
+
+    useEffect(() => {
+        log.debug("SearchPage", "useEffect", "fetchEverything")
+
+        dispatch(fetchInventories())
+        dispatch(fetchNationalities())
+        dispatch(fetchArtists())
+        dispatch(fetchSubjects())
+        dispatch(fetchPlans())
+        dispatch(fetchTechniques())
+        dispatch(fetchCountries())
+        dispatch(fetchCities())
+        dispatch(fetchInstitutions())
+
+        log.debug("SearchPage", "useEffect", "fetchEverything", "done")
+    }, [dispatch])
 
     return (
-        <KeyboardAvoidingView
-            h={ {
-                lg: "auto"
-            } }
-            behavior={ Platform.OS === "ios" ? "padding" : "height" }
-        >
-            <ScrollView>
-                <VStack>
-                    <SearchForm/>
+        <Center m={ 2 } mr={ 4 } flex={1}>
+            <Button
+                alignSelf={ "start" }
+                onPress={ () => setIsFilterOpen(!isFilterOpen) }
+                variant="outline"
+                endIcon={
+                    <>
+                        { isFilterOpen ?
+                            (<ChevronUpIcon size={ 4 } color={ "primary.500" }/>)
+                            : (<ChevronDownIcon size={ 4 } color={ "primary.500" }/>) }
+                    </>
+                }
+                flexWrap={ "nowrap" }
+                borderColor={ "primary.500" }
+                mb={ 2 }
+            >
+                Filter
+            </Button>
+            <ScrollView flex={1} w={"100%"} >
+                <VStack space={ 1 }>
+                    <SearchForm isFilterOpen={ isFilterOpen }/>
                     <ListView/>
                 </VStack>
             </ScrollView>
-        </KeyboardAvoidingView>
+        </Center>
     )
 }