DateTimePIcker automatically opens repeatedly on Android

[stephengladney]

Bug report

datetimepicker version: 8.0.1 Android version: 13.0

Summary

When running the app on Android, on any screen that uses the component, the picker is automatically opened when the screen loads. When closing it, it immediately reopens again.

Is there a setting or prop that needs to be passed to prevent this?

Reproducible sample code

function todayStart() {
  return new Date(new Date().toDateString())
}

function todayEnd() {
  const date = new Date()
  date.setHours(23)
  date.setMinutes(59)
  date.setSeconds(59)
  return date
}

export function MyComponent() {
  const [startTime, setStartTime] = useState<Date>(todayStart())
  const [endTime, setEndTime] = useState<Date>(todayEnd())
  const searchParams = useLocalSearchParams()

  return (
  <View>
    <DateTimePicker
          testID="dateTimePicker"
          value={startTime}
          minimumDate={todayStart()}
          mode={"time"}
          is24Hour={true}
          onChange={handleStartTimeChange}
        />
    <DateTimePicker
          testID="dateTimePicker"
          value={startTime}
          minimumDate={todayStart()}
          mode={"time"}
          is24Hour={true}
          onChange={handleStartTimeChange}
        />
  </View>)
}

Steps to reproduce

1. Render a DateTimePicker component on any screen.
2. Run the app on an Android device or emulator.
3. View the screen with the component

Screenshot

Describe what you expected to happen:

1. The DateTimePicker should not open until the user clicks on it
2. The DateTimePicker should stay closed when the user closes it

Environment info

expo version: 51.0.22

[stephengladney]

Solved: I'm an idiot who should've read the documentation. Use the imperative API.

[kaushikwavhal]

@stephengladney The imperative API works on Android but the documentation mentions that the component API is functional but this bug makes it broken. Its a bit cumbersome to have to write separate code for both platform.