contentoh-components-library 21.6.54 → 21.6.55

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/dist/components/pages/RetailerProductEdition/index.js +29 -10
  2. package/dist/components/pages/RetailerProductEdition/utils.js +48 -1
  3. package/package.json +1 -1
  4. package/src/components/pages/RetailerProductEdition/index.js +23 -3
  5. package/src/components/pages/RetailerProductEdition/utils.js +34 -0
  6. package/dist/ai/prompts/attribute.prompt.js +0 -28
  7. package/dist/ai/prompts/description.prompt.js +0 -33
  8. package/dist/ai/schemas/attribute.schema.js +0 -35
  9. package/dist/ai/schemas/description.schema.js +0 -27
  10. package/dist/components/atoms/AssetPreview/AssetPreview.stories.js +0 -118
  11. package/dist/components/atoms/AssetPreview/index.js +0 -150
  12. package/dist/components/atoms/AssetPreview/styles.js +0 -28
  13. package/dist/components/molecules/GalleryAssetElement/GalleryAssetElement.stories.js +0 -147
  14. package/dist/components/molecules/GalleryAssetElement/index.js +0 -178
  15. package/dist/components/molecules/GalleryAssetElement/styles.js +0 -26
  16. package/dist/components/molecules/GalleryTrayTabs/GalleryTrayTabs.stories.js +0 -56
  17. package/dist/components/molecules/GalleryTrayTabs/index.js +0 -60
  18. package/dist/components/molecules/GalleryTrayTabs/styles.js +0 -20
  19. package/dist/components/organisms/DigitalAssetsTray/DigitalAssetsTray.stories.js +0 -171
  20. package/dist/components/organisms/DigitalAssetsTray/index.js +0 -211
  21. package/dist/components/organisms/DigitalAssetsTray/styles.js +0 -22
  22. package/dist/global-files/digital-assets/assetTypes.js +0 -480
  23. package/dist/global-files/digital-assets/assets.actions.js +0 -64
  24. package/dist/global-files/digital-assets/assets.adapter.js +0 -304
  25. package/dist/global-files/digital-assets/assets.mock.js +0 -136
  26. package/dist/global-files/digital-assets/assets.reducer.js +0 -220
  27. package/dist/global-files/digital-assets/uploadAssets.js +0 -179
  28. package/dist/global-files/digital-assets/useDigitalAssets.js +0 -522
@@ -629,9 +629,11 @@ var RetailerProductEditionView = function RetailerProductEditionView(_ref) {
629
629
  type: "SET_ACTIVE_RETAILER",
630
630
  payload: productNormalized.categoryRetailerInOrder[0]
631
631
  });
632
- setShotThd([58, 59, 60, 61].includes(productNormalized.categoryRetailerInOrder[0].id_retailer)); // Configurar statusArray según el rol del usuario
632
+ setShotThd([58, 59, 60, 61].includes(productNormalized.categoryRetailerInOrder[0].id_retailer)); // Los estatus evaluables salen del rol UNIDO a la asignación. Solo por
633
+ // rol, quien produce y además audita no tenía 'AC' en la lista y el
634
+ // envío se quedaba sin nada que mandar.
633
635
 
634
- setStatusArray((0, _utils.getStatusArrayByRole)(user.id_role)); // Cargar usuarios y asignaciones
636
+ setStatusArray((0, _utils.getStatusArrayForUser)(user, productNormalized)); // Cargar usuarios y asignaciones
635
637
 
636
638
  _context2.next = 10;
637
639
  return (0, _data.fetchUsers)(token);
