at-builder 1.2.2 → 1.2.4

package/.claude/settings.local.json

@@ -4,7 +4,8 @@
       "Bash(npm run build:prod:*)",
       "Bash(node:*)",
       "Bash(npx tsc:*)",
-      "Bash(find:*)"
+      "Bash(find:*)",
+      "Bash(rm:*)"
     ],
     "deny": []
   }

package/.plop/generators/actions.js

@@ -11,10 +11,8 @@ const fs = require('fs');
  * @returns {Array} - Array of actions that plop needs to perform
  */
 exports.actionHandler = (data) => {
-    let { executionPath } = process.env;
     let actions = [];
     let fileName = '';
-    let componentType = '';
     let folderName = '';
     let testPath = '';
     let numberOfVariations;
@@ -30,44 +28,52 @@ exports.actionHandler = (data) => {
         { 'global': true, 'path': `${testPath}/Vanalytics/analytics.js`, 'templateFile': `${TEMPLATE_DIR}/analytics.hbs`, variation },
         { 'global': false, 'path': `${folderName}/constants/index.js`, 'templateFile': `${TEMPLATE_DIR}/constants.hbs`, variation },
         { 'global': false, 'path': `${folderName}/scripts/app.js`, 'templateFile': `${TEMPLATE_DIR}/component.cb.hbs`, variation },
-        { 'global': false, 'path': `${folderName}/css/style.scss`, 'templateFile': `${TEMPLATE_DIR}/style.hbs`, variation }
+        { 'global': false, 'path': `${folderName}/css/style.scss`, 'templateFile': `${TEMPLATE_DIR}/style.hbs`, variation },
+        { 'global': true, 'path': `${testPath}/shared/build.config.json`, 'templateFile': `${TEMPLATE_DIR}/build.config.hbs`, variation }
         ];
     }
 
-    // Get the track path from the environment variable
-    trackName = executionPath + "/Activities";
-    // trackName = path.join(fs.readFileSync(path.join(process.cwd(), 'sample.txt'), { flag: 'r' }).toString(), 'Activities');
+    // Get the activities path from environment variables (same approach as webpack config)
+    const PWD = process.env.executionPath || process.cwd();
+    console.log(`📁 Using ACTIVITIES_BASE_FOLDER directory: ${process.env.executionPath}`);
+    const ACTIVITIES_BASE_FOLDER = process.env.ACTIVITIES_BASE_FOLDER || 'Activities';
+    trackName = path.join(PWD, ACTIVITIES_BASE_FOLDER);
+
+    // Log the activities path for debugging
+    console.log(`📁 Using activities directory: ${trackName}`);
+
+    // Ensure the activities directory exists
+    if (!fs.existsSync(trackName)) {
+        fs.mkdirSync(trackName, { recursive: true });
+        console.log(`📁 Created activities directory: ${trackName}`);
+    }
 
     // Convert the name to camel case
     fileName = toCamelCase(name);
 
     // Get the number of variations from the user
     numberOfVariations = parseInt(variationName);
-    
+
     let constantMappingFile = null;
 
     // If the user has provided track name and test name and variation name
     if (trackName && testName && variationName) {
         // Get the current year
-        let year = new Date().getFullYear();
-        // testPath = trackName + `/${year}/` + testName;
         testPath = trackName + `/${testName}`;
         // Get the constant mapping
         constantMappingFile = assignConstants();
         // Convert the name to pascal case
         fileName = toPascalCase(name);
-        // Set the component type
-        componentType = TEMPLATE_TYPE_SUFFIX_CLASS_BASED;
     }
 
     // Create actions for the global files
     createActionObject(true);
 
-    
+
 
     // Loop through the number of variations provided by the user
     let i = 1;
-    
+
     do {
         // Get the variation name
         let variation = "Variation-" + i;
@@ -111,9 +117,70 @@ exports.actionHandler = (data) => {
         });
     }
 
+    // Update .env file with the new activity name
+    updateEnvFile(testName);
     
+    // Show completion message
+    console.log(`\n🎉 Activity "${testName}" created successfully!`);
+    console.log(`📁 Location: ${testPath}`);
+    console.log(`📋 Number of variations: ${numberOfVariations}`);
+    console.log(`🔧 ACTIVITY_FOLDER_NAME updated in .env file`);
+    console.log(`\n💡 Run "atb build" to build your activity`);
+    console.log(`💡 Run "atb doctor" to check your configuration`);
 
     // Return the actions
     return actions;
 }
 
