upd: report divisi

Deskripsi:
blm bisa karena tidak ada package yg cocok
- package input date

No Issues

app/(application)/division/report.tsx

@@ -7,30 +7,92 @@ import SelectForm from "@/components/selectForm";
 import Styles from "@/constants/Styles";
 import { router, Stack } from "expo-router";
 import { useState } from "react";
-import { SafeAreaView, ScrollView, View } from "react-native";
+import { Button, SafeAreaView, ScrollView, View } from "react-native";
+import DateTimePickerModal from "react-native-modal-datetime-picker";
 
 export default function Report() {
-   const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' })
+   const [chooseGroup, setChooseGroup] = useState({ val: "", label: "" });
+   const [error, setError] = useState({
+      group: false,
+      date: false,
+      dateEnd: false,
+   });
+   const [date, setDate] = useState("");
+   const [isDatePickerVisible, setDatePickerVisibility] = useState(false);
+
+   const showDatePicker = () => {
+      setDatePickerVisibility(true);
+   };
+
+   const hideDatePicker = () => {
+      setDatePickerVisibility(false);
+   };
+
+   const handleConfirm = (date: any) => {
+      setDate(date);
+      hideDatePicker();
+   };
+
+
 
    return (
       <SafeAreaView>
          <Stack.Screen
             options={{
-               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-               headerTitle: 'Laporan Divisi',
-               headerTitleAlign: 'center',
+               headerLeft: () => (
+                  <ButtonBackHeader
+                     onPress={() => {
+                        router.back();
+                     }}
+                  />
+               ),
+               headerTitle: "Laporan Divisi",
+               headerTitleAlign: "center",
             }}
          />
          <ScrollView>
             <View style={[Styles.p15, Styles.mb100]}>
-               <SelectForm bg="white" label="Lembaga Desa" placeholder="Pilih Lembaga Desa" value={chooseGroup.label} required onPress={() => { }} />
-               <InputForm bg="white" label="Tanggal Awal" type="default" placeholder="Pilih Tanggal Awal" required />
-               <InputForm bg="white" label="Tanggal Akhir" type="default" placeholder="Pilih Tanggal Akhir" required />
+               <SelectForm
+                  bg="white"
+                  label="Lembaga Desa"
+                  placeholder="Pilih Lembaga Desa"
+                  value={chooseGroup.label}
+                  required
+                  onPress={() => { }}
+                  error={error.group}
+                  errorText="Lembaga Desa tidak boleh kosong"
+               />
+               <Button title="Open" onPress={showDatePicker} />
+               {/* <DateTimePickerModal
+                  isVisible={isDatePickerVisible}
+                  mode="date"
+                  date={new Date()}
+                  onConfirm={handleConfirm}
+                  onCancel={hideDatePicker}
+               /> */}
+               <InputForm
+                  bg="white"
+                  label="Tanggal Awal"
+                  type="default"
+                  placeholder="Pilih Tanggal Awal"
+                  required
+                  error={error.date}
+                  errorText="Tanggal awal tidak boleh kosong"
+               />
+               <InputForm
+                  bg="white"
+                  label="Tanggal Akhir"
+                  type="default"
+                  placeholder="Pilih Tanggal Akhir"
+                  required
+                  error={error.dateEnd}
+                  errorText="Tanggal akhir tidak boleh kosong"
+               />
                <ReportChartProgress />
                <ReportChartDocument />
                <ReportChartEvent />
             </View>
          </ScrollView>
       </SafeAreaView>
-   )
-}
+   );
+}