contentoh-components-library 21.4.68 → 21.4.70

package/dist/components/organisms/RenameImagesBar/RenameImagesBar.stories.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.RenameImagesBarDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _index = require("./index");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/organisms/RenameImagesBar",
+  component: _index.RenameImagesBar,
+  argTypes: {}
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.RenameImagesBar, (0, _objectSpread2.default)({}, args));
+};
+
+var RenameImagesBarDefault = Template.bind({});
+exports.RenameImagesBarDefault = RenameImagesBarDefault;
+RenameImagesBarDefault.args = {
+  RenameImagesBar: {}
+};

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

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RenameImagesBar = void 0;
+
+var _InputImages = require("../../atoms/InputImages");
+
+var _NumberMandatory = require("../../atoms/NumberMandatory");
+
+var _InputGroupv = require("../InputGroupv2");
+
+var _styles = require("./styles");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var RenameImagesBar = function RenameImagesBar(_ref) {
+  var description = _ref.description,
+      number = _ref.number;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_InputImages.InputImages, {
+      required: true,
+      description_small: "Descripción del campo.",
+      placeHolder: "UPC"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputImages.InputImages, {
+      required: false,
+      description_small: "Descripción del campo.",
+      placeHolder: "Modelo"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputImages.InputImages, {
+      required: true,
+      description_small: "Descripción del campo.",
+      placeHolder: "Item"
+    })]
+  });
+};
+
+exports.RenameImagesBar = RenameImagesBar;

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

@@ -0,0 +1,20 @@
+"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 _variables = require("../../../global-files/variables");
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  height:60px;\n  display: flex;\n  gap: 10px;\n  padding:22px 15px;\n  border:1px solid ", ";\n  border-radius:10px;\n"])), _variables.GlobalColors.gray_light);
+
+exports.Container = Container;

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

@@ -27,9 +27,7 @@ var _addVersion = _interopRequireDefault(require("../../../assets/images/version
 
 var _closeVersionSelector = _interopRequireDefault(require("../../../assets/images/versionSelector/closeVersionSelector.svg"));
 
-var _variables = require("contentoh-components-library/dist/global-files/variables");
-
-var _variables2 = require("../../../global-files/variables");
+var _variables = require("../../../global-files/variables");
 
 var _VersionItem = require("../../molecules/VersionItem");
 
@@ -122,7 +120,7 @@ var VersionSelector = function VersionSelector(_ref) {
         text: "Versión del producto",
         headerType: "input-name-header",
         color: _variables.GlobalColors.white,
-        fontFamily: _variables2.FontFamily.Lato
+        fontFamily: _variables.FontFamily.Lato
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "buttons-container",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {

package/dist/components/organisms/VersionSelectorv2/VersionSelectorv2.stories.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.VersionSelectorv2Default = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _index = require("./index");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/organisms/VersionSelectorv2",
+  component: _index.VersionSelectorv2
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.VersionSelectorv2, (0, _objectSpread2.default)({}, args));
+};
+
+var VersionSelectorv2Default = Template.bind({});
+exports.VersionSelectorv2Default = VersionSelectorv2Default;
+VersionSelectorv2Default.args = {
+  articleId: 35707,
+  companyName: "COMPANY DEV",
+  currentVersion: 7
+};

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

@@ -0,0 +1,166 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VersionSelectorv2 = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _styles = require("./styles");
+
+var _axios = _interopRequireDefault(require("axios"));
+
+var _react = require("react");
+
+var _ScreenHeader = require("../../atoms/ScreenHeader");
+
+var _GeneralButton = require("../../atoms/GeneralButton");
+
+var _addVersion = _interopRequireDefault(require("../../../assets/images/versionSelector/addVersion.svg"));
+
+var _closeVersionSelector = _interopRequireDefault(require("../../../assets/images/versionSelector/closeVersionSelector.svg"));
+
+var _variables = require("../../../global-files/variables");
+
+var _VersionItemv = require("../../molecules/VersionItemv2");
+
+var _CreateVersion = require("../../organisms/CreateVersion");
+
+var _customHooks = require("../../../global-files/customHooks");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var VersionSelectorv2 = function VersionSelectorv2(_ref) {
+  var modalId = _ref.modalId,
+      articleId = _ref.articleId,
+      setVersion = _ref.setVersion,
+      companyName = _ref.companyName,
+      currentVersion = _ref.currentVersion,
+      setShowVersionSelector = _ref.setShowVersionSelector,
+      jwt = _ref.jwt;
+
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      versions = _useState2[0],
+      setVersions = _useState2[1];
+
+  var _useCloseModal = (0, _customHooks.useCloseModal)("create-version"),
+      _useCloseModal2 = (0, _slicedToArray2.default)(_useCloseModal, 2),
+      showCreateVersion = _useCloseModal2[0],
+      setShowCreateVersion = _useCloseModal2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      reload = _useState4[0],
+      setReload = _useState4[1];
+
+  var loadProductVersions = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(articleId) {
+      var response, versionList;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              _context.next = 3;
+              return _axios.default.get("".concat(process.env.REACT_APP_VERSIONS_ENDPOINT, "?articleId=").concat(articleId, "&provider=true"), {
+                headers: {
+                  Authorization: jwt
+                }
+              });
+
+            case 3:
+              response = _context.sent;
+              versionList = JSON.parse(response.data.body).data;
+              setVersions(versionList);
+              _context.next = 11;
+              break;
+
+            case 8:
+              _context.prev = 8;
+              _context.t0 = _context["catch"](0);
+              console.log(_context.t0);
+
+            case 11:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[0, 8]]);
+    }));
+
+    return function loadProductVersions(_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  (0, _react.useEffect)(function () {
+    var ac = new AbortController();
+    loadProductVersions(articleId);
+    return function () {
+      setVersions([]);
+      setShowCreateVersion(false);
+      return function () {
+        return ac.abort();
+      }; // Abort both fetches on unmount
+    };
+  }, [reload]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    id: modalId,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "versions-header",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenHeader.ScreenHeader, {
+        text: "Versiones",
+        headerType: "input-name-header",
+        color: _variables.GlobalColors.gray,
+        fontFamily: _variables.FontFamily.Lato
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "buttons-container",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+          image: _addVersion.default,
+          buttonType: "circular-button",
+          onClick: function onClick() {
+            return setShowCreateVersion(true);
+          },
+          id: "add-version"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+          buttonType: "general-white-button close-button",
+          onClick: function onClick() {
+            return setShowVersionSelector(false);
+          },
+          id: "close-button"
+        })]
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "versions-container",
+      children: versions === null || versions === void 0 ? void 0 : versions.map(function (item) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionItemv.VersionItemv2, {
+          version: item.version,
+          articleStatus: item.article_status,
+          currentVersion: item.version === currentVersion,
+          productOwner: companyName,
+          setVersion: setVersion,
+          timestamp: item.timestamp
+        }, item.version);
+      })
+    }), showCreateVersion && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CreateVersion.CreateVersion, {
+      articleId: articleId,
+      version: currentVersion,
+      versionsList: versions,
+      setShowCreateVersion: setShowCreateVersion,
+      realoadVersion: function realoadVersion() {
+        return setReload(!reload);
+      },
+      jwt: jwt
+    })]
+  });
+};
+
+exports.VersionSelectorv2 = VersionSelectorv2;

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