+/**
+ * Updates the .env file with the new activity folder name
+ * @param {string} activityName - The name of the activity to set in ACTIVITY_FOLDER_NAME
+ */
+function updateEnvFile(activityName) {
+    const PWD = process.env.executionPath || process.cwd();
+    const envPath = path.join(PWD, '.env');
+    
+    if (!fs.existsSync(envPath)) {
+        console.log('⚠️ .env file not found, skipping ACTIVITY_FOLDER_NAME update');
+        console.log('💡 Run "atb init" to create .env file');
+        return;
+    }
+    
+    if (!activityName || activityName.trim() === '') {
+        console.log('⚠️ Activity name is empty, skipping .env update');
+        return;
+    }
+    
+    try {
+        // Read the current .env file
+        let envContent = fs.readFileSync(envPath, 'utf8');
+        
+        // Clean activity name (remove quotes if present)
+        const cleanActivityName = activityName.trim().replace(/^["']|["']$/g, '');
+        
+        // Update or add ACTIVITY_FOLDER_NAME
+        const activityFolderRegex = /^ACTIVITY_FOLDER_NAME=.*$/m;
+        const newLine = `ACTIVITY_FOLDER_NAME="${cleanActivityName}"`;
+        
+        if (activityFolderRegex.test(envContent)) {
+            // Update existing line
+            envContent = envContent.replace(activityFolderRegex, newLine);
+            console.log(`✅ Updated ACTIVITY_FOLDER_NAME to "${cleanActivityName}" in .env file`);
+        } else {
+            // Add new line if it doesn't exist, ensure it ends with newline
+            if (!envContent.endsWith('\n')) {
+                envContent += '\n';
+            }
+            envContent += newLine;
+            console.log(`✅ Added ACTIVITY_FOLDER_NAME="${cleanActivityName}" to .env file`);
+        }
+        
+        // Write the updated content back to .env file
+        fs.writeFileSync(envPath, envContent, 'utf8');
+        
+    } catch (error) {
+        console.error(`❌ Error updating .env file: ${error.message}`);
+        console.log('💡 You may need to manually set ACTIVITY_FOLDER_NAME in your .env file');
+    }
+}
+

package/.plop/templates/analytics.hbs

@@ -5,8 +5,16 @@
              * Mutation observer initialize
             */
 
-            var observer = new MutationObserver(function (mutations) {
-                 
+            const observer = new MutationObserver(function (mutations) {
+                mutations.forEach(function (mutation) {
+                    if (mutation.addedNodes.length) {
+                        mutation.addedNodes.forEach(function (node) {
+                            if (node.classList) {
+                                // do something
+                            }
+                        });
+                    }
+                });
             });
 
             // observing now
@@ -19,5 +27,7 @@
             window.{{windowFlagName}} = true;
         }  
     }
-    catch(err){}
+    catch (err){
+        console.log(err);
+    }
 }());

package/.plop/templates/build.config.hbs

@@ -0,0 +1,7 @@
+{
+    "activityInfo": {
+        "id": null,
+        "name": "",
+        "variations": {}
+    }
+}

package/.plop/templates/component.cb.hbs

@@ -1,34 +1,79 @@
-{{!-- import { Observer } from '../../../../.globals/services/observer';
-import { logger } from '../../../../.globals/services/logger';
-import { GetDOMElement } from '../../../../.globals/services/domHandler'; --}}
-{{!-- import * as CONSTANTS from '../constants'; --}}
+// import * as CONSTANTS from '../constants';
 
 export class App {
-    
     /**
-    * @param define constructor properties 
+    * @param define constructor properties
     */
-    constructor(){
-        {{!-- this.domHandler = GetDOMElement;
-        this.loggerService  = logger; --}}
-    };
+    constructor() {
+        this.state = {}; // For managing app state
+    }
 
     /**
-    *  Executes on load of the test , observer is initialised
+    *  Initializes the application, sets up observer and logs the event
     */
     init = () => {
-        {{!-- this.observer = new Observer();
-        this.observer.setObserver(this.callback); --}}
+        this.isRunning = true;
+        this.onStart();
+    }
+
+    /**
+    *  Starts the app or app-specific functionality
+    */
+    onStart = () => {
+        // Additional initialization logic (e.g., setting up listeners, data fetching)
+    }
+
+    /**
+    *  Reset the app to its initial state
+    */
+    reset = () => {
+        this.state = {}; // Reset state
+        this.onStart(); // Optionally restart app functionality
     }
 
     /**
-    *  Disconnet mutation observer , clear any window variable or perform cleanup activity
+    *  Disconnect mutation observer , clear any window variable or perform cleanup activity
     */
-    destroy(){};
- 
+    destroy = () => {
+    }
+
+    /**
+    *  Handles errors that occur within the app
+    * @param {string} message - Error message to log
+    * @param {Error} error - Optional error object
+    */
+    handleError = (message, error = null) => {
+        // Additional error handling (e.g., sending error details to a server)
+    }
+
+    /**
+    *  Logs app's current state
+    */
+    logState = () => {
+    }
+
+    /**
+    *  Sets or updates a property in the app's state
+    * @param {string} key - The key of the state property
+    * @param {any} value - The value to set
+    */
+    setState = (key, value) => {
+        this.state[key] = value;
+    }
+
+    /**
+    *  Gets a property from the app's state
+    * @param {string} key - The key of the state property
+    * @returns {any} - The value of the state property
+    */
+    getState = (key) => {
+        return this.state[key];
+    }
+
     /**
     *  Mutation Observer Callback
     */
     callback = () => {
+        // Callback logic for mutation observer
     }
 }

