fix(web): sync local events before google connect refresh (#1582)

* feat(auth): enhance Google connection handling with local events synchronization

- Integrated local events synchronization into the Google connection process, ensuring that local events are synced before connecting to Google.
- Added error handling to display a toast notification if local event synchronization fails, preventing the connection to Google in such cases.
- Updated tests to verify the new synchronization logic and error handling, ensuring robust functionality in the authentication flow.

* feat(auth): implement syncPendingLocalEvents for improved local event handling

- Introduced syncPendingLocalEvents function to manage synchronization of local events with error handling and Redux dispatching.
- Updated authentication flow to utilize syncPendingLocalEvents, ensuring local events are synced before completing Google authentication.
- Enhanced tests to cover new synchronization logic and error handling scenarios, improving overall robustness of the authentication process.

* feat(auth): refactor Google connection handling and introduce new hooks

- Refactored the Google connection logic into a dedicated hook, `useConnectGoogle`, to streamline the authentication process and improve code organization.
- Added utility functions for building Google connection requests and managing UI states related to Google Calendar connections.
- Updated error handling for Google Calendar repair messages and ensured proper integration with Redux state management.
- Introduced comprehensive tests for the new hook and its functionalities, enhancing overall test coverage and reliability.
- Adjusted imports across components to utilize the new hook structure, ensuring consistent usage throughout the application.

* fix(auth): correct Google Calendar repair dispatch logic

- Updated the `useConnectGoogle` hook to ensure the `closeCmdPalette` action is dispatched correctly during the Google repair process.
- Refactored related tests to reflect the changes in dispatch expectations, enhancing the accuracy of the test coverage for Google connection handling.

* feat(auth): implement useCompleteAuthentication and related tests

- Introduced the `useCompleteAuthentication` hook to streamline the authentication process, marking users as authenticated and syncing local events.
- Added comprehensive tests for the new hook, ensuring proper functionality and integration with Redux state management.
- Updated imports across components to utilize the new hook structure, enhancing code organization and maintainability.
- Refactored existing authentication logic to leverage the new hook, improving overall user experience during the authentication flow.

* feat(auth): refactor Google authentication to use GoogleAuthConfig

- Replaced the SignInUpInput type with GoogleAuthConfig in the authentication logic to better align with the new Google authentication structure.
- Updated related tests to reflect the changes in data types, ensuring consistency across the authentication flow.
- Introduced a new GoogleAuthConfig type definition to encapsulate the necessary parameters for Google authentication.
- Refactored imports and function signatures across various components and hooks to utilize the new configuration type, enhancing code clarity and maintainability.

* refactor(auth): update Google login mock paths for consistency

- Changed the import paths for the `useGoogleLogin` mock to align with the new directory structure.
- Updated related test files to reflect the new import paths, ensuring consistency across the authentication testing suite.

* feat(auth): add GoogleButton component for Google sign-in

- Introduced a new `GoogleButton` component that features a monochrome Google "G" logo and adheres to Google's design guidelines.
- The button includes customizable props for click handling, disabled state, label, and inline styles.
- Removed the obsolete `ouath.types.ts` file to streamline the codebase.

* fix(auth): update GoogleButton mock path in tests

- Changed the import path for the `GoogleButton` mock in the `AuthModal.test.tsx` file to reflect the new directory structure, ensuring consistency with recent component refactoring.

* fix(auth): update onSuccess handler to return boolean for auth flow control

- Modified the `onSuccess` callback in `useGoogleAuth` to return a boolean value, allowing for better control over the authentication flow.
- Updated the `useConnectGoogle` hook to handle the new return value, ensuring proper state reset when authentication is not completed.
- Added a test case to verify the behavior when the custom success handler returns false, ensuring the authentication state is reset correctly.

* refactor(auth): streamline Google event synchronization process

- Removed the direct call to `syncCompassEventsToGoogle` from the `GoogleAuthService` and integrated it into the `UserService` during the Google Calendar sync process.
- Updated the test cases for `GoogleAuthService` to reflect changes in event synchronization logic.
- Added the `syncCompassEventsToGoogle` function to the `EventService`, encapsulating the logic for syncing Compass events to Google Calendar.
- Enhanced error handling for event synchronization in the `UserService`, ensuring robust logging for failures.

* feat(sync): implement Google Calendar synchronization in SyncService

- Added `startGoogleCalendarSync` method to `SyncService` for initializing calendars, importing events, and managing synchronization tokens.
- Updated tests in `sync.service.test.ts` to validate the new synchronization logic, ensuring watches are created only after successful imports.
- Refactored `UserService` to utilize `SyncService` for Google Calendar sync, enhancing code organization and reducing duplication.
- Mocked `isUsingHttps` in tests to simulate different environments during synchronization.

* refactor(sync): migrate Google Calendar sync logic from UserService to SyncService

- Replaced calls to `userService.restartGoogleCalendarSync` with `syncService.restartGoogleCalendarSync` across multiple files, centralizing the synchronization logic within the SyncService.
- Updated tests to reflect the new structure, ensuring that the sync functionality is properly validated in the context of the SyncService.
- Enhanced error handling and logging during the Google Calendar sync process, improving overall robustness and maintainability of the synchronization workflow.

* refactor(sync): move syncCompassEventsToGoogle function to SyncService

- Transferred the `syncCompassEventsToGoogle` function from `EventService` to `SyncService`, centralizing the synchronization logic for Compass events.
- Updated imports and adjusted the function's implementation to fit within the new service structure, ensuring consistency and maintainability.
- Enhanced the overall organization of the codebase by consolidating event synchronization responsibilities within the `SyncService`.

* chore(ci): upgrade GitHub Actions to use checkout and setup-node v6

- Updated the `checkout` action from v4 to v6 in both `test-e2e.yml` and `test-unit.yml` workflows for improved performance and features.
- Upgraded the `setup-node` action from v4 to v6, ensuring compatibility with the latest Node.js version and enhancing caching capabilities for Yarn.

* refactor(event): simplify title submission logic in fillTitleAndSaveWithKeyboard function

- Updated the title submission method in the `fillTitleAndSaveWithKeyboard` function to use a plain Enter key instead of ControlOrMeta+Enter, improving reliability on Linux CI environments.
- Adjusted comments to clarify the behavior of hotkeys in the EventForm, ensuring consistency with related test cases.

* refactor(event): enhance title submission reliability in fillTitleAndSaveWithKeyboard function

- Updated the title submission logic to use Control+Enter instead of plain Enter, improving reliability across different operating systems in CI environments.
- Revised comments to clarify the handling of hotkeys and ensure consistency with the EventForm's behavior.

* refactor(event): improve title submission method and enhance code clarity

- Introduced a new helper function, `fillTitleAndSaveEventForm`, to streamline the title submission process in the event form.
- Updated `fillTitleAndSaveWithMouse` and `fillTitleAndSaveWithKeyboard` to utilize the new helper function, improving code maintainability.
- Added detailed comments to clarify the submission process and the rationale behind using the Save control for reliability in CI environments.

* refactor(event): unify title submission method across event tests

- Replaced individual title submission methods (`fillTitleAndSaveWithMouse` and `fillTitleAndSaveWithKeyboard`) with a single `fillTitleAndSaveEventForm` function across all event-related test files.
- Updated all relevant test cases to utilize the new unified method, enhancing code maintainability and reducing duplication.
- Improved the reliability of the title submission process by ensuring consistent handling across different interaction types.

* refactor(sync): change export to const for syncCompassEventsToGoogle function

- Updated the `syncCompassEventsToGoogle` function from an exported function to a constant within the `SyncService` class, improving encapsulation and code organization.
- This change enhances maintainability by keeping the function scoped within the service, aligning with the overall structure of the codebase.

Author: tyler-dane

.github/workflows/test-e2e.yml

@@ -13,13 +13,13 @@ jobs:
 
     steps:
       - name: Check out repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v6
 
       - name: Enable Corepack
         run: corepack enable
 
       - name: Set up Node.js
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v6
         with:
           node-version: 24
           cache: yarn

.github/workflows/test-unit.yml

@@ -12,13 +12,13 @@ jobs:
 
     steps:
       - name: Check out Git repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v6
 
       - name: Enable Corepack
         run: corepack enable
 
       - name: Install Node.js and Yarn
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v6
         with:
           node-version: 24
           cache: "yarn"

docs/features/google-sync-and-websocket-flow.md

@@ -414,11 +414,20 @@ Source files:
 Examples:
 
 ```json
-{ "operation": "REPAIR", "status": "COMPLETED", "eventsCount": 42, "calendarsCount": 3 }
+{
+  "operation": "REPAIR",
+  "status": "COMPLETED",
+  "eventsCount": 42,
+  "calendarsCount": 3
+}
 ```
 
 ```json
-{ "operation": "INCREMENTAL", "status": "ERRORED", "message": "Incremental Google Calendar sync failed for user: 123" }
+{
+  "operation": "INCREMENTAL",
+  "status": "ERRORED",
+  "message": "Incremental Google Calendar sync failed for user: 123"
+}
 ```
 
 ### Repair Failure Messaging

e2e/allday/create-allday-event-keyboard.spec.ts

@@ -2,7 +2,7 @@ import { test } from "@playwright/test";
 import {
   createEventTitle,
   expectAllDayEventVisible,
-  fillTitleAndSaveWithKeyboard,
+  fillTitleAndSaveEventForm,
   openAllDayEventFormWithKeyboard,
   prepareCalendarPage,
 } from "../utils/event-test-utils";
@@ -16,7 +16,7 @@ test("should create an all-day event using keyboard interaction", async ({
 
   const title = createEventTitle("All-Day Event");
   await openAllDayEventFormWithKeyboard(page);
-  await fillTitleAndSaveWithKeyboard(page, title);
+  await fillTitleAndSaveEventForm(page, title);
 
   await expectAllDayEventVisible(page, title);
 });

e2e/allday/create-allday-event-mouse.spec.ts

@@ -2,7 +2,7 @@ import { test } from "@playwright/test";
 import {
   createEventTitle,
   expectAllDayEventVisible,
-  fillTitleAndSaveWithMouse,
+  fillTitleAndSaveEventForm,
   openAllDayEventFormWithMouse,
   prepareCalendarPage,
 } from "../utils/event-test-utils";
@@ -19,7 +19,7 @@ test("should create an all-day event using mouse interaction", async ({
 
   const title = createEventTitle("All-Day Event");
   await openAllDayEventFormWithMouse(page);
-  await fillTitleAndSaveWithMouse(page, title);
+  await fillTitleAndSaveEventForm(page, title);
 
   await expectAllDayEventVisible(page, title);
 });

e2e/allday/delete-allday-event-keyboard.spec.ts

@@ -4,7 +4,7 @@ import {
   deleteEventWithKeyboard,
   expectAllDayEventMissing,
   expectAllDayEventVisible,
-  fillTitleAndSaveWithKeyboard,
+  fillTitleAndSaveEventForm,
   openAllDayEventFormWithKeyboard,
   openEventForEditingWithKeyboard,
   prepareCalendarPage,
@@ -19,7 +19,7 @@ test("should delete an all-day event using keyboard interaction", async ({
 
   const title = createEventTitle("All-Day Event");
   await openAllDayEventFormWithKeyboard(page);
-  await fillTitleAndSaveWithKeyboard(page, title);
+  await fillTitleAndSaveEventForm(page, title);
   await expectAllDayEventVisible(page, title);
   await page.waitForTimeout(1000);
 

e2e/allday/delete-allday-event-mouse.spec.ts

@@ -4,7 +4,7 @@ import {
   deleteEventWithMouse,
   expectAllDayEventMissing,
   expectAllDayEventVisible,
-  fillTitleAndSaveWithMouse,
+  fillTitleAndSaveEventForm,
   openAllDayEventFormWithMouse,
   openEventForEditingWithMouse,
   prepareCalendarPage,
@@ -22,7 +22,7 @@ test("should delete an all-day event using mouse interaction", async ({
 
   const title = createEventTitle("All-Day Event");
   await openAllDayEventFormWithMouse(page);
-  await fillTitleAndSaveWithMouse(page, title);
+  await fillTitleAndSaveEventForm(page, title);
   await expectAllDayEventVisible(page, title);
 
   await openEventForEditingWithMouse(page, title);

e2e/allday/update-allday-event-keyboard.spec.ts

@@ -3,7 +3,7 @@ import {
   createEventTitle,
   expectAllDayEventMissing,
   expectAllDayEventVisible,
-  fillTitleAndSaveWithKeyboard,
+  fillTitleAndSaveEventForm,
   openAllDayEventFormWithKeyboard,
   openEventForEditingWithKeyboard,
   prepareCalendarPage,
@@ -19,14 +19,14 @@ test("should update an all-day event using keyboard interaction", async ({
 
   const title = createEventTitle("All-Day Event");
   await openAllDayEventFormWithKeyboard(page);
-  await fillTitleAndSaveWithKeyboard(page, title);
+  await fillTitleAndSaveEventForm(page, title);
   await expectAllDayEventVisible(page, title);
   await page.waitForTimeout(1000);
 
   await openEventForEditingWithKeyboard(page, title);
 
   const updatedTitle = updateEventTitle("All-Day Event");
-  await fillTitleAndSaveWithKeyboard(page, updatedTitle);
+  await fillTitleAndSaveEventForm(page, updatedTitle);
 
   await expectAllDayEventVisible(page, updatedTitle);
   await expectAllDayEventMissing(page, title);

e2e/allday/update-allday-event-mouse.spec.ts

@@ -3,7 +3,7 @@ import {
   createEventTitle,
   expectAllDayEventMissing,
   expectAllDayEventVisible,
-  fillTitleAndSaveWithMouse,
+  fillTitleAndSaveEventForm,
   openAllDayEventFormWithMouse,
   openEventForEditingWithMouse,
   prepareCalendarPage,
@@ -22,13 +22,13 @@ test("should update an all-day event using mouse interaction", async ({
 
   const title = createEventTitle("All-Day Event");
   await openAllDayEventFormWithMouse(page);
-  await fillTitleAndSaveWithMouse(page, title);
+  await fillTitleAndSaveEventForm(page, title);
   await expectAllDayEventVisible(page, title);
 
   await openEventForEditingWithMouse(page, title);
 
   const updatedTitle = updateEventTitle("All-Day Event");
-  await fillTitleAndSaveWithMouse(page, updatedTitle);
+  await fillTitleAndSaveEventForm(page, updatedTitle);
 
   await expectAllDayEventVisible(page, updatedTitle);
   await expectAllDayEventMissing(page, title);

e2e/someday/create-someday-event-keyboard.spec.ts

@@ -2,7 +2,7 @@ import { test } from "@playwright/test";
 import {
   createEventTitle,
   expectSomedayEventVisible,
-  fillTitleAndSaveWithKeyboard,
+  fillTitleAndSaveEventForm,
   openSomedayEventFormWithKeyboard,
   prepareCalendarPage,
 } from "../utils/event-test-utils";
@@ -16,7 +16,7 @@ test("should create a someday event using keyboard interaction", async ({
 
   const title = createEventTitle("Someday Event");
   await openSomedayEventFormWithKeyboard(page);
-  await fillTitleAndSaveWithKeyboard(page, title);
+  await fillTitleAndSaveEventForm(page, title);
 
   await expectSomedayEventVisible(page, title);
 });