@carlonicora/nextjs-jsonapi 1.7.6 → 1.8.0

package/scripts/generate-web-module/templates/components/editor.template.ts

@@ -8,7 +8,7 @@ import { FrontendTemplateData, FrontendField, FrontendRelationship } from "../..
 import { toCamelCase, pluralize, toPascalCase } from "../../transformers/name-transformer";
 import { AUTHOR_VARIANT } from "../../types/field-mapping.types";
 import { getFormFieldJsx } from "../../transformers/field-mapper";
-import { getRelationshipFormJsx, getDefaultValueExpression, getPayloadMapping, isFoundationImport, FOUNDATION_PACKAGE } from "../../transformers/relationship-resolver";
+import { getRelationshipFormJsx, getDefaultValueExpression, getPayloadMapping, isFoundationImport, FOUNDATION_COMPONENTS_PACKAGE } from "../../transformers/relationship-resolver";
 
 /**
  * Generate the editor component file content
@@ -156,7 +156,7 @@ function generateImports(data: FrontendTemplateData): string {
       const componentName = rel.single ? `${rel.name}Selector` : `${rel.name}MultiSelector`;
       if (rel.isFoundation) {
         // Foundation entities use named imports from the package
-        imports.push(`import { ${componentName} } from "${FOUNDATION_PACKAGE}";`);
+        imports.push(`import { ${componentName} } from "${FOUNDATION_COMPONENTS_PACKAGE}";`);
       } else {
         imports.push(`import ${componentName} from "${rel.importPath}";`);
       }
@@ -188,6 +188,21 @@ function generateImports(data: FrontendTemplateData): string {
     componentImports.push("FormInput");
   }
 
+  // Check if any relationship has boolean or date fields that need specific form components
+  const hasRelBooleanFields = relationships.some((rel) =>
+    rel.fields?.some((f) => f.type === "boolean")
+  );
+  const hasRelDateFields = relationships.some((rel) =>
+    rel.fields?.some((f) => f.type === "date" || f.type === "datetime")
+  );
+
+  if (hasRelBooleanFields) {
+    componentImports.push("FormCheckbox");
+  }
+  if (hasRelDateFields) {
+    componentImports.push("FormDatePicker");
+  }
+
   imports.push(`import {
   ${componentImports.join(",\n  ")},
 } from "@carlonicora/nextjs-jsonapi/components";`);
@@ -288,9 +303,34 @@ function generateFormSchema(data: FrontendTemplateData): string {
         schemaFields.push(`    ${fieldId}: entityObjectSchema.optional(),`);
       } else {
         schemaFields.push(`    ${fieldId}: entityObjectSchema.refine((data) => data.id && data.id.length > 0, {
-      message: t(\`generic.relationships.${fieldId}.error\`),
+      message: t(\`features.${names.camelCase}.relationships.${fieldId}.error\`),
     }),`);
       }
+      // Add relationship property fields to schema
+      if (rel.fields && rel.fields.length > 0) {
+        rel.fields.forEach((field) => {
+          const optional = rel.nullable ? ".optional()" : "";
+          switch (field.type) {
+            case "number":
+              schemaFields.push(`    ${field.name}: z.number()${optional},`);
+              break;
+            case "boolean":
+              schemaFields.push(`    ${field.name}: z.boolean()${optional},`);
+              break;
+            case "date":
+            case "datetime":
+              schemaFields.push(`    ${field.name}: z.coerce.date()${optional},`);
+              break;
+            case "any":
+              schemaFields.push(`    ${field.name}: z.any()${optional},`);
+              break;
+            case "string":
+            default:
+              schemaFields.push(`    ${field.name}: z.string()${optional},`);
+              break;
+          }
+        });
+      }
     } else {
       schemaFields.push(`    ${fieldId}: z.array(entityObjectSchema).optional(),`);
     }
@@ -349,6 +389,28 @@ function generateDefaultValues(data: FrontendTemplateData): string {
       defaults.push(`    ${fieldId}: ${names.camelCase}?.${propertyName}
       ? { id: ${names.camelCase}.${propertyName}.id, name: ${names.camelCase}.${propertyName}.name }
       : undefined,`);
+      // Add relationship property field defaults
+      if (rel.fields && rel.fields.length > 0) {
+        rel.fields.forEach((field) => {
+          switch (field.type) {
+            case "number":
+              defaults.push(`    ${field.name}: ${names.camelCase}?.${propertyName}?.${field.name} ?? 0,`);
+              break;
+            case "boolean":
+              defaults.push(`    ${field.name}: ${names.camelCase}?.${propertyName}?.${field.name} ?? false,`);
+              break;
+            case "date":
+            case "datetime":
+            case "any":
+              defaults.push(`    ${field.name}: ${names.camelCase}?.${propertyName}?.${field.name},`);
+              break;
+            case "string":
+            default:
+              defaults.push(`    ${field.name}: ${names.camelCase}?.${propertyName}?.${field.name} ?? "",`);
+              break;
+          }
+        });
+      }
     } else {
       defaults.push(`    ${fieldId}: ${names.camelCase}?.${pluralPropertyName}
       ? ${names.camelCase}.${pluralPropertyName}.map((item) => ({ id: item.id, name: item.name }))
@@ -394,6 +456,12 @@ function generateOnSubmit(data: FrontendTemplateData): string {
 
     if (rel.single) {
       payloadFields.push(`      ${payloadKey}: values.${fieldId}?.id,`);
+      // Add relationship property fields to payload
+      if (rel.fields && rel.fields.length > 0) {
+        rel.fields.forEach((field) => {
+          payloadFields.push(`      ${field.name}: values.${field.name},`);
+        });
+      }
     } else {
       payloadFields.push(`      ${payloadKey}: values.${fieldId} ? values.${fieldId}.map((item) => item.id) : [],`);
     }
@@ -484,9 +552,51 @@ function generateFormFields(data: FrontendTemplateData): string {
       formElements.push(`              <${rel.name}Selector
                 id="${fieldId}"
                 form={form}
-                label={t(\`generic.relationships.${fieldId}.label\`)}
-                placeholder={t(\`generic.relationships.${fieldId}.placeholder\`)}${!rel.nullable ? "\n                isRequired" : ""}
+                label={t(\`features.${names.camelCase}.relationships.${fieldId}.label\`)}
+                placeholder={t(\`features.${names.camelCase}.relationships.${fieldId}.placeholder\`)}${!rel.nullable ? "\n                isRequired" : ""}
+              />`);
+      // Add form inputs for relationship property fields
+      if (rel.fields && rel.fields.length > 0) {
+        rel.fields.forEach((field) => {
+          const isRequired = !rel.nullable;
+          switch (field.type) {
+            case "number":
+              formElements.push(`              <FormInput
+                form={form}
+                id="${field.name}"
+                name={t(\`features.${names.camelCase}.relationships.${fieldId}.fields.${field.name}.label\`)}
+                placeholder={t(\`features.${names.camelCase}.relationships.${fieldId}.fields.${field.name}.placeholder\`)}
+                type="number"${isRequired ? "\n                isRequired" : ""}
+              />`);
+              break;
+            case "boolean":
+              formElements.push(`              <FormCheckbox
+                form={form}
+                id="${field.name}"
+                name={t(\`features.${names.camelCase}.relationships.${fieldId}.fields.${field.name}.label\`)}
               />`);
+              break;
+            case "date":
+            case "datetime":
+              formElements.push(`              <FormDatePicker
+                form={form}
+                id="${field.name}"
+                name={t(\`features.${names.camelCase}.relationships.${fieldId}.fields.${field.name}.label\`)}${isRequired ? "\n                isRequired" : ""}
+              />`);
+              break;
+            case "string":
+            case "any":
+            default:
+              formElements.push(`              <FormInput
+                form={form}
+                id="${field.name}"
+                name={t(\`features.${names.camelCase}.relationships.${fieldId}.fields.${field.name}.label\`)}
+                placeholder={t(\`features.${names.camelCase}.relationships.${fieldId}.fields.${field.name}.placeholder\`)}${isRequired ? "\n                isRequired" : ""}
+              />`);
+              break;
+          }
+        });
+      }
     } else {
       formElements.push(`              <${rel.name}MultiSelector
                 id="${fieldId}"

package/scripts/generate-web-module/templates/data/interface.template.ts

@@ -74,13 +74,21 @@ function generateInputType(data: FrontendTemplateData): string {
     fieldLines.push(`  ${field.name}${optional}: ${field.tsType};`);
   });
 
-  // Add relationship IDs
+  // Add relationship IDs and relationship property fields
   relationships.forEach((rel) => {
     const effectiveName = rel.variant || rel.name;
     if (rel.single) {
       const key = `${toCamelCase(effectiveName)}Id`;
       const optional = rel.nullable ? "?" : "";
       fieldLines.push(`  ${key}${optional}: string;`);
+
+      // Add relationship property fields to input type (match relationship optionality)
+      if (rel.fields && rel.fields.length > 0) {
+        rel.fields.forEach((field) => {
+          const fieldOptional = rel.nullable ? "?" : "";
+          fieldLines.push(`  ${field.name}${fieldOptional}: ${field.tsType};`);
+        });
+      }
     } else {
       const key = `${toCamelCase(rel.name)}Ids`;
       fieldLines.push(`  ${key}?: string[];`);
@@ -120,7 +128,15 @@ function generateInterface(data: FrontendTemplateData): string {
     const effectiveName = rel.variant || rel.name;
     if (rel.single) {
       const propertyName = toCamelCase(effectiveName);
-      const type = rel.nullable ? `${rel.interfaceName} | undefined` : rel.interfaceName;
+
+      // Build return type - use intersection if relationship has fields
+      let baseType = rel.interfaceName;
+      if (rel.fields && rel.fields.length > 0) {
+        const metaFields = rel.fields.map(f => `${f.name}?: ${f.tsType}`).join("; ");
+        baseType = `${rel.interfaceName} & { ${metaFields} }`;
+      }
+
+      const type = rel.nullable ? `(${baseType}) | undefined` : baseType;
       getterLines.push(`  get ${propertyName}(): ${type};`);
     } else {
       const propertyName = pluralize(toCamelCase(rel.name));

package/scripts/generate-web-module/templates/data/model.template.ts

@@ -91,7 +91,13 @@ function generatePrivateFields(data: FrontendTemplateData): string {
       const effectiveName = rel.variant || rel.name;
       if (rel.single) {
         const propName = toCamelCase(effectiveName);
-        lines.push(`  private _${propName}?: ${rel.interfaceName};`);
+        // Use intersection type if relationship has fields
+        let typeDecl = rel.interfaceName;
+        if (rel.fields && rel.fields.length > 0) {
+          const metaFields = rel.fields.map((f) => `${f.name}?: ${f.tsType}`).join("; ");
+          typeDecl = `${rel.interfaceName} & { ${metaFields} }`;
+        }
+        lines.push(`  private _${propName}?: ${typeDecl};`);
       } else {
         const propName = pluralize(toCamelCase(rel.name));
         lines.push(`  private _${propName}?: ${rel.interfaceName}[];`);
@@ -127,12 +133,20 @@ function generateGetters(data: FrontendTemplateData): string {
       const effectiveName = rel.variant || rel.name;
       if (rel.single) {
         const propName = toCamelCase(effectiveName);
+
+        // Build return type - use intersection if relationship has fields
+        let baseType = rel.interfaceName;
+        if (rel.fields && rel.fields.length > 0) {
+          const metaFields = rel.fields.map((f) => `${f.name}?: ${f.tsType}`).join("; ");
+          baseType = `${rel.interfaceName} & { ${metaFields} }`;
+        }
+
         if (rel.nullable) {
-          lines.push(`  get ${propName}(): ${rel.interfaceName} | undefined {
+          lines.push(`  get ${propName}(): (${baseType}) | undefined {
     return this._${propName};
   }`);
         } else {
-          lines.push(`  get ${propName}(): ${rel.interfaceName} {
+          lines.push(`  get ${propName}(): ${baseType} {
     if (this._${propName} === undefined) throw new Error("JsonApi error: ${data.names.camelCase} ${propName} is missing");
     return this._${propName};
   }`);
@@ -188,9 +202,18 @@ function generateRehydrateMethod(data: FrontendTemplateData): string {
       if (rel.single) {
         const propName = toCamelCase(effectiveName);
         const relationshipKey = effectiveName.toLowerCase();
-        lines.push(
-          `    this._${propName} = this._readIncluded(data, "${relationshipKey}", Modules.${rel.name}) as ${rel.interfaceName}${rel.nullable ? " | undefined" : ""};`,
-        );
+
+        // Use _readIncludedWithMeta for relationships with fields
+        if (rel.fields && rel.fields.length > 0) {
+          const metaType = `{ ${rel.fields.map((f) => `${f.name}?: ${f.tsType}`).join("; ")} }`;
+          lines.push(
+            `    this._${propName} = this._readIncludedWithMeta<${rel.interfaceName}, ${metaType}>(data, "${relationshipKey}", Modules.${rel.name});`,
+          );
+        } else {
+          lines.push(
+            `    this._${propName} = this._readIncluded(data, "${relationshipKey}", Modules.${rel.name}) as ${rel.interfaceName}${rel.nullable ? " | undefined" : ""};`,
+          );
+        }
       } else {
         const propName = pluralize(toCamelCase(rel.name));
         const relationshipKey = pluralize(rel.name.toLowerCase());
@@ -268,6 +291,17 @@ function generateCreateJsonApiMethod(data: FrontendTemplateData): string {
         lines.push(`          type: Modules.${rel.name}.name,`);
         lines.push(`          id: data.${payloadKey},`);
         lines.push(`        },`);
+
+        // Add meta for relationship fields
+        if (rel.fields && rel.fields.length > 0) {
+          lines.push(`        meta: {`);
+          rel.fields.forEach((field, i) => {
+            const comma = i < rel.fields!.length - 1 ? "," : "";
+            lines.push(`          ${field.name}: data.${field.name}${comma}`);
+          });
+          lines.push(`        },`);
+        }
+
         lines.push(`      };`);
         lines.push(`    }`);
       } else {

package/scripts/generate-web-module/transformers/i18n-generator.ts

@@ -43,6 +43,18 @@ export function generateI18nKeys(
       error: `${toTitleCase(effectiveName)} is required`,
       list: pluralize(toTitleCase(rel.name)),
     };
+
+    // Add fields for relationship edge properties
+    if (rel.fields && rel.fields.length > 0) {
+      relationshipKeys[effectiveKey].fields = {};
+      rel.fields.forEach((field) => {
+        relationshipKeys[effectiveKey].fields![field.name] = {
+          label: toTitleCase(field.name),
+          placeholder: `Enter ${toTitleCase(field.name).toLowerCase()}`,
+          error: `${toTitleCase(field.name)} is required`,
+        };
+      });
+    }
   });
 
   // Generate type keys
@@ -68,6 +80,9 @@ export function generateI18nKeys(
  * @returns Object structure for en.json
  */
 export function buildI18nMessages(i18nKeys: I18nKeySet): Record<string, any> {
+  // Use proper pluralization and lowercase for types key
+  const pluralLowercaseKey = pluralize(i18nKeys.moduleName).toLowerCase();
+
   return {
     features: {
       [i18nKeys.moduleName]: {
@@ -76,7 +91,7 @@ export function buildI18nMessages(i18nKeys: I18nKeySet): Record<string, any> {
       },
     },
     types: {
-      [i18nKeys.moduleName + "s"]: i18nKeys.type.icuPlural,
+      [pluralLowercaseKey]: i18nKeys.type.icuPlural,
     },
   };
 }

package/scripts/generate-web-module/transformers/relationship-resolver.ts

@@ -6,14 +6,18 @@
  */
 
 import { JsonRelationshipDefinition } from "../types/json-schema.interface";
-import { FrontendRelationship, RelationshipServiceMethod } from "../types/template-data.interface";
+import { FrontendRelationship, FrontendField, RelationshipServiceMethod } from "../types/template-data.interface";
 import { AUTHOR_VARIANT, AUTHOR_ZOD_SCHEMA, ENTITY_ZOD_SCHEMA } from "../types/field-mapping.types";
 import { toCamelCase, toKebabCase, pluralize, toPascalCase } from "./name-transformer";
+import { mapFields } from "./field-mapper";
 
 /**
- * Foundation package name constant for web imports
+ * Foundation package constants for web imports
+ * Components (selectors) come from /components
+ * Data (interfaces, services) come from /core
  */
-export const FOUNDATION_PACKAGE = "@carlonicora/nextjs-jsonapi/features";
+export const FOUNDATION_COMPONENTS_PACKAGE = "@carlonicora/nextjs-jsonapi/components";
+export const FOUNDATION_CORE_PACKAGE = "@carlonicora/nextjs-jsonapi/core";
 
 /**
  * Check if a directory represents a foundation import (from the package)
@@ -78,9 +82,9 @@ export function resolveRelationship(rel: JsonRelationshipDefinition): FrontendRe
 
   if (isFoundationImport(rel.directory)) {
     // Foundation entities import from the package
-    importPath = FOUNDATION_PACKAGE;
-    interfaceImportPath = FOUNDATION_PACKAGE;
-    serviceImportPath = FOUNDATION_PACKAGE;
+    importPath = FOUNDATION_COMPONENTS_PACKAGE;        // Selectors from /components
+    interfaceImportPath = FOUNDATION_CORE_PACKAGE;     // Interfaces from /core
+    serviceImportPath = FOUNDATION_CORE_PACKAGE;       // Services from /core
   } else {
     // Feature entities use local paths
     const webDirectory = mapDirectoryToWebPath(rel.directory);
@@ -89,6 +93,12 @@ export function resolveRelationship(rel: JsonRelationshipDefinition): FrontendRe
     serviceImportPath = `@/features/${webDirectory}/${modelKebab}/data/${rel.name}Service`;
   }
 
+  // Map relationship fields (only for single relationships)
+  let fields: FrontendField[] | undefined;
+  if (rel.single && rel.fields && rel.fields.length > 0) {
+    fields = mapFields(rel.fields, toCamelCase(rel.name));
+  }
+
   return {
     name: rel.name,
     variant: rel.variant,
@@ -106,6 +116,7 @@ export function resolveRelationship(rel: JsonRelationshipDefinition): FrontendRe
     serviceImportPath,
     interfaceName: `${rel.name}Interface`,
     modelKebab,
+    fields,
   };
 }
 
@@ -161,7 +172,7 @@ export function getSelectorImports(relationships: FrontendRelationship[]): strin
   relationships.forEach((rel) => {
     if (isFoundationImport(rel.directory)) {
       // Foundation entities use named imports from the package
-      imports.add(`import { ${rel.selectorComponent} } from "${FOUNDATION_PACKAGE}";`);
+      imports.add(`import { ${rel.selectorComponent} } from "${FOUNDATION_COMPONENTS_PACKAGE}";`);
     } else {
       imports.add(`import ${rel.selectorComponent} from "${rel.importPath}";`);
     }

package/scripts/generate-web-module/types/json-schema.interface.ts

@@ -26,6 +26,7 @@ export interface JsonRelationshipDefinition {
   relationshipName: string; // Backend-specific, ignored in frontend
   toNode: boolean; // Backend-specific, ignored in frontend
   nullable: boolean;
+  fields?: JsonFieldDefinition[]; // Relationship property fields (stored on edges)
 }
 
 /**

package/scripts/generate-web-module/types/template-data.interface.ts

@@ -58,6 +58,7 @@ export interface FrontendRelationship {
   serviceImportPath: string; // Full import path for service
   interfaceName: string; // e.g., "UserInterface"
   modelKebab: string; // e.g., "user"
+  fields?: FrontendField[]; // Relationship property fields (stored on edges)
 }
 
 /**
@@ -80,6 +81,14 @@ export interface I18nKeySet {
       placeholder: string;
       error: string;
       list: string;
+      fields?: Record<
+        string,
+        {
+          label: string;
+          placeholder: string;
+          error: string;
+        }
+      >;
     }
   >;
   type: {

package/scripts/generate-web-module/utils/i18n-updater.ts

@@ -75,8 +75,9 @@ export function updateI18n(
     messages.types = {};
   }
   const typesKey = Object.keys(moduleMessages.types)[0];
-  if (typesKey && !messages.types[names.pluralCamel]) {
-    messages.types[names.pluralCamel] = moduleMessages.types[typesKey];
+  const lowercasePluralKey = names.pluralCamel.toLowerCase();
+  if (typesKey && !messages.types[lowercasePluralKey]) {
+    messages.types[lowercasePluralKey] = moduleMessages.types[typesKey];
   }
 
   if (dryRun) {

package/src/core/abstracts/AbstractApiData.ts

@@ -115,6 +115,40 @@ export abstract class AbstractApiData implements ApiDataInterface {
     }) as T;
   }
 
+  /**
+   * Read included relationship data and augment with relationship meta properties.
+   * Used for single relationships (one-to-one) that have edge properties.
+   *
+   * @param data - Hydrated JSON:API data
+   * @param type - Relationship type key (e.g., "guide")
+   * @param dataType - Module reference for rehydration
+   * @returns Related object augmented with meta properties, or undefined
+   */
+  protected _readIncludedWithMeta<T extends ApiDataInterface, M extends Record<string, any>>(
+    data: JsonApiHydratedDataInterface,
+    type: string,
+    dataType: ApiRequestDataTypeInterface,
+  ): (T & M) | undefined {
+    // Get the base related object using existing logic
+    const related = this._readIncluded<T>(data, type, dataType);
+
+    // Only works for single relationships (not arrays)
+    if (!related || Array.isArray(related)) {
+      return undefined;
+    }
+
+    // Extract relationship meta from JSON:API data
+    const relationshipMeta = data.jsonApi.relationships?.[type]?.meta;
+
+    // If no meta, return the related object as-is
+    if (!relationshipMeta) {
+      return related as T & M;
+    }
+
+    // Augment the object with meta properties
+    return Object.assign(related, relationshipMeta) as T & M;
+  }
+
   dehydrate(): JsonApiHydratedDataInterface {
     return {
       jsonApi: this._jsonApi,