@madgex/fert 3.0.1 → 4.1.0

package/bin/cli.js

@@ -38,6 +38,18 @@ const run = () => {
     .option('--target <env>', 'Environment to publish to, "dev" or "prod"')
     .action((...args) => require('./commands/publish')(...args));
 
+  cli
+    .command('configs [root]', 'Query/Publish project configs')
+    .option(
+      '--publish <env>',
+      'Publish configs to Configuration API environment "dev" or "production"'
+    )
+    .option(
+      '--query [configName]',
+      'Describe known keys for a config, omit to list all known configs'
+    )
+    .action((...args) => require('./commands/configs')(...args));
+
   cli
     .command('init [root]', 'Create a new branding project')
     .option('--template <template>', 'Template to use when scaffolding project')

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

@@ -63,7 +63,6 @@ module.exports = async function buildCssFromTokens(srcTokensPath, buildPath) {
     'name/cti/kebab',
     'color/css',
     'css/rawData',
-    'custom/pxToRem',
   ];
   const prefix = 'mds';
 
@@ -102,8 +101,7 @@ module.exports = async function buildCssFromTokens(srcTokensPath, buildPath) {
   // Use StyleDictionary to build a tokens SCSS file
   const StyleDictionary = StyleDictionaryPackage.extend(styleDictionaryConfig);
 
-  const tokenBaseFontSize = brandObj?.font?.size?.base?.value; // will default to 16px if undefined
-  await registerTransforms(StyleDictionary, tokenBaseFontSize);
+  await registerTransforms(StyleDictionary);
   await runSilently(StyleDictionary.buildAllPlatforms.bind(StyleDictionary));
 
   // clean-up temp SD file

package/bin/commands/build.js

@@ -5,9 +5,11 @@ 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');
+const { validateLocalConfigs } = require('../utils/configs.js');
 
 module.exports = async (root, options = {}) => {
   const fertConfig = await resolveConfig(root, options);
+  await validateLocalConfigs(fertConfig, { catch: false });
 
   if (!options.only) {
     await rimraf(path.resolve(fertConfig.workingDir, 'dist'));

package/bin/commands/configs.js

@@ -0,0 +1,70 @@
+const { resolveConfig } = require('../utils/index.js');
+const {
+  getConfigAPI,
+  validateLocalConfigs,
+  updateProjectConfigs,
+} = require('../utils/configs.js');
+const chalk = require('chalk');
+const { log } = require('../utils/logging.js');
+
+module.exports = async (root, options) => {
+  const fertConfig = await resolveConfig(root, options);
+  const api = await getConfigAPI(fertConfig);
+
+  if (!options.publish && !options.query) {
+    console.log(chalk.red(`Missing required --publish or --query option`));
+  }
+
+  if (options.publish) {
+    const validTargets = ['dev', 'production'];
+
+    if (!validTargets.includes(options.publish)) {
+      throw Error(
+        `Missing or invalid --publish option. Choose from [${validTargets}]`
+      );
+    }
+
+    try {
+      await validateLocalConfigs(fertConfig, { catch: false });
+      await updateProjectConfigs(fertConfig, { environment: options.publish });
+    } catch (err) {
+      log.debug(err);
+      process.exit(1);
+    }
+  } else if (options.query) {
+    try {
+      if (options.query !== true) {
+        console.log(
+          chalk.cyan(`\nGetting ${options.query} schema description...`)
+        );
+        const schema = api.schemas[options.query];
+        if (!schema) {
+          console.error(chalk.red(`Schema not found for ${options.query}`));
+          return;
+        }
+
+        console.log(JSON.stringify(schema.describe().keys, null, 2));
+        console.log(
+          `\n${chalk.cyan('Defaults')}:\n${JSON.stringify(schema.validate({}), null, 2)}`
+        );
+        return;
+      }
+
+      console.log(chalk.cyan(`\nAvailable config schemas...`));
+      console.log(
+        Object.keys(api.schemas)
+          .sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()))
+          .map((key) => ` * ${key}`)
+          .join('\n'),
+        '\n'
+      );
+
+      console.log(
+        'Use `fert configs <configName>` to get a specific schema description'
+      );
+    } catch (err) {
+      log.debug(err);
+      process.exit(1);
+    }
+  }
+};

package/bin/commands/dev-server.js

@@ -4,6 +4,7 @@ const open = require('open');
 const chokidar = require('chokidar');
 const { resolveConfig } = require('../utils/index.js');
 const { log } = require('../utils/logging.js');
+const { validateLocalConfigs } = require('../utils/configs.js');
 const { devServer } = require('../../server');
 const { buildTokens, buildExternalAssets } = require('./build.js');
 const {
@@ -22,9 +23,18 @@ module.exports = async (root, options = {}) => {
     )}\n`
   );
 
+  await validateLocalConfigs(fertConfig);
+  await buildTokens(fertConfig);
+
+  // watch local configs - revalidate on change
+  const configsPath = path.resolve(fertConfig.workingDir, './config/*.json');
+  chokidar.watch(configsPath, { ignoreInitial: true }).on('all', async () => {
+    await validateLocalConfigs(fertConfig);
+  });
+
   // watch brand.json & fert.config.js - refresh on change
   const brandPath = path.resolve(fertConfig.workingDir, BRAND_JSON_FILENAME);
-  chokidar.watch(brandPath).on('all', async () => {
+  chokidar.watch(brandPath, { ignoreInitial: true }).on('all', async () => {
     await buildTokens(fertConfig);
   });
 

package/bin/commands/publish.js

@@ -5,6 +5,10 @@ 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 {
+  validateLocalConfigs,
+  updateProjectConfigs,
+} = require('../utils/configs.js');
 const {
   getCloudFrontDistributionsForDomain,
 } = require('../utils/lookup-cf-distribution-ids');
@@ -62,29 +66,40 @@ module.exports = async (root, options) => {
     )}\n`
   );
 
-  // send to S3 using the Asset Store API
-  const assetStore = new AssetStoreUploader({
-    apiUrl,
-    apiKey,
-    basePath: remoteBasePath,
-  });
+  try {
+    // send to S3 using the Asset Store API
+    const assetStore = new AssetStoreUploader({
+      apiUrl,
+      apiKey,
+      basePath: remoteBasePath,
+    });
 
-  const uploadResult = await assetStore.uploadDir(localDir);
+    const uploadResult = await assetStore.uploadDir(localDir);
 
-  log.success(
-    `Publish complete in ${(uploadResult.duration / 1000).toFixed(0)}s\n`
-  );
+    // validate & upload local configs to configuration API
+    await validateLocalConfigs(fertConfig);
+    await updateProjectConfigs(fertConfig),
+      {
+        environment: fertConfig.currBranch === 'master' ? 'production' : 'dev',
+      };
 
-  // invalidate cloudfront cache
-  await assetStore.invalidatePaths([assetStoreInvPath]);
+    log.success(
+      `Publish complete in ${(uploadResult.duration / 1000).toFixed(0)}s\n`
+    );
 
-  for (let dist of clientCloudFrontDists) {
-    await assetStore.invalidatePaths([brandedSiteInvPath], dist.id);
-  }
+    // invalidate cloudfront cache
+    await assetStore.invalidatePaths([assetStoreInvPath]);
 
-  log.info(
-    `\nNote cloudfront invalidations may take upto ${chalk.yellow(
-      '30 seconds'
-    )} to complete.\n`
-  );
+    for (let dist of clientCloudFrontDists) {
+      await assetStore.invalidatePaths([brandedSiteInvPath], dist.id);
+    }
+
+    log.info(
+      `\nNote cloudfront invalidations may take upto ${chalk.yellow(
+        '30 seconds'
+      )} to complete.\n`
+    );
+  } catch (error) {
+    log.error('An error occurred during the publish process', error);
+  }
 };

