fix(web): close overlay after successful sync#1482
Merged
tyler-dane merged 10 commits intomainfrom Feb 28, 2026
Merged
Conversation
…mplates - Removed unnecessary emoji from template names for a cleaner presentation. - Eliminated the priority dropdown from the feature request template to streamline the submission process. - Updated the bug report template to remove the emoji, enhancing consistency across issue templates. - Adjusted the configuration file to reflect these changes, ensuring clarity in the issue submission process.
- Updated SocketProvider tests to utilize `act` for asynchronous callback invocations, ensuring proper handling of state updates during testing. - Improved test reliability by wrapping callback executions in `act`, aligning with React's testing best practices.
- Introduced a new test case to verify the correct handling of import end events when the awaitingImportResults state changes mid-render. - Utilized a ref to prevent stale closures, ensuring that the correct state is referenced during socket event processing. - Enhanced the reliability of the useGcalSync hook by ensuring it properly processes events even when state changes occur asynchronously.
- Deleted the circle.svg file from the public SVG assets as it is no longer needed in the project. - This cleanup helps streamline the asset management and reduces unnecessary file clutter.
Contributor
There was a problem hiding this comment.
Pull request overview
Addresses #1478 by ensuring the Google Calendar import completion event reliably updates “awaiting import results” flows and triggers a refetch so the UI can exit the loading state after re-auth.
Changes:
- Update
useGcalSyncto avoid stale state in socket event handlers by readingawaitingImportResultsvia a ref and triggering a fetch on successful import end. - Adjust/add tests around the import-start/import-end socket flow and wrap socket-callback invocations in
act. - Remove an unused SVG asset and simplify GitHub issue template labels/names.
Reviewed changes
Copilot reviewed 6 out of 7 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/web/src/socket/provider/SocketProvider.test.tsx | Wraps socket callback invocations in act to ensure React state updates flush in tests. |
| packages/web/src/socket/hooks/useGcalSync.ts | Uses a ref to read the latest “awaiting import results” state in socket callbacks; parses results; dispatches fetch trigger on import end. |
| packages/web/src/socket/hooks/useGcalSync.test.ts | Adds coverage for the updated import flow and edge cases (payload formats, malformed JSON). |
| packages/web/src/public/svg/circle.svg | Removes a previously committed SVG asset. |
| .github/ISSUE_TEMPLATE/config.yml | Removes emojis from contact link names. |
| .github/ISSUE_TEMPLATE/2-bug-report.yml | Removes emoji from template name. |
| .github/ISSUE_TEMPLATE/1-feature-request.yml | Removes emoji from template name and removes a “Priority” dropdown. |
- Update ref synchronously during render instead of in useEffect to fully eliminate race condition window - Rename misleading test name (timeout -> successfully) - Fix test assertions to validate action creator calls directly instead of using unused variable and dispatch-based assertions Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Updated state management and selectors to reflect the new naming convention for clarity. - Adjusted related components and tests to ensure consistency with the updated state name. - This change enhances code readability and aligns with the overall naming strategy in the project.
- Removed the 1-second delay in the reconnect function, allowing for immediate reconnection after disconnection. - Updated the corresponding test case to reflect the change in behavior, ensuring it accurately tests the immediate reconnection functionality. - This change enhances the responsiveness of the socket client and improves the clarity of the test case.
Contributor
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 13 out of 14 changed files in this pull request and generated 3 comments.
Comments suppressed due to low confidence (1)
packages/web/src/components/SyncEventsOverlay/SyncEventsOverlay.tsx:20
- This component now selects
selectIsImportPending, but the local variable and inline comments still refer toawaitingImportResults. Renaming the variable/comments toisImportPending(or similar) would reduce confusion when reading overlay activation logic.
const awaitingImportResults = useAppSelector(selectIsImportPending);
const isAuthenticating = useAppSelector(selectIsAuthenticating);
// Show overlay when:
// - isAuthenticating: User clicked sign-in, popup is open (from auth slice)
// - awaitingImportResults: OAuth completed, waiting on import results
// - importing: Calendar import in progress (from sync slice)
const shouldBeActive = isAuthenticating || awaitingImportResults || importing;
- Removed the use of fake timers in the tests for useGcalSync, simplifying the test setup. - Updated type definitions for event handler variables to allow for undefined values, enhancing type safety. - This change improves test clarity and aligns with best practices for handling asynchronous events in React testing.
…tion flow - Introduced a new test suite for the Google Calendar re-authentication process, validating user experience during import operations. - Implemented tests to ensure the spinner visibility during import initiation, handling of socket events, and correct state updates upon import completion. - Enhanced test reliability by utilizing `act` for asynchronous operations and capturing socket event callbacks. - This addition improves coverage for the re-authentication flow and ensures a seamless user experience during Google Calendar synchronization.
- Updated the Redux action and corresponding function names to improve clarity and consistency in the import state management. - Adjusted all related components and tests to reflect the new naming convention, ensuring seamless integration across the codebase. - This change enhances code readability and aligns with the overall naming strategy in the project.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #1478