wip: dynamic search for component create

app/pages/component/create.vue

@@ -212,6 +212,9 @@
             :pieces-loading="piecesLoading"
             :products-loading="productsLoading"
             :components-loading="componentsLoading"
+            :piece-type-label-map="pieceTypeLabelMap"
+            :product-type-label-map="productTypeLabelMap"
+            :component-type-label-map="componentTypeLabelMap"
           />
           <p v-else class="text-xs text-error">
             Impossible de générer les emplacements définis par le squelette.
@@ -349,7 +352,9 @@ import SearchSelect from '~/components/common/SearchSelect.vue'
 import { useComponentTypes } from '~/composables/useComponentTypes'
 import { useComposants } from '~/composables/useComposants'
 import { usePieces } from '~/composables/usePieces'
+import { usePieceTypes } from '~/composables/usePieceTypes'
 import { useProducts } from '~/composables/useProducts'
+import { useProductTypes } from '~/composables/useProductTypes'
 import { useToast } from '~/composables/useToast'
 import { useCustomFields } from '~/composables/useCustomFields'
 import { useDocuments } from '~/composables/useDocuments'
@@ -372,20 +377,19 @@ const route = useRoute()
 const router = useRouter()
 
 const { componentTypes, loadComponentTypes, loadingComponentTypes } = useComponentTypes()
+const { pieceTypes, loadPieceTypes } = usePieceTypes()
+const { productTypes, loadProductTypes } = useProductTypes()
 const {
   createComposant,
   composants: componentCatalogRef,
-  loadComposants,
   loading: componentsLoading,
 } = useComposants()
 const {
   pieces: pieceCatalogRef,
-  loadPieces,
   loading: piecesLoading,
 } = usePieces()
 const {
   products: productCatalogRef,
-  loadProducts,
   loading: productsLoading,
 } = useProducts()
 const toast = useToast()
@@ -414,6 +418,28 @@ const structureDataLoading = computed(
   () => piecesLoading.value || componentsLoading.value || productsLoading.value,
 )
 
+const pieceTypeLabelMap = computed(() =>
+  Object.fromEntries(
+    (pieceTypes.value || [])
+      .filter((type: any) => type?.id)
+      .map((type: any) => [type.id, type.name || type.code || '']),
+  ),
+)
+const productTypeLabelMap = computed(() =>
+  Object.fromEntries(
+    (productTypes.value || [])
+      .filter((type: any) => type?.id)
+      .map((type: any) => [type.id, type.name || type.code || '']),
+  ),
+)
+const componentTypeLabelMap = computed(() =>
+  Object.fromEntries(
+    (componentTypes.value || [])
+      .filter((type: any) => type?.id)
+      .map((type: any) => [type.id, type.name || type.code || '']),
+  ),
+)
+
 watch(
   () => route.query.typeId,
   (value) => {
@@ -934,9 +960,8 @@ const submitCreation = async () => {
 onMounted(async () => {
   await Promise.allSettled([
     loadComponentTypes(),
-    loadPieces(),
-    loadComposants(),
-    loadProducts(),
+    loadPieceTypes(),
+    loadProductTypes(),
   ])
 })