From 4f57686364dc75ca2e5be4978ce6295bbc7e9a54 Mon Sep 17 00:00:00 2001
From: Ruslan Bakiev <572431+veikab@users.noreply.github.com>
Date: Wed, 7 Jan 2026 16:16:45 +0700
Subject: [PATCH] fix(ai): use LangServe message format (type instead of role)

---
 app/pages/clientarea/addresses/[uuid].vue     | 332 ++++++++++++++++++
 app/pages/clientarea/addresses/index.vue      |  32 +-
 app/pages/clientarea/ai/index.vue             |   2 +-
 .../team/teams/UpdateTeamAddress.graphql      |  15 +
 i18n/locales/en/profileAddresses.json         |  10 +-
 i18n/locales/ru/profileAddresses.json         |  10 +-
 6 files changed, 374 insertions(+), 27 deletions(-)
 create mode 100644 app/pages/clientarea/addresses/[uuid].vue
 create mode 100644 graphql/operations/team/teams/UpdateTeamAddress.graphql

diff --git a/app/pages/clientarea/addresses/[uuid].vue b/app/pages/clientarea/addresses/[uuid].vue
new file mode 100644
index 0000000..72cedf3
--- /dev/null
+++ b/app/pages/clientarea/addresses/[uuid].vue
@@ -0,0 +1,332 @@
+<template>
+  <Stack gap="6">
+    <PageHeader :title="t('profileAddresses.form.title_edit')" />
+
+    <Card v-if="isLoadingAddress" padding="lg">
+      <Stack align="center" gap="3">
+        <Spinner />
+        <Text tone="muted">{{ t('profileAddresses.states.loading') }}</Text>
+      </Stack>
+    </Card>
+
+    <Stack v-else-if="addressData" gap="4">
+      <Input
+        v-model="addressData.name"
+        :label="t('profileAddresses.form.name.label')"
+        :placeholder="t('profileAddresses.form.name.placeholder')"
+      />
+
+      <!-- Address search with Mapbox -->
+      <div class="form-control">
+        <label class="label">
+          <span class="label-text">{{ t('profileAddresses.form.address.label') }}</span>
+        </label>
+        <div ref="searchBoxContainer" class="w-full" />
+        <input
+          v-if="addressData.address"
+          type="hidden"
+          :value="addressData.address"
+        />
+      </div>
+
+      <!-- Mapbox map for selecting coordinates -->
+      <div class="form-control">
+        <label class="label">
+          <span class="label-text">{{ t('profileAddresses.form.mapLabel') }}</span>
+        </label>
+        <div class="h-80 rounded-lg overflow-hidden border border-base-300">
+          <MapboxMap
+            ref="mapComponentRef"
+            :map-id="'address-picker-edit'"
+            style="width: 100%; height: 100%"
+            :options="{
+              style: 'mapbox://styles/mapbox/streets-v12',
+              center: [addressData.longitude || 37.6173, addressData.latitude || 55.7558],
+              zoom: 12
+            }"
+            @mb-click="onMapClick"
+            @mb-created="onMapCreated"
+          >
+            <MapboxDefaultMarker
+              v-if="addressData.latitude && addressData.longitude"
+              :marker-id="'selected-location'"
+              :lnglat="[addressData.longitude, addressData.latitude]"
+              color="#3b82f6"
+            />
+          </MapboxMap>
+        </div>
+        <label class="label" v-if="addressData.latitude && addressData.longitude">
+          <span class="label-text-alt text-success">
+            {{ addressData.latitude.toFixed(6) }}, {{ addressData.longitude.toFixed(6) }}
+          </span>
+        </label>
+      </div>
+
+      <Stack direction="row" gap="3">
+        <Button @click="updateAddress" :disabled="isSaving || !addressData.latitude">
+          {{ isSaving ? t('profileAddresses.form.updating') : t('profileAddresses.form.update') }}
+        </Button>
+        <Button variant="outline" :as="NuxtLink" :to="localePath('/clientarea/addresses')">
+          {{ t('common.cancel') }}
+        </Button>
+      </Stack>
+
+      <!-- Delete button -->
+      <div class="pt-4 border-t border-base-300">
+        <Button variant="ghost" class="text-error" @click="handleDelete" :disabled="isDeleting">
+          <Icon name="lucide:trash-2" size="16" class="mr-2" />
+          {{ isDeleting ? t('profileAddresses.actions.deleting') : t('profileAddresses.actions.delete') }}
+        </Button>
+      </div>
+    </Stack>
+
+    <EmptyState
+      v-else
+      icon="lucide:alert-circle"
+      :title="t('profileAddresses.error.not_found')"
+      :action-label="t('profileAddresses.error.back_to_list')"
+      :action-to="localePath('/clientarea/addresses')"
+    />
+  </Stack>
+</template>
+
+<script setup lang="ts">
+import { NuxtLink } from '#components'
+import type { MapMouseEvent, Map as MapboxMapType } from 'mapbox-gl'
+
+definePageMeta({
+  middleware: ['auth-oidc']
+})
+
+const route = useRoute()
+const { execute, mutate } = useGraphQL()
+const { t } = useI18n()
+const localePath = useLocalePath()
+const config = useRuntimeConfig()
+
+const uuid = computed(() => route.params.uuid as string)
+
+const isLoadingAddress = ref(true)
+const isSaving = ref(false)
+const isDeleting = ref(false)
+const searchBoxContainer = ref<HTMLElement | null>(null)
+const mapInstance = ref<MapboxMapType | null>(null)
+const searchBoxRef = ref<any>(null)
+
+const addressData = ref<{
+  uuid: string
+  name: string
+  address: string
+  latitude: number | null
+  longitude: number | null
+  countryCode: string | null
+} | null>(null)
+
+// Load address data
+const loadAddress = async () => {
+  isLoadingAddress.value = true
+  try {
+    const { GetTeamAddressesDocument } = await import('~/composables/graphql/team/teams-generated')
+    const data = await execute(GetTeamAddressesDocument, {}, 'team', 'teams')
+    const addresses = data?.teamAddresses || []
+    const found = addresses.find((a: any) => a.uuid === uuid.value)
+
+    if (found) {
+      addressData.value = {
+        uuid: found.uuid,
+        name: found.name || '',
+        address: found.address || '',
+        latitude: found.latitude,
+        longitude: found.longitude,
+        countryCode: found.countryCode
+      }
+    }
+  } catch (e) {
+    console.error('Failed to load address', e)
+  } finally {
+    isLoadingAddress.value = false
+  }
+}
+
+await loadAddress()
+
+const onMapCreated = (map: MapboxMapType) => {
+  mapInstance.value = map
+}
+
+// Reverse geocode: get address by coordinates (local language)
+const reverseGeocode = async (lat: number, lng: number): Promise<{ address: string | null; countryCode: string | null }> => {
+  try {
+    const token = config.public.mapboxAccessToken
+    const response = await fetch(
+      `https://api.mapbox.com/geocoding/v5/mapbox.places/${lng},${lat}.json?access_token=${token}`
+    )
+    const data = await response.json()
+    const feature = data.features?.[0]
+    if (!feature) return { address: null, countryCode: null }
+
+    // Extract country code from context
+    const countryContext = feature.context?.find((c: any) => c.id?.startsWith('country.'))
+    const countryCode = countryContext?.short_code?.toUpperCase() || null
+
+    return { address: feature.place_name, countryCode }
+  } catch {
+    return { address: null, countryCode: null }
+  }
+}
+
+const onMapClick = async (event: MapMouseEvent) => {
+  if (!addressData.value) return
+
+  const lat = event.lngLat.lat
+  const lng = event.lngLat.lng
+
+  addressData.value.latitude = lat
+  addressData.value.longitude = lng
+
+  // Reverse geocode: load address by coordinates
+  const result = await reverseGeocode(lat, lng)
+  if (result.address) {
+    addressData.value.address = result.address
+    addressData.value.countryCode = result.countryCode
+    // Update SearchBox input
+    if (searchBoxRef.value) {
+      searchBoxRef.value.value = result.address
+    }
+  }
+}
+
+// Initialize Mapbox SearchBox
+onMounted(async () => {
+  if (!searchBoxContainer.value) return
+
+  const { MapboxSearchBox } = await import('@mapbox/search-js-web')
+
+  const searchBox = new MapboxSearchBox()
+  searchBox.accessToken = config.public.mapboxAccessToken as string
+  searchBox.options = {
+    // Without language: uses local country language
+  }
+  searchBox.placeholder = t('profileAddresses.form.address.placeholder')
+
+  // Pre-fill with existing address
+  if (addressData.value?.address) {
+    searchBox.value = addressData.value.address
+  }
+
+  searchBox.addEventListener('retrieve', (event: any) => {
+    if (!addressData.value) return
+
+    const feature = event.detail.features?.[0]
+    if (feature) {
+      const [lng, lat] = feature.geometry.coordinates
+      addressData.value.address = feature.properties.full_address || feature.properties.name
+      addressData.value.latitude = lat
+      addressData.value.longitude = lng
+
+      // Extract country code from context
+      const countryContext = feature.properties.context?.country
+      addressData.value.countryCode = countryContext?.country_code?.toUpperCase() || null
+
+      // Fly to selected location
+      if (mapInstance.value) {
+        mapInstance.value.flyTo({
+          center: [lng, lat],
+          zoom: 15
+        })
+      }
+    }
+  })
+
+  searchBoxRef.value = searchBox
+  searchBoxContainer.value.appendChild(searchBox as unknown as Node)
+})
+
+const updateAddress = async () => {
+  if (!addressData.value || !addressData.value.name || !addressData.value.address || !addressData.value.latitude) return
+
+  isSaving.value = true
+  try {
+    const { UpdateTeamAddressDocument } = await import('~/composables/graphql/team/teams-generated')
+    const result = await mutate(UpdateTeamAddressDocument, {
+      input: {
+        uuid: addressData.value.uuid,
+        name: addressData.value.name,
+        address: addressData.value.address,
+        latitude: addressData.value.latitude,
+        longitude: addressData.value.longitude,
+        countryCode: addressData.value.countryCode
+      }
+    }, 'team', 'teams')
+
+    if (result.updateTeamAddress?.success) {
+      navigateTo(localePath('/clientarea/addresses'))
+    } else {
+      console.error('Failed to update address:', result.updateTeamAddress?.message)
+    }
+  } catch (e) {
+    console.error('Failed to update address', e)
+  } finally {
+    isSaving.value = false
+  }
+}
+
+const handleDelete = async () => {
+  if (!addressData.value) return
+  if (!confirm(t('profileAddresses.actions.confirm_delete'))) return
+
+  isDeleting.value = true
+  try {
+    const { DeleteTeamAddressDocument } = await import('~/composables/graphql/team/teams-generated')
+    const result = await mutate(DeleteTeamAddressDocument, { uuid: addressData.value.uuid }, 'team', 'teams')
+
+    if (result.deleteTeamAddress?.success) {
+      navigateTo(localePath('/clientarea/addresses'))
+    } else {
+      console.error('Failed to delete address:', result.deleteTeamAddress?.message)
+    }
+  } catch (e) {
+    console.error('Failed to delete address', e)
+  } finally {
+    isDeleting.value = false
+  }
+}
+</script>
+
+<style>
+/* Mapbox SearchBox styling */
+mapbox-search-box {
+  width: 100%;
+}
+
+mapbox-search-box::part(input) {
+  height: 3rem;
+  padding: 0.5rem 1rem;
+  font-size: 1rem;
+  border: 1px solid oklch(var(--bc) / 0.2);
+  border-radius: var(--rounded-btn, 0.5rem);
+  background-color: oklch(var(--b1));
+  color: oklch(var(--bc));
+}
+
+mapbox-search-box::part(input):focus {
+  outline: 2px solid oklch(var(--p));
+  outline-offset: 2px;
+}
+
+mapbox-search-box::part(results-list) {
+  background-color: oklch(var(--b1));
+  border: 1px solid oklch(var(--bc) / 0.2);
+  border-radius: var(--rounded-btn, 0.5rem);
+  margin-top: 0.25rem;
+}
+
+mapbox-search-box::part(result-item) {
+  padding: 0.75rem 1rem;
+  color: oklch(var(--bc));
+}
+
+mapbox-search-box::part(result-item):hover {
+  background-color: oklch(var(--b2));
+}
+</style>
diff --git a/app/pages/clientarea/addresses/index.vue b/app/pages/clientarea/addresses/index.vue
index 0d94e35..a9f3384 100644
--- a/app/pages/clientarea/addresses/index.vue
+++ b/app/pages/clientarea/addresses/index.vue
@@ -25,32 +25,17 @@
         </NuxtLink>
 
         <Grid :cols="1" :md="2" :gap="4">
