nuxt-openapi-hyperfetch 0.1.7-alpha.1 → 0.2.7-alpha.1

package/src/generators/shared/runtime/useListConnector.ts

@@ -0,0 +1,148 @@
+// @ts-nocheck - This file runs in user's Nuxt project with different TypeScript config
+/**
+ * useListConnector — Runtime connector for list/table endpoints.
+ *
+ * Wraps a useAsyncData composable that returns an array and exposes:
+ * - rows, columns, loading, error state
+ * - pagination helpers (if paginated: true)
+ * - row selection
+ * - modal coordination helpers (openCreate, openUpdate, openDelete)
+ *
+ * Copied to the user's project alongside the generated connectors.
+ */
+import { ref, computed, shallowRef } from 'vue';
+
+/**
+ * @param composableFn  The generated useAsyncData composable, e.g. useAsyncDataGetPets
+ * @param options       Configuration for the list connector
+ */
+export function useListConnector(composableFn, options = {}) {
+  const { paginated = false, columns = [] } = options;
+
+  // ── Execute the underlying composable ──────────────────────────────────────
+  const composable = composableFn({ paginated });
+
+  // ── Derived state ──────────────────────────────────────────────────────────
+
+  const rows = computed(() => {
+    const data = composable.data?.value;
+    if (!data) return [];
+    // Support both direct arrays and { data: [...] } shapes
+    if (Array.isArray(data)) return data;
+    if (Array.isArray(data.data)) return data.data;
+    return [];
+  });
+
+  const loading = computed(() => composable.pending?.value ?? false);
+  const error = computed(() => composable.error?.value ?? null);
+
+  // Pagination — passthrough from the underlying composable when paginated: true
+  const pagination = computed(() => composable.pagination?.value ?? null);
+
+  function goToPage(page) {
+    composable.goToPage?.(page);
+  }
+
+  function nextPage() {
+    composable.nextPage?.();
+  }
+
+  function prevPage() {
+    composable.prevPage?.();
+  }
+
+  function setPerPage(n) {
+    composable.setPerPage?.(n);
+  }
+
+  // ── Row selection ──────────────────────────────────────────────────────────
+
+  const selected = ref([]);
+
+  function onRowSelect(row) {
+    const idx = selected.value.indexOf(row);
+    if (idx === -1) {
+      selected.value = [...selected.value, row];
+    } else {
+      selected.value = selected.value.filter((r) => r !== row);
+    }
+  }
+
+  function clearSelection() {
+    selected.value = [];
+  }
+
+  // ── Refresh ────────────────────────────────────────────────────────────────
+
+  function refresh() {
+    void composable.refresh?.();
+  }
+
+  // ── CRUD coordination (triggers watched by the parent component) ──────────
+  // The parent watches these refs to decide when to open a modal/panel/route.
+  // Naming convention:
+  //   _createTrigger — Ref<number> counter; no data needed (form starts empty)
+  //   _updateTarget  — ShallowRef<Row|null>; the row to pre-fill the edit form
+  //   _deleteTarget  — ShallowRef<Row|null>; the row to confirm deletion for
+
+  const _createTrigger = ref(0);
+  const _updateTarget = shallowRef(null);
+  const _deleteTarget = shallowRef(null);
+
+  /**
+   * Signal the parent that the user wants to create a new item.
+   * The parent should watch `_createTrigger` and open a create form/modal.
+   */
+  function create() {
+    _createTrigger.value++;
+  }
+
+  /**
+   * Signal the parent that the user wants to edit `row`.
+   * The parent should watch `_updateTarget` and open an edit form/modal.
+   */
+  function update(row) {
+    _updateTarget.value = row;
+  }
+
+  /**
+   * Signal the parent that the user wants to delete `row`.
+   * The parent should watch `_deleteTarget` and open a confirmation modal.
+   */
+  function remove(row) {
+    _deleteTarget.value = row;
+  }
+
+  return {
+    // State
+    rows,
+    columns: computed(() => columns),
+    loading,
+    error,
+
+    // Pagination
+    pagination,
+    goToPage,
+    nextPage,
+    prevPage,
+    setPerPage,
+
+    // Selection
+    selected,
+    onRowSelect,
+    clearSelection,
+
+    // Actions
+    refresh,
+
+    // CRUD coordination — public methods
+    create,
+    update,
+    remove,
+
+    // CRUD coordination — internal triggers (watch these in the parent)
+    _createTrigger,
+    _updateTarget,
+    _deleteTarget,
+  };
+}

