97 lines
3.6 KiB
TypeScript
97 lines
3.6 KiB
TypeScript
import Styles from "@/constants/Styles"
|
|
import { apiGetGroup } from "@/lib/api"
|
|
import { setEntityFilterGroup } from "@/lib/filterSlice"
|
|
import { useAuthSession } from "@/providers/AuthProvider"
|
|
import { AntDesign } from "@expo/vector-icons"
|
|
import { router } from "expo-router"
|
|
import { useEffect, useState } from "react"
|
|
import { Pressable, ScrollView, View } from "react-native"
|
|
import Text from './Text';
|
|
import { useDispatch, useSelector } from "react-redux"
|
|
import { ButtonForm } from "./buttonForm"
|
|
import DrawerBottom from "./drawerBottom"
|
|
|
|
|
|
type Props = {
|
|
open: boolean,
|
|
close: (value: boolean) => void
|
|
page: 'position' | 'member' | 'discussion' | 'project' | 'division'
|
|
category?: 'filter-group' | 'filter-data'
|
|
}
|
|
|
|
export default function ModalFilter({ open, close, page, category }: Props) {
|
|
const data = [
|
|
{
|
|
id: "data-saya",
|
|
name: "Kegiatan Saya",
|
|
},
|
|
{
|
|
id: "semua",
|
|
name: "Semua Kegiatan",
|
|
},
|
|
]
|
|
const { token, decryptToken } = useAuthSession()
|
|
const dispatch = useDispatch()
|
|
const entities = useSelector((state: any) => state.filterGroup)
|
|
const [chooseGroup, setChooseGroup] = useState('')
|
|
|
|
async function handleLoad() {
|
|
const hasil = await decryptToken(String(token?.current))
|
|
const response = await apiGetGroup({ active: 'true', user: hasil, search: '' })
|
|
dispatch(setEntityFilterGroup(response.data))
|
|
}
|
|
|
|
useEffect(() => {
|
|
if (entities.length == 0) {
|
|
handleLoad()
|
|
}
|
|
}, [dispatch]);
|
|
|
|
|
|
|
|
|
|
return (
|
|
<DrawerBottom animation="slide" isVisible={open} setVisible={close} title="Filter" height={75}>
|
|
<View style={{ justifyContent: 'space-between', flex: 1 }}>
|
|
<ScrollView>
|
|
<View>
|
|
{
|
|
category == "filter-data"
|
|
?
|
|
data.map((item: any, index: any) => (
|
|
<Pressable key={index} style={[Styles.itemSelectModal]} onPress={() => { setChooseGroup(item.id) }}>
|
|
<Text style={[chooseGroup == item.id ? Styles.textDefaultSemiBold : Styles.textDefault]}>{item.name}</Text>
|
|
{
|
|
chooseGroup == item.id && <AntDesign name="check" size={20} />
|
|
}
|
|
</Pressable>
|
|
))
|
|
:
|
|
entities.map((item: any, index: any) => (
|
|
<Pressable key={index} style={[Styles.itemSelectModal]} onPress={() => { setChooseGroup(item.id) }}>
|
|
<Text style={[chooseGroup == item.id ? Styles.textDefaultSemiBold : Styles.textDefault]}>{item.name}</Text>
|
|
{
|
|
chooseGroup == item.id && <AntDesign name="check" size={20} />
|
|
}
|
|
</Pressable>
|
|
))
|
|
}
|
|
</View>
|
|
</ScrollView>
|
|
<View>
|
|
<ButtonForm text="Terapkan" onPress={() => {
|
|
close(false)
|
|
page == 'project' ?
|
|
category == "filter-data"
|
|
?
|
|
router.replace(`/${page}?status=0&cat=${chooseGroup}`)
|
|
:
|
|
router.replace(`/${page}?status=0&group=${chooseGroup}`)
|
|
:
|
|
router.replace(`/${page}?active=true&group=${chooseGroup}`)
|
|
}} />
|
|
</View>
|
|
</View>
|
|
</DrawerBottom>
|
|
)
|
|
} |