component-manages-styles.js

import './styles.css';

const ClassStylesComponent = () => {
  const [isActive, setIsActive] = useState(false);
  const className = isActive ? 'button--active' : 'button';

  return (
    <div>
      <button onClick={() => setIsActive(!isActive)} className={className}>
        click me
      </button>
    </div>
  );
};