@@ -0,0 +1,20 @@
+"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 _variables = require("../../../global-files/variables");
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 300px;\n  height: 100%;\n  background-color: ", ";\n  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.4);\n  overflow: auto;\n  position: absolute;\n  right: 20px;\n  top: 0;\n  z-index: 500;\n\n  .versions-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    height: 44px;\n    border-radius: 10px 10px 0 0;\n    background: #F9F9F9;\n    padding:5px 10px;\n\n    .buttons-container {\n      display: flex;\n      align-items: center;\n\n      button + * {\n        margin-left: 10px;\n        width: 24px;\n        height: 24px;\n        border: 1px solid ", ";\n        background-size: 12px;\n        padding: 0;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n    }\n  }\n  .versions-container{\n    padding:5px 10px;\n  }\n    \n"])), _variables.GlobalColors.white, _variables.GlobalColors.magenta_s2);
+
+exports.Container = Container;

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?1699640943284"
   },
   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.eyJzdWIiOiI0NTEyYjVhNS0zNjZhLTRiYjUtOTE2ZS1hYWZlMDU0MDI5OTIiLCJjb2duaXRvOmdyb3VwcyI6WyJ1c3VhcmlvX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwicGhvbmVfbnVtYmVyX3ZlcmlmaWVkIjpmYWxzZSwiY29nbml0bzp1c2VybmFtZSI6IjQ1MTJiNWE1LTM2NmEtNGJiNS05MTZlLWFhZmUwNTQwMjk5MiIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiI4YTJhOTE3ZS0xZWU2LTQ5ODAtODZiZS0yZTEzMGI4ZTcyMmIiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY5OTY0MDk0MSwibmFtZSI6IkphaXIgTGXDs24iLCJwaG9uZV9udW1iZXIiOiIrNTI1NTU1NTU1NTU1IiwiZXhwIjoxNjk5NjQ0NTQxLCJpYXQiOjE2OTk2NDA5NDEsImVtYWlsIjoiaGxlb25AY29udGVudG9oLmNvbSJ9.YrLhtF5cee0S_iWX1gXBTJPxF8zls25SMK9GfCWoCpAabGRy9HtGSZ9KUuZlXICz13TTvgOfxFIv5duwS2vxYIlE1ZuLPHXSm2L4FuwJHcppedxssPNgfmxmVu-4B0SaMNWynjIWwbt_wumb2spwe3ONTcuRI-UgmJo_Rfa_cKUOiL-oNCQwkX6KhuWRGcfcpoUkfhi6tfOAgkA8VT5D8h-Dgawg5ibRnbjRMQejfNg1vVh_d2MpYhX9ve5SM9r1JdRCowgxMjb3ii6eXnng_UqjRdrB4008wkG8iZbz2C_NVJjJGrt1B454MZZmRvHbRogs-uu6U1JUsDW09qhcCg"
 };

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,15 @@ 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
               }];
               metricsArray.push({
+                label: "Productos activos",
+                value: registeredProducts
+              }, {
                 label: "Productos filtrados",
                 value: total
               }, {
@@ -288,7 +305,7 @@ var Dashboard = function Dashboard(_ref) {
               setRequiredProducts(ordersBydate);
               setProductsByStatus(ordersByStatus);
 
-            case 24:
+            case 28:
             case "end":
               return _context3.stop();
           }
@@ -420,7 +437,9 @@ var Dashboard = function Dashboard(_ref) {
     }, _callee4);
   })), []);
   (0, _react.useEffect)(function () {
-    (orderByRequired === null || orderByRequired === void 0 ? void 0 : orderByRequired.startDate) && (orderByStatus === null || orderByStatus === void 0 ? void 0 : orderByStatus.endDate) && metricsData.length > 0 && setLoading(false);
+    if (orderByRequired !== null && orderByRequired !== void 0 && orderByRequired.startDate && orderByStatus !== null && orderByStatus !== void 0 && orderByStatus.endDate && metricsData.length > 0) {
+      setLoading(false);
+    }
   }, [orderByRequired, orderByStatus, metricsData]);
   (0, _react.useEffect)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
     var startDate, endDate, queryObject;
@@ -433,20 +452,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 +517,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",