Update package json scripts

js/vademecum.js

@@ -3,29 +3,53 @@
 const dom = React.createElement;
 
 const CONFIG = {
-  profA: {
+  "prof-a": {
       contactInformation: true,
       productFilter: products => products,
       prices: false,
+      categories: [
+        [ "Higiene", "higiene" ],
+        [ "Máscaras", "mascaras" ],
+        [ "Ácido Hialurónico", "acido-hialuronico" ],
+        [ "Peeling", "peeling" ],
+        [ "Corporales", "corporales" ],
+        [ "Hombres", "hombres" ],
+        [ "Protección Intensiva", "proteccion-intensiva" ],
+        [ "Monodosis", "monodosis" ],
+        [ "Activos Concentrados", "activos-concentrados" ],
+        [ "Protección Solar", "proteccion-solar" ]
+      ]
   },
-  profB: {
+  "prof-b": {
       contactInformation: false,
       productFilter: products => products,
       prices: false,
+      categories: [
+        [ "Higiene", "higiene" ],
+        [ "Máscaras", "mascaras" ],
+        [ "Ácido Hialurónico", "acido-hialuronico" ],
+        [ "Peeling", "peeling" ],
+        [ "Corporales", "corporales" ],
+        [ "Hombres", "hombres" ],
+        [ "Protección Intensiva", "proteccion-intensiva" ],
+        [ "Monodosis", "monodosis" ],
+        [ "Activos Concentrados", "activos-concentrados" ],
+        [ "Protección Solar", "proteccion-solar" ]
+      ]
   },
-  domA: {
+  "dom-a": {
       contactInformation: false,
       productFilter: products => products,
       prices: true,
   },
-  domB: {
+  "dom-a": {
       contactInformation: false,
       productFilter: products => products,
       prices: false,
   },
 };
 
-console.log(process.env.mode, CONFIG[process.env.mode]);
+console.log(process.env.MODE, CONFIG[process.env.MODE]);
 
 const Tag = (label, key, className) => (
   <span className={`tag ${className||''}`} key={key}>{label}</span>
@@ -124,7 +148,8 @@ const ToC = (categories, products) => (
 )
 
 
-const Vademecum = (categories, products) => {
+const Vademecum = (categories, products, prices) => {
+  console.log(prices);
   return categories.map((categoryName, i) => (
     <div key={i}>
       {
@@ -142,19 +167,10 @@ const LABEL = 0,
 class VademecumData extends React.Component {
   constructor(props) {
     super(props);
+    const config = CONFIG[process.env.MODE];
     this.state = {
-      categories: [
-        [ "Higiene", "higiene" ],
-        [ "Máscaras", "mascaras" ],
-        [ "Ácido Hialurónico", "acido-hialuronico" ],
-        [ "Peeling", "peeling" ],
-        [ "Corporales", "corporales" ],
-        [ "Hombres", "hombres" ],
-        [ "Protección Intensiva", "proteccion-intensiva" ],
-        [ "Monodosis", "monodosis" ],
-        [ "Activos Concentrados", "activos-concentrados" ],
-        [ "Protección Solar", "proteccion-solar" ]
-      ],
+      config: config,
+      categories: config.categories,
       products: null,
     }
   }
@@ -162,6 +178,7 @@ class VademecumData extends React.Component {
   componentDidMount() {
     fetch('data/products-by-category.json')
       .then(response => response.json())
+      .then(this.state.config.productFilter)
       .then(data => {
         this.setState({
           products: data,
@@ -170,12 +187,12 @@ class VademecumData extends React.Component {
   }
 
   render() {
-    const { categories, products } = this.state;
+    const { categories, products, config } = this.state;
     if (products) {
       return ( 
         <div>
           { ToC(categories, products) }
-          { Vademecum(categories, products) }
+          { Vademecum(categories, products, config.prices) }
         </div>
       )
     } else {

lib/vademecum.js

@@ -18,38 +18,43 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
 
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 var dom = React.createElement;
-var CONFIG = {
-  profA: {
+
+var CONFIG = _defineProperty({
+  "prof-a": {
     contactInformation: true,
     productFilter: function productFilter(products) {
       return products;
     },
-    prices: false
+    prices: false,
+    categories: [["Higiene", "higiene"], ["Máscaras", "mascaras"], ["Ácido Hialurónico", "acido-hialuronico"], ["Peeling", "peeling"], ["Corporales", "corporales"], ["Hombres", "hombres"], ["Protección Intensiva", "proteccion-intensiva"], ["Monodosis", "monodosis"], ["Activos Concentrados", "activos-concentrados"], ["Protección Solar", "proteccion-solar"]]
   },
-  profB: {
+  "prof-b": {
     contactInformation: false,
     productFilter: function productFilter(products) {
       return products;
     },
-    prices: false
+    prices: false,
+    categories: [["Higiene", "higiene"], ["Máscaras", "mascaras"], ["Ácido Hialurónico", "acido-hialuronico"], ["Peeling", "peeling"], ["Corporales", "corporales"], ["Hombres", "hombres"], ["Protección Intensiva", "proteccion-intensiva"], ["Monodosis", "monodosis"], ["Activos Concentrados", "activos-concentrados"], ["Protección Solar", "proteccion-solar"]]
   },
-  domA: {
+  "dom-a": {
     contactInformation: false,
     productFilter: function productFilter(products) {
       return products;
     },
     prices: true
-  },
-  domB: {
-    contactInformation: false,
-    productFilter: function productFilter(products) {
-      return products;
-    },
-    prices: false
   }
-};
-console.log("profA", CONFIG["profA"]);
+}, "dom-a", {
+  contactInformation: false,
+  productFilter: function productFilter(products) {
+    return products;
+  },
+  prices: false
+});
+
+console.log("prof-b", CONFIG["prof-b"]);
 
 var Tag = function Tag(label, key, className) {
   return dom("span", {
@@ -116,7 +121,8 @@ var ToC = function ToC(categories, products) {
   })));
 };
 
-var Vademecum = function Vademecum(categories, products) {
+var Vademecum = function Vademecum(categories, products, prices) {
+  console.log(prices);
   return categories.map(function (categoryName, i) {
     return dom("div", {
       key: i
@@ -139,8 +145,10 @@ function (_React$Component) {
     _classCallCheck(this, VademecumData);
 
     _this = _possibleConstructorReturn(this, _getPrototypeOf(VademecumData).call(this, props));
+    var config = CONFIG["prof-b"];
     _this.state = {
-      categories: [["Higiene", "higiene"], ["Máscaras", "mascaras"], ["Ácido Hialurónico", "acido-hialuronico"], ["Peeling", "peeling"], ["Corporales", "corporales"], ["Hombres", "hombres"], ["Protección Intensiva", "proteccion-intensiva"], ["Monodosis", "monodosis"], ["Activos Concentrados", "activos-concentrados"], ["Protección Solar", "proteccion-solar"]],
+      config: config,
+      categories: config.categories,
       products: null
     };
     return _this;
@@ -153,7 +161,7 @@ function (_React$Component) {
 
       fetch('data/products-by-category.json').then(function (response) {
         return response.json();
-      }).then(function (data) {
+      }).then(this.state.config.productFilter).then(function (data) {
         _this2.setState({
           products: data
         });
@@ -164,10 +172,11 @@ function (_React$Component) {
     value: function render() {
       var _this$state = this.state,
           categories = _this$state.categories,
-          products = _this$state.products;
+          products = _this$state.products,
+          config = _this$state.config;
 
       if (products) {
-        return dom("div", null, ToC(categories, products), Vademecum(categories, products));
+        return dom("div", null, ToC(categories, products), Vademecum(categories, products, config.prices));
       } else {
         return dom("div", null);
       }
@@ -177,4 +186,4 @@ function (_React$Component) {
   return VademecumData;
 }(React.Component);
 
-ReactDOM.render(dom(VademecumData), domContainer);
+ReactDOM.render(dom(VademecumData), domContainer);

package-lock.json

@@ -1848,6 +1848,27 @@
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
       "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
+    "cross-env": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-5.2.0.tgz",
+      "integrity": "sha512-jtdNFfFW1hB7sMhr/H6rW1Z45LFqyI431m3qU6bFXcQ3Eh7LtBuG3h74o7ohHZ3crrRkkqHlo4jYHFPcjroANg==",
+      "requires": {
+        "cross-spawn": "^6.0.5",
+        "is-windows": "^1.0.0"
+      }
+    },
+    "cross-spawn": {
+      "version": "6.0.5",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+      "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+      "requires": {
+        "nice-try": "^1.0.4",
+        "path-key": "^2.0.1",
+        "semver": "^5.5.0",
+        "shebang-command": "^1.2.0",
+        "which": "^1.2.9"
+      }
+    },
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -2959,14 +2980,18 @@
     "is-windows": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
-      "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==",
-      "dev": true
+      "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA=="
     },
     "isarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
       "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
     },
+    "isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
+    },
     "isobject": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
@@ -3162,6 +3187,11 @@
         "to-regex": "^3.0.1"
       }
     },
+    "nice-try": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
+      "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ=="
+    },
     "node-modules-regexp": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/node-modules-regexp/-/node-modules-regexp-1.0.0.tgz",
@@ -3306,6 +3336,11 @@
       "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
       "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
     },
+    "path-key": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
+      "integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A="
+    },
     "path-parse": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
@@ -3601,8 +3636,7 @@
     "semver": {
       "version": "5.7.0",
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.0.tgz",
-      "integrity": "sha512-Ya52jSX2u7QKghxeoFGpLwCtGlt7j0oY9DYb5apt9nPlJ42ID+ulTXESnt/qAQcoSERyZ5sl3LDIOw0nAn/5DA==",
-      "dev": true
+      "integrity": "sha512-Ya52jSX2u7QKghxeoFGpLwCtGlt7j0oY9DYb5apt9nPlJ42ID+ulTXESnt/qAQcoSERyZ5sl3LDIOw0nAn/5DA=="
     },
     "set-value": {
       "version": "2.0.0",
@@ -3627,6 +3661,19 @@
         }
       }
     },
+    "shebang-command": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
+      "integrity": "sha1-RKrGW2lbAzmJaMOfNj/uXer98eo=",
+      "requires": {
+        "shebang-regex": "^1.0.0"
+      }
+    },
+    "shebang-regex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
+      "integrity": "sha1-2kL0l0DAtC2yypcoVxyxkMmO/qM="
+    },
     "slash": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
@@ -4024,6 +4071,14 @@
         "homedir-polyfill": "^1.0.1"
       }
     },
+    "which": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
+      "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
+      "requires": {
+        "isexe": "^2.0.0"
+      }
+    },
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",

package.json

@@ -9,6 +9,7 @@
   "dependencies": {
     "@babel/polyfill": "^7.4.4",
     "@babel/preset-react": "^7.0.0",
+    "cross-env": "^5.2.0",
     "dotenv": "^8.0.0",
     "puppeteer": "^1.15.0",
     "puppeteer-core": "^1.15.0"
@@ -22,7 +23,10 @@
     "babel-plugin-transform-inline-environment-variables": "^0.4.3"
   },
   "scripts": {
-    "start": "node src/index.js",
+    "start:prof-a": "cross-env MODE=prof-a ./node_modules/.bin/babel js/vademecum.js --watch --out-file lib/vademecum.js",
+    "start:prof-b": "cross-env MODE=prof-b ./node_modules/.bin/babel js/vademecum.js --watch --out-file lib/vademecum.js",
+    "start:dom-a": "cross-env MODE=dom-a ./node_modules/.bin/babel js/vademecum.js --watch --out-file lib/vademecum.js",
+    "start:dom-b": "cross-env MODE=dom-b ./node_modules/.bin/babel js/vademecum.js --watch --out-file lib/vademecum.js",
     "prof-start": "./node_modules/.bin/babel js/vademecum.js --watch --out-file lib/vademecum.js",
     "prof-build": "./node_modules/.bin/babel js/vademecum.js --out-dir lib",
     "prof-pdf": "npm run prof-build && node pdf-maker.js",