Expanding Donate Button

donateButton.js

const { DonationForm } = RaiselyComponents.Molecules;
const [showDonate, setShowDonate] = useState(false);

return (
  <div className="donation-profile__wrapper spotlight-donate">
    {showDonate ? (
      <DonationForm
        profileUuid={profile.uuid}
        title={`Donate to ${profile.name}`}
        integrations={props.integrations}
        global={props.global}
      />
    ) : (
        <div className="donation-profile__button-wrapper">
          <Button onClick={() => setShowDonate(true)} theme="secondary">Donate</Button>
        </div>
      )}
  </div>
);