pixelon 0.3.81 → 0.3.82

package/dist/components/molecules/chat/StructuredContent/components/ReactiveCrud/optionsLoader.d.ts

@@ -1,6 +1,7 @@
 import type { SelectOption } from '../../../../../organisms/lumi/DynamicForm/types';
 import type { ChatEventBus } from '../../../../../../core/eventBus/chatEventBus';
 import type { CrudFieldOptionsEndpoint } from './types';
+export declare const OPTIONS_LOAD_ERROR = "No se pudieron cargar las opciones. Int\u00E9ntalo de nuevo.";
 export declare function unwrap(raw: unknown): unknown;
 export declare function resolveBody(body: Record<string, unknown> | undefined, ctx?: Record<string, unknown>): Record<string, unknown>;
 export declare function loadOptions(eventBus: ChatEventBus, ep: CrudFieldOptionsEndpoint, ctx?: Record<string, unknown>): Promise<SelectOption[]>;

package/dist/index.esm.js

@@ -14111,6 +14111,7 @@ function getFormatter(key) {
   return key ? CRUD_FORMATTERS[key] : void 0;
 }
 
+const OPTIONS_LOAD_ERROR = "No se pudieron cargar las opciones. Int\xE9ntalo de nuevo.";
 function unwrap$3(raw) {
   if (raw && typeof raw === "object" && "response" in raw) {
     return raw.response;
@@ -14448,6 +14449,7 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
   const fileFields = useMemo(() => formFields.filter((f) => f.moleculeType === "FILE"), [formFields]);
   const normalFields = useMemo(() => formFields.filter((f) => f.moleculeType !== "FILE"), [formFields]);
   const [optionsByField, setOptionsByField] = useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = useState({});
   const [loadingOptions, setLoadingOptions] = useState(false);
   const [submitting, setSubmitting] = useState(false);
   const [fileEntries, setFileEntries] = useState({});
@@ -14461,14 +14463,17 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       toLoad.map(async (f) => {
         try {
           const opts = await loadOptions(eventBus, f.optionsEndpoint, { ...row, id: row[idField] });
-          return [f.name, opts];
+          return [f.name, opts, null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
       if (!alive) return;
-      setOptionsByField(Object.fromEntries(entries));
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
       setLoadingOptions(false);
     });
     return () => {
@@ -14482,9 +14487,12 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       moleculeType: CRUD_TO_FORM_MOLECULE[f.moleculeType] ?? "INPUT",
       required: f.required,
       placeholder: f.placeholder,
-      options: f.options ?? optionsByField[f.name]
+      options: f.options ?? optionsByField[f.name],
+      // SPEC-106 T8 — `uiProps` llega tal cual a la molécula, así que el desplegable dice lo
+      // que pasó de verdad en vez del «no hay» de siempre. Sin error, se queda el de siempre.
+      ...optionsErrorByField[f.name] ? { uiProps: { notFoundContent: optionsErrorByField[f.name] } } : {}
     })),
-    [normalFields, optionsByField]
+    [normalFields, optionsByField, optionsErrorByField]
   );
   const validationSchema = useMemo(() => buildCrudYupSchema(normalFields), [normalFields]);
   const uploadOne = async (f, file, idx) => {
@@ -15919,7 +15927,7 @@ function chatLinkFormatter(field, eventBus) {
     return createElement(ChatLinkCell, { targets, eventBus });
   };
 }
-function toRenderField(f, loaded, eventBus, mapsApiKey) {
+function toRenderField(f, loaded, eventBus, mapsApiKey, loadError) {
   const fmt = getFormatter(f.format);
   const options = f.options ?? loaded[f.name];
   if (f.moleculeType === "LOCATION") {
@@ -15964,7 +15972,9 @@ function toRenderField(f, loaded, eventBus, mapsApiKey) {
     columnWidth: f.columnWidth,
     fixed: f.fixed,
     align: f.align,
-    uiProps: options ? { options } : void 0,
+    // SPEC-106 T8 — con un fallo de carga, el desplegable dice que no se pudo preguntar en vez
+    // de «no hay opciones disponibles», que es una respuesta y no la tenemos.
+    uiProps: loadError ? { options: options ?? [], notFoundContent: loadError } : options ? { options } : void 0,
     formatValue
   };
 }
@@ -16014,6 +16024,7 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
   const [activeAction, setActiveAction] = useState(null);
   const [detailRow, setDetailRow] = useState(null);
   const [optionsByField, setOptionsByField] = useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = useState({});
   useEffect(() => {
     let alive = true;
     const toLoad = config.fields.filter((f) => f.optionsEndpoint);
@@ -16021,21 +16032,25 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
     void Promise.all(
       toLoad.map(async (f) => {
         try {
-          return [f.name, await loadOptions(eventBus, f.optionsEndpoint)];
+          return [f.name, await loadOptions(eventBus, f.optionsEndpoint), null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
-      if (alive) setOptionsByField(Object.fromEntries(entries));
+      if (!alive) return;
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
     });
     return () => {
       alive = false;
     };
   }, [eventBus, config.fields]);
   const renderByFields = useMemo(
-    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey)),
-    [config.fields, optionsByField, eventBus]
+    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey, optionsErrorByField[f.name])),
+    [config.fields, optionsByField, optionsErrorByField, eventBus]
   );
   const validationSchema = useMemo(() => buildCrudYupSchema(config.fields), [config.fields]);
   const rowActions = useMemo(() => {

package/dist/index.js

@@ -14132,6 +14132,7 @@ function getFormatter(key) {
   return key ? CRUD_FORMATTERS[key] : void 0;
 }
 
+const OPTIONS_LOAD_ERROR = "No se pudieron cargar las opciones. Int\xE9ntalo de nuevo.";
 function unwrap$3(raw) {
   if (raw && typeof raw === "object" && "response" in raw) {
     return raw.response;
@@ -14469,6 +14470,7 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
   const fileFields = React.useMemo(() => formFields.filter((f) => f.moleculeType === "FILE"), [formFields]);
   const normalFields = React.useMemo(() => formFields.filter((f) => f.moleculeType !== "FILE"), [formFields]);
   const [optionsByField, setOptionsByField] = React.useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = React.useState({});
   const [loadingOptions, setLoadingOptions] = React.useState(false);
   const [submitting, setSubmitting] = React.useState(false);
   const [fileEntries, setFileEntries] = React.useState({});
@@ -14482,14 +14484,17 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       toLoad.map(async (f) => {
         try {
           const opts = await loadOptions(eventBus, f.optionsEndpoint, { ...row, id: row[idField] });
-          return [f.name, opts];
+          return [f.name, opts, null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
       if (!alive) return;
-      setOptionsByField(Object.fromEntries(entries));
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
       setLoadingOptions(false);
     });
     return () => {
@@ -14503,9 +14508,12 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       moleculeType: CRUD_TO_FORM_MOLECULE[f.moleculeType] ?? "INPUT",
       required: f.required,
       placeholder: f.placeholder,
-      options: f.options ?? optionsByField[f.name]
+      options: f.options ?? optionsByField[f.name],
+      // SPEC-106 T8 — `uiProps` llega tal cual a la molécula, así que el desplegable dice lo
+      // que pasó de verdad en vez del «no hay» de siempre. Sin error, se queda el de siempre.
+      ...optionsErrorByField[f.name] ? { uiProps: { notFoundContent: optionsErrorByField[f.name] } } : {}
     })),
-    [normalFields, optionsByField]
+    [normalFields, optionsByField, optionsErrorByField]
   );
   const validationSchema = React.useMemo(() => buildCrudYupSchema(normalFields), [normalFields]);
   const uploadOne = async (f, file, idx) => {
@@ -15940,7 +15948,7 @@ function chatLinkFormatter(field, eventBus) {
     return React.createElement(ChatLinkCell, { targets, eventBus });
   };
 }
-function toRenderField(f, loaded, eventBus, mapsApiKey) {
+function toRenderField(f, loaded, eventBus, mapsApiKey, loadError) {
   const fmt = getFormatter(f.format);
   const options = f.options ?? loaded[f.name];
   if (f.moleculeType === "LOCATION") {
@@ -15985,7 +15993,9 @@ function toRenderField(f, loaded, eventBus, mapsApiKey) {
     columnWidth: f.columnWidth,
     fixed: f.fixed,
     align: f.align,
-    uiProps: options ? { options } : void 0,
+    // SPEC-106 T8 — con un fallo de carga, el desplegable dice que no se pudo preguntar en vez
+    // de «no hay opciones disponibles», que es una respuesta y no la tenemos.
+    uiProps: loadError ? { options: options ?? [], notFoundContent: loadError } : options ? { options } : void 0,
     formatValue
   };
 }
@@ -16035,6 +16045,7 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
   const [activeAction, setActiveAction] = React.useState(null);
   const [detailRow, setDetailRow] = React.useState(null);
   const [optionsByField, setOptionsByField] = React.useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = React.useState({});
   React.useEffect(() => {
     let alive = true;
     const toLoad = config.fields.filter((f) => f.optionsEndpoint);
@@ -16042,21 +16053,25 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
     void Promise.all(
       toLoad.map(async (f) => {
         try {
-          return [f.name, await loadOptions(eventBus, f.optionsEndpoint)];
+          return [f.name, await loadOptions(eventBus, f.optionsEndpoint), null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
-      if (alive) setOptionsByField(Object.fromEntries(entries));
+      if (!alive) return;
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
     });
     return () => {
       alive = false;
     };
   }, [eventBus, config.fields]);
   const renderByFields = React.useMemo(
-    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey)),
-    [config.fields, optionsByField, eventBus]
+    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey, optionsErrorByField[f.name])),
+    [config.fields, optionsByField, optionsErrorByField, eventBus]
   );
   const validationSchema = React.useMemo(() => buildCrudYupSchema(config.fields), [config.fields]);
   const rowActions = React.useMemo(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelon",
-  "version": "0.3.81",
+  "version": "0.3.82",
   "description": "Design system de la marca goluti",
   "type": "module",
   "main": "dist/index.js",