# React-specific naming conventions

When creating action handlers and callbacks in React, use onAction for callbacks and handleAction for action handlers.

const MyList = ({options, onSelect}) => {
   const handleSelect = () => {
      // do something within this component
      onSelect();
   };

   return (
      <div>
         {options.map(option => <Option onClick={handleSelect} />)
      </div>
   );
};

const Option = ({onClick}) => {
   // ...
}

An advantage of this convention is that it lets us distinguish between a callback vs. local code that may potentially be wrapping a callback.

setState((old) => []) vs setState((current) => [])

Prefer setState((current) => []) because it better reflects how useState acts during the React render cycle.