browser-extension-manager 1.0.13 → 1.1.0

package/dist/gulp/tasks/defaults.js

@@ -0,0 +1,308 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('defaults');
+const { src, dest, watch, series } = require('gulp');
+const through2 = require('through2');
+const jetpack = require('fs-jetpack');
+const path = require('path');
+const { minimatch } = require('minimatch');
+const { template } = require('node-powertools');
+const createTemplateTransform = require('./utils/template-transform');
+const argv = require('yargs').argv;
+const JSON5 = require('json5');
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+const config = Manager.getConfig('project');
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
+
+// Get clean versions
+// const cleanVersions = { versions: Manager.getCleanVersions()};
+const cleanVersions = { versions: package.engines };
+
+// File MAP
+const FILE_MAP = {
+  // Files to skip overwrite
+  '**/*.md': {
+    overwrite: false,
+  },
+  'hooks/**/*': {
+    overwrite: false,
+  },
+  'src/**/*': {
+    overwrite: false,
+  },
+  'src/**/*.{html,md}': {
+    skip: (file) => {
+      // Get the name
+      const name = path.basename(file.name, path.extname(file.name));
+      const htmlFilePath = path.join(file.destination, `${name}.html`);
+      const mdFilePath = path.join(file.destination, `${name}.md`);
+      const htmlFileExists = jetpack.exists(htmlFilePath);
+      const mdFileExists = jetpack.exists(mdFilePath);
+      const eitherExists = htmlFileExists || mdFileExists;
+
+      // Skip if both files exist
+      return eitherExists;
+    },
+  },
+
+  // Files to rewrite path
+  // Removed because getting too confusing
+  // 'dist/pages/**/*': {
+  //   path: (file) => file.source.replace('dist/pages', 'dist'),
+  // },
+  '_.gitignore': {
+    name: (file) => file.name.replace('_.gitignore', '.gitignore'),
+  },
+
+  // Config file with smart merging
+  'config/browser-extension-manager.json': {
+    overwrite: true,
+    merge: true,
+  },
+
+  // Files to run templating on
+  '.nvmrc': {
+    template: cleanVersions,
+  },
+
+  // Files to skip
+  '**/.DS_Store': {
+    skip: true,
+  },
+  '**/__temp/**/*': {
+    skip: true,
+  },
+}
+
+// Glob
+const input = [
+  // Files to include
+  `${rootPathPackage}/dist/defaults/**/*`,
+];
+const output = './';
+const delay = 250;
+
+// Index
+let index = -1;
+
+// Helper function to merge configs intelligently
+function mergeConfigs(existingConfig, newConfig) {
+  const merged = { ...newConfig };
+
+  // Recursively merge nested objects
+  function mergeNested(target, source, newDefaults) {
+    for (const key in newDefaults) {
+      if (Object.prototype.hasOwnProperty.call(newDefaults, key)) {
+        const newValue = newDefaults[key];
+        const existingValue = source[key];
+
+        if (typeof newValue === 'object' && newValue !== null && !Array.isArray(newValue)) {
+          // Handle nested objects
+          target[key] = target[key] || {};
+          mergeNested(target[key], existingValue || {}, newValue);
+        } else if (Object.prototype.hasOwnProperty.call(source, key) && existingValue !== 'default') {
+          // User has a custom value, keep it
+          target[key] = existingValue;
+        } else {
+          // User doesn't have this option or has 'default', use new default
+          target[key] = newValue;
+        }
+      }
+    }
+  }
+
+  mergeNested(merged, existingConfig, newConfig);
+
+  return merged;
+}
+
+// Main task
+function defaults(complete, changedFile) {
+  // Increment index
+  index++;
+
+  // Log
+  logger.log('Starting...');
+
+  // Use changedFile if provided, otherwise use all inputs
+  const filesToProcess = changedFile ? [changedFile] : input;
+  logger.log('input', filesToProcess)
+
+  // Log files being used
+  logger.log('Files being used:');
+
+  // Complete
+  // return src(input, { base: 'src' })
+  return src(filesToProcess, { base: `${rootPathPackage}/dist/defaults`, dot: true, encoding: false })  // Add base to preserve directory structure
+    .pipe(customTransform())
+    .pipe(createTemplateTransform({site: config}))
+    .pipe(dest(output, { encoding: false }))
+    .on('finish', () => {
+      // Log
+      logger.log('Finished!');
+
+      // Complete
+      return complete();
+    });
+}
+
+function customTransform() {
+  return through2.obj(function (file, _, callback) {
+    // Skip if it's a directory
+    if (file.isDirectory()) {
+      return callback(null, file);
+    }
+
+    // If the file is named .gitkeep, create the directory but don't copy the file
+    if (path.basename(file.path) === '.gitkeep') {
+      jetpack.dir(path.dirname(path.join(output, path.relative(file.base, file.path))));
+      return callback();
+    }
+
+    // Get relative path
+    const relativePath = path.relative(file.base, file.path).replace(/\\/g, '/');
+
+    // Check if this is a binary file BEFORE any processing
+    const isBinaryFile = /\.(jpg|jpeg|png|gif|webp|svg|ico|woff|woff2|ttf|otf|eot|pdf|zip|tar|gz|mp3|mp4|avi|mov)$/i.test(file.path);
+
+    // Build item
+    const item = {
+      source: path.dirname(file.path),
+      name: path.basename(file.path),
+      destination: path.dirname(relativePath),
+    };
+
+    const options = getFileOptions(relativePath);
+    const ogName = item.name;
+
+    // Handle dynamic rename
+    if (typeof options.name === 'function') {
+      item.name = options.name(item);
+    }
+
+    // Handle dynamic path
+    if (typeof options.path === 'function') {
+      item.destination = options.path(item);
+    }
+
+    // Handle overwrite/skip as functions
+    if (typeof options.overwrite === 'function') {
+      options.overwrite = options.overwrite(item);
+    }
+    if (typeof options.skip === 'function') {
+      options.skip = options.skip(item);
+    }
+
+    // Final relative path
+    const finalRelativePath = path.join(item.destination, item.name);
+    const fullOutputPath = path.join(output, finalRelativePath);
+
+    // Check existence
+    const exists = jetpack.exists(fullOutputPath);
+
+    // Handle config merging
+    if (options.merge && exists && !isBinaryFile) {
+      try {
+        const existingContent = jetpack.read(fullOutputPath);
+        const newContent = file.contents.toString();
+
+        const existingConfig = JSON5.parse(existingContent);
+        const newConfig = JSON5.parse(newContent);
+
+        // Merge configs, preserving user's non-default values
+        const mergedConfig = mergeConfigs(existingConfig, newConfig);
+
+        // Update file contents with merged config
+        file.contents = Buffer.from(JSON5.stringify(mergedConfig, null, 2));
+
+        logger.log(`Merged config file: ${relativePath}`);
+      } catch (error) {
+        logger.error(`Error merging config file ${relativePath}:`, error);
+        // Fall through to normal processing if merge fails
+      }
+    }
+
+    // Skip if instructed
+    if (options.skip || (!options.overwrite && exists && !options.merge)) {
+      logger.log(`Skipping file: ${relativePath}`);
+      return callback();
+    }
+
+    // Log
+    // logger.log(`Processing file: ${relativePath}`);
+    // logger.log(`  _ORIG: ${file.path}`);
+    // logger.log(`  name: ${item.name}`);
+    // logger.log(`  destination: ${item.destination}`);
+    // logger.log(`  overwrite: ${options.overwrite}`);
+    // logger.log(`  skip: ${options.skip}`);
+    // logger.log(`  _FINAL: ${fullOutputPath}`);
+
+    // Run template if required
+    if (options.template && !isBinaryFile) {
+      const contents = file.contents.toString();
+      const templated = template(contents, options.template);
+
+      // Update file contents
+      file.contents = Buffer.from(templated);
+    }
+
+    // Update path
+    file.path = path.join(file.base, finalRelativePath);
+
+    // Push transformed file
+    this.push(file);
+
+    // Complete
+    return callback();
+  });
+}
+function defaultsWatcher(complete) {
+  // Quit if in build mode
+  if (Manager.isBuildMode()) {
+    logger.log('[watcher] Skipping watcher in build mode');
+    return complete();
+  }
+
+  // Log
+  logger.log('[watcher] Watching for changes...');
+
+  // Watch for changes
+  watch(input, { delay: delay, dot: true })
+  .on('change', (changedPath) => {
+    logger.log(`[watcher] File changed (${changedPath})`);
+    // Call defaults with just the changed file
+    defaults(() => {}, changedPath);
+  });
+
+  // Complete
+  return complete();
+}
+
+// Default Task
+module.exports = series(defaults, defaultsWatcher);
+
+function getFileOptions(filePath) {
+  const defaults = {
+    overwrite: true,
+    name: null,
+    path: null,
+    template: null,
+    skip: false,
+    rule: null,
+  };
+
+  let options = { ...defaults };
+
+  for (const pattern in FILE_MAP) {
+    if (minimatch(filePath, pattern)) {
+      options = { ...options, ...FILE_MAP[pattern] };
+      options.rule = pattern;
+    }
+  }
+
+  return options;
+}