package/bin/utils/configs.js

@@ -0,0 +1,208 @@
+const fs = require('node:fs');
+const path = require('node:path');
+const Hoek = require('@hapi/hoek');
+const { log } = require('../utils/logging');
+const chalk = require('chalk');
+const ora = require('ora');
+
+/**
+ * Validates the local configuration files against the provided schema.
+ *
+ * @param {Object} fertConfig - The project config.
+ * @param {Object} options - The options object.
+ * @param {boolean} options.catch - Whether to catch validation errors or just log them.
+ *
+ * @returns {Promise<void>} - Returns a promise that resolves if all configurations are valid.
+ * @throws {Error} - Throws an error if any configuration is invalid.
+ */
+const validateLocalConfigs = async (fertConfig, options = { catch: true }) => {
+  Hoek.assert(fertConfig, 'fertConfig is required');
+
+  const api = await getConfigAPI({
+    clientPropertyId: fertConfig.clientPropertyId,
+  });
+  const localConfigs = loadLocalConfigs(fertConfig);
+
+  const validationPromises = Object.keys(localConfigs).map(
+    async (configName) => {
+      try {
+        const schema = api.getSchema(configName);
+        const { error } = schema.validate(localConfigs[configName].data);
+        if (error) {
+          throw new Error(
+            `Config invalid: ${chalk.bold(localConfigs[configName].path)} - ${error.message}`
+          );
+        }
+
+        log.success(`Config validated:`, chalk.bold(configName));
+      } catch (err) {
+        log.error(err.message);
+
+        if (!options.catch) {
+          throw err;
+        }
+      }
+    }
+  );
+
+  await Promise.all(validationPromises);
+};
+
+const getConfigAPI = async ({
+  clientPropertyId,
+  environment = 'production',
+} = {}) => {
+  const { ConfigAPI } = await import('@madgex/config-api-sdk');
+
+  const api = new ConfigAPI({
+    clientPropertyId,
+    environment,
+  });
+
+  await api.loadSchemas();
+
+  return api;
+};
+
+const loadLocalConfigs = (fertConfig) => {
+  const dir = path.join(fertConfig.workingDir, 'config');
+  const configs = {};
+
+  if (!fs.existsSync(dir)) {
+    throw new Error(`Directory does not exist: ${dir}`);
+  }
+
+  const files = fs.readdirSync(dir);
+
+  files.forEach((file) => {
+    const filePath = path.join(dir, file);
+
+    if (fs.statSync(filePath).isFile()) {
+      const fileName = path.basename(file, path.extname(file));
+
+      // Purge any existing cache of the file
+      delete require.cache[filePath];
+
+      try {
+        configs[fileName] = {
+          path: filePath,
+          data: require(filePath),
+        };
+      } catch (err) {
+        log.error(`Error loading config: ${err.message}`);
+      }
+    }
+  });
+
+  return configs;
+};
+
+/**
+ * Handles the removal and setting of project configs in the Configuration API.
+ *
+ * @param {Object} fertConfig - The project config.
+ *
+ * @returns {Promise<boolean>} - Returns a promise that resolves to true if the update is successful.
+ */
+const updateProjectConfigs = async (
+  fertConfig,
+  { environment = 'production' } = {}
+) => {
+  Hoek.assert(fertConfig, 'fertConfig is required');
+
+  let spinner;
+
+  try {
+    const api = await getConfigAPI({
+      clientPropertyId: fertConfig.clientPropertyId,
+      environment,
+    });
+    spinner = ora('Fetching local configs').start();
+
+    const localConfigs = loadLocalConfigs(fertConfig);
+    const { toRemove, toSet } = collateConfigs(api, localConfigs);
+
+    spinner.text = 'Updating configs…';
+    await Promise.all([removeConfigs(api, toRemove), setConfigs(api, toSet)]);
+
+    const { host } = new URL(api.options.apiUrl);
+    spinner.succeed(`Project configs applied to ${chalk.bold(host)}`);
+
+    return true;
+  } catch (error) {
+    spinner.fail('Failed to apply project configs');
+    log.error(error);
+    throw error;
+  }
+};
+
+const collateConfigs = (api, localConfigs) => {
+  const toRemove = {};
+  const toSet = {};
+
+  Object.entries(localConfigs).forEach(
+    ([configName, { data: config = {} } = {}]) => {
+      const configDefault = api._getDefaultConfig(configName);
+
+      const unsetKeysWithDefaults = getUnsetKeysWithDefaults(
+        configDefault,
+        config
+      );
+      toRemove[configName] = Object.keys(unsetKeysWithDefaults);
+      toSet[configName] = config;
+    }
+  );
+
+  return { toRemove, toSet };
+};
+
+const getUnsetKeysWithDefaults = (defaults = {}, config = {}) => {
+  Hoek.assert(
+    typeof defaults === 'object' && defaults !== null,
+    'defaults must be an object'
+  );
+  Hoek.assert(
+    typeof config === 'object' && config !== null,
+    'config must be an object'
+  );
+
+  const diff = {};
+  for (const key in defaults) {
+    if (!Object.keys(config).includes(key)) {
+      diff[key] = defaults[key];
+    }
+  }
+  return diff;
+};
+
+const removeConfigs = async (api, toRemove) => {
+  const deletePromises = Object.entries(toRemove).flatMap(
+    ([configName, keys]) =>
+      keys.map((key) =>
+        api.deleteConfig(configName, key).catch((error) => {
+          log.error('Failed to remove config', { configName, key, error });
+        })
+      )
+  );
+
+  await Promise.all(deletePromises);
+};
+
+const setConfigs = async (api, toSet) => {
+  const setPromises = Object.entries(toSet).flatMap(([configName, config]) =>
+    Object.entries(config).map(async ([key, value]) => {
+      try {
+        await api.setConfig(configName, key, value);
+      } catch (error) {
+        log.error('Failed to set config', { configName, key, value, error });
+      }
+    })
+  );
+
+  await Promise.all(setPromises);
+};
+module.exports = {
+  getConfigAPI,
+  validateLocalConfigs,
+  updateProjectConfigs,
+};