@@ -2488,6 +2490,23 @@ var RetailerProductEditionView = function RetailerProductEditionView(_ref) {
2488
2490
  return Promise.all(evaluationArray);
2489
2491
 
2490
2492
  case 7:
2493
+ if (!(evaluationArray.length === 0)) {
2494
+ _context15.next = 10;
2495
+ break;
2496
+ }
2497
+
2498
+ dispatch({
2499
+ type: "SET_MODAL",
2500
+ payload: {
2501
+ show: true,
2502
+ title: "Error",
2503
+ message: "No hay servicios que puedas evaluar en el estatus actual.",
2504
+ image: _errorModal.default
2505
+ }
2506
+ });
2507
+ return _context15.abrupt("return");
2508
+
2509
+ case 10:
2491
2510
  status = "".concat(result, "A"); // Actualizar el statusByRetailer para todos los retailers y conceptos
2492
2511
 
2493
2512
  updatedStatusByRetailer = state.product.statusByRetailer.map(function (item) {
@@ -2539,28 +2558,28 @@ var RetailerProductEditionView = function RetailerProductEditionView(_ref) {
2539
2558
  image: _genericModalCheck.default
2540
2559
  }
2541
2560
  });
2542
- _context15.next = 19;
2561
+ _context15.next = 22;
2543
2562
  break;
2544
2563
 
2545
- case 16:
2546
- _context15.prev = 16;
2564
+ case 19:
2565
+ _context15.prev = 19;
2547
2566
  _context15.t0 = _context15["catch"](1);
2548
2567
  console.error("Error in bulk evaluation:", _context15.t0);
2549
2568
 
2550
- case 19:
2551
- _context15.prev = 19;
2569
+ case 22:
2570
+ _context15.prev = 22;
2552
2571
  dispatch({
2553
2572
  type: "SET_SAVING",
2554
2573
  payload: false
2555
2574
  });
2556
- return _context15.finish(19);
2575
+ return _context15.finish(22);
2557
2576
 
2558
- case 22:
2577
+ case 25:
2559
2578
  case "end":
2560
2579
  return _context15.stop();
2561
2580
  }
2562
2581
  }
2563
- }, _callee15, null, [[1, 16, 19, 22]]);
2582
+ }, _callee15, null, [[1, 19, 22, 25]]);
2564
2583
  }));
2565
2584
 
2566
2585
  return function sendBulkEvaluation(_x6) {
@@ -5,10 +5,12 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.translateService = exports.translateConcept = exports.sendMessage = exports.normalizeProduct = exports.getStatusArrayByRole = exports.getInputsData = exports.getConceptsByRole = exports.getConceptByTab = exports.getAuditVersion = exports.createMessage = exports.calculateRequiredNull = exports.buildCollaboratorAssignations = void 0;
8
+ exports.translateService = exports.translateConcept = exports.sendMessage = exports.normalizeProduct = exports.getStatusArrayForUser = exports.getStatusArrayByRole = exports.getInputsData = exports.getConceptsByRole = exports.getConceptByTab = exports.getAuditVersion = exports.createMessage = exports.calculateRequiredNull = exports.buildCollaboratorAssignations = void 0;
9
9
 
10
10
  var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
11
11
 
12
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
13
+
12
14
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
13
15
 
14
16
  var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
@@ -241,9 +243,54 @@ var getStatusArrayByRole = function getStatusArrayByRole(idRole) {
241
243
  return [];
242
244
  }
243
245
  };
246
+ /**
247
+ * Estatus en los que esta persona puede evaluar ESTE producto.
248
+ *
249
+ * Unión de lo que le toca por ROL y de lo que le toca por ASIGNACIÓN. Antes
250
+ * solo se preguntaba el rol, y de ahí salía el defecto: un Especialista de
251
+ * Textos asignado como auditor no tenía 'AC' en su lista. El botón sí
252
+ * aparecía —esa compuerta ya mira la asignación—, pero `sendBulkEvaluation`
253
+ * filtra con esta lista, se quedaba sin una sola petición que mandar, y aun
254
+ * así pintaba 'AA' en pantalla y anunciaba éxito. El cambio se veía y no
255
+ * existía en la base.
256
+ *
257
+ * Se expresa reusando `getStatusArrayByRole`: cada slot ocupado aporta los
258
+ * estatus del rol que clásicamente lo ocupaba, y se unen sin repetir.
259
+ */
260
+
244
261
 
