Merge pull request #29 from farhoudshapouran/invalid-array-length-bug

fix: invalid array length
farhoudshapouran · Nov 1, 2023 · b8d8a19 · b8d8a19
2 parents ce015a1 + 6bc524b
commit b8d8a19
Show file tree

Hide file tree

Showing 6 changed files with 83 additions and 77 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-native-ui-datepicker",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Customizable datetime picker for React Native",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

diff --git a/src/components/DaySelector.tsx b/src/components/DaySelector.tsx
@@ -28,14 +28,14 @@ const DaySelector = () => {
   return (
     <View style={styles.container}>
       <View style={[styles.weekDaysContainer, theme?.weekDaysContainerStyle]}>
-        {utils.getWeekdaysMin().map((item, index) => (
+        {utils.getWeekdaysMin()?.map((item, index) => (
           <View key={index} style={styles.weekDayCell}>
             <Text style={theme?.weekDaysTextStyle}>{item}</Text>
           </View>
         ))}
       </View>
       <View style={styles.daysContainer}>
-        {days.map((day, index) => {
+        {days?.map((day, index) => {
           const dayContainerStyle =
             day && day.isCurrentMonth
               ? theme?.dayContainerStyle

diff --git a/src/components/Header.tsx b/src/components/Header.tsx
@@ -22,6 +22,7 @@ const Header = ({ buttonPrevIcon, buttonNextIcon }: HeaderProps) => {
 
   const renderPrevButton = (
     <TouchableOpacity
+      disabled={calendarView === CalendarViews.time}
       onPress={() =>
         calendarView === CalendarViews.day
           ? onChangeMonth(-1)
@@ -49,6 +50,7 @@ const Header = ({ buttonPrevIcon, buttonNextIcon }: HeaderProps) => {
 
   const renderNextButton = (
     <TouchableOpacity
+      disabled={calendarView === CalendarViews.time}
       onPress={() =>
         calendarView === CalendarViews.day
           ? onChangeMonth(1)

diff --git a/src/components/MonthSelector.tsx b/src/components/MonthSelector.tsx
@@ -9,7 +9,7 @@ const MonthSelector = () => {
   return (
     <View style={styles.container}>
       <View style={styles.monthsContainer}>
-        {utils.getMonths().map((item, index) => {
+        {utils.getMonths()?.map((item, index) => {
           const activeItemStyle =
             index === month
               ? {

diff --git a/src/components/TimePicker/Wheel.tsx b/src/components/TimePicker/Wheel.tsx
@@ -113,22 +113,25 @@ const Wheel = ({
     translateY.setValue(0);
     translateY.setOffset(0);
     const currentIndex = displayValues.indexOf(value);
-    return displayValues.map((_, index) =>
-      translateY
-        .interpolate({
-          inputRange: [-radius, radius],
-          outputRange: [
-            -radius + ((radius * 2) / displayCount) * (index - currentIndex),
-            radius + ((radius * 2) / displayCount) * (index - currentIndex),
-          ],
-          extrapolate: 'extend',
-        })
-        .interpolate({
-          inputRange: [-radius, radius],
-          outputRange: [-Math.PI / 2, Math.PI / 2],
-          extrapolate: 'clamp',
-        })
-    );
+    return displayValues && displayValues.length > 0
+      ? displayValues.map((_, index) =>
+          translateY
+            .interpolate({
+              inputRange: [-radius, radius],
+              outputRange: [
+                -radius +
+                  ((radius * 2) / displayCount) * (index - currentIndex),
+                radius + ((radius * 2) / displayCount) * (index - currentIndex),
+              ],
+              extrapolate: 'extend',
+            })
+            .interpolate({
+              inputRange: [-radius, radius],
+              outputRange: [-Math.PI / 2, Math.PI / 2],
+              extrapolate: 'clamp',
+            })
+        )
+      : [];
   }, [displayValues, radius, value, displayCount, translateY]);
 
   return (

diff --git a/src/utils.ts b/src/utils.ts
@@ -126,62 +126,63 @@ export default class utils {
         : 35 - monthDaysOffset
       : 0;
 
-    const prevDays = this.displayFullDays
-      ? prevDaysArray.map((day) => {
-          const thisDay = date.add(-1, 'month').date(day);
-          let disabled = false;
-          if (this.minimumDate) {
-            disabled = thisDay < this.getDate(this.minimumDate);
-          }
-          if (this.maximumDate && !disabled) {
-            disabled = thisDay > this.getDate(this.maximumDate);
-          }
-          return {
-            text: day.toString(),
-            day,
-            date: this.getFormatedDate(thisDay, 'YYYY/MM/DD'),
-            disabled,
-            isCurrentMonth: false,
-          };
-        })
-      : new Array(dayOfMonth);
-
-    return [
-      ...prevDays,
-      ...Array.from({ length: currentMonthDays }, (_, i) => {
-        const thisDay = date.date(i + 1);
-        let disabled = false;
-        if (this.minimumDate) {
-          disabled = thisDay < this.getDate(this.minimumDate);
-        }
-        if (this.maximumDate && !disabled) {
-          disabled = thisDay > this.getDate(this.maximumDate);
-        }
-        return {
-          text: (i + 1).toString(),
-          day: i + 1,
-          date: this.getFormatedDate(thisDay, 'YYYY/MM/DD'),
-          disabled,
-          isCurrentMonth: true,
-        };
-      }),
-      ...Array.from({ length: nextMonthDays }, (_, i) => {
-        const thisDay = date.add(1, 'month').date(i + 1);
-        let disabled = false;
-        if (this.minimumDate) {
-          disabled = thisDay < this.getDate(this.minimumDate);
-        }
-        if (this.maximumDate && !disabled) {
-          disabled = thisDay > this.getDate(this.maximumDate);
-        }
-        return {
-          text: (i + 1).toString(),
-          day: i + 1,
-          date: this.getFormatedDate(thisDay, 'YYYY/MM/DD'),
-          disabled,
-          isCurrentMonth: false,
-        };
-      }),
-    ];
+    const prevDays =
+      this.displayFullDays && prevDaysArray && prevDaysArray.length > 0
+        ? prevDaysArray.map((day) => {
+            const thisDay = date.add(-1, 'month').date(day);
+            let disabled = false;
+            if (this.minimumDate) {
+              disabled = thisDay < this.getDate(this.minimumDate);
+            }
+            if (this.maximumDate && !disabled) {
+              disabled = thisDay > this.getDate(this.maximumDate);
+            }
+            return {
+              text: day.toString(),
+              day,
+              date: this.getFormatedDate(thisDay, 'YYYY/MM/DD'),
+              disabled,
+              isCurrentMonth: false,
+            };
+          })
+        : new Array(dayOfMonth);
+
+    const currentDays = Array.from({ length: currentMonthDays }, (_, i) => {
+      const thisDay = date.date(i + 1);
+      let disabled = false;
+      if (this.minimumDate) {
+        disabled = thisDay < this.getDate(this.minimumDate);
+      }
+      if (this.maximumDate && !disabled) {
+        disabled = thisDay > this.getDate(this.maximumDate);
+      }
+      return {
+        text: (i + 1).toString(),
+        day: i + 1,
+        date: this.getFormatedDate(thisDay, 'YYYY/MM/DD'),
+        disabled,
+        isCurrentMonth: true,
+      };
+    });
+
+    const nextDays = Array.from({ length: nextMonthDays }, (_, i) => {
+      const thisDay = date.add(1, 'month').date(i + 1);
+      let disabled = false;
+      if (this.minimumDate) {
+        disabled = thisDay < this.getDate(this.minimumDate);
+      }
+      if (this.maximumDate && !disabled) {
+        disabled = thisDay > this.getDate(this.maximumDate);
+      }
+      return {
+        text: (i + 1).toString(),
+        day: i + 1,
+        date: this.getFormatedDate(thisDay, 'YYYY/MM/DD'),
+        disabled,
+        isCurrentMonth: false,
+      };
+    });
+
+    return [...prevDays, ...currentDays, ...nextDays];
   };
 }