package/src/generators/shared/runtime/zod-error-merger.ts

@@ -0,0 +1,119 @@
+// @ts-nocheck - This file runs in user's Nuxt project with different TypeScript config
+/**
+ * zod-error-merger — Merge Zod fieldErrors with per-field error message overrides.
+ *
+ * Priority (highest → lowest):
+ *   3. config.fields[fieldName].errors[zodCode]   — per-field, per-code override
+ *   2. z.setErrorMap()                            — global translation (set by the developer)
+ *   1. Zod defaults                               — built-in English messages
+ *
+ * This function handles priority 3 only. Priority 2 is handled automatically by Zod
+ * when the developer sets z.setErrorMap() in their plugins/zod-i18n.ts.
+ *
+ * Copied to the user's project alongside the generated connectors.
+ */
+
+/**
+ * Map Zod issue codes to friendlier config key names.
+ * The developer uses these keys in config.fields[name].errors:
+ *
+ *   errors: {
+ *     required: 'Name is required',
+ *     min:      'At least 1 character',
+ *     max:      'Max 100 characters',
+ *     email:    'Invalid email',
+ *     enum:     'Select a valid option',
+ *   }
+ */
+const ZOD_CODE_TO_CONFIG_KEY = {
+  too_small: 'min',
+  too_big: 'max',
+  invalid_type: 'required', // most common: field is undefined/null
+  invalid_enum_value: 'enum',
+  invalid_string: 'format',
+};
+
+/**
+ * Convert Zod's flatten().fieldErrors to Record<string, string>,
+ * merging optional per-field message overrides from the component config.
+ *
+ * @param fieldErrors  Output of zodResult.error.flatten().fieldErrors
+ *                     Shape: { fieldName: string[] }
+ * @param errorConfig  Optional per-field error config from index.ts
+ *                     Shape: { fieldName: { required?: string, min?: string, ... } }
+ */
+export function mergeZodErrors(fieldErrors, errorConfig = {}) {
+  const result = {};
+
+  for (const [field, messages] of Object.entries(fieldErrors)) {
+    if (!messages || messages.length === 0) {
+      continue;
+    }
+
+    // The first message is the most relevant one
+    const defaultMessage = messages[0];
+
+    // Check if there's a config override for this field
+    const fieldConfig = errorConfig[field];
+    if (!fieldConfig) {
+      result[field] = defaultMessage;
+      continue;
+    }
+
+    // Try to map the Zod message to a config key.
+    // We check for simple substrings in the Zod message to identify the code.
+    const configMessage = resolveConfigMessage(defaultMessage, fieldConfig);
+    result[field] = configMessage ?? defaultMessage;
+  }
+
+  return result;
+}
+
+/**
+ * Try to find a matching override in fieldConfig based on the Zod message content.
+ * Returns the override string, or null if no match found.
+ */
+function resolveConfigMessage(zodMessage, fieldConfig) {
+  if (!fieldConfig || typeof fieldConfig !== 'object') {
+    return null;
+  }
+
+  // Direct key match: developer can use zod code names directly
+  // e.g. errors.too_small, errors.invalid_type
+  for (const [zodCode, configKey] of Object.entries(ZOD_CODE_TO_CONFIG_KEY)) {
+    if (fieldConfig[zodCode]) {
+      // Check if Zod message suggests this error type
+      if (messageMatchesCode(zodMessage, zodCode)) {
+        return fieldConfig[zodCode];
+      }
+    }
+    // Also support friendly key names: errors.min, errors.required, etc.
+    if (fieldConfig[configKey]) {
+      if (messageMatchesCode(zodMessage, zodCode)) {
+        return fieldConfig[configKey];
+      }
+    }
+  }
+
+  // Fallback: if developer set errors.required and Zod says "Required"
+  if (fieldConfig.required && /required|undefined|null/i.test(zodMessage)) {
+    return fieldConfig.required;
+  }
+
+  return null;
+}
+
+/**
+ * Heuristic: does the Zod default message suggest a certain error code?
+ */
+function messageMatchesCode(message, zodCode) {
+  const patterns = {
+    too_small: /at least|minimum|must contain at least|min/i,
+    too_big: /at most|maximum|must contain at most|max/i,
+    invalid_type: /required|expected|received undefined|null/i,
+    invalid_enum_value: /invalid enum|expected one of/i,
+    invalid_string: /invalid|email|url|uuid|datetime/i,
+  };
+
+  return patterns[zodCode]?.test(message) ?? false;
+}