-          <Card v-for="addr in items" :key="addr.uuid" padding="small" interactive>
-            <div class="flex flex-col gap-1">
-              <div class="flex items-center justify-between">
+          <NuxtLink v-for="addr in items" :key="addr.uuid" :to="localePath(`/clientarea/addresses/${addr.uuid}`)" class="block">
+            <Card padding="small" interactive>
+              <div class="flex flex-col gap-1">
                 <Text size="base" weight="semibold" class="truncate">{{ addr.name }}</Text>
-                <div class="dropdown dropdown-end">
-                  <label tabindex="0" class="btn btn-ghost btn-xs btn-circle">
-                    <Icon name="lucide:more-vertical" size="16" />
-                  </label>
-                  <ul tabindex="0" class="dropdown-content z-10 menu p-2 shadow bg-base-100 rounded-box w-40">
-                    <li>
-                      <a class="text-error" @click="deleteAddress(addr.uuid)">
-                        <Icon name="lucide:trash-2" size="16" />
-                        {{ t('profileAddresses.actions.delete') }}
-                      </a>
-                    </li>
-                  </ul>
+                <Text tone="muted" size="sm" class="line-clamp-2">{{ addr.address }}</Text>
+                <div class="flex items-center mt-1">
+                  <span class="text-lg">{{ isoToEmoji(addr.countryCode) }}</span>
                 </div>
               </div>
