Counter effects

counter-1.jsx

// Counter.jsx
import * as React from 'react'
import { useCounterReducer } from './useCounterReducer'

const Counter = () => {
  const [counter, dispatch] = useCounterReducer();
  
  React.useEffect(() => {
    if (counter < 0) {
      alert('Ya akhi, nilai counter ndak boleh di bawah 0 😚');
      dispatch('INCREMENT'); //biar bisa 0 lagi
    }
  }, [counter]);
  
  return (
    <div>
      <button onClick={() => dispatch('INCREMENT')}>+</button>
      {counter}
      <button onClick={() => dispatch('DECREMENT')}>-</button>
    </div>
  )
}