package/dist/gulp/tasks/distribute.js

@@ -3,14 +3,15 @@ const Manager = new (require('../../build.js'));
 const logger = Manager.logger('distribute');
 const { src, dest, watch, series } = require('gulp');
 const through2 = require('through2');
-const jetpack = require('fs-jetpack');
 const path = require('path');
-const { execute } = require('node-powertools');
+const jetpack = require('fs-jetpack');
+const createTemplateTransform = require('./utils/template-transform');
 
 // Load package
 const package = Manager.getPackage('main');
 const project = Manager.getPackage('project');
 const manifest = Manager.getManifest();
+const config = Manager.getConfig('project');
 const rootPathPackage = Manager.getRootPath('main');
 const rootPathProject = Manager.getRootPath('project');
 
@@ -20,7 +21,17 @@ const input = [
   'src/**/*',
 
   // Files to exclude
-  // '!dist/**',
+  // Images handled by imagemin
+  '!src/**/*.{jpg,jpeg,png,gif,svg,webp}',
+  // JS files handled by webpack
+  '!src/**/*.js',
+  // CSS/SCSS files handled by sass task
+  '!src/**/*.{css,scss,sass}',
+  // HTML files in views handled by html task
+  '!src/views/**/*.html',
+  // Exlcude .DS_Store files
+  '!**/.DS_Store',
+  // Exclude any temp files
 ];
 const output = 'dist';
 const delay = 250;
