Button click - changing button text to inform user in progress action

Below is the pretty crude method I’ve implemented to inform user than button click is in progress

  • How to add nice loading animation on sign up button
  • How can I animate “Loading…” text
  • Is the code correct or needs optimization ?
const [isButtonClicked, setButtonLoading] = useState(false);
    const toggleButtonClicked = () => {
        setButtonLoading(isButtonClicked => !isButtonClicked);
                                       className={`bg-blue-medium text-white w-full rounded h-8 font-bold
                                       ${isInvalid && 'opacity-50'}
                                       ${isInvalid && 'cursor-default'}
                                       {!isButtonClicked ? "Sign Up" : "Loading..."}

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.