Skip to content

Add loading states and disable buttons during API calls #2

@StencilwashCoder

Description

@StencilwashCoder

Problem

Currently users can tap buttons multiple times while API calls are in flight. No visual feedback shows that an operation is pending.

Affected Screens

    • no loading state during check-in API call
  • (if exists) - can create multiple shifts
  • (if exists) - can submit lot multiple times
  • (if exists) - payroll could run twice = double pay

Current Code Example

The state exists but:

  • Button doesn't show spinner
  • Scanner isn't visually disabled
  • User can still navigate back and lose the pending operation

Implementation

Update Button Component

Update Screens

  • - disable scanner + show loading overlay during check-in
  • - disable create button, show spinner
  • - disable submit, show spinner
  • - CRITICAL: show big warning + spinner, disable all actions

Add Loading Overlay Component

Prevent Double-Submit Pattern

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions