contentoh-components-library 21.4.62 → 21.4.64

package/dist/components/organisms/GridProducts/index.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.GridProducts = void 0;
+
+var _styles = require("./styles");
+
+var _GridItem = require("../../molecules/GridItem");
+
+var _HeaderItem = require("../../molecules/HeaderItem");
+
+var _RowItem = require("../../molecules/RowItem");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var GridProducts = function GridProducts(_ref) {
+  var _ref$products = _ref.products,
+      products = _ref$products === void 0 ? [] : _ref$products,
+      _ref$columnsArray = _ref.columnsArray,
+      columnsArray = _ref$columnsArray === void 0 ? [] : _ref$columnsArray,
+      _ref$gridView = _ref.gridView,
+      gridView = _ref$gridView === void 0 ? true : _ref$gridView,
+      chkOnChange = _ref.chkOnChange,
+      _ref$selected = _ref.selected,
+      selected = _ref$selected === void 0 ? [] : _ref$selected,
+      chkChecked = _ref.chkChecked,
+      checkAll = _ref.checkAll,
+      chkCheckedAll = _ref.chkCheckedAll,
+      onGridClick = _ref.onGridClick;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
+    children: !gridView ? products === null || products === void 0 ? void 0 : products.map(function (_ref2, i) {
+      var gridElement = _ref2.gridElement,
+          product = _ref2.product,
+          id = _ref2.id;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridItem.GridItem, {
+        id: id,
+        index: i,
+        product: product,
+        gridElement: gridElement,
+        chkOnChange: chkOnChange,
+        onGridClick: onGridClick,
+        selected: selected,
+        chkChecked: chkChecked
+      }, i);
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "table-view",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderItem.HeaderItem, {
+        columnsArray: columnsArray,
+        checkAll: checkAll,
+        chkCheckedAll: chkCheckedAll
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowItem.RowItem, {
+        productsArray: products,
+        chkOnChange: chkOnChange,
+        onGridClick: onGridClick,
+        chkChecked: chkChecked
+      })]
+    })
+  });
+};
+
+exports.GridProducts = GridProducts;

package/dist/components/organisms/GridProducts/styles.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Container = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-wrap: wrap;\n  gap: 10px;\n  height: calc(100% - 100px);\n  overflow: auto;\n\n  .table-view {\n    height: 100%;\n    width: 100%;\n  }\n"])));
+
+exports.Container = Container;

package/dist/components/organisms/GridProducts/utils.js