@@ -28,60 +39,95 @@ const delay = 250;
 // Index
 let index = -1;
 
-// Main task
-async function distribute(complete) {
-  // Increment index
-  index++;
+// Copy FontAwesome webfonts from node_modules if installed
+function copyFontAwesomeWebfonts() {
+  const fontAwesomeWebfontsSource = path.resolve(rootPathProject, 'node_modules/@fortawesome/fontawesome-free/webfonts');
+  const fontAwesomeWebfontsDest = path.resolve(rootPathProject, 'dist/assets/webfonts');
 
-  // Log
-  logger.log('Starting...');
+  // Check if FontAwesome is installed
+  if (!jetpack.exists(fontAwesomeWebfontsSource)) {
+    logger.log('[FontAwesome] Not installed, skipping webfonts copy');
+    return;
+  }
 
-  // Create build JSON
-  await createBuildJSON();
+  // Create destination directory
+  jetpack.dir(fontAwesomeWebfontsDest);
 
-  // Complete
-  return src(input, { base: 'src' })
-    // .pipe(customPathTransform())
-    .pipe(dest(output))
-    .on('end', () => {
-      // Log
-      logger.log('Finished!');
-
-      // Complete
-      return complete();
-    });
+  // Copy .woff2 files
+  const webfontFiles = jetpack.find(fontAwesomeWebfontsSource, { matching: '*.woff2' });
+
+  webfontFiles.forEach(file => {
+    const fileName = path.basename(file);
+    const destPath = path.join(fontAwesomeWebfontsDest, fileName);
+    jetpack.copy(file, destPath, { overwrite: true });
+    logger.log(`[FontAwesome] Copied ${fileName}`);
+  });
+
+  logger.log(`[FontAwesome] Copied ${webfontFiles.length} webfont file(s)`);
+}
+
+// Main task
+function distribute() {
+  return new Promise(async function(resolve, reject) {
+    // Increment index
+    index++;
+
+    // Log
+    logger.log('Starting...');
+
+    // Copy FontAwesome webfonts first
+    copyFontAwesomeWebfonts();
+
+    // Complete
+    return src(input, {
+      base: 'src',
+      dot: true,
+      encoding: false
+    })
+      .pipe(customTransform())
+      .pipe(createTemplateTransform({site: config}))
+      .pipe(dest(output, { encoding: false }))
+      .on('finish', () => {
+        // Log
+        logger.log('Finished!');
+
+        // Complete
+        return resolve();
+      });
+  });
 }
 
-function customPathTransform() {
+function customTransform() {
   return through2.obj(function (file, _, callback) {
     // Skip if it's a directory
     if (file.isDirectory()) {
       return callback(null, file);
     }
 
-    // Get relative path
-    const relativePath = path.relative(file.base, file.path);
+    // Get relative path from src base
+    const relativePath = path.relative(file.base, file.path).replace(/\\/g, '/');
 
     // Log
-    // logger.log(`Processing file 111: ${relativePath}`);
+    logger.log(`Processing file: ${relativePath}`);
 
     // Change path if it starts with 'pages/'
-    if (relativePath.startsWith('pages/')) {
-      const newRelativePath = relativePath.replace(/^pages\//, '');
-      file.path = path.join(file.base, newRelativePath);
+    // if (relativePath.startsWith('pages/')) {
+    //   // Remove 'pages/' prefix
+    //   const newRelativePath = relativePath.replace(/^pages\//, '');
 
-      // Log
-      // logger.log(`Changed path to 222: ${file.path}`);
-    }
+    //   // Update file path to remove pages directory
+    //   // This will make src/pages/index.html -> dist/index.html
+    //   file.path = path.join(file.base, newRelativePath);
 
-    // Log
-    // logger.log(`Processing file 333: ${file.path}`);
+    //   // Log
+    //   logger.log(`  -> Moving from pages/ to root: ${newRelativePath}`);
+    // }
 
     // Push the file
     this.push(file);
 
     // Continue
-    callback(null, file);
+    callback();
   });
 }
 
@@ -97,7 +143,7 @@ function distributeWatcher(complete) {
   logger.log('[watcher] Watching for changes...');
 
   // Watch for changes
-  watch(input, { delay: delay }, distribute)
+  watch(input, { delay: delay, dot: true }, distribute)
   .on('change', function(path) {
     logger.log(`[watcher] File ${path} was changed`);
   });
@@ -107,59 +153,8 @@ function distributeWatcher(complete) {
 }
 
 // Default Task
-module.exports = series(distribute, distributeWatcher);
-
-
-// Get git info
-async function getGitInfo() {
-  return await execute('git remote -v')
-  .then((r) => {
-    // Split on whitespace
-    const split = r.split(/\s+/);
-    const url = split[1];
-
-    // Get user and repo
-    const user = url.split('/')[3];
-    const name = url.split('/')[4].replace('.git', '');
-
-    // Return
-    return {user, name};
-  })
-}
-
-// Create build.json
-async function createBuildJSON() {
-  // Create build log JSON
-  try {
-    // Get info first
-    const git = await getGitInfo();
-
-    // Create JSON
-    const json = {
-      timestamp: new Date().toISOString(),
-      repo: {
-        user: git.user,
-        name: git.name,
-      },
-      environment: Manager.getEnvironment(),
-      packages: {
-        'web-manager': require('web-manager/package.json').version,
-        [package.name]: package.version,
-      },
-      manifest: manifest,
-    }
-
-    // Log object
-    // logger.log('Build JSON:', json);
-
-    // Write to file
-    jetpack.write('dist/build.json', JSON.stringify(json, null, 2));
-
-    // Log
-    logger.log('Created build.json');
-  } catch (e) {
-    console.error('Error updating build.json', e);
-  }
-}
-
-
+module.exports = series(
+  // Manager.wrapTask('distribute', distribute),
+  distribute,
+  distributeWatcher
+);

package/dist/gulp/tasks/html.js

@@ -0,0 +1,150 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('html');
+const { src, dest, watch, series } = require('gulp');
+const through2 = require('through2');
+const jetpack = require('fs-jetpack');
+const path = require('path');
+const { template } = require('node-powertools');
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+const config = Manager.getConfig('project');
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
+
+// Glob
+const input = [
+  // Files to include
+  'src/views/**/*.html',
+
+  // Files to exclude
+  '!src/views/**/_*.html',
+];
+const output = 'dist/views';
+const delay = 250;
+
+// Main task
+function html(complete) {
+  // Log
+  logger.log('Starting...');
+
+  // Load the template
+  const templatePath = path.join(rootPathPackage, 'dist', 'config', 'page-template.html');
+  const templateContent = jetpack.read(templatePath);
+
+  if (!templateContent) {
+    logger.error('Template not found at:', templatePath);
+    return complete();
+  }
+
+  // Process HTML files
+  return src(input)
+    .pipe(processHtml(templateContent))
+    .pipe(dest(output))
+    .on('finish', () => {
+      logger.log('Finished!');
+      return complete();
+    });
+}
+
+// Process HTML transform
+function processHtml(templateContent) {
+  return through2.obj(function (file, _, callback) {
+    // Skip if it's a directory
+    if (file.isDirectory()) {
+      return callback(null, file);
+    }
+
+    try {
+      // Get the view name from the file path
+      const viewName = path.basename(file.path, '.html');
+      const relativePath = path.relative(path.join(rootPathProject, 'src/views'), file.dirname);
+      const viewNameWithPath = relativePath ? `${relativePath}/${viewName}` : viewName;
+
+      // Read the content (body HTML)
+      const bodyContent = file.contents.toString();
+
+      // Determine the component name for CSS/JS loading
+      // Template already includes /components/ prefix, so just provide the component path
+      // Pages can have multiple files (index, pricing, login, etc.)
+      // Other components (popup, options, etc.) only have index.html
+      let componentName;
+      if (relativePath.startsWith('pages/') || relativePath === 'pages') {
+        // Pages directory: include full path with filename
+        // pages/index.html -> pages/index
+        // pages/pricing.html -> pages/pricing
+        componentName = viewNameWithPath;
+      } else if (relativePath && viewName === 'index') {
+        // Other components with index.html: use just the directory name
+        // popup/index.html -> popup
+        // options/index.html -> options
+        componentName = relativePath;
+      } else if (relativePath) {
+        // Non-index files in other directories: use full path
+        componentName = viewNameWithPath;
+      } else {
+        // No path: use viewName
+        componentName = viewName;
+      }
+
+      // Prepare template data
+      const data = {
+        content: bodyContent,
+        page: {
+          name: componentName,
+          path: viewNameWithPath,
+          title: config.brand?.name || 'Extension',
+        },
+        theme: {
+          appearance: config.theme?.appearance || 'dark',
+        },
+        brand: config.brand || {},
+        cacheBust: Date.now(),
+      };
+
+      // Apply template with custom brackets
+      const rendered = template(templateContent, data, {
+        brackets: ['{{', '}}'],
+      });
+
+      // Update file contents
+      file.contents = Buffer.from(rendered);
+
+      // Log
+      logger.log(`Processed: ${viewNameWithPath}.html`);
+
+      // Push the file
+      this.push(file);
+      return callback();
+    } catch (error) {
+      logger.error('Error processing HTML:', error);
+      return callback(error);
+    }
+  });
+}
+
+// Watcher task
+function htmlWatcher(complete) {
+  // Quit if in build mode
+  if (Manager.isBuildMode()) {
+    logger.log('[watcher] Skipping watcher in build mode');
+    return complete();
+  }
+
+  // Log
+  logger.log('[watcher] Watching for changes...');
+
+  // Watch for changes
+  watch(input, { delay: delay, dot: true }, html)
+    .on('change', function (path) {
+      logger.log(`[watcher] File ${path} was changed`);
+    });
+
+  // Complete
+  return complete();
+}
+
+// Export task
+module.exports = series(html, htmlWatcher);