Question regarding a crash in a simple example

Ask your Question

Simple question, I'm trying to implement the date picker, the single variant, in particular, is crashing with the following error:

Simulator Screenshot - iPhone 14 Pro - 2023-07-07 at 14 35 08

The other variants (input, range, multiple) seem to work just fine replicating the code in the example from the librarie's repository.

The component implementation:


import React, { useCallback, useState } from 'react';
import { DatePickerModal } from 'react-native-paper-dates';

import type { CalendarDate } from 'react-native-paper-dates/lib/typescript/Date/Calendar';
import type { DatePickerProps } from './data-picker-props';

type Props = { date: CalendarDate };

const Single = ({ visible, onDismiss, onConfirm }: DatePickerProps) => {
  const [date, setDate] = useState<CalendarDate>(new Date('2023-07-07T03:24:00'));

  const confirm = useCallback(
    ({ date }: Props) => {
      setDate(date);
      onConfirm(date as CalendarDate);
    },
    [date]
  );

  return (
    <DatePickerModal
      locale="es"
      mode="single"
      visible={visible}
      onDismiss={onDismiss}
      onConfirm={confirm}
      date={date}
    />
  );
};

export default Single;

The example screen:

import registerTranslation from '@objects/data-picker-registerTranslation';
import React, { useState } from 'react';
import { StyleSheet } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import DatePicker from '../components/ui/atoms/data-picker/data-picker-single';
import { Button } from '@components/ui';

const styles = StyleSheet.create({
  container: { justifyContent: 'center' }
});

const RNDatePicker = () => {
  const [visible, setVisible] = useState(false);
  registerTranslation;

  return (
    <SafeAreaView style={styles.container}>
      <Button onPress={() => setVisible(true)}>show date picker</Button>
      <DatePicker
        visible={visible}
        onDismiss={() => setVisible(false)}
        onConfirm={date => alert(date)}
      />
    </SafeAreaView>
  );
};

export default RNDatePicker;

Am I missing something? 🤔

My setup: Macbook M1, running MacOS 13.4 Xcode 14.3 "react": "18.2.0", "react-native": "0.71.8",

web-ridge / react-native-paper-dates

Question regarding a crash in a simple example #301

Ask your Question