Loading indicator on buttons

[zoeyli-46]

Description:

Create a Loading indicator when clicking on a button that takes more than 1 second to respond
There is currently no indicator when clicking the following:

"Start" button on the reporting dashboard (ticket #441)
Approving / declining user access requests (bug 2784)
Selecting an operator

The action can take a few seconds, which could lead to a user clicking multiple times and causing duplicate entries. For example, multiple clicks of 'approve' led to the same contact being added multiple times

The submitButton component that is used in Registration file uploads includes a spinner, so loading spinner appears on "submit" button automatically. We can reuse this for the other buttons: "start" (relates to ticket #441 )"approve/decline" "continue" etc.

Acceptance Criteria:

Given I clicked on any button
If the page takes more than 1 second to respond,
Show a loading spinner on the button
And I cannot click the button again while it is showing the loading spinner

Development Checklist:

• Checklist item
• Checklist item
• Checklist item
• Meets the DOD

Definition of Ready (Note: If any of these points are not applicable, mark N/A)

• User story is included
• User role and type are identified
• Acceptance criteria are included
• Wireframes are included (if required)
• Design / Solution is accepted by Product Owner
• Dependencies are identified (technical, business, regulatory/policy)
• Story has been estimated (under 13 pts)

Definition of Done (Note: If any of these points are not applicable, mark N/A)

• Acceptance criteria are tested by the CI pipeline
• UI meets accessibility requirements
• Configuration changes are documented, documentation and designs are updated
• Passes code peer-review
• Passes QA of Acceptance Criteria with verification in Dev and Test
• Ticket is ready to be merged to main branch
• Can be demoed in Sprint Review
• Bugs or future work cards are identified and created
• Reviewed and approved by Product Owner

Blocked By/Blocking

Notes:

[zoeyli-46]

@patriciarussellCAS just flagging that the current submit button has a spinner already, and is already in use for the file uploads in registration! tagging in @andrea-williams to share any estimate about the work required to apply that same effect to the other buttons?

[patriciarussellCAS]

Note: Could be occurring on the "review facility page" as discovered in UAT.
@zoeyli-46