[WIP] Add postal code search integration to AddressPicker

Implemented `getPostalCodes` function in `local-search` driver and connected it with `AddressPicker.vue`. Introduced UI changes to display postal codes alongside addresses and ensured search requests are abortable.

src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressPicker.vue

@@ -3,7 +3,9 @@ import { Address } from "ChillMainAssets/types";
 import SearchBar from "ChillMainAssets/vuejs/AddressPicker/Component/SearchBar.vue";
 import {
     AddressAggregated,
+    AssociatedPostalCode,
     getAddressesAggregated,
+    getPostalCodes,
 } from "ChillMainAssets/vuejs/AddressPicker/driver/local-search";
 import { Ref, ref } from "vue";
 
@@ -16,24 +18,35 @@ const props = withDefaults(defineProps<AddressPickerProps>(), {
 });
 
 const addresses: Ref<AddressAggregated[]> = ref([]);
-let abortController: null | AbortController = null;
+const postalCodes: Ref<AssociatedPostalCode[]> = ref([]);
+let abortControllerSearchAddress: null | AbortController = null;
+let abortControllerSearchPostalCode: null | AbortController = null;
 
 const onSearch = async function (search: string): Promise<void> {
-    if (null !== abortController) {
-        abortController.abort();
+    performSearchForAddress(search);
+    performSearchForPostalCode(search);
+};
+
+const performSearchForAddress = async (search: string): Promise<void> => {
+    if (null !== abortControllerSearchAddress) {
+        abortControllerSearchAddress.abort();
     }
 
     if ("" === search) {
         addresses.value = [];
-        abortController = null;
+        abortControllerSearchAddress = null;
         return;
     }
 
-    abortController = new AbortController();
+    abortControllerSearchAddress = new AbortController();
 
     console.log("onSearch", search);
     try {
-        addresses.value = await getAddressesAggregated(search, abortController);
+        addresses.value = await getAddressesAggregated(
+            search,
+            abortControllerSearchAddress,
+        );
+        abortControllerSearchAddress = null;
     } catch (e: unknown) {
         if (e instanceof DOMException && e.name === "AbortError") {
             console.log("search aborted for:", search);
@@ -44,6 +57,37 @@ const onSearch = async function (search: string): Promise<void> {
         throw e;
     }
 };
+
+const performSearchForPostalCode = async (search: string): Promise<void> => {
+    if (null !== abortControllerSearchPostalCode) {
+        abortControllerSearchPostalCode.abort();
+    }
+
+    if ("" === search) {
+        addresses.value = [];
+        abortControllerSearchPostalCode = null;
+        return;
+    }
+
+    abortControllerSearchPostalCode = new AbortController();
+
+    console.log("onSearch", search);
+    try {
+        postalCodes.value = await getPostalCodes(
+            search,
+            abortControllerSearchPostalCode,
+        );
+        abortControllerSearchPostalCode = null;
+    } catch (e: unknown) {
+        if (e instanceof DOMException && e.name === "AbortError") {
+            console.log("search postal code aborted for:", search);
+
+            return;
+        }
+
+        throw e;
+    }
+};
 </script>
 
 <template>
@@ -52,6 +96,7 @@ const onSearch = async function (search: string): Promise<void> {
     <p v-for="a in addresses" :key="a.row_number">
         {{ a.street }}, positions: {{ a.positions[0] }}
     </p>
+    <p v-for="pc in postalCodes" :key="pc.postcode_id">{{ pc }}</p>
 </template>
 
 <style scoped lang="scss"></style>