From 1c5169b3081cc0e3bb6363940007ca2645c3fb25 Mon Sep 17 00:00:00 2001 From: namlh023 Date: Thu, 9 Apr 2026 14:12:04 +0700 Subject: [PATCH 1/6] [MOL-20560][NL] Add listeners-ready event for location-field --- src/components/fields/location-field/location-field.tsx | 3 +++ src/components/fields/location-field/types.ts | 9 +++++++++ 2 files changed, 12 insertions(+) diff --git a/src/components/fields/location-field/location-field.tsx b/src/components/fields/location-field/location-field.tsx index 719d8d9fa..dd8cfcba4 100644 --- a/src/components/fields/location-field/location-field.tsx +++ b/src/components/fields/location-field/location-field.tsx @@ -59,6 +59,9 @@ export const LocationField = (props: IGenericFieldProps) = useEffect(() => { addFieldEventListener("show-location-modal", id, handleLocationModalShow); + // Signal that the field has registered its listeners and is ready for external triggers. + dispatchFieldEvent("listeners-ready", id); + return () => { removeFieldEventListener("show-location-modal", id, handleLocationModalShow); }; diff --git a/src/components/fields/location-field/types.ts b/src/components/fields/location-field/types.ts index cc2dd2844..a37ed2bf5 100644 --- a/src/components/fields/location-field/types.ts +++ b/src/components/fields/location-field/types.ts @@ -96,6 +96,7 @@ export type TSetCurrentLocationDetail = TLocationFieldDetail; export type TLocationFieldErrorDetail = TLocationFieldDetail; export type TLocationFieldEvents = { + "listeners-ready": CustomEvent; "get-current-location": CustomEvent; "set-current-location": CustomEvent; error: CustomEvent; @@ -116,6 +117,14 @@ export class GeolocationPositionErrorWrapper extends Error { // ============================================================================= // EVENTS (fired from FEE) // ============================================================================= +/** fired after the location field registers its internal event listeners and is ready for external triggers */ +function locationFieldEvent( + uiType: "location-field", + type: "listeners-ready", + id: string, + listener: TFieldEventListener, + options?: boolean | AddEventListenerOptions | undefined +): void; /** fired on showing location modal */ function locationFieldEvent( uiType: "location-field", From c3a666db64b5780930066209196f1503748487fc Mon Sep 17 00:00:00 2001 From: namlh023 Date: Thu, 9 Apr 2026 15:13:57 +0700 Subject: [PATCH 2/6] [MOL-20560][NL] Add location-field listeners-ready event to storybook --- .../location-field/location-field-events.stories.tsx | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/stories/3-fields/location-field/location-field-events.stories.tsx b/src/stories/3-fields/location-field/location-field-events.stories.tsx index 75e7a64a8..c535b42c7 100644 --- a/src/stories/3-fields/location-field/location-field-events.stories.tsx +++ b/src/stories/3-fields/location-field/location-field-events.stories.tsx @@ -850,3 +850,10 @@ RefreshLocationAndTriggerGetCurrentLocation.args = { label: "Refresh current location and trigger get current location", mapApi: defaultMapApi, }; + +export const ListenersReady = Template("listeners-ready").bind({}); +ListenersReady.args = { + uiType: "location-field", + label: "Listeners Ready", + mapApi: defaultMapApi, +}; From c2d5354dd9c2a21c69d950480d0186a8cda50830 Mon Sep 17 00:00:00 2001 From: namlh023 Date: Thu, 9 Apr 2026 15:36:48 +0700 Subject: [PATCH 3/6] [MOL-20560][NL] Add test for location-field listeners-ready event --- .../location-field/location-field.spec.tsx | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/__tests__/components/fields/location-field/location-field.spec.tsx b/src/__tests__/components/fields/location-field/location-field.spec.tsx index a3bd21eff..3885977dc 100644 --- a/src/__tests__/components/fields/location-field/location-field.spec.tsx +++ b/src/__tests__/components/fields/location-field/location-field.spec.tsx @@ -52,6 +52,7 @@ enum ELocationInputEvents { "SET_CURRENT_LOCATION" = "set-current-location", "GET_CURRENT_LOCATION" = "get-current-location", "MOUNT" = "mount", + "LISTENERS_READY" = "listeners-ready", "SHOW_MODAL" = "show-location-modal", "HIDE_MODAL" = "hide-location-modal", "CLICK_EDIT_BUTTON" = "click-edit-button", @@ -635,6 +636,23 @@ describe("location-input-group", () => { // PostalCodeError //Modal Events + describe("Listeners-ready events", () => { + it("should fire listeners-ready after listeners are registered", async () => { + const handleListenersReady = jest.fn(); + renderComponent({ + eventType: ELocationInputEvents.LISTENERS_READY, + eventListener: (formRef) => () => { + handleListenersReady(); + formRef.dispatchFieldEvent(UI_TYPE, ELocationInputEvents.SHOW_MODAL, COMPONENT_ID); + }, + }); + await waitFor(() => { + expect(handleListenersReady).toHaveBeenCalled(); + expect(getLocationModal(true)).toBeInTheDocument(); + }); + }); + }); + describe("Modal events", () => { it("should fire show-location-modal event on showing location modal", async () => { const handleShowReviewModal = jest.fn(); From 474dbac939cb6ac1afefdc11a6b5fbddb7fdb351 Mon Sep 17 00:00:00 2001 From: namlh023 Date: Thu, 9 Apr 2026 17:15:52 +0700 Subject: [PATCH 4/6] [MOL-20560][NL] Add optional chaning in case reverseGeocodeAborter.current is null --- .../location-modal/location-search/location-search.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/fields/location-field/location-modal/location-search/location-search.tsx b/src/components/fields/location-field/location-modal/location-search/location-search.tsx index 9cc4b1ad8..8fc16cf00 100644 --- a/src/components/fields/location-field/location-modal/location-search/location-search.tsx +++ b/src/components/fields/location-field/location-modal/location-search/location-search.tsx @@ -143,7 +143,7 @@ export const LocationSearch = ({ latitude: 1.29994179707526, longitude: 103.789404349716, bufferRadius: 1, - abortSignal: reverseGeocodeAborter.current.signal, + abortSignal: reverseGeocodeAborter.current?.signal, otherFeatures: OneMapBoolean.YES, getToken, headers: mapApiHeaders, From f52f155b6cd1fbec348f7dcb42f25333166fa63a Mon Sep 17 00:00:00 2001 From: namlh023 Date: Tue, 14 Apr 2026 10:23:25 +0700 Subject: [PATCH 5/6] [MOL-20560][NL] Rename listeners-ready to show-location-modal-ready --- .../fields/location-field/location-field.spec.tsx | 14 +++++++------- .../fields/location-field/location-field.tsx | 2 +- src/components/fields/location-field/types.ts | 4 ++-- .../location-field-events.stories.tsx | 6 +++--- 4 files changed, 13 insertions(+), 13 deletions(-) diff --git a/src/__tests__/components/fields/location-field/location-field.spec.tsx b/src/__tests__/components/fields/location-field/location-field.spec.tsx index 3885977dc..cc60cb768 100644 --- a/src/__tests__/components/fields/location-field/location-field.spec.tsx +++ b/src/__tests__/components/fields/location-field/location-field.spec.tsx @@ -52,7 +52,7 @@ enum ELocationInputEvents { "SET_CURRENT_LOCATION" = "set-current-location", "GET_CURRENT_LOCATION" = "get-current-location", "MOUNT" = "mount", - "LISTENERS_READY" = "listeners-ready", + "SHOW_LOCATION_MODAL_READY" = "show-location-modal-ready", "SHOW_MODAL" = "show-location-modal", "HIDE_MODAL" = "hide-location-modal", "CLICK_EDIT_BUTTON" = "click-edit-button", @@ -636,18 +636,18 @@ describe("location-input-group", () => { // PostalCodeError //Modal Events - describe("Listeners-ready events", () => { - it("should fire listeners-ready after listeners are registered", async () => { - const handleListenersReady = jest.fn(); + describe("Show Location Modal Ready events", () => { + it("should fire show-location-modal-ready after it is registered", async () => { + const handleShowLocationModalReady = jest.fn(); renderComponent({ - eventType: ELocationInputEvents.LISTENERS_READY, + eventType: ELocationInputEvents.SHOW_LOCATION_MODAL_READY, eventListener: (formRef) => () => { - handleListenersReady(); + handleShowLocationModalReady(); formRef.dispatchFieldEvent(UI_TYPE, ELocationInputEvents.SHOW_MODAL, COMPONENT_ID); }, }); await waitFor(() => { - expect(handleListenersReady).toHaveBeenCalled(); + expect(handleShowLocationModalReady).toHaveBeenCalled(); expect(getLocationModal(true)).toBeInTheDocument(); }); }); diff --git a/src/components/fields/location-field/location-field.tsx b/src/components/fields/location-field/location-field.tsx index dd8cfcba4..9892853ca 100644 --- a/src/components/fields/location-field/location-field.tsx +++ b/src/components/fields/location-field/location-field.tsx @@ -60,7 +60,7 @@ export const LocationField = (props: IGenericFieldProps) = addFieldEventListener("show-location-modal", id, handleLocationModalShow); // Signal that the field has registered its listeners and is ready for external triggers. - dispatchFieldEvent("listeners-ready", id); + dispatchFieldEvent("show-location-modal-ready", id); return () => { removeFieldEventListener("show-location-modal", id, handleLocationModalShow); diff --git a/src/components/fields/location-field/types.ts b/src/components/fields/location-field/types.ts index a37ed2bf5..35df1e926 100644 --- a/src/components/fields/location-field/types.ts +++ b/src/components/fields/location-field/types.ts @@ -96,7 +96,7 @@ export type TSetCurrentLocationDetail = TLocationFieldDetail; export type TLocationFieldErrorDetail = TLocationFieldDetail; export type TLocationFieldEvents = { - "listeners-ready": CustomEvent; + "show-location-modal-ready": CustomEvent; "get-current-location": CustomEvent; "set-current-location": CustomEvent; error: CustomEvent; @@ -120,7 +120,7 @@ export class GeolocationPositionErrorWrapper extends Error { /** fired after the location field registers its internal event listeners and is ready for external triggers */ function locationFieldEvent( uiType: "location-field", - type: "listeners-ready", + type: "show-location-modal-ready", id: string, listener: TFieldEventListener, options?: boolean | AddEventListenerOptions | undefined diff --git a/src/stories/3-fields/location-field/location-field-events.stories.tsx b/src/stories/3-fields/location-field/location-field-events.stories.tsx index c535b42c7..d137e51fc 100644 --- a/src/stories/3-fields/location-field/location-field-events.stories.tsx +++ b/src/stories/3-fields/location-field/location-field-events.stories.tsx @@ -851,9 +851,9 @@ RefreshLocationAndTriggerGetCurrentLocation.args = { mapApi: defaultMapApi, }; -export const ListenersReady = Template("listeners-ready").bind({}); -ListenersReady.args = { +export const ShowLocationModalReady = Template("show-location-modal-ready").bind({}); +ShowLocationModalReady.args = { uiType: "location-field", - label: "Listeners Ready", + label: "Show Location Modal Ready", mapApi: defaultMapApi, }; From 1f108e5fbe81e65f5a5d1fbbc3a4b5548db3aa8c Mon Sep 17 00:00:00 2001 From: Nam Le Date: Wed, 15 Apr 2026 09:18:53 +0700 Subject: [PATCH 6/6] [MOL-20560][NL] rephase comment for better clarity --- src/components/fields/location-field/types.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/fields/location-field/types.ts b/src/components/fields/location-field/types.ts index 35df1e926..246ab0efc 100644 --- a/src/components/fields/location-field/types.ts +++ b/src/components/fields/location-field/types.ts @@ -117,7 +117,7 @@ export class GeolocationPositionErrorWrapper extends Error { // ============================================================================= // EVENTS (fired from FEE) // ============================================================================= -/** fired after the location field registers its internal event listeners and is ready for external triggers */ +/** fired after the location field registers the `show-location-modal` event listener and is ready for external triggers */ function locationFieldEvent( uiType: "location-field", type: "show-location-modal-ready",