upd: calendar

Deskripsi:
- update indicator pada kalender
- fix style pada kalender

No Issues

app/(application)/division/[id]/(fitur-division)/calendar/index.tsx

@@ -1,19 +1,29 @@
 import ButtonBackHeader from "@/components/buttonBackHeader"
 import HeaderRightCalendarList from "@/components/calendar/headerCalendarList"
+import ItemDateCalendar from "@/components/calendar/itemDateCalendar"
 import EventItem from "@/components/eventItem"
 import Styles from "@/constants/Styles"
 import { router, Stack } from "expo-router"
+import moment from 'moment'
 import { useState } from "react"
 import { SafeAreaView, ScrollView, Text, View } from "react-native"
 import DateTimePicker, { CalendarComponents, CalendarDay, DateType, getDefaultStyles } from "react-native-ui-datepicker"
 
 export default function CalendarDivision() {
    const defaultStyles = getDefaultStyles()
-   const [selected, setSelected] = useState<DateType>()
+   const [selected, setSelected] = useState<DateType>(new Date());
+   const listDate = ['2025-03-19', '2025-03-22']
+
    const components: CalendarComponents = {
-      Day: (day: CalendarDay) => <Text>amalia</Text>,
-      // Month: (month: CalendarMonth) => <YourCustomMonth month={month} />
-      // etc
+      Day: (day: CalendarDay) => {
+         const now = String(day.date)
+         const today = moment(now).format('YYYY-MM-DD');
+         const sign = listDate.includes(today)
+
+         return (
+            <ItemDateCalendar text={day.text} isSelected={day.isSelected} isSign={sign} />
+         )
+      },
    };
 
    return (
@@ -30,18 +40,20 @@ export default function CalendarDivision() {
             <View style={[Styles.p15]}>
                <View style={[Styles.wrapPaper, Styles.p10]}>
                   <DateTimePicker
-                     // components={components}
+                     components={components}
                      mode="single"
                      date={selected}
                      onChange={({ date }) => setSelected(date)}
-                     styles={defaultStyles}
+                     styles={{
+                        selected: Styles.selectedDate,
+                     }}
                   />
                </View>
                <View style={[Styles.mb15, Styles.mt15]}>
                   <Text style={[Styles.textDefaultSemiBold, Styles.mb05]}>Acara</Text>
                   <View style={[Styles.wrapPaper]}>
-                     <EventItem category="purple" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={()=>{router.push('./calendar/321')}}/>
-                     <EventItem category="orange" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={()=>{router.push('./calendar/321')}}/>
+                     <EventItem category="purple" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={() => { router.push('./calendar/321') }} />
+                     <EventItem category="orange" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={() => { router.push('./calendar/321') }} />
                   </View>
                </View>
             </View>