245
262
  exports.getStatusArrayByRole = getStatusArrayByRole;
246
263
 
264
+ var getStatusArrayForUser = function getStatusArrayForUser(user, product) {
265
+ // `normalizeProduct` pone 0 cuando no hay nadie asignado, no null.
266
+ var mine = function mine(value) {
267
+ return !!value && value === (user === null || user === void 0 ? void 0 : user.id_user);
268
+ };
269
+
270
+ var roles = [user === null || user === void 0 ? void 0 : user.id_role];
271
+ if (mine(product === null || product === void 0 ? void 0 : product.id_auditor)) roles.push(6);
272
+ var services = ["datasheet", "description", "images"];
273
+
274
+ if (services.some(function (s) {
275
+ return mine(product === null || product === void 0 ? void 0 : product["id_".concat(s, "_especialist")]);
276
+ })) {
277
+ roles.push(7);
278
+ }
279
+
280
+ if (["datasheet", "description"].some(function (s) {
281
+ return mine(product === null || product === void 0 ? void 0 : product["id_".concat(s, "_facilitator")]);
282
+ })) {
283
+ roles.push(4);
284
+ }
285
+
286
+ if (mine(product === null || product === void 0 ? void 0 : product.id_images_facilitator)) roles.push(5);
287
+ return (0, _toConsumableArray2.default)(new Set(roles.flatMap(function (role) {
288
+ return getStatusArrayByRole(role);
289
+ })));
290
+ };
291
+
292
+ exports.getStatusArrayForUser = getStatusArrayForUser;
293
+
247
294
  var getConceptsByRole = function getConceptsByRole(idRole) {
248
295
  switch (idRole) {
249
296
  case 4:
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "contentoh-components-library",
3
- "version": "21.6.54",
3
+ "version": "21.6.55",
4
4
  "dependencies": {
5
5
  "@aws-amplify/auth": "^4.5.3",
6
6
  "@aws-amplify/datastore": "^3.11.0",
@@ -17,7 +17,7 @@ import {
17
17
  createMessage,
18
18
  sendMessage,
19
19
  translateConcept,
20
- getStatusArrayByRole,
20
+ getStatusArrayForUser,
21
21
  getConceptsByRole,
22
22
  buildCollaboratorAssignations,
23
23
  calculateRequiredNull,
@@ -374,8 +374,10 @@ const RetailerProductEditionView = ({
374
374
  ),
375
375
  );
376
376
 
377
- // Configurar statusArray según el rol del usuario
378
- setStatusArray(getStatusArrayByRole(user.id_role));
377
+ // Los estatus evaluables salen del rol UNIDO a la asignación. Solo por
378
+ // rol, quien produce y además audita no tenía 'AC' en la lista y el
379
+ // envío se quedaba sin nada que mandar.
380
+ setStatusArray(getStatusArrayForUser(user, productNormalized));
379
381
 
380
382
  // Cargar usuarios y asignaciones
381
383
  const users = await fetchUsers(token);
@@ -1769,6 +1771,24 @@ const RetailerProductEditionView = ({
1769
1771
 
1770
1772
  await Promise.all(evaluationArray);
1771
1773
 
1774
+ // Sin una sola petición no hubo evaluación. Seguir de largo es lo que
1775
+ // pintaba el estatus nuevo y anunciaba éxito mientras la base no se
1776
+ // enteraba: el cambio se veía en pantalla y no existía. Un no-op tiene
1777
+ // que decirlo, no fingir que funcionó.
1778
+ if (evaluationArray.length === 0) {
1779
+ dispatch({
1780
+ type: "SET_MODAL",
1781
+ payload: {
1782
+ show: true,
1783
+ title: "Error",
1784
+ message:
1785
+ "No hay servicios que puedas evaluar en el estatus actual.",
1786
+ image: errorIcon,
1787
+ },
1788
+ });
1789
+ return;
1790
+ }
1791
+
1772
1792
  const status = `${result}A`;
1773
1793
 
1774
1794
  // Actualizar el statusByRetailer para todos los retailers y conceptos
@@ -197,6 +197,40 @@ export const getStatusArrayByRole = (idRole) => {
197
197
  }
198
198
  };
199
199
 
200
+ /**
201
+ * Estatus en los que esta persona puede evaluar ESTE producto.
202
+ *
203
+ * Unión de lo que le toca por ROL y de lo que le toca por ASIGNACIÓN. Antes
204
+ * solo se preguntaba el rol, y de ahí salía el defecto: un Especialista de
205
+ * Textos asignado como auditor no tenía 'AC' en su lista. El botón sí
206
+ * aparecía —esa compuerta ya mira la asignación—, pero `sendBulkEvaluation`
207
+ * filtra con esta lista, se quedaba sin una sola petición que mandar, y aun
208
+ * así pintaba 'AA' en pantalla y anunciaba éxito. El cambio se veía y no
209
+ * existía en la base.
210
+ *
211
+ * Se expresa reusando `getStatusArrayByRole`: cada slot ocupado aporta los
212
+ * estatus del rol que clásicamente lo ocupaba, y se unen sin repetir.
213
+ */
214
+ export const getStatusArrayForUser = (user, product) => {
215
+ // `normalizeProduct` pone 0 cuando no hay nadie asignado, no null.
216
+ const mine = (value) => !!value && value === user?.id_user;
217
+
218
+ const roles = [user?.id_role];
219
+
220
+ if (mine(product?.id_auditor)) roles.push(6);
221
+
222
+ const services = ["datasheet", "description", "images"];
223
+ if (services.some((s) => mine(product?.[`id_${s}_especialist`]))) {
224
+ roles.push(7);
225
+ }
226
+ if (["datasheet", "description"].some((s) => mine(product?.[`id_${s}_facilitator`]))) {
227
+ roles.push(4);
228
+ }
229
+ if (mine(product?.id_images_facilitator)) roles.push(5);
230
+
231
+ return [...new Set(roles.flatMap((role) => getStatusArrayByRole(role)))];
232
+ };
233
+
200
234
  export const getConceptsByRole = (idRole) => {
201
235
  switch (idRole) {
202
236
  case 4:
@@ -1,28 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.generateAttributePrompt = void 0;
7
-
8
- var generateAttributePrompt = function generateAttributePrompt(_ref) {
9
- var _ref$upc = _ref.upc,
10
- upc = _ref$upc === void 0 ? 0 : _ref$upc,
11
- _ref$inputName = _ref.inputName,
12
- inputName = _ref$inputName === void 0 ? "" : _ref$inputName,
13
- _ref$description = _ref.description,
14
- description = _ref$description === void 0 ? "" : _ref$description,
15
- _ref$currentValue = _ref.currentValue,
16
- currentValue = _ref$currentValue === void 0 ? "" : _ref$currentValue,
17
- _ref$name = _ref.name,
18
- name = _ref$name === void 0 ? "" : _ref$name,
19
- _ref$category = _ref.category,
20
- category = _ref$category === void 0 ? "" : _ref$category,
21
- _ref$retailer = _ref.retailer,
22
- retailer = _ref$retailer === void 0 ? "" : _ref$retailer,
23
- _ref$maxChar = _ref.maxChar,
24
- maxChar = _ref$maxChar === void 0 ? 100 : _ref$maxChar;
25
- return "\n Eres un especialista en la generaci\xF3n, optimizaci\xF3n, mejora y captura de atributos de la ficha t\xE9cnica de productos para cat\xE1logos en l\xEDnea.\n Tu tarea es crear atributos claros, concisos y relevantes que resalten las caracter\xEDsticas y beneficios del producto, utilizando un lenguaje preciso y adaptado al p\xFAblico objetivo.\n\n Datos del producto:\n - UPC: ".concat(upc, "\n - Nombre del producto: ").concat(name, "\n - Categor\xEDa: ").concat(category, "\n - Nombre del atributo: ").concat(inputName, "\n - Requerimiento del atributo: ").concat(description, "\n - Valor actual del atributo: ").concat(currentValue, "\n - Cadena comercial dirigida: ").concat(retailer, "\n\n Instrucciones:\n 1. Analiza el nombre del producto y la categor\xEDa para entender su contexto.\n 2. Analiza la descripci\xF3n del atributo actual del producto.\n 3. Identifica la informaci\xF3n clave del atributo que sean relevantes y \xFAtiles para los clientes potenciales.\n 4. Genera una lista de atributos que:\n - Cumplan con la descripcion del atributo proporcionada, no inventes datos o cambies el contexto de lo que pide la descripci\xF3n del atributo.\n - Sean claros y f\xE1ciles de entender.\n - Destaquen las caracter\xEDsticas y beneficios clave del producto.\n - Utilicen un lenguaje preciso y adaptado al p\xFAblico objetivo.\n - Mantengan un tono profesional y coherente con la marca.\n - Aumenten la probabilidad de compra del producto.\n - No excedan los ").concat(maxChar, " caracteres en total.\n - Si existe ejemplo en la descripci\xF3n del atributo, sigue el mismo formato para generar los atributos.\n 5. No incluyas emojis ni signos especiales (*/+\xB4!\xA1?\xBF)\n 6. No repitas el encabezado: ").concat(inputName, "\n 7. No incluyas call to action, ejemplo: \"!Compra ya!\" \"!Da click!\" \"!Apurate!\"\n\n Aseg\xFArate de que los atributos generados cumplan con todas las instrucciones proporcionadas.\n\n No lo olvides, el objetivo principal es mejorar la captura de atributos para la ficha t\xE9cnica del producto para atraer, convencer y dar la informaci\xF3n completa a los clientes potenciales que puedan realizar una compra.\n ");
26
- };
27
-
28
- exports.generateAttributePrompt = generateAttributePrompt;
@@ -1,33 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.generateDescriptionPrompt = void 0;
7
-
8
- // Cadena y Proveedor
9
-
10
- /**
11
- * La cadena ${cadena} tiene estas reglas ${reglas} para el tipo de descripcion que es: ${descripcion}
12
- */
13
- var generateDescriptionPrompt = function generateDescriptionPrompt(_ref) {
14
- var _ref$upc = _ref.upc,
15
- upc = _ref$upc === void 0 ? 0 : _ref$upc,
16
- _ref$inputName = _ref.inputName,
17
- inputName = _ref$inputName === void 0 ? "" : _ref$inputName,
18
- _ref$description = _ref.description,
19
- description = _ref$description === void 0 ? "" : _ref$description,
20
- _ref$currentValue = _ref.currentValue,
21
- currentValue = _ref$currentValue === void 0 ? "" : _ref$currentValue,
22
- _ref$name = _ref.name,
23
- name = _ref$name === void 0 ? "" : _ref$name,
24
- _ref$category = _ref.category,
25
- category = _ref$category === void 0 ? "" : _ref$category,
26
- _ref$retailer = _ref.retailer,
27
- retailer = _ref$retailer === void 0 ? "" : _ref$retailer,
28
- _ref$maxChar = _ref.maxChar,
29
- maxChar = _ref$maxChar === void 0 ? 100 : _ref$maxChar;
30
- return "\n Eres un especialista en la generaci\xF3n, optimizaci\xF3n y mejora de descripciones de productos para cat\xE1logos en l\xEDnea.\n Tu tarea es crear descripciones claras, concisas y atractivas que resalten las caracter\xEDsticas y beneficios del producto, utilizando un lenguaje persuasivo y adaptado al p\xFAblico objetivo.\n\n Datos del producto:\n - UPC: ".concat(upc, "\n - Nombre del producto: ").concat(name, "\n - Categor\xEDa: ").concat(category, "\n - Encabezado de la descripci\xF3n: ").concat(inputName, "\n - Requerimiento de la descripcion: ").concat(description, "\n - Descripcion actual del producto: ").concat(currentValue, "\n - Cadena comercial dirigida: ").concat(retailer, "\n\n Instrucciones:\n 1. Analiza la descripci\xF3n actual del producto en caso de tenerla.\n 2. Identifica \xE1reas de mejora, como claridad, concisi\xF3n, atractivo y relevancia.\n 3. Genera una descripci\xF3n que:\n - Sea clara y f\xE1cil de entender.\n - Destaque las caracter\xEDsticas y beneficios clave del producto.\n - Utilice un lenguaje persuasivo y adaptado al p\xFAblico objetivo.\n - Mantenga un tono profesional y coherente con la marca.\n - No exceda los ").concat(maxChar, " caracteres.\n - Aumente la probabilidad de compra del producto, utilizando persuasi\xF3n en la necesidad de compra del producto.\n 4. No incluyas emojis ni signos especiales (*/+\xB4!\xA1?\xBF)\n 5. No repitas el encabezado: ").concat(inputName, "\n 6. No incluyas call to action, ejemplo: \"!Compra ya!\" \"!Da click!\" \"!Apurate!\"\n\n\n Aseg\xFArate de que la descripci\xF3n generada cumpla con todas las instrucciones proporcionadas.\n\n No lo olvides, el objetivo principal es mejorar la descripci\xF3n del producto para atraer y convencer a los clientes potenciales de realizar una compra. Eres un experto en marketing y redacci\xF3n persuasiva.\n\n Nota: No estas hablando con los clientes, estas descripciones ir\xE1n en la tienda de E-commerce de la cadena comercial. No realices saludos, despedidas, sugerencias\n ");
31
- };
32
-
33
- exports.generateDescriptionPrompt = generateDescriptionPrompt;
@@ -1,35 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- var schema = {
8
- type: "object",
9
- properties: {
10
- results: {
11
- type: "array",
12
- items: {
13
- type: "object",
14
- properties: {
15
- label: {
16
- type: "string"
17
- },
18
- value: {
19
- type: "string"
20
- }
21
- }
22
- },
23
- maxItems: 3
24
- },
25
- compliance_warnings: {
26
- type: "array",
27
- items: {
28
- type: "string"
29
- }
30
- }
31
- },
32
- required: ["results"]
33
- };
34
- var _default = schema;
35
- exports.default = _default;
@@ -1,27 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- var schema = {
8
- type: "object",
9
- properties: {
10
- results: {
11
- type: "array",
12
- items: {
13
- type: "object",
14
- properties: {
15
- value: {
16
- type: "string"
17
- }
18
- }
19
- },
20
- minItems: 1,
21
- maxItems: 3
22
- }
23
- },
24
- required: ["results"]
25
- };
26
- var _default = schema;
27
- exports.default = _default;
@@ -1,118 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = exports.VideoConControles = exports.Video360 = exports.SinFuente = exports.Pdf = exports.Gif360 = exports.Bandeja = void 0;
9
-
10
- var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
11
-
12
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
13
-
14
- var _index = require("./index");
15
-
16
- var _assets = require("../../../global-files/digital-assets/assets.adapter");
17
-
18
- var _assets2 = require("../../../global-files/digital-assets/assets.mock");
19
-
20
- var _jsxRuntime = require("react/jsx-runtime");
21
-
22
- /*
23
- Los activos del mock apuntan a claves de S3 que no existen todavía. Para poder
24
- ver el componente antes de que haya backend, se sustituyen las URLs por
25
- archivos públicos de ejemplo; el resto del objeto (tipo, nombre, peso,
26
- duración) es el que devolvería el adaptador.
27
- */
28
- var SAMPLES = {
29
- mp4: "https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4",
30
- gif: "https://upload.wikimedia.org/wikipedia/commons/2/2c/Rotating_earth_%28large%29.gif"
31
- };
32
-
33
- var _fromBackendList$map = (0, _assets.fromBackendList)(_assets2.backendAssetsMock).map(function (asset) {
34
- return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, asset), {}, {
35
- url: asset.ext === "mp4" ? SAMPLES.mp4 : asset.ext === "gif" ? SAMPLES.gif : "",
36
- poster: ""
37
- });
38
- }),
39
- _fromBackendList$map2 = (0, _slicedToArray2.default)(_fromBackendList$map, 4),
40
- giro360 = _fromBackendList$map2[0],
41
- gif360 = _fromBackendList$map2[1],
42
- video = _fromBackendList$map2[2],
43
- pdf = _fromBackendList$map2[3];
44
-
45
- var _default = {
46
- title: "Components/atoms/AssetPreview",
47
- component: _index.AssetPreview,
48
- argTypes: {
49
- size: {
50
- options: ["catalogue-image-small-size", "catalogue-image-big-size", "carousel-image", "catalogue-modal-image", "main-image"],
51
- control: {
52
- type: "select"
53
- }
54
- }
55
- }
56
- };
57
- exports.default = _default;
58
-
59
- var Template = function Template(args) {
60
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.AssetPreview, (0, _objectSpread2.default)({}, args));
61
- };
62
-
63
- var Video360 = Template.bind({});
64
- exports.Video360 = Video360;
65
- Video360.args = {
66
- asset: giro360,
67
- size: "catalogue-image-big-size"
68
- };
69
- var Gif360 = Template.bind({});
70
- exports.Gif360 = Gif360;
71
- Gif360.args = {
72
- asset: gif360,
73
- size: "catalogue-image-big-size"
74
- };
75
- var VideoConControles = Template.bind({});
76
- exports.VideoConControles = VideoConControles;
77
- VideoConControles.args = {
78
- asset: video,
79
- size: "main-image",
80
- controls: true
81
- };
82
- var Pdf = Template.bind({});
83
- exports.Pdf = Pdf;
84
- Pdf.args = {
85
- asset: pdf,
86
- size: "catalogue-image-big-size"
87
- };
88
- /** Un activo sin URL todavía —recién soltado en la bandeja— no debe romper. */
89
-
90
- var SinFuente = Template.bind({});
91
- exports.SinFuente = SinFuente;
92
- SinFuente.args = {
93
- asset: {
94
- name: "manual_sin_subir.pdf",
95
- ext: "pdf",
96
- assetType: "pdf"
97
- },
98
- size: "catalogue-image-big-size"
99
- };
100
- /** Cómo se ve la bandeja completa, que es el uso real. */
101
-
102
- var Bandeja = function Bandeja() {
103
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
104
- style: {
105
- display: "flex",
106
- gap: 12,
107
- flexWrap: "wrap"
108
- },
109
- children: [giro360, gif360, video, pdf].map(function (asset) {
110
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.AssetPreview, {
111
- asset: asset,
112
- size: "catalogue-image-big-size"
113
- }, asset.id);
114
- })
115
- });
116
- };
117
-
118
- exports.Bandeja = Bandeja;
@@ -1,150 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.AssetPreview = void 0;
9
-
10
- var _reactImageFallback = _interopRequireDefault(require("react-image-fallback"));
11
-
12
- var _styles = require("./styles");
13
-
14
- var _IconFile = require("../IconFile");
15
-
16
- var _assetTypes = require("../../../global-files/digital-assets/assetTypes");
17
-
18
- var _defaultProductImage = _interopRequireDefault(require("../../../assets/images/defaultImages/defaultProductImage.png"));
19
-
20
- var _jsxRuntime = require("react/jsx-runtime");
21
-
22
- var PlayBadge = function PlayBadge() {
23
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
24
- className: "play-badge",
25
- "aria-hidden": "true",
26
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
27
- viewBox: "0 0 24 24",
28
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("circle", {
29
- cx: "12",
30
- cy: "12",
31
- r: "11"
32
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("polygon", {
33
- points: "9.5,7.5 17,12 9.5,16.5"
34
- })]
35
- })
36
- });
37
- };
38
- /**
39
- * Previsualización de un activo digital o de una imagen de producto.
40
- *
41
- * Acepta el modelo de `assets.adapter` y también un objeto suelto
42
- * (`{ url, mime, ext, name }`), para poder usarse donde todavía no hay activos
43
- * adaptados.
44
- *
45
- * `controls` distingue los dos usos: en la bandeja se quieren miniaturas
46
- * quietas; en el visor grande, un reproductor.
47
- */
48
-
49
-
50
- var AssetPreview = function AssetPreview(_ref) {
51
- var _ref$asset = _ref.asset,
52
- asset = _ref$asset === void 0 ? {} : _ref$asset,
53
- _ref$size = _ref.size,
54
- size = _ref$size === void 0 ? "catalogue-image-small-size" : _ref$size,
55
- _ref$controls = _ref.controls,
56
- controls = _ref$controls === void 0 ? false : _ref$controls,
57
- _ref$showBadge = _ref.showBadge,
58
- showBadge = _ref$showBadge === void 0 ? true : _ref$showBadge,
59
- _ref$showDuration = _ref.showDuration,
60
- showDuration = _ref$showDuration === void 0 ? true : _ref$showDuration,
61
- onClick = _ref.onClick,
62
- _ref$className = _ref.className,
63
- className = _ref$className === void 0 ? "" : _ref$className;
64
- var url = asset.url,
65
- src = asset.src,
66
- poster = asset.poster,
67
- mime = asset.mime,
68
- ext = asset.ext,
69
- name = asset.name,
70
- assetType = asset.assetType,
71
- duration = asset.duration;
72
- var source = url || src || "";
73
- var kind = (0, _assetTypes.resolvePreviewKind)({
74
- mime: mime,
75
- ext: ext,
76
- name: name
77
- });
78
- var extension = (ext || (0, _assetTypes.getExtension)(name) || "").toLowerCase();
79
- var label = assetType ? (0, _assetTypes.getAssetType)(assetType).label : extension.toUpperCase();
80
- var badge = showBadge && label ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
81
- className: "asset-badge",
82
- children: label
83
- }) : null;
84
- var durationTag = showDuration && duration ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
85
- className: "asset-duration",
86
- children: (0, _assetTypes.formatDuration)(duration)
87
- }) : null;
88
-
89
- var body = function body() {
90
- if (!source) {
91
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
92
- className: "asset-fallback",
93
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconFile.IconFile, {
94
- ext: extension,
95
- size: "34"
96
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
97
- title: name,
98
- children: name
99
- })]
100
- });
101
- }
102
-
103
- if (kind === _assetTypes.ASSET_PREVIEW.VIDEO) {
104
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
105
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("video", {
106
- // `#t=0.5` pide al navegador el fotograma del medio segundo en vez
107
- // de una pantalla negra. Resuelve la miniatura sin descargar el
108
- // archivo entero ni convertirlo a base64, que es lo que hacía el
109
- // parche que este componente reemplaza.
110
- src: poster ? source : "".concat(source, "#t=0.5"),
111
- poster: poster || undefined,
112
- controls: controls,
113
- muted: !controls,
114
- playsInline: true,
115
- preload: "metadata"
116
- }), !controls && /*#__PURE__*/(0, _jsxRuntime.jsx)(PlayBadge, {})]
117
- });
118
- }
119
-
120
- if (kind === _assetTypes.ASSET_PREVIEW.IMAGE) {
121
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactImageFallback.default, {
122
- src: source,
123
- fallbackImage: _defaultProductImage.default,
124
- alt: name,
125
- onClick: onClick
126
- });
127
- }
128
-
129
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
130
- className: "asset-fallback",
131
- onClick: onClick,
132
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconFile.IconFile, {
133
- ext: extension,
134
- size: "34"
135
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
136
- title: name,
137
- children: name
138
- })]
139
- });
140
- };
141
-
142
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
143
- className: "".concat(size, " ").concat(className).trim(),
144
- onClick: controls ? undefined : onClick,
145
- $clickable: Boolean(onClick) && !controls,
146
- children: [body(), badge, durationTag]
147
- });
148
- };
149
-
150
- exports.AssetPreview = AssetPreview;