refactor(frontend) : extract shared components and reduce file sizes

- Extract CustomFieldInputGrid.vue from 6 duplicated template blocks (~70 lines each)
- Extract EntityHistorySection.vue from 3 identical history sections in edit pages
- Extract useDragReorder composable from 4 identical drag-and-drop implementations in StructureNodeEditor (~330 lines → ~30)
- Extract catalogDisplayUtils.ts (resolvePrimaryDocument, resolveSupplierNames, buildSuppliersDisplay)
- Remove redundant computed wrappers (historyEntries, loadingTypes, selectedFiles)
- Remove unused imports (fieldKey, historyActionLabel, formatHistoryDate, *HistoryEntry types)
- Move Intl.DateTimeFormat to module-level in date.ts

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

app/pages/component/create.vue

@@ -241,78 +241,7 @@
               Renseignez les valeurs propres à ce composant selon le squelette choisi.
             </p>
           </header>
-          <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
-            <div
-              v-for="(field, index) in customFieldInputs"
-              :key="fieldKey(field, index)"
-              class="form-control"
-            >
-              <label class="label">
-                <span class="label-text">{{ field.name }}</span>
-                <span v-if="field.required" class="label-text-alt text-error">*</span>
-              </label>
-              <input
-                v-if="field.type === 'text'"
-                v-model="field.value"
-                type="text"
-                class="input input-bordered input-sm md:input-md"
-                :required="field.required"
-                :disabled="!canEdit || submitting"
-              >
-              <input
-                v-else-if="field.type === 'number'"
-                v-model="field.value"
-                type="number"
-                step="0.01"
-                class="input input-bordered input-sm md:input-md"
-                :required="field.required"
-                :disabled="!canEdit || submitting"
-              >
-              <select
-                v-else-if="field.type === 'select'"
-                v-model="field.value"
-                class="select select-bordered select-sm md:select-md"
-                :required="field.required"
-                :disabled="!canEdit || submitting"
-              >
-                <option value="">Sélectionner...</option>
-                <option
-                  v-for="option in field.options"
-                  :key="option"
-                  :value="option"
-                >
-                  {{ option }}
-                </option>
-              </select>
-              <label v-else-if="field.type === 'boolean'" class="flex items-center gap-3 cursor-pointer">
-                <input
-                  v-model="field.value"
-                  type="checkbox"
-                  class="toggle toggle-primary toggle-sm md:toggle-md"
-                  true-value="true"
-                  false-value="false"
-                  :disabled="!canEdit || submitting"
-                >
-                <span class="text-sm" :class="field.value === 'true' ? 'text-success font-medium' : 'text-base-content/60'">{{ field.value === 'true' ? 'Oui' : 'Non' }}</span>
-              </label>
-              <input
-                v-else-if="field.type === 'date'"
-                v-model="field.value"
-                type="date"
-                class="input input-bordered input-sm md:input-md"
-                :required="field.required"
-                :disabled="!canEdit || submitting"
-              >
-              <input
-                v-else
-                v-model="field.value"
-                type="text"
-                class="input input-bordered input-sm md:input-md"
-                :required="field.required"
-                :disabled="!canEdit || submitting"
-              >
-            </div>
-          </div>
+          <CustomFieldInputGrid :fields="customFieldInputs" :disabled="!canEdit || submitting" />
         </div>
 
         <div class="space-y-4 rounded-lg border border-base-200 bg-base-200/40 p-4">
@@ -396,7 +325,7 @@ const route = useRoute()
 const router = useRouter()
 const { get } = useApi()
 
-const { componentTypes, loadComponentTypes, loadingComponentTypes } = useComponentTypes()
+const { componentTypes, loadComponentTypes, loadingComponentTypes: loadingTypes } = useComponentTypes()
 const { pieceTypes, loadPieceTypes } = usePieceTypes()
 const { productTypes, loadProductTypes } = useProductTypes()
 const {
@@ -487,7 +416,6 @@ watch(selectedTypeId, (id) => {
   router.replace({ path: route.path, query: nextQuery }).catch(() => {})
 })
 
-const loadingTypes = computed(() => loadingComponentTypes.value)
 const componentTypeList = computed<ComponentCatalogType[]>(() =>
   (componentTypes.value || [])
     .filter((item: any) => item?.category === 'COMPONENT') as ComponentCatalogType[],
@@ -1026,8 +954,6 @@ interface CustomFieldInput {
   orderIndex: number
 }
 
-const fieldKey = (field: CustomFieldInput, index: number) =>
-  field.customFieldValueId || field.id || `${field.name}-${index}`
 
 const normalizeCustomFieldInputs = (structure: ComponentModelStructure | null): CustomFieldInput[] => {
   if (!structure || typeof structure !== 'object') {