What is a Transformation in Pabbly Hook?

Transformation ​

Definition​

In Pabbly Hook, Transformation is a powerful feature that allows you to modify, format, or restructure webhook data before it is sent to the desired destination. Transformations let you adapt incoming data to meet specific requirements, ensuring seamless integrations and efficient workflow automation.

---

Key Features of the Transformation Page:​

1. List of Transformations:
   • Displays all transformations created within your account.
   • Each transformation is uniquely identified by a Transformation Name and a Transformation ID for easy reference.
2. Timestamp Information:
   • Shows the creation date and time of each transformation, helping you track updates and modifications.
3. Detailed View:
   • You can click on any transformation ID to view its specific rules and configurations.

---

How to Use the Transformation Page:​

1. Create a New Transformation:
   • Open the Create Connection page.
   • Click on the "Create Transformation" button (if available).
   • Define the rules for mapping, modifying, or restructuring incoming data.
2. View an Existing Transformation:
   • Click on a transformation name or ID to see its details.
   • Check the applied rules, field mappings, and any logic used in the transformation.

Transformations syntax​

Pabbly Hook allows for arbitrary transformations on request data using JavaScript (ES7).
Function : (request, context) => {
return request;
}

Setting up a Transformation​

1. Navigate to the Transformation Section: In Pabbly hook, locate the connection where you want to apply a transformation. Under the hook settings, find the "Transformations" section.
2. Click Transform to add a transformation rule.
3. Click Create new transformation.

5. Define the Transformation Logic: You can specify transformations using code to alter the incoming request's body, headers, or path parameters and add code snippet for transformation.
6. Once written, test your transformation.

• The left pane's Input tab shows the request your transformation will be tested against. To change this request, click edit tab and select a recent payload, or edit the text directly.
• Click Run to test the transformation. Once run, the left pane's Output tab shows the resulting payload.

7. Once satisfied with the transformation, click Save.
8. Name the transformation using the input field in the pop-up box, clicking Save to save the transformation.

9. Make sure to select the saved transformation from dropdown and click Save again on the connection form to apply your changes.

Here’s an example code snippet to reformat a date field and rename a parameter for better compatibility.

10. From this point forward, events received on the connection are transformed prior to delivery to their destination.

(request, context) => {
  // Modify the `order_date` from `MM/DD/YYYY` to `YYYY-MM-DD`
  if (request.payload.order_date) {
    const [month, day, year] = request.payload.order_date.split('/');
    request.payload.order_date = `${year}-${month}-${day}`;
  }
 
  // Rename `orderID` to `order_id`
  if (request.payload.orderID) {
    request.payload.order_id = request.payload.orderID;
    delete request.payload.orderID;
  }
 
  // Example: Add a new field if `total_amount` is above a threshold
  if (request.payload.total_amount && request.payload.total_amount > 1000) {
    request.payload.high_value_order = true;
  }
 
    return request;
}

Transformation Code Example Explanation​

• Date Formatting: This code transforms order_date from MM/DD/YYYY to YYYY-MM-DD.
• Renaming Fields: It renames orderID to order_id for consistency.
• Adding Conditional Fields: If total_amount exceeds 1000, a new field high_value_order is added to indicate a high-value order.

# Example Transformation Code Including Payload , Headers , Query Params.

(request, context) => {
 
  // Modify the `order_date` from `MM/DD/YYYY` to `YYYY-MM-DD` in payload
  if (request.payload.order_date) {
    const [month, day, year] = request.payload.order_date.split('/');
    request.payload.order_date = `${year}-${month}-${day}`;
  }

  // Rename `orderID` to `order_id` in payload
  if (request.payload.orderID) {
    request.payload.order_id = request.payload.orderID;
    delete request.payload.orderID;
  }

  // Add a new field in payload if `total_amount` is above a threshold
  if (request.payload.total_amount && request.payload.total_amount > 1000) {
    request.payload.high_value_order = true;
  }

  // Modify `api_key` header for consistency
  if (request.headers['api_key']) {
    request.headers['API_KEY'] = request.headers['api_key'];
    delete request.headers['api_key'];
  }

  // Add a new header if `Content-Type` is missing
  if (!request.headers['Content-Type']) {
    request.headers['Content-Type'] = 'application/json';
  }

  // Update query param `status` from "pending" to "in_progress"
  if (request.queryParams.status === 'pending') {
    request.queryParams.status = 'in_progress';
  }

  return request;
}

Transformation Code Explanation​

• Payload Adjustments:
  • Reformats order_date to YYYY-MM-DD.
  • Renames orderID to order_id.
  • Adds high_value_order if total_amount is greater than 1000.
• Header Adjustments:
  • Renames api_key to API_KEY.
  • Sets Content-Type to application/json if it was missing.
• Query Parameter Adjustments:
  • Changes status from "pending" to "in_progress" if necessary.

Input Example​

Here’s an example of how the input might look before applying the transformation:

Output Example​

After applying the transformation, the output will look like this:

