@madgex/fert 1.3.0 → 1.5.2

package/.prettierrc.js

@@ -4,5 +4,5 @@ module.exports = {
   singleQuote: true,
   printWidth: 80,
   trailingComma: 'es5',
-  endOfLine: 'auto'
+  endOfLine: 'auto',
 };

package/bin/cli.js

@@ -30,7 +30,7 @@ const run = () => {
     .action((...args) => require('./commands/build.js')(...args));
 
   cli
-    .command('publish [root]', 'Publish project to S3')
+    .command('publish [root]', 'Publish the project')
     .option('--target <env>', 'Environment to publish to, "dev" or "prod"')
     .action((...args) => require('./commands/publish')(...args));
 

package/bin/commands/build-tasks/build-external-assets.js

@@ -1,6 +1,6 @@
 const Path = require('path');
 const fs = require('fs/promises');
-const { log } = require('../../utils');
+const { log } = require('../../utils/logging');
 
 module.exports = async function buildExternalAssets(fertConfig) {
   const { externalAssets, workingDir } = fertConfig;

package/bin/commands/build-tasks/build-tokens.js

@@ -5,7 +5,8 @@ const {
   registerTransforms,
 } = require('@madgex/design-system/tasks/registerTransforms');
 const colorTransforms = require('@madgex/design-system/tasks/colorTransforms');
-const { ensureTrailingSlash, log, exists } = require('../../utils');
+const { ensureTrailingSlash, exists } = require('../../utils');
+const { log } = require('../../utils/logging');
 const { TMP_DIR } = require('../../../constants');
 
 const dsTokensPath = Path.dirname(

package/bin/commands/build-tasks/bundle-entry.js

@@ -3,7 +3,7 @@ const _ = require('lodash');
 const vite = require('vite');
 const updateBuildWithBundledDsCSS = require('./bundle-ds-css');
 const buildExternalAssets = require('./build-external-assets');
-const { log } = require('../../utils');
+const { log } = require('../../utils/logging');
 
 module.exports = async (fertConfig, options = {}) => {
   let dynamicOptions = {};
@@ -17,7 +17,7 @@ module.exports = async (fertConfig, options = {}) => {
 
   dynamicOptions = {
     root: path.resolve(fertConfig.workingDir),
-    base: '/_/jobseekers-frontend/',
+    base: '/_/jobseekers-frontend/assets/',
     build: {
       cssCodeSplit: false, // important: to get a single, style.css file output
       outDir: path.resolve(fertConfig.workingDir, 'dist'),

package/bin/commands/build.js

@@ -1,6 +1,7 @@
 const path = require('path');
 const { rimraf } = require('rimraf');
-const { resolveConfig, log } = require('../utils');
+const { resolveConfig } = require('../utils');
+const { log } = require('../utils/logging');
 const bundleEntry = require('./build-tasks/bundle-entry');
 const buildCssFromTokens = require('./build-tasks/build-tokens');
 const buildExternalAssets = require('./build-tasks/build-external-assets');

package/bin/commands/dev-server.js

@@ -2,7 +2,8 @@ const path = require('path');
 const chalk = require('chalk');
 const open = require('open');
 const chokidar = require('chokidar');
-const { resolveConfig, log } = require('../utils/index.js');
+const { resolveConfig } = require('../utils/index.js');
+const { log } = require('../utils/logging.js');
 const { devServer } = require('../../server');
 const { buildTokens, buildExternalAssets } = require('./build.js');
 const {

package/bin/commands/publish-tasks/asset-store-uploader.js

@@ -1,7 +1,7 @@
 const fs = require('fs');
 const path = require('path');
 const Hoek = require('@hapi/hoek');
-const { log } = require('../../utils');
+const { log } = require('../../utils/logging');
 const axios = require('axios');
 const FormData = require('form-data');
 const ora = require('ora');

package/bin/commands/publish.js

@@ -1,7 +1,8 @@
 const path = require('path');
 const Hoek = require('@hapi/hoek');
 const chalk = require('chalk');
-const { resolveConfig, log } = require('../utils');
+const { resolveConfig } = require('../utils');
+const { log } = require('../utils/logging');
 const getAwsParam = require('./publish-tasks/get-aws-parameter');
 const AssetStoreUploader = require('./publish-tasks/asset-store-uploader');
 const {

package/bin/utils/cpid-lookup.js

@@ -1,22 +1,33 @@
 // Fetch provides support for node 16 and lower
-const fetch = require('node-fetch-commonjs');
+const axios = require('axios');
+const { log } = require('../utils/logging');
 const storage = require('node-persist');
 const dayjs = require('dayjs');
 const duration = require('dayjs/plugin/duration');
 const { PROPERTY_ID_API, TMP_DIR } = require('../../constants');
+const chalk = require('chalk');
 
 dayjs.extend(duration);
 
 exports.doCpidLookup = async (clientPropertyId) => {
   const API_URL = new URL(clientPropertyId, PROPERTY_ID_API).toString();
 
-  const res = await fetch(API_URL);
-
-  if (!res.ok) {
-    throw Error(`Unable to lookup CPID [${clientPropertyId}]`);
-  }
-
-  const { data: results } = await res.json();
+  const results = await axios
+    .get(API_URL, { timeout: 5000 })
+    .then((res) => {
+      return res.data.data;
+    })
+    .catch((error) => {
+      log.error(
+        `Unable to lookup CPID [${chalk.yellow(
+          clientPropertyId
+        )}] from ${chalk.cyan(API_URL)}: ${chalk.redBright(error.message)}\n`
+      );
+
+      throw Error(error.message);
+    });
+
+  // const { data: results } = await res.json();
   const { brandName, parentId: parentCpid } = results;
 
   return {
@@ -33,10 +44,10 @@ exports.cpidLookup = async (clientPropertyId) => {
     ttl: dayjs.duration(1, 'week').asMilliseconds(),
   });
 
-  const value = await storage.getItem(clientPropertyId);
+  const cache = await storage.getItem(clientPropertyId);
 
-  if (value) {
-    return value;
+  if (cache) {
+    return cache;
   }
 
   const result = await this.doCpidLookup(clientPropertyId);

package/bin/utils/index.js

@@ -3,8 +3,6 @@ const fs = require('fs');
 const fsp = require('fs/promises');
 const { VERSION } = require('../../constants');
 const chalk = require('chalk');
-const debug = require('debug');
-const debugLog = debug('fert');
 const uuidValidator = require('uuid-validate');
 const Hoek = require('@hapi/hoek');
 const { cpidLookup } = require('./cpid-lookup');
@@ -14,21 +12,6 @@ exports.printBanner = () => {
   console.log(chalk`\n{green.bold Fert} v${VERSION}\n`);
 };
 
-exports.log = {
-  info: (...args) => {
-    console.log(...args);
-  },
-  success: (...args) => {
-    console.log(chalk.green.bold('✔'), ...args);
-  },
-  error: (...args) => {
-    console.log(chalk.red.bold('✖'), ...args);
-  },
-  debug: (...args) => {
-    debugLog(...args);
-  },
-};
-
 exports.resolveConfig = async (root, options = {}) => {
   const defaults = {
     clientPropertyId: null,

package/bin/utils/logging.js

@@ -0,0 +1,18 @@
+const debug = require('debug');
+const debugLog = debug('fert');
+const chalk = require('chalk');
+
+exports.log = {
+  info: (...args) => {
+    console.log(...args);
+  },
+  success: (...args) => {
+    console.log(chalk.green.bold('✔'), ...args);
+  },
+  error: (...args) => {
+    console.log(chalk.red.bold('✖'), ...args);
+  },
+  debug: (...args) => {
+    debugLog(...args);
+  },
+};

package/constants.js

@@ -14,6 +14,7 @@ module.exports = {
   AWS_REGION: 'eu-west-1',
   PROPERTY_ID_API:
     'https://property-identification-api.cs.madgexhosting.net/properties/',
+  ASSETS_API_URL: 'https://asset-store.job.madgexhosting.net',
   BRAND_JSON_FILENAME: 'brand.json',
   FERT_CONFIG_FILENAME: 'fert.config.js',
   ASSET_STORE_API: 'https://asset-store-api.{env}.madgexhosting.net/',

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@madgex/fert",
-  "version": "1.3.0",
+  "version": "1.5.2",
   "description": "Tool to help build the V6 branding",
   "bin": {
     "fert": "./bin/cli.js"
   },
   "scripts": {
     "lint": "eslint .",
+    "format": "prettier --write .",
     "lint-staged": "lint-staged",
     "semantic-release": "semantic-release",
     "test": "echo \"Error: no test specified\" && exit 1",
@@ -27,11 +28,11 @@
     "@hapi/hapi": "^21.3.2",
     "@hapi/hoek": "^11.0.2",
     "@hapi/inert": "^7.1.0",
-    "@hapi/vision": "^7.0.2",
+    "@hapi/vision": "^7.0.3",
     "@hapipal/toys": "^4.0.0",
     "@madgex/design-system": "*",
     "@private/header-footer-podlet-server": "github:wiley/madgex-header-footer-podlet",
-    "axios": "^1.4.0",
+    "axios": "^1.5.0",
     "cac": "^6.7.14",
     "chalk": "4.1.2",
     "chokidar": "^3.5.3",
@@ -39,31 +40,30 @@
     "debug": "^4.3.4",
     "form-data": "^4.0.0",
     "lodash": "^4.17.21",
-    "node-fetch-commonjs": "^3.3.1",
     "node-persist": "^3.1.3",
     "nunjucks": "^3.2.4",
     "open": "8.4.2",
     "ora": "5.4.1",
     "prompts": "^2.4.2",
     "rimraf": "^5.0.1",
-    "sass": "^1.64.1",
+    "sass": "^1.66.1",
     "simple-update-notifier": "^2.0.0",
     "style-dictionary": "^3.8.0",
     "uuid-validate": "^0.0.3",
-    "vite": "^4.4.7",
+    "vite": "^4.4.9",
     "vite-plugin-static-copy": "^0.17.0"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.6.7",
-    "@commitlint/config-conventional": "^17.6.7",
+    "@commitlint/config-conventional": "^17.7.0",
     "commitizen": "^4.3.0",
     "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^8.45.0",
-    "eslint-config-prettier": "^8.8.0",
+    "eslint": "^8.49.0",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-prettier": "^5.0.0",
     "husky": "^8.0.3",
-    "lint-staged": "^13.2.3",
-    "prettier": "^3.0.0",
+    "lint-staged": "^14.0.1",
+    "prettier": "^3.0.3",
     "semantic-release": "^21.1.1"
   },
   "peerDependencies": {

package/repo-templates/globals/fert.config.js

@@ -1,4 +1,8 @@
 module.exports = {
   clientPropertyId: '{CPID}',
   entry: './src/index.js',
+  externalAssets: {
+    links: [],
+    scripts: [],
+  },
 };

package/repo-templates/template-basic/package.json

@@ -8,6 +8,6 @@
     "build": "fert build"
   },
   "devDependencies": {
-    "@madgex/frontend-rollout-tool": "*"
+    "@madgex/fert": "*"
   }
 }

package/repo-templates/template-bigworkbag/package.json

@@ -8,6 +8,6 @@
     "build": "fert build"
   },
   "devDependencies": {
-    "@madgex/frontend-rollout-tool": "*"
+    "@madgex/fert": "*"
   }
 }

package/server/index.js

@@ -1,9 +1,14 @@
 const Hapi = require('@hapi/hapi');
 const Toys = require('@hapipal/toys');
 const path = require('path');
-const { log } = require('../bin/utils');
+const { log } = require('../bin/utils/logging');
 const podletServer = require('@private/header-footer-podlet-server');
-const { VERSION, DEFAULT_DEV_PORT } = require('../constants');
+const {
+  VERSION,
+  DEFAULT_DEV_PORT,
+  PROPERTY_ID_API,
+  ASSETS_API_URL,
+} = require('../constants');
 
 exports.devServer = async ({ start, fertConfig = {} } = {}) => {
   const server = Hapi.server({
@@ -33,6 +38,8 @@ exports.devServer = async ({ start, fertConfig = {} } = {}) => {
       isFert: true,
       isProd: false,
       templatePath: [path.resolve(fertConfig.workingDir, 'templates')],
+      clientPropertiesApi: PROPERTY_ID_API,
+      assetsApiUrl: ASSETS_API_URL,
     },
     routes: { prefix: '/_podlet' },
   });

package/server/plugins/hapi-vite.js

@@ -33,6 +33,16 @@ module.exports = {
               input: options.entry,
             },
           },
+          css: {
+            preprocessorOptions: {
+              scss: {
+                additionalData: `
+                @import "../../public/tokens/scss/index.scss";
+                @import "@madgex/design-system/src/scss/import.scss";
+                `, // all scss processed files gets this injected at the top
+              },
+            },
+          },
         });
 
         await server.app.viteServer.listen();

package/server/routes/views.js

@@ -5,6 +5,7 @@ module.exports = {
   path: '/{page*}',
   handler: async (request, h) => {
     const { page } = request.params;
+    const fertConfig = request.server.fertConfig();
 
     // we'll pass over the headers as ModHeader may be used but
     // remove the browsers 'accept-encoding' header otherwise
@@ -17,16 +18,11 @@ module.exports = {
       method: request.method,
       headers: filteredHeaders,
       auth: request.auth.isAuthenticated ? request.auth : null,
+      app: {
+        clientPropertyId: fertConfig.clientPropertyId,
+      },
     });
 
-    if (podletResponse.statusCode === 200) {
-      try {
-        podletResponse.result = JSON.parse(podletResponse.result);
-      } catch (err) {
-        console.error('Unable to parse podlet response', err);
-      }
-    }
-
     return h.view(page, {
       auth: request.auth,
       podletResponse,