Implement a useCycle hook that cycles through a sequence of values each time its function is called.

exportdefaultfunction Component() {
const [mode, cycle] = useCycle('low', 'medium', 'high');
return (
    <div>
      <p>State: {mode}</p>
      <button onClick={cycle}>Cycle</button>
    </div>
  );
}

Arguments

The useCycle hook should accept an indefinite number of arguments, each representing a value in the sequence to cycle through.

Returns

A tuple containing the following elements:

1. value: The current value
2. cycle: A function that changes the current value to the next one in the sequence, or the first one if the current value is the last in the sequence

My Solution

Editorial