Edit a transformation​

Editing a transformation changes how payload data is transformed before delivery.

1. Open the connection rules configuration.
2. Navigate to the Transformation Section: Choose the transformation you want to update.
3. Next to the transformation rule, click Editor Button(Screenshot for your's refrence).
   
   
4. Configure the transformation using the supported transformation syntax in the right-hand pane.
5. Once written, test your transformation.
   • The left pane's Input tab shows the request your transformation will be tested against. To change this request, click Change and select a recent payload, or edit the text directly.
   • Click Run to test the transformation. Once run, the left pane's Output tab shows the resulting payload.
6. Optionally, you may rename the transformation using the input field in the pop up box. Click Update to confirm the name change.
   
   
7. Once satisfied, click Update.
8. Make sure to click Update again on the connection form to apply your changes.

---

Transformation Modal View in Pabbly Hook​

Definition​

The Transformation Modal View in Pabbly Hook allows users to view and manage the details of a specific transformation created within the system. This feature is accessible by selecting a transformation from the "Transformations" list on the left-hand side vertical navigation bar.

---

Features and Fields Explained​

1. Transformation Name​

• Location: Top of the modal, prominently displayed.
• Purpose: Identifies the name of the selected transformation for quick reference.
• Editable: No, it reflects the name assigned during transformation creation.

2. Created At​

• Location: Below the transformation name.
• Purpose: Indicates the exact timestamp when the transformation was initially created.
• Format: Follows the MMM DD, YYYY HH:MM:SS format for easy readability.

3. Transformation ID​

• Location: Listed alongside other metadata.
• Purpose: Provides a unique identifier for the transformation. This is particularly useful for debugging or referencing the transformation in API calls.
• Editable: No, it is automatically generated by the system.

4. Last Updated At​

• Location: Next to the "Created At" field.
• Purpose: Displays the most recent timestamp when the transformation was modified. Useful for tracking changes.
• Format: Same as the "Created At" field.

5. Transformation Code​

• Location: In the main content section of the modal.
• Purpose: Shows the actual JavaScript code used for the transformation.
• Key Features:
  • Syntax Highlighting: Ensures better readability of the code.
  • Code Examples: Includes comments for common use cases, such as:
    • Changing date formats.
    • Renaming fields.
    • Adding conditional fields based on specific logic.

Example Use Cases in Transformation Code​

1. Change Date Format:
   

   if (request.payload.order_date) {
   const [month, day, year] = request.payload.order_date.split('/');
   request.payload.order_date = `${year}-${month}-${day}`;
   }

2. Rename Fields:
   

   if (request.payload.orderID) {
   request.payload.order_id = request.payload.orderID;
   delete request.payload.orderID;
   }

3. Add Conditional Fields:
   

   if (request.payload.total_amount && request.payload.total_amount > 1000) {
   request.payload.high_value_order = true;
   }

Click to expand...

---

How to Use the Transformation Modal​

1. Viewing Transformation Details:
   • Navigate to the "Transformations" section from the sidebar.
   • Click on the desired transformation ID to open the modal view.

---

1. Editing Transformation Code:

• Locate the "Transformation Code" section.
• Modify the code as needed. For example:
  • Change the date format from MM/DD/YYYY to YYYY-MM-DD.
  • Rename fields or add custom logic using JavaScript.

---

1. Saving Changes:
   • After making modifications, click the "Update" button (if available).

---

1. Debugging:
   • Use the Transformation ID to trace logs or identify issues in webhook integrations.

Additional Note on "Created At" Field​

The "Created At" field in the transformation modal includes a timezone specification in the format:

Transformation Created: November 29, 2024 16:09:39 (UTC +05:30) Asia/Kolkata

---

Explanation​

1. Purpose:
   • The inclusion of the timezone ensures clarity about the specific time zone the timestamp refers to. This is particularly useful in scenarios involving global teams or when debugging logs and events that occur across multiple time zones.
2. Components:
   • Date and Time: November 29, 2024 16:09:39.
   • UTC Offset: (UTC +05:30).
   • Time Zone Region: Asia/Kolkata.
3. Display:
   • This detail is prominently displayed below the "Transformation Name," ensuring it is visible and easy to understand.

---

Usage Implications​

• Debugging:
  • When comparing timestamps in logs or events from other systems, ensure alignment with the specified timezone.
• Global Team Collaboration:
  • Facilitates smooth communication by providing clarity about the timezone when a transformation was created.
• Compliance and Auditing:
  • Useful for timestamp validation in regions where precise logging and timezone tracking are required for compliance.

This additional detail ensures that users can track transformations with precision, even in a multi-time-zone environment.

---

Best Practices​

• Validate Code: Before saving, ensure your JavaScript code is error-free to avoid runtime issues.
• Test Changes: Test the transformation using sample payloads to confirm it behaves as expected.

---

This documentation provides a comprehensive understanding of the transformation modal view in Pabbly Hook, ensuring users can efficiently manage and customize their transformations.