package/CustomWrapperPlugin.js

@@ -58,4 +58,4 @@ class CustomWrapperPlugin {
     }
 }
 
-module.exports = CustomWrapperPlugin;
+export default CustomWrapperPlugin;

package/README.md

@@ -3,14 +3,20 @@
 [![npm version](https://badge.fury.io/js/at-builder.svg)](https://www.npmjs.com/package/at-builder)  
 [![License](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
 
-`at-builder` is a simple command-line tool designed to streamline Adobe Target activity creation and building processes.
+A streamlined command-line tool for creating, building, and deploying Adobe Target A/B testing activities with modern web technologies.
 
 ---
 
-## **Features**
+## **🎯 Features**
 
-- 🔧 **Prod Build**: Build target ready code in your local and ship to any target activity.  
-- 🚀 **Help Information**: Get detailed instructions on available commands and usage directly from the CLI.  
+- 🏗️ **Project Initialization**: Set up new projects with complete configuration
+- 🎨 **Activity Templates**: Generate new activities with customizable variations
+- ⚡ **Smart Building**: Development and production builds with hot reload
+- 🚀 **Adobe Target Deployment**: Direct deployment to Adobe Target activities
+- 🩺 **Health Diagnostics**: Automatic configuration validation and fixing
+- 📁 **Flexible Structure**: Configurable activities folder structure
+- 🔧 **Environment Management**: Automatic .env file handling
+- 💻 **Modern Toolchain**: TypeScript, Webpack, Babel, SCSS support
 
 ---
 
@@ -24,73 +30,244 @@ npm install -g at-builder
 
 ---
 
-## **Usage**
+## **🚀 Quick Start**
 
-Run the command-line tool:
+1. **Initialize a new project:**
+```bash
+atb init
+```
+
+2. **Create a new activity:**
+```bash
+atb new
+```
 
+3. **Build your activity:**
 ```bash
-atb
+atb build
 ```
 
-### **Available Commands**
+4. **Deploy to Adobe Target:**
+```bash
+atb deploy
+```
 
-- **`new`**: Creates a new activity.  
-- **`build`**: Creates a build.  
+---
+
+## **📋 Commands Reference**
+
+### **Core Commands**
+
+| Command | Description | Options |
+|---------|-------------|---------|
+| `atb init` | Initialize project with configuration files | |
+| `atb new` | Create new Adobe Target activity with variations | |
+| `atb build` | Build activity for development | `--prod` for production |
+| `atb dev` | Start development server with file watching | `--browser` to open browser |
+| `atb deploy` | Deploy activity to Adobe Target | `--dry-run` for testing |
+| `atb doctor` | Diagnose and fix configuration issues | `--fix` to auto-fix |
 
 ### **Examples**
 
 ```bash
-# Create a new activity
-atb -c new
+# Initialize new project
+atb init
+
+# Create new activity
+atb new
+
+# Development build with hot reload
+atb build
+
+# Production build for Adobe Target
+atb build --prod
+
+# Development server with browser
+atb dev --browser
 
-# Build the project
-atb -c build
+# Deploy to Adobe Target
+atb deploy
 
-# Build the project for target activity
-atb -p -c build
+# Check project configuration
+atb doctor
+
+# Auto-fix configuration issues
+atb doctor --fix
 ```
 
 ---
 
-## **API Documentation**
+## **🔧 Project Structure**
+
+After initialization, your project will have:
+
+```
+your-project/
+├── .env                    # Environment configuration
+├── adobe.config.js         # Adobe Target API settings
+├── watch-config.json       # Build configuration
+├── package.json           # NPM configuration
+└── Activities/            # Your activities folder
+    └── your-activity/     # Activity folder (auto-created)
+        ├── Variation-1/   # Test variations
+        │   ├── index.js   # Entry point
+        │   ├── css/
+        │   │   └── style.scss
+        │   ├── scripts/
+        │   │   └── app.js
+        │   └── constants/
+        │       └── index.js
+        ├── Vanalytics/    # Analytics tracking
+        └── shared/        # Shared configuration
+```
 
-### **`getVersion()`**
+---
 
-- **Description**: Retrieves the version number from the `package.json` file.  
-- **Returns**: *(string)* - The version number of the package.  
+## **⚙️ Configuration**
 
-#### **Example**
+### **Environment Variables (.env)**
+
+```bash
+# Project Structure
+ACTIVITIES_BASE_FOLDER="Activities"
+ACTIVITY_FOLDER_NAME="your-activity-name"
+
+# Development Settings
+NODE_ENV="development"
+PUPPETEER_LANDING_PAGE=""
+TARGET_URL=""
+LOGIN_URL=""
+VARIATION="Variation-1"
+
+# Adobe Target Deployment
+ADOBE_CLIENT_ID="your-client-id"
+ADOBE_CLIENT_SECRET="your-client-secret"
+```
+
+### **Adobe Target Configuration (adobe.config.js)**
 
 ```javascript
-const { getVersion } = require("at-builder");
+module.exports = {
+    BASE_URL: 'https://mc.adobe.io/target/activities/',
+    IMS_TOKEN_URL: 'https://ims-na1.adobelogin.com/ims/token/v1',
+    IMS_SCOPE: 'openid,target_sdk'
+};
+```
+
+---
+
+## **🔄 Workflow**
+
+1. **Setup**: Run `atb init` to create project configuration
+2. **Create**: Run `atb new` to generate activity templates
+3. **Develop**: Modify variations in `/Activities/{name}/Variation-*/`
+4. **Test**: Run `atb build` for development testing
+5. **Build**: Run `atb build --prod` for production deployment
+6. **Deploy**: Run `atb deploy` to deploy to Adobe Target
 
-console.log(getVersion()); // Outputs the version number of the package
+---
+
+## **🩺 Troubleshooting**
+
+### **Health Check**
+```bash
+# Diagnose configuration issues
+atb doctor
+
+# Automatically fix issues
+atb doctor --fix
+```
+
+### **Common Issues**
+
+- **Missing .env file**: Run `atb init` or `atb doctor --fix`
+- **Build errors**: Check `ACTIVITY_FOLDER_NAME` in .env
+- **Deploy failures**: Verify Adobe credentials in .env
+- **Missing activity folder**: Create activity with `atb new`
+
+## **🚨 Advanced Configuration**
+
+### **Custom Activities Folder**
+
+You can customize the activities folder location:
+
+```bash
+# Use a different activities folder
+ACTIVITIES_BASE_FOLDER="MyActivities"
+```
+
+### **Build Scripts Integration**
+
+Add to your project's package.json:
+
+```json
+{
+  "scripts": {
+    "build:target": "atb build --prod",
+    "deploy:target": "atb deploy",
+    "dev:target": "atb dev --browser"
+  }
+}
 ```
 
-### **`getHelpInfo()`**
+---
 
-- **Description**: Provides a string containing help information for the `atb` command-line tool.  
-- **Returns**: *(string)* - The help information string.  
+## **🔌 API Integration**
 
-#### **Example**
+For programmatic usage:
 
 ```javascript
-const { getHelpInfo } = require("at-builder");
+const { getVersion, getHelpInfo } = require("at-builder");
+
+// Get version
+console.log(getVersion());
 
+// Get help information
 console.log(getHelpInfo());
-// Outputs detailed help information for the CLI tool
 ```
 
 ---
 
-## **License**
+## **🤝 Contributing**
+
+1. Fork the repository
+2. Create your feature branch (`git checkout -b feature/amazing-feature`)
+3. Commit your changes (`git commit -m 'Add amazing feature'`)
+4. Push to the branch (`git push origin feature/amazing-feature`)
+5. Open a Pull Request
+
+---
+
+## **📝 Changelog**
+
+### v1.2.3
+- ✨ Added `deploy` command for Adobe Target deployment
+- 🩺 Added `doctor` command for configuration diagnostics
+- 🔧 Automatic .env file updates when creating activities
+- 📁 Configurable activities folder structure
+- ⚡ Improved environment variable validation
+- 🚀 Enhanced error handling and user guidance
+
+### Previous Versions
+- v1.2.2: Build improvements and bug fixes
+- v1.2.1: Enhanced CLI interface
+- v1.2.0: Initial public release
+
+---
+
+## **📄 License**
 
 This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
 
 ---
 
-## **Support**
+## **🆘 Support**
+
+- **Repository**: [https://github.com/upesenga/at-builder](https://github.com/upesenga/at-builder)
+- **Issues**: [https://github.com/upesenga/at-builder/issues](https://github.com/upesenga/at-builder/issues)
+- **Author**: Upendra Sengar
+- **License**: MIT
 
-If you encounter any issues or have questions, feel free to email.  
+---
 
---- 
+**Made with ❤️ for Adobe Target developers**