I have a form that is suppose to take five date values, these dates (in some cases) refer to tasks in the future so it is not always necessary that they have a value. As a result, there are situations where the user may pass in three dates on the add form but leave the other two dates blank. My code was working perfectly so long as the user was entering all five dates but now that some are being left blank I can not get the app to work.

Database - This Query works fine with a null value so I know a date col can be NULL

INSERT INTO applicants (store, first_name, last_name, position, date_in,recruiterscreen_completion,testing_completion,
 interview_completion, backgroundcheck_completion, drugscreen_completion, paperwork_completion) 
VALUES ('Autoexpress','Test','test','Salesperson','2/21/22',NULL,'2/20/22','2/21/22','2/20/22','2/21/22','2/20/22') RETURNING *

Back End Code - However when I pass the value through I get errors

/*ADD NEW APPLICANT REQUEST*/
const addApplicant = async (req, res) => {
  const errors = validationResult(req);

  if (!errors.isEmpty()) {
    return res.status(400).json({ errors: errors.array() });
  }

  const { store, first_name, last_name, position, recruiterscreen_completion,testing_completion,backgroundcheck_completion,interview_completion,drugscreen_completion,paperwork_completion, date_in } = req.body;

  try {
  console.log(recruiterscreen_completion)
    const applicants = await queryInstance(`INSERT INTO applicants (store, first_name,last_name,position, recruiterscreen_completion,testing_completion,backgroundcheck_completion,interview_completion,drugscreen_completion,paperwork_completion, date_in) VALUES ('${store}', '${first_name}', '${last_name}', '${position}', '${recruiterscreen_completion}', '${testing_completion}', '${backgroundcheck_completion}','${interview_completion}','${drugscreen_completion}','${paperwork_completion}','${date_in}') RETURNING *`);
    res.json({ applicants });
  } catch (err) {
    console.error(err.message);
    return res.status(500).send(err.message);
  }
}; 

Add Form (Example of one of the form elements)

<label className="add-form-label-long" htmlFor="recruiterscreen_completion">
          Recrutier Screen
          <input
            type="date"
            id="recruiterscreen_completion"
            name="recruiterscreen_completion"
            onChange={handleFormChange}
            value={formData.recruiterscreen_completion}
          ></input>
        </label>

If the user does not select any date in the dropdown does a NULL value pass through? Or is it undefined? How do I resolve?