@goplusvn/core 0.1.8 → 0.1.9

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@goplusvn/core",
   "description": "GoPlusVN Platform Kit - ERP kernel: layout, RBAC, CRUD, multi-tenant, system pages",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "private": false,
   "publishConfig": {
     "registry": "https://registry.npmjs.org",

package/src/crud/components/crud-table.tsx

@@ -23,6 +23,40 @@ import {
 } from "../../ui/primitives/client";
 import { DataTable } from "../../ui/data-display/data-table/data-table";
 
+/**
+ * Resolve a relation FK column's label from the relation object the server already
+ * included on the row (e.g. `branchId` → `row.branch.name`).
+ *
+ * Relation columns are configured as a `select` field whose `dataSource` points at
+ * `/api/<relation>`; the client resolves the id → label by fetching that endpoint
+ * asynchronously. That secondary fetch is the only label source, so the column shows
+ * the raw FK id whenever it hasn't resolved yet (first paint), fails, is slow, or is
+ * capped by pagination (the endpoint's default page size). A per-config `renderCell`
+ * that reads `row.branch?.name` can't help — render functions are stripped when the
+ * config is serialized for Client Components.
+ *
+ * When the entity `include`s the relation, the row already carries the related record,
+ * so we can render its label directly with no secondary fetch and no race. The relation
+ * key is inferred from the field name (`branchId` → `branch`) and the label field from
+ * the `dataSource` (default `name`).
+ */
+function resolveIncludedRelationLabel(
+  field: { name?: string; dataSource?: { labelField?: string } },
+  row: Record<string, unknown> | undefined,
+): string | undefined {
+  const name = field?.name;
+  if (!field?.dataSource || !row || !name || !name.endsWith("Id")) {
+    return undefined;
+  }
+  const relationKey = name.slice(0, -2);
+  if (!relationKey) return undefined;
+  const rel = row[relationKey];
+  if (!rel || typeof rel !== "object" || Array.isArray(rel)) return undefined;
+  const labelField = field.dataSource.labelField || "name";
+  const label = (rel as Record<string, unknown>)[labelField];
+  return label != null && label !== "" ? String(label) : undefined;
+}
+
 interface CrudTableProps<TData = Record<string, unknown>> {
   data: CrudResponse<TData>;
   loading?: boolean;
@@ -196,7 +230,8 @@ export function CrudTable<TData extends Record<string, unknown>>({
                 );
                 content = option
                   ? option.label
-                  : formatFieldValue(value, field);
+                  : (resolveIncludedRelationLabel(field, row.original) ??
+                    formatFieldValue(value, field));
               }
             } else {
               content = formatFieldValue(value, field);