-
-              <Text tone="muted" size="sm" class="line-clamp-2">{{ addr.address }}</Text>
-
-              <div class="flex items-center justify-between mt-1">
-                <span class="text-lg">{{ isoToEmoji(addr.countryCode) }}</span>
-              </div>
-            </div>
-          </Card>
+            </Card>
+          </NuxtLink>
         </Grid>
       </template>
 
@@ -79,7 +64,6 @@ const {
   items,
   isLoading,
   itemsWithCoords,
-  deleteAddress,
   isoToEmoji,
   init
 } = useTeamAddresses()
diff --git a/app/pages/clientarea/ai/index.vue b/app/pages/clientarea/ai/index.vue
index 206fd69..4503e2d 100644
--- a/app/pages/clientarea/ai/index.vue
+++ b/app/pages/clientarea/ai/index.vue
@@ -87,7 +87,7 @@ const handleSend = async () => {
     const body = {
       input: {
         messages: chat.value.map((m) => ({
-          role: m.role === 'assistant' ? 'assistant' : 'user',
+          type: m.role === 'assistant' ? 'ai' : 'human',
           content: m.content
         }))
       }
diff --git a/graphql/operations/team/teams/UpdateTeamAddress.graphql b/graphql/operations/team/teams/UpdateTeamAddress.graphql
new file mode 100644
index 0000000..46b77de
--- /dev/null
+++ b/graphql/operations/team/teams/UpdateTeamAddress.graphql
@@ -0,0 +1,15 @@
+mutation UpdateTeamAddress($input: UpdateTeamAddressInput!) {
+  updateTeamAddress(input: $input) {
+    success
+    message
+    address {
+      uuid
+      name
+      address
+      latitude
+      longitude
+      countryCode
+      isDefault
+    }
+  }
+}
diff --git a/i18n/locales/en/profileAddresses.json b/i18n/locales/en/profileAddresses.json
index b9b06db..7872de8 100644
--- a/i18n/locales/en/profileAddresses.json
+++ b/i18n/locales/en/profileAddresses.json
@@ -6,10 +6,12 @@
     "actions": {
       "add": "Add address",
       "confirm_delete": "Delete this address?",
-      "delete": "Delete"
+      "delete": "Delete",
+      "deleting": "Deleting..."
     },
     "form": {
       "title": "New address",
+      "title_edit": "Edit address",
       "name": {
         "label": "Name",
         "placeholder": "e.g. Office, Warehouse, Production"
@@ -28,6 +30,8 @@
       },
       "save": "Save",
       "saving": "Saving...",
+      "update": "Update",
+      "updating": "Updating...",
       "mapLabel": "Select a point on the map"
     },
     "states": {
@@ -41,6 +45,10 @@
       "cta": "Add first address",
       "title": "No addresses"
     },
+    "error": {
+      "not_found": "Address not found",
+      "back_to_list": "Back to addresses"
+    },
     "status": {}
   }
 }
