How to update Form options after submitting using useReducer

Question

i´m new at programming..

I'm coding a form that has a Select list of Options, which come from an array of objects (i named it initialState for useReducer use). Now i have to use the useReducer hook to update those options when the form is submitted. The submitted option has to be eliminated after submitting.

I just started coding the hook, but i really don´t know what to do...

The app is rendering OK, and the "placeholder" initial state is showing the first option value. I'm okay with that.

Can you help me plase? Thanks!

import { useState, useReducer } from "react";

const handleSubmit = (e) => {
    e.preventDefault();
}

const BookingForm = () => {

    const initialState = [
        {value: "17:00"},
        {value: "17:30"},
        {value: "18:00"},
        {value: "18:30"},
        {value: "19:00"},
        {value: "19:30"}]

    const reducer = (state, action) => {
                   ??????          }

    const [state, dispatch] = useReducer(reducer, initialState);

    const [option, setOption] = useState({initialState});

   return(

  <div className="form_div">
    <form className="form" onSubmit={handleSubmit}>
     <label htmlFor="res-time" className="label">Choose time
      <select id="res-time " className="input"
            value={option}
            onChange={(e) => setOption(e.target.value)}>

            {initialState.map(item => {
                  return (<option key={item.value} value={item.value}>{item.value}</option>);
              })}
      </select>
     </label>

    <input type="submit" value="Make Your reservation"  className="button" onClick={() => dispatch({type: "selected option"})}/>

    </form>

export default BookingForm;