fix: pencarian
Deskripsi: - scroll height - tanpa wrap - pake scroll map No Issues
This commit is contained in:
@@ -1,5 +1,6 @@
|
|||||||
import BorderBottomItem from "@/components/borderBottomItem";
|
import BorderBottomItem from "@/components/borderBottomItem";
|
||||||
import ButtonBackHeader from "@/components/buttonBackHeader";
|
import ButtonBackHeader from "@/components/buttonBackHeader";
|
||||||
|
import ImageUser from "@/components/imageNew";
|
||||||
import InputSearch from "@/components/inputSearch";
|
import InputSearch from "@/components/inputSearch";
|
||||||
import Text from '@/components/Text';
|
import Text from '@/components/Text';
|
||||||
import { ColorsStatus } from "@/constants/ColorsStatus";
|
import { ColorsStatus } from "@/constants/ColorsStatus";
|
||||||
@@ -9,8 +10,8 @@ import { apiGetSearch } from "@/lib/api";
|
|||||||
import { useAuthSession } from "@/providers/AuthProvider";
|
import { useAuthSession } from "@/providers/AuthProvider";
|
||||||
import { AntDesign, MaterialIcons } from "@expo/vector-icons";
|
import { AntDesign, MaterialIcons } from "@expo/vector-icons";
|
||||||
import { router, Stack } from "expo-router";
|
import { router, Stack } from "expo-router";
|
||||||
import { useState } from "react";
|
import React, { useState } from "react";
|
||||||
import { FlatList, Image, SafeAreaView, View } from "react-native";
|
import { RefreshControl, SafeAreaView, ScrollView, View } from "react-native";
|
||||||
import Toast from "react-native-toast-message";
|
import Toast from "react-native-toast-message";
|
||||||
|
|
||||||
type PropsUser = {
|
type PropsUser = {
|
||||||
@@ -40,10 +41,13 @@ export default function Search() {
|
|||||||
const [dataUser, setDataUser] = useState<PropsUser[]>([])
|
const [dataUser, setDataUser] = useState<PropsUser[]>([])
|
||||||
const [dataDivisi, setDataDivisi] = useState<PropDivisi[]>([])
|
const [dataDivisi, setDataDivisi] = useState<PropDivisi[]>([])
|
||||||
const [dataProject, setDataProject] = useState<PropProject[]>([])
|
const [dataProject, setDataProject] = useState<PropProject[]>([])
|
||||||
|
const [refreshing, setRefreshing] = useState(false)
|
||||||
|
const [search, setSearch] = useState('')
|
||||||
|
|
||||||
async function handleSearch(cari: string) {
|
async function handleSearch(cari: string) {
|
||||||
try {
|
try {
|
||||||
if (cari.length > 3) {
|
setSearch(cari)
|
||||||
|
if (cari.length >= 3) {
|
||||||
const user = await decryptToken(String(token?.current))
|
const user = await decryptToken(String(token?.current))
|
||||||
const hasil = await apiGetSearch({ text: cari, user: user })
|
const hasil = await apiGetSearch({ text: cari, user: user })
|
||||||
if (hasil.success) {
|
if (hasil.success) {
|
||||||
@@ -65,6 +69,14 @@ export default function Search() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const handleRefresh = async () => {
|
||||||
|
setRefreshing(true)
|
||||||
|
handleSearch(search)
|
||||||
|
await new Promise(resolve => setTimeout(resolve, 2000));
|
||||||
|
setRefreshing(false)
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<SafeAreaView>
|
<SafeAreaView>
|
||||||
@@ -80,41 +92,44 @@ export default function Search() {
|
|||||||
{
|
{
|
||||||
dataProject.length + dataDivisi.length + dataUser.length > 0
|
dataProject.length + dataDivisi.length + dataUser.length > 0
|
||||||
?
|
?
|
||||||
<View style={[Styles.wrapPaper, Styles.mb100]}>
|
<ScrollView
|
||||||
|
style={[Styles.h100]}
|
||||||
|
refreshControl={
|
||||||
|
<RefreshControl
|
||||||
|
refreshing={refreshing}
|
||||||
|
onRefresh={handleRefresh}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
>
|
||||||
{
|
{
|
||||||
dataUser.length > 0 &&
|
dataUser.length > 0 &&
|
||||||
<View style={[Styles.mb05]}>
|
<View style={[Styles.mv05, Styles.p10]}>
|
||||||
<Text>ANGGOTA</Text>
|
<Text>ANGGOTA</Text>
|
||||||
<FlatList
|
{
|
||||||
data={dataUser}
|
dataUser.map((item, index) => (
|
||||||
keyExtractor={(item) => String(item.id)}
|
|
||||||
renderItem={({ item }) => (
|
|
||||||
<BorderBottomItem
|
<BorderBottomItem
|
||||||
|
key={index}
|
||||||
borderType="bottom"
|
borderType="bottom"
|
||||||
icon={<Image
|
icon={<ImageUser src={`${ConstEnv.url_storage}/files/${item.img}`} />}
|
||||||
source={{ uri: `${ConstEnv.url_storage}/files/${item.img}` }}
|
|
||||||
style={[Styles.userProfileSmall]}
|
|
||||||
/>}
|
|
||||||
title={item.name}
|
title={item.name}
|
||||||
subtitle={`${item.group}-${item.position}`}
|
subtitle={`${item.group}-${item.position}`}
|
||||||
onPress={() => {
|
onPress={() => {
|
||||||
router.push(`/member/${item.id}`)
|
router.push(`/member/${item.id}`)
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
))
|
||||||
/>
|
}
|
||||||
</View>
|
</View>
|
||||||
}
|
}
|
||||||
|
|
||||||
{
|
{
|
||||||
dataDivisi.length > 0 &&
|
dataDivisi.length > 0 &&
|
||||||
<View style={[Styles.mb05]}>
|
<View style={[Styles.mv05, Styles.p10]}>
|
||||||
<Text>DIVISI</Text>
|
<Text>DIVISI</Text>
|
||||||
<FlatList
|
{
|
||||||
data={dataDivisi}
|
dataDivisi.map((item, index) => (
|
||||||
keyExtractor={(item) => String(item.id)}
|
|
||||||
renderItem={({ item }) => (
|
|
||||||
<BorderBottomItem
|
<BorderBottomItem
|
||||||
|
key={index}
|
||||||
borderType="bottom"
|
borderType="bottom"
|
||||||
icon={
|
icon={
|
||||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||||
@@ -127,21 +142,20 @@ export default function Search() {
|
|||||||
router.push(`/division/${item.id}`)
|
router.push(`/division/${item.id}`)
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
))
|
||||||
/>
|
}
|
||||||
</View>
|
</View>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
{
|
{
|
||||||
dataProject.length > 0 &&
|
dataProject.length > 0 &&
|
||||||
<View style={[Styles.mb10]}>
|
<View style={[Styles.mv05, Styles.p10]}>
|
||||||
<Text>KEGIATAN</Text>
|
<Text>KEGIATAN</Text>
|
||||||
<FlatList
|
{
|
||||||
data={dataProject}
|
dataProject.map((item, index) => (
|
||||||
keyExtractor={(item) => String(item.id)}
|
|
||||||
renderItem={({ item }) => (
|
|
||||||
<BorderBottomItem
|
<BorderBottomItem
|
||||||
|
key={index}
|
||||||
borderType="bottom"
|
borderType="bottom"
|
||||||
icon={
|
icon={
|
||||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||||
@@ -154,13 +168,11 @@ export default function Search() {
|
|||||||
router.push(`/project/${item.id}`)
|
router.push(`/project/${item.id}`)
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
))
|
||||||
/>
|
}
|
||||||
</View>
|
</View>
|
||||||
}
|
}
|
||||||
|
</ScrollView>
|
||||||
|
|
||||||
</View>
|
|
||||||
:
|
:
|
||||||
<View style={[Styles.contentItemCenter, Styles.mt10]}>
|
<View style={[Styles.contentItemCenter, Styles.mt10]}>
|
||||||
<Text style={[Styles.textInformation, Styles.cGray]}>Tidak ada data</Text>
|
<Text style={[Styles.textInformation, Styles.cGray]}>Tidak ada data</Text>
|
||||||
|
|||||||
Reference in New Issue
Block a user