@@ -0,0 +1,149 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getProductsToTable = void 0;
+
+var _RetailerCatalog = require("../../atoms/RetailerCatalog");
+
+var _UserCatalog = require("../../atoms/UserCatalog");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var getProductsToTable = function getProductsToTable() {
+  var products = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var textSpecialists = arguments.length > 1 ? arguments[1] : undefined;
+  var imagesSpecialists = arguments.length > 2 ? arguments[2] : undefined;
+  var auditors = arguments.length > 3 ? arguments[3] : undefined;
+  var images = arguments.length > 4 ? arguments[4] : undefined;
+  var onAssign = arguments.length > 5 ? arguments[5] : undefined;
+  var productsTableArray = [];
+  products.forEach(function (product) {
+    var article = product.article,
+        orderId = product.orderId,
+        upc = product.upc,
+        status = product.status,
+        version = product.version;
+    var id = (article === null || article === void 0 ? void 0 : article.id_article) + "-" + orderId;
+    var imgArray = images[(article === null || article === void 0 ? void 0 : article.id_article) + "-" + version];
+    var element = {
+      id: id,
+      cols: [{
+        name: (article === null || article === void 0 ? void 0 : article.country) || "-",
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: orderId || "-",
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: upc || "-",
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: (article === null || article === void 0 ? void 0 : article.name) || "-",
+        flex: 1,
+        minWidth: 200
+      }, {
+        name: "S/M" || "-",
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: status || "-",
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RetailerCatalog.RetailerCatalog, {
+          id: "retailers-" + id,
+          article: product,
+          retailers: product.retailers
+        }),
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: product.prio,
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: /*#__PURE__*/(0, _jsxRuntime.jsx)(_UserCatalog.UserCatalog, {
+          datasheet: article.id_datasheet_especialist,
+          description: article.id_description_especialist,
+          images: article.id_images_especialist,
+          auditor: article.id_auditor,
+          textSpecialists: textSpecialists,
+          imagesSpecialists: imagesSpecialists,
+          auditors: auditors,
+          id: "users-" + id,
+          product: product,
+          onAssign: onAssign
+        }),
+        flex: 1,
+        minWidth: 100
+      }, {
+        name: "Cont.",
+        flex: 1,
+        minWidth: 100
+      }],
+      gridElement: {
+        images: imgArray,
+        info: [{
+          title: "name",
+          value: (article === null || article === void 0 ? void 0 : article.name) || "-"
+        }, {
+          title: "order",
+          value: orderId || "-"
+        }, {
+          title: "category",
+          value: (article === null || article === void 0 ? void 0 : article.category) || "-"
+        }, {
+          title: "company",
+          value: (article === null || article === void 0 ? void 0 : article.company_name) || "-"
+        }, {
+          title: "price",
+          value: (article === null || article === void 0 ? void 0 : article.price) || "-"
+        }],
+        status: [{
+          title: "datasheet",
+          value: product === null || product === void 0 ? void 0 : product.datasheet_status,
+          percent: 80
+        }, {
+          title: "description",
+          value: product === null || product === void 0 ? void 0 : product.description_status,
+          percent: 80
+        }, {
+          title: "images",
+          value: product === null || product === void 0 ? void 0 : product.images_status,
+          percent: 80
+        }],
+        catalogs: {
+          leftSide: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RetailerCatalog.RetailerCatalog, {
+            id: "retailers-" + id,
+            limit: 2,
+            article: product,
+            retailers: product.retailers
+          }),
+          rightSide: /*#__PURE__*/(0, _jsxRuntime.jsx)(_UserCatalog.UserCatalog, {
+            datasheet: article.id_datasheet_especialist,
+            description: article.id_description_especialist,
+            images: article.id_images_especialist,
+            auditor: article.id_auditor,
+            textSpecialists: textSpecialists,
+            imagesSpecialists: imagesSpecialists,
+            auditors: auditors,
+            id: "users-" + id,
+            product: product,
+            onAssign: onAssign
+          })
+        }
+      },
+      showBottom: true,
+      product: product,
+      article: article
+    };
+    productsTableArray.push(element);
+  });
+  return productsTableArray;
+};
+
+exports.getProductsToTable = getProductsToTable;

package/dist/components/organisms/InputGroup/index.js

@@ -82,16 +82,7 @@ var InputGroup = function InputGroup(_ref) {
         setShowBox(false);
       }
     }