diff --git a/i18n/locales/ru/profileAddresses.json b/i18n/locales/ru/profileAddresses.json
index 1612ddb..5b14319 100644
--- a/i18n/locales/ru/profileAddresses.json
+++ b/i18n/locales/ru/profileAddresses.json
@@ -6,10 +6,12 @@
     "actions": {
       "add": "Добавить адрес",
       "delete": "Удалить",
+      "deleting": "Удаление...",
       "confirm_delete": "Удалить этот адрес?"
     },
     "form": {
       "title": "Новый адрес",
+      "title_edit": "Редактирование адреса",
       "mapLabel": "Выберите точку на карте",
       "name": {
         "label": "Название",
@@ -28,7 +30,9 @@
         "placeholder": "37.6173"
       },
       "save": "Сохранить",
-      "saving": "Сохранение..."
+      "saving": "Сохранение...",
+      "update": "Обновить",
+      "updating": "Обновление..."
     },
     "states": {
       "loading": "Загружаем адреса..."
@@ -41,6 +45,10 @@
       "description": "У вас пока нет сохранённых адресов",
       "cta": "Добавить первый адрес"
     },
+    "error": {
+      "not_found": "Адрес не найден",
+      "back_to_list": "Назад к адресам"
+    },
     "status": {}
   }
 }