package/bin/utils/index.js

@@ -4,19 +4,19 @@ const { VERSION, SITE } = require('../../constants');
 const chalk = require('chalk');
 const uuidValidator = require('uuid-validate');
 const Hoek = require('@hapi/hoek');
+const simpleGit = require('simple-git');
 const { cpidLookup } = require('./cpid-lookup');
 const { cpIdMatchesGitRemote } = require('./cpid-matches-git-remote');
 const { resolveExternalAssets } = require('./resolve-external-assets');
 const { log } = require('./logging');
 const { CONFIG_API } = require('../../constants');
-const assert = require('node:assert');
 
 exports.printBanner = () => {
   console.log(`\n${chalk.green.bold('Fert')} v${VERSION}`);
 };
 
 exports.getConfig = async (cpid, configNames = []) => {
-  assert(Array.isArray(configNames), 'configNames must be an array');
+  Hoek.assert(Array.isArray(configNames), 'configNames must be an array');
 
   const result = {};
 
@@ -42,6 +42,7 @@ exports.resolveConfig = async (root, options = {}) => {
   };
 
   const workingDir = root ? path.resolve(root) : path.resolve(process.cwd());
+  const git = simpleGit({ baseDir: workingDir });
 
   const fertConfig = Hoek.applyToDefaults(
     defaults,
@@ -54,8 +55,10 @@ exports.resolveConfig = async (root, options = {}) => {
     `Invalid clientPropertyId specified in fert.config.js: ${fertConfig.clientPropertyId}`
   );
 
-  // Check Fert cpid matches git's remote
+  // get & store the current git branch
+  fertConfig.currBranch = (await git.branch()).current;
 
+  // Check Fert cpid matches git's remote
   const fertCpidMatchesGitRemote = await cpIdMatchesGitRemote(
     fertConfig,
     workingDir

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@madgex/fert",
-  "version": "3.0.1",
+  "version": "4.1.0",
   "description": "Tool to help build the V6 branding",
   "bin": {
     "fert": "./bin/cli.js"
@@ -18,7 +18,7 @@
     "url": "https://github.com/wiley/madgex-frontend-rollout-tool.git"
   },
   "engines": {
-    "node": ">=16.0.0"
+    "node": ">=18.20.0"
   },
   "author": "Madgex",
   "license": "UNLICENSED",
@@ -31,7 +31,8 @@
     "@hapi/inert": "^7.1.0",
     "@hapi/vision": "^7.0.3",
     "@hapipal/toys": "^4.0.0",
-    "@madgex/design-system": "^6.1.4",
+    "@madgex/config-api-sdk": "^1.0.6",
+    "@madgex/design-system": "^7.0.0",
     "@private/header-footer-podlet-server": "github:wiley/madgex-header-footer-podlet",
     "axios": "^1.6.2",
     "cac": "^6.7.14",

package/server/templates/page1.njk

@@ -28,7 +28,7 @@
         </div>
         <div class="mds-grid-col-12 mds-grid-col-lg-3">
         <div class="mds-branded-container mds-branded-container--1 mds-padding-b4 mds-padding-bottom-b5 mds-margin-bottom-b5">
-            <h2 class="mds-font-great-primer">Branded Container</h2>
+            <h2 class="mds-font-s2">Branded Container</h2>
             <p class="mds-margin-bottom-b4">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
             <a href="#" draggable="false" class="mds-button mds-button--neutral mds-button--small">Lorem ipsum</a>
         </div>