diff --git a/src/components/Forms/IconForm.tsx b/src/components/Forms/IconForm.tsx index cd247a208e09e963907020da262ca54b06d7878e..eaa08aef2994c5975df3ca1be75e8389d126adba 100644 --- a/src/components/Forms/IconForm.tsx +++ b/src/components/Forms/IconForm.tsx @@ -17,6 +17,7 @@ type props = { search?: boolean; errorMessage?: string; onPress?: () => void; + onEndEditing?: () => void; }; const IconForm = ({ @@ -30,6 +31,7 @@ const IconForm = ({ search = false, errorMessage, onPress, + onEndEditing, }: props) => { const [isFocused, setIsFocused] = useState(false); const [showPass, setShowPass] = useState(password); @@ -65,6 +67,7 @@ const IconForm = ({ setIsError(false); } } + onEndEditing && onEndEditing(); }; let iconName: React.ComponentProps["name"]; diff --git a/src/screens/ecosystem/EcosystemSearch.tsx b/src/screens/ecosystem/EcosystemSearch.tsx index 52230cf273ab5c22967ed03a4be9c49867623599..8067b265942b70cbeaaae5ce610e78317f480403 100644 --- a/src/screens/ecosystem/EcosystemSearch.tsx +++ b/src/screens/ecosystem/EcosystemSearch.tsx @@ -1,5 +1,5 @@ import { - ActivityIndicator, + // ActivityIndicator FlatList, ListRenderItem, StyleSheet, @@ -11,84 +11,102 @@ import IconForm from "../../components/Forms/IconForm"; import { EcosystemStackScreenProps } from "../../types/navigation"; import DropdownForm from "../../components/Forms/DropdownForm"; import { IDD } from "../../types/firestore"; -import { getCategoriesAsDdFormat } from "../../helpers/ddConverter"; import SmallButton from "../../components/button/SmallButton"; -import { getByCategory } from "../../service/firestore/ecosystem/getByCategory"; +// import { getByCategory } from "../../service/firestore/ecosystem/getByCategory"; import { IEcosystem } from "../../types/firestore/ecosystems"; import Spacer from "../../components/Spacer/Spacer"; import HorizontalCards from "../../components/Cards/HorizontalCards"; import { useNavigation } from "@react-navigation/core"; import { useCategory } from "../../hooks/reduxHooks"; +import { getCategoriesAsDdFormat } from "../../helpers/ddConverter"; +import { searchEcosystem } from "../../service/typesense/searchEcosystem"; +import { SearchResponseHit } from "typesense/lib/Typesense/Documents"; const EcosystemSearch = ({ route }: EcosystemStackScreenProps<"Search">) => { const [search, setSearch] = useState(""); const [picked, setPicked] = useState(""); const [categories, setCategories] = useState([]); const { headerTitle } = route.params; - const [ecosystems, setEcosystems] = useState([]); - const [lastVisibleId, setLastVisibleId] = useState(""); - const [loadingMore, setLoadingmore] = useState(false); + const [ecosystems, setEcosystems] = useState[]>( + [] + ); + // const [lastVisibleId, setLastVisibleId] = useState(""); + // const [loadingMore, setLoadingmore] = useState(false); const nav = useNavigation(); const categoriesHook = useCategory(); useEffect(() => { setCategories(() => getCategoriesAsDdFormat(categoriesHook)); }, []); - const filterByCategory = async () => { - if (ecosystems.length > 0) { - console.log("test"); - ecosystems.length = 0; - } - const result = await getByCategory(picked, lastVisibleId); - setEcosystems([...ecosystems, ...result]); - }; - const handleOnEndReach = () => { - // setLoadingmore(true); - const lastIndexItem = ecosystems[ecosystems.length - 1]; - const lastIndexItemId = lastIndexItem.id; - setLastVisibleId(lastIndexItemId); - if (ecosystems.length - 1 === 0) { - setLoadingmore(false); - } else { - setLoadingmore(true); - } - // setLoadingmore(true); + // const filterByCategory = async () => { + // if (ecosystems.length > 0) { + // ecosystems.length = 0; + // } + // const result = await getByCategory(picked); + // setEcosystems(result); + // }; + // const handleOnEndReach = () => { + // // setLoadingmore(true); + // const lastIndexItem = ecosystems[ecosystems.length - 1]; + // const lastIndexItemId = lastIndexItem.id; + // setLastVisibleId(lastIndexItemId); + // if (ecosystems.length - 1 === 0) { + // setLoadingmore(false); + // } else { + // setLoadingmore(true); + // } + // // setLoadingmore(true); + // }; + + const onSearch = async () => { + const res = await searchEcosystem({ + q: search, + query_by: "name", + }); + console.log(res.searchHits[0]); + setEcosystems(res.searchHits); }; - const renderItem: ListRenderItem = ({ item }) => ( - - - { - nav.navigate("Ecosystem", { - screen: "EcosystemDetails", - params: { - headerTitle: item.name, - id: item.id, - title: item.name, - desc: item.description, - image: item.pic, - member: item.followerCount.toString(), - rating: item.rating.toString(), - }, - }); + + const renderItem: ListRenderItem> = ({ + item: _item, + }) => { + const item = _item.document; + return ( + + + > + { + nav.navigate("Ecosystem", { + screen: "EcosystemDetails", + params: { + headerTitle: item.name, + id: item.id, + title: item.name, + desc: item.description, + image: item.pic, + member: item.followerCount.toString(), + rating: item.rating.toString(), + }, + }); + }} + rate={item.rating.toString()} + /> + - - ); - const ListFooterComponent = () => ( - - - - ); + ); + }; + // const ListFooterComponent = () => ( + // + // + // + // ); return ( ) => { setText={setSearch} placeholder={"Cari dengan kata kunci ini.."} search + onPress={onSearch} + onEndEditing={onSearch} /> )} {headerTitle === "Filter" && ( @@ -131,7 +151,7 @@ const EcosystemSearch = ({ route }: EcosystemStackScreenProps<"Search">) => { text="Filter" colors="primary" onPress={() => { - filterByCategory(); + // filterByCategory(); }} /> @@ -144,15 +164,9 @@ const EcosystemSearch = ({ route }: EcosystemStackScreenProps<"Search">) => { renderItem={renderItem} ItemSeparatorComponent={() => } ListHeaderComponent={() => } - ListFooterComponent={() => - !loadingMore ? ( - - ) : ( - - ) - } + ListFooterComponent={() => } onEndReachedThreshold={0.5} - onEndReached={handleOnEndReach} + // onEndReached={handleOnEndReach} /> )} diff --git a/src/service/typesense/searchEcosystem.ts b/src/service/typesense/searchEcosystem.ts index 6317e316d2fed3afdaa1e32a7c2149cc6241ee7c..5b91a3f3db04258a2e64df59529dee7515443487 100644 --- a/src/service/typesense/searchEcosystem.ts +++ b/src/service/typesense/searchEcosystem.ts @@ -1,7 +1,10 @@ import axios, { AxiosResponse } from "axios"; import { CLOUD_FUNCTIONS_URL } from "../../constants/urls"; import { IEcosystem } from "../../types/firestore/ecosystems"; -import { SearchParams } from "typesense/lib/Typesense/Documents"; +import { + SearchParams, + SearchResponseHit, +} from "typesense/lib/Typesense/Documents"; import { getEnv } from "../../helpers/getEnv"; export type searchEcosystemParams = { @@ -29,5 +32,5 @@ export const searchEcosystem = async ( }; type searchResponse = { - searchHits: IEcosystem[]; + searchHits: SearchResponseHit[]; }; diff --git a/src/service/typesense/searchUser.ts b/src/service/typesense/searchUser.ts index 3a61bd2630f3baf5a6f77837ba188f9c77560076..baf25d9bad02beaed9718fca16077527bd5fabfa 100644 --- a/src/service/typesense/searchUser.ts +++ b/src/service/typesense/searchUser.ts @@ -1,7 +1,10 @@ import axios, { AxiosResponse } from "axios"; import { CLOUD_FUNCTIONS_URL } from "../../constants/urls"; import { IUser } from "../../types/firestore/User"; -import { SearchParams } from "typesense/lib/Typesense/Documents"; +import { + SearchParams, + SearchResponseHit, +} from "typesense/lib/Typesense/Documents"; export const searchUser = async ( searchParams: SearchParams> @@ -26,5 +29,5 @@ export const searchUser = async ( }; type searchResponse = { - searchHits: IUser[]; + searchHits: SearchResponseHit[]; };