Simplify multiple instances of useState

Question

In my ReactJS code, I need to store multiple variables as separate states like this. Is there any easier way to create them? Because now I use useState function repeatedly.

  const [dutyCode, setDutyCode] = useState("");
  const [startTime, handleStartTime] = useState(new Date());
  const [endTime, handleEndTime] = useState(new Date());
  const [activityType, setActivityType] = useState("");
  const [dutyType, setDutyType] = useState("");

Answer 1

You can just use one state object and destructure it:

const [state, setState] = useState({
    dutyCode: "",
    startTime: new Date(),
    endTime: new Date(),
    activityType: "",
    dutyType: "",
});

const {
    dutyCode,
    startTime,
    endTime,
    activityType,
    dutyType,
} = state;

const updateState = (update) => setState({ ...state, ...update });