Skip to content

feat(ux): add loading and disabled states for async action buttons#2204

Open
Antra1705 wants to merge 2 commits into
Priyanshu-byte-coder:mainfrom
Antra1705:1508-loading-disabled-states-async-actions
Open

feat(ux): add loading and disabled states for async action buttons#2204
Antra1705 wants to merge 2 commits into
Priyanshu-byte-coder:mainfrom
Antra1705:1508-loading-disabled-states-async-actions

Conversation

@Antra1705
Copy link
Copy Markdown
Contributor

Summary

Added consistent disabled and loading states to all action buttons that trigger async API/fetch calls across the codebase, preventing double-submissions and race conditions.

Closes #1508


Type of Change

  • Bug fix
  • New feature
  • Documentation update
  • Refactor / code cleanup

Changes Made

  • ConfirmModal.tsx: Added disabled prop to block Confirm/Cancel buttons and backdrop/Escape dismissal during in-flight operations
  • ProjectMetrics.tsx: Added disconnecting state to Jira Disconnect button
  • GoalTracker.tsx: Added incrementingId state to manual +1 button; passed disabled={deletingId !== null} to ConfirmModal during deletion
  • TodayFocusHero.tsx: Added isSaving and isClearing states to Save and Clear buttons, disabling input during flight
  • StreakTracker.tsx: Fixed conditional rendering of freeze block (freeze !== null instead of !freezeLoading); added loading state to Freeze/Cancel freeze buttons
  • settings/page.tsx: Added disabled={saving} to Spotlight Pin, Unpin, Move Up, Move Down buttons and search input
  • RoomClient.tsx: Added deleting state to Delete Room button with "Deleting..." label

How to Test

  1. Goal Tracker: Click +1 on a manual goal — button briefly disables. Delete a goal — modal buttons disable during deletion.
  2. ProjectMetrics: Click Disconnect on Jira integration — button disables and shows "Disconnecting..."
  3. TodayFocusHero: Click Save — button disables and shows "Saving...". Click Clear — shows "Clearing..."
  4. Settings: Search and pin/unpin/reorder repos — all buttons disable while saving
  5. RoomClient: Click Delete Room — button disables and shows "Deleting..."
  6. StreakTracker: Click Freeze Streak — button disables and shows "Freezing..."

Screenshots (if UI change)

Screenshot 2026-06-08 at 12 03 37 PM Screenshot 2026-06-08 at 12 06 41 PM Screenshot 2026-06-08 at 12 07 33 PM Screenshot 2026-06-08 at 12 08 09 PM Screenshot 2026-06-08 at 12 09 00 PM Screenshot 2026-06-08 at 12 11 57 PM

Checklist

  • Linked issue in summary
  • npm run lint passes locally
  • No TypeScript errors (npm run type-check)
  • Self-reviewed the diff
  • Added/updated tests if applicable

Accessibility Checklist

  • Proper keyboard navigation tested
  • Responsive UI verified
  • Accessibility labels added where needed

Additional Notes

@vercel
Copy link
Copy Markdown

vercel Bot commented Jun 8, 2026

@Antra1705 is attempting to deploy a commit to the PRIYANSHU DOSHI's projects Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions github-actions Bot added gssoc26 GSSoC 2026 contribution type:design GSSoC type bonus: UI/design (+10 pts) type:feature GSSoC type bonus: new feature labels Jun 8, 2026
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Jun 8, 2026

GSSoC Label Checklist 🏷️

@Priyanshu-byte-coder — please apply the appropriate labels before merging:

Difficulty (pick one):

  • level:beginner — 20 pts
  • level:intermediate — 35 pts
  • level:advanced — 55 pts
  • level:critical — 80 pts

Quality (optional):

  • quality:clean — ×1.2 multiplier
  • quality:exceptional — ×1.5 multiplier

Validation (required to score):

  • gssoc:approved — counts for points
  • gssoc:invalid / gssoc:spam / gssoc:ai-slop — does not score

Type labels (type:*) are auto-detected from files and title. Review and adjust if needed.
Points formula: (difficulty × quality_multiplier) + type_bonus

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

gssoc26 GSSoC 2026 contribution type:design GSSoC type bonus: UI/design (+10 pts) type:feature GSSoC type bonus: new feature

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Enhancement]: Disable submit button during async API requests

1 participant