cannot add hours to JSON

Question

I need to use a TimePicker component in my React app to allow users to select hours and minutes. After the user selects a time, I want to display the selected hours and minutes in the console when the user clicks a button. However, when I test my code, I can only see the selected minutes in the console. I'm using React and Bootstrap to create this functionality. Can you please advise me on how to fix this issue?

import TimePicker from 'react-times';

function TimePickerExample(props) {
    const { selectedTime, setSelectedTime } = props;
    const [time, setTime] = useState({ hour: 0, minute: 0 });

    const handleTimeChange = (newTime) => {
        setTime(newTime);
        setSelectedTime(newTime);
    };

    return (
        <div>
            <label htmlFor="time">Choose time</label>
            <TimePicker
                theme="material"
                colorPalette="light"
                time={time}
                onTimeChange={handleTimeChange}
            />
        </div>
    );
}
function Send(props) {
    const { selectedTime } = props;

    const handleSubmit = (event) => {
        event.preventDefault();

        const data = {
            selectedTime: `${selectedTime.hour}:${selectedTime.minute}`,
        };
        const newJsonData = JSON.stringify(data);

        console.log(newJsonData);
    };
    return (
        <div className="send">
            <form onSubmit={handleSubmit}>
                <Button variant="primary" type="submit">
                    Send
                </Button>
            </form>
        </div>
    );
}
function App() {
    const handleTimeChange = (time) => {
        setSelectedTime(time);
    };
    const handleClear = () => {
        setSelectedTime(null);
    };
    return (
        <div className="choose">
            <TimePickerExample selectedTime={selectedTime} setSelectedTime={handleTimeChange} />
            <div className="buttons-row">
                <Send
                    selectedTime={selectedTime}
                />
                <Clear onClear={handleClear} />
            </div>
        </div>
    );
}
export default App;