-  }, [activeRetailer, inputGroup.groupId]); // useEffect(() => {
-  //   if (showBox) {
-  //     // Realiza la acción que deseas cuando showBox es true
-  //     console.log("showBox es true");
-  //   } else {
-  //     // Realiza la acción que deseas cuando showBox es false
-  //     console.log("showBox es false");
-  //   }
-  // }, [showBox]);
-
+  }, [activeRetailer, inputGroup.groupId]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [inputGroup.groupId === "16" && (activeRetailer === null || activeRetailer === void 0 ? void 0 : (_activeRetailer$retai3 = activeRetailer.retailer) === null || _activeRetailer$retai3 === void 0 ? void 0 : _activeRetailer$retai3.id) === 68 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
       className: activeSection === "Ficha técnica" ? "datasheets-layout" : "descriptions-layout",

package/dist/components/organisms/Modal/styles.js

@@ -15,6 +15,6 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var ContainerModal = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  display: grid;\n  place-items: center;\n  background-color: rgba(0, 0, 0, 0.4);\n\n  .contentModal {\n    width: fit-content;\n    max-width: 80%;\n    min-width: 80px;\n    height: fit-content;\n    max-height: 90%;\n    min-height: 120px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    background-color: white;\n    border-radius: 10px;\n    padding: 25px 25px 20px 25px;\n    box-shadow: 0px 2px 4px 0px #00000040;\n\n    header {\n      width: 100%;\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      justify-content: flex-start;\n      gap: 6px;\n      margin-bottom: 20px;\n\n      .label-title {\n        width: 100%;\n        text-align: center;\n        font-family: ", ", sans-serif;\n        font-size: 17px;\n        line-height: 1.2;\n        color: #262626;\n        white-space: pre-wrap;\n      }\n    }\n\n    .iconModal {\n      width: 50px;\n      height: 50px;\n      font-size: 30px;\n      border-width: 4px;\n      margin-bottom: 20px;\n      overflow: hidden;\n\n      &.iconModal-error {\n        background-color: #953737;\n        border-color: #953737;\n        color: white;\n      }\n      &.iconModal-warning {\n        font-size: 27px;\n        padding-bottom: 8px;\n        color: #af9647;\n        border-color: #af9647;\n      }\n      &.iconModal-info {\n        border-color: #9e3e26;\n        color: #9e3e26;\n      }\n      &.iconModal-success {\n      }\n    }\n\n    .label-message {\n      width: 100%;\n      text-align: center;\n      font-family: ", ", sans-serif;\n      font-size: 13px;\n      color: #707070;\n      white-space: pre-wrap;\n    }\n\n    .container-customComponent {\n      width: 100%;\n      max-height: 50vh;\n      display: flex;\n      flex-direction: column;\n      margin-top: 20px;\n      padding: 0px 0px;\n      //border: 1px solid red;\n    }\n\n    .container-buttons {\n      width: 100%;\n      display: flex;\n      flex-direction: row;\n      justify-content: center;\n      gap: 12px;\n      margin-top: 20px;\n      //border: 1px solid red;\n    }\n  }\n"])), _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoRegular);
+var ContainerModal = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  display: grid;\n  place-items: center;\n  background-color: rgba(0, 0, 0, 0.4);\n\n  .contentModal {\n    width: fit-content;\n    max-width: 80%;\n    min-width: 80px;\n    height: fit-content;\n    max-height: 90%;\n    min-height: 120px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    background-color: white;\n    border-radius: 10px;\n    padding: 25px 25px 20px 25px;\n    box-shadow: 0px 2px 4px 0px #00000040;\n\n    header {\n      width: 100%;\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      justify-content: flex-start;\n      gap: 6px;\n\n      .label-title {\n        width: 100%;\n        text-align: center;\n        font-family: ", ", sans-serif;\n        font-size: 17px;\n        line-height: 1.2;\n        color: #262626;\n        white-space: pre-wrap;\n      }\n\n      & + * {\n        margin-top: 20px;\n      }\n    }\n\n    .iconModal {\n      width: 50px;\n      height: 50px;\n      font-size: 30px;\n      border-width: 4px;\n      margin-bottom: 20px;\n      overflow: hidden;\n\n      &.iconModal-error {\n        background-color: #953737;\n        border-color: #953737;\n        color: white;\n      }\n      &.iconModal-warning {\n        font-size: 27px;\n        padding-bottom: 8px;\n        color: #af9647;\n        border-color: #af9647;\n      }\n      &.iconModal-info {\n        border-color: #9e3e26;\n        color: #9e3e26;\n      }\n      &.iconModal-success {\n      }\n    }\n\n    .label-message {\n      width: 100%;\n      text-align: center;\n      font-family: ", ", sans-serif;\n      font-size: 13px;\n      color: #707070;\n      white-space: pre-wrap;\n    }\n\n    .container-customComponent {\n      width: 100%;\n      max-height: 50vh;\n      display: flex;\n      flex-direction: column;\n      margin-top: 20px;\n      padding: 0px 0px;\n      //border: 1px solid red;\n    }\n\n    .container-buttons {\n      width: 100%;\n      display: flex;\n      flex-direction: row;\n      justify-content: center;\n      gap: 12px;\n      margin-top: 20px;\n      //border: 1px solid red;\n    }\n  }\n"])), _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoRegular);
 
 exports.ContainerModal = ContainerModal;

package/dist/components/pages/Dashboard/Dashboard.stories.js

@@ -27,57 +27,54 @@ var DashboardDeafult = Template.bind({});
 exports.DashboardDeafult = DashboardDeafult;
 DashboardDeafult.args = {
   user: {
-    id_user: 37,
-    name: "José",
-    last_name: "Castañeda",
-    email: "ismael97lopez@gmail.com",
-    position: "Auditor",
-    telephone: "",
+    id_user: 343,
+    name: "Jair",
+    last_name: "León",
+    email: "hleon@contentoh.com",
+    position: "Test States",
+    telephone: "+525555555555",
     country: "México",
-    id_company: 2,
-    id_cognito: "9a213128-6482-4c16-a4b6-6e64f225b1bd",
+    id_company: 234,
+    id_cognito: "4512b5a5-366a-4bb5-916e-aafe05402992",
     birth_Date: null,
     about_me: "",
     zip_code: "",
     address: "",
     job: "",
-    id_stripe: "",
-    id_role: 6,
+    id_stripe: "cus_KuEt6R6vwmN09f",
+    id_role: 0,
     active: 1,
     is_retailer: 0,
-    email_notify: 1,
-    is_user_tech: null,
+    email_notify: 0,
+    is_user_tech: "ADMIN-AS",
     membership: {
-      id: 2,
-      start_date: "2021-11-05T02:35:12.000Z",
-      end_date: "2022-11-05T02:34:49.000Z",
-      planID: 1,
-      plan: "prod_KtkvuFFLpOdP6e",
-      name: "Plan Free",
-      user_limit: "1",
-      products_limit: "3",
-      type: "PyMES"
+      id: 139,
+      start_date: "2023-10-04T15:46:14.000Z",
+      end_date: "2024-10-04T08:46:09.000Z",
+      planID: 9,
+      plan: "prod_KtlkzZVGq6bRTO",
+      name: "Plan Enterprise Full",
+      user_limit: "30",
+      products_limit: "10000",
+      type: "Enterprise"
     },
-    src: "https://content-management-profile.s3.amazonaws.com/id-37/37.png?1684953973972"
+    src: "https://content-management-profile.s3.amazonaws.com/id-343/343.png?1699470782542"
   },
   company: {
-    id_company: 1,
-    trade_name: "GRUPO BRAHMA",
-    company_name: "GRUPO BRAHMA",
+    id_company: 234,
+    trade_name: "L'ORÉAL",
+    company_name: "L'ORÉAL",
     rfc: "XAXX010101000",
     adress: "AA",
-    about_company: "",
-    telephone: "",
-    web_site: "",
-    zip_code: "",
+    about_company: " ",
+    telephone: " ",
+    web_site: " ",
+    zip_code: " ",
     email: null,
-    social_link: "",
+    social_link: " ",
     is_retailer: 0,
-    retailers: [{
-      id: null,
-      name: null,
-      country: null
-    }]
+    financedRetailers: [],
+    retailers: []
   },
-  jwt: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJmNTkyN2Y4ZS1jYmY3LTQ5MjItOWUwOS1lNjllYzBiMjczMWEiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6ImY1OTI3ZjhlLWNiZjctNDkyMi05ZTA5LWU2OWVjMGIyNzMxYSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiI3ZjNkZTM4Mi03NWE2LTRlNDAtYTI3NC00YmM5ODg2Nzk0YjYiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY4NDk1NTYzOCwibmFtZSI6IklzbWFlbCBMb3BleiIsInBob25lX251bWJlciI6Iis1MjMxMTEzNjYzMzYiLCJleHAiOjE2ODQ5NTkyMzcsImlhdCI6MTY4NDk1NTYzOCwiZW1haWwiOiJpbG9wZXpAY29udGVudG9oLmNvbSJ9.ALvhpSGVv34JV8vLSg0CznmsIzRMJ_BFcmDI4qYXzr0qwgLLihon0M0xmODMhIHKcZK4jODC01guliB6fTPoCb8kfPHrBgLnHMBU8PxU1Fcc2EqF5U8lh4fJK6Mc7kiJ4lCreKJL3kT_1ytC-7FdRAlhNXzuJW6aMQQ785ODQ8-1RtHKW6U_b9x88-WFxjltEKuw734LGBSkz9iKZSumNBJBP8HTMgwOgmRTJ6lR-hPsujvl7aF3maXhftpk2fI8S_FzjVRMsxY3T8hQHIXEYwQUv-fC5SPOgc8XDuAp18MKfi0qkU1EYHQahC0qZmvgVGWEDcu5D36Xj0as4iAiFQ"
+  jwt: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiI0NTEyYjVhNS0zNjZhLTRiYjUtOTE2ZS1hYWZlMDU0MDI5OTIiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6IjQ1MTJiNWE1LTM2NmEtNGJiNS05MTZlLWFhZmUwNTQwMjk5MiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiIzYmY0NzAzZC1iMzlmLTRlNDQtYjRiMi03OWVjZGM0N2MyYjYiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY5OTQ3MDc4MCwibmFtZSI6IkphaXIgTGXDs24iLCJwaG9uZV9udW1iZXIiOiIrNTI1NTU1NTU1NTU1IiwiZXhwIjoxNjk5NDc0MzgwLCJpYXQiOjE2OTk0NzA3ODAsImVtYWlsIjoiaGxlb25AY29udGVudG9oLmNvbSJ9.TWHLcBHgP91ROeYE2slm6xpxba7EMksrOZnBe0X49EXfFhPi8z3NzjomiH3mLTg-ZHR-Rrer_qHxPxv_SLfISYupKENiO7K5E3vqV1dXBzmZdQClcFQb_OskpbMlMBGrOEtGJdWaI37-c-w9an9c_PiNSruF_UuqktyxkUIfWP-UGjFAKp3dhh_Nr1ZjpjJX2PXtDH33qMopr1LLMI84x3Y4ej-pWkJpFcF-3EuUWeEZubQEmapoBj9xNPpaOKvCQ5i2DDe46779YDoyIy0fhIiBEYtMVlHLa2-JqqDvJef29byJPXqebOGZJRSOKAxZyqlaXtUqL8LUFSLeZMwkjw"
 };

package/dist/components/pages/Dashboard/index.js

@@ -141,6 +141,16 @@ var Dashboard = function Dashboard(_ref) {
       _useState34 = (0, _slicedToArray2.default)(_useState33, 1),
       isProviderFinanced = _useState34[0];
 
+  var _useState35 = (0, _react.useState)([]),
+      _useState36 = (0, _slicedToArray2.default)(_useState35, 2),
+      trades = _useState36[0],
+      setTrades = _useState36[1];
+
+  var _useState37 = (0, _react.useState)([]),
+      _useState38 = (0, _slicedToArray2.default)(_useState37, 2),
+      tradesSelected = _useState38[0],
+      setTradesSelected = _useState38[1];
+
   var loadProductVersions = /*#__PURE__*/function () {
     var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(queryObject) {
       var keys, string, query, endpoint, response;
@@ -231,7 +241,7 @@ var Dashboard = function Dashboard(_ref) {
 
   var loadProductsByStatus = /*#__PURE__*/function () {
     var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(orderByStatus) {
-      var isRetailer, isProvider, isCollaborator, _ref5, ordersBydate, ordersByStatus, _ordersByStatus$total, total, _ordersByStatus$R, R, _ordersByStatus$PA, PA, _ordersByStatus$Ex, Ex, _ordersByStatus$ACA, ACA, productsFinished, inProcess, metricsArray;
+      var isRetailer, isProvider, isCollaborator, _ref5, ordersBydate, ordersByStatus, ordersByActive, companyTrades, _ordersByStatus$total, total, _ordersByStatus$R, R, _ordersByStatus$PA, PA, _ordersByStatus$Ex, Ex, _ordersByStatus$ACA, ACA, productsFinished, inProcess, registeredProducts, metricsArray;
 
       return _regenerator.default.wrap(function _callee3$(_context3) {
         while (1) {
@@ -257,6 +267,9 @@ var Dashboard = function Dashboard(_ref) {
               _ref5 = _context3.t0;
               ordersBydate = _ref5.ordersBydate;
               ordersByStatus = _ref5.ordersByStatus;
+              ordersByActive = _ref5.ordersByActive;
+              companyTrades = _ref5.companyTrades;
+              if (trades.length === 0) setTrades(companyTrades);
               _ordersByStatus$total = ordersByStatus.total, total = _ordersByStatus$total === void 0 ? 0 : _ordersByStatus$total, _ordersByStatus$R = ordersByStatus.R, R = _ordersByStatus$R === void 0 ? 0 : _ordersByStatus$R, _ordersByStatus$PA = ordersByStatus.PA, PA = _ordersByStatus$PA === void 0 ? 0 : _ordersByStatus$PA, _ordersByStatus$Ex = ordersByStatus.Ex, Ex = _ordersByStatus$Ex === void 0 ? 0 : _ordersByStatus$Ex, _ordersByStatus$ACA = ordersByStatus.ACA, ACA = _ordersByStatus$ACA === void 0 ? 0 : _ordersByStatus$ACA;
               productsFinished = 0;
               if (isRetailer) productsFinished = Ex;
@@ -265,11 +278,16 @@ var Dashboard = function Dashboard(_ref) {
               inProcess = Object.keys(ordersByStatus).reduce(function (prev, curr) {
                 return !["total", "PA", "R", "Ex", "ACA"].includes(curr) ? prev + ordersByStatus[curr] : prev;
               }, 0);
+              registeredProducts = ordersByActive.registered;
               metricsArray = [metricsData[0] ? metricsData[0] : {
                 label: "Productos totales",
                 value: total
               }];
+              console.log(registeredProducts);
               metricsArray.push({
+                label: "Productos activos",
+                value: registeredProducts
+              }, {
                 label: "Productos filtrados",
                 value: total
               }, {
@@ -288,7 +306,7 @@ var Dashboard = function Dashboard(_ref) {
               setRequiredProducts(ordersBydate);
               setProductsByStatus(ordersByStatus);
 
-            case 24:
+            case 29:
             case "end":
               return _context3.stop();
           }
@@ -433,20 +451,21 @@ var Dashboard = function Dashboard(_ref) {
               startDate: startDate,
               endDate: endDate
             };
-            companyId.length > 0 && (queryObject["companyId"] = companyId.join(","));
-            retailerId.length > 0 && (queryObject["retailerId"] = retailerId.join(","));
-            categoryId.length > 0 && (queryObject["categoryId"] = categoryId.join(","));
+            if (companyId.length > 0) queryObject["companyId"] = companyId.join(",");
+            if (retailerId.length > 0) queryObject["retailerId"] = retailerId.join(",");
+            if (categoryId.length > 0) queryObject["categoryId"] = categoryId.join(",");
+            if (tradesSelected.length > 0) queryObject["trades"] = encodeURIComponent(tradesSelected.join(","));
             applicantsFilter.length > 0 && (queryObject["requestedBy"] = applicantsFilter.join(","));
-            _context5.next = 8;
+            _context5.next = 9;
             return loadProductsByStatus(queryObject, true);
 
-          case 8:
+          case 9:
           case "end":
             return _context5.stop();
         }
       }
     }, _callee5);
-  })), [companyId, retailerId, categoryId, datesRange, applicantsFilter]);
+  })), [companyId, retailerId, categoryId, datesRange, applicantsFilter, tradesSelected]);
   return loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "filters",
@@ -497,6 +516,14 @@ var Dashboard = function Dashboard(_ref) {
         parameterArray: applicantsFilter,
         setParameterArray: setApplicantsFilter,
         defaultOption: "Todos los solicitantes"
+      }), user.id_role === 0 && (trades === null || trades === void 0 ? void 0 : trades.length) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CustomSelect.CustomSelect, {
+        showSearchBar: true,
+        options: trades,
+        selectLabel: "Todas las marcas",
+        placeHolder: "Buscar marca",
+        customSelectId: "trade-select",
+        parameterArray: tradesSelected,
+        setParameterArray: setTradesSelected
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "metric-cards",

package/dist/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js

@@ -45,10 +45,10 @@ ProviderProductEditionDefault.args = {
     version: 1,
     retailersAvailable: [{
       name: "The Home Depot Golden",
-      "id": 58
+      id: 58
     }, {
       name: "The Home Depot Onboarding",
-      "id": 68
+      id: 68
     }],
     percentage: "89"
   },
@@ -146,7 +146,7 @@ ProviderProductEditionDefault.args = {
       name: "The Home Depot Onboarding",
       country: "México",
       id_region: 1,
-      "active": 1,
+      active: 1,
       flow: 1
     }]
   },