@bigbinary/neeto-webhooks-frontend 1.6.10 → 1.6.12

package/README.md

@@ -1,90 +1,121 @@
 # neeto-webhooks-nano
-The `neeto-webhooks-nano` manages webhooks within neeto applications. The nano exports the `@bigbinary/neeto-webhooks-frontend` NPM package and `neeto-webhooks-engine` Rails engine for development.
+
+The `neeto-webhooks-nano` manages webhooks within neeto applications. The nano
+exports the `@bigbinary/neeto-webhooks-frontend` NPM package
+and `neeto-webhooks-engine` Rails engine for development.
 
 # Contents
+
 1. [Development with Host Application](#development-with-host-application)
-    - [Engine](#engine)
-        - [Installation](#installation)
-        - [Usage](#usage)
-    - [Frontend package](#frontend-package)
-        - [Installation](#installation-1)
-        - [Components](#components)
+   - [Engine](#engine)
+     - [Installation](#installation)
+     - [Usage](#usage)
+   - [Frontend package](#frontend-package)
+     - [Installation](#installation-1)
+     - [Components](#components)
 2. [Instructions for Publishing](#instructions-for-publishing)
 
 # Development with Host Application
+
 ## Engine
+
 The engine is used to manage webhooks across neeto products.
 
 ### Installation
-1. Add this line to your application's Gemfile:
-    ```ruby
-    source "NEETO_GEM_SERVER_URL" do
-       # ..existing gems
 
-       gem 'neeto-webhooks-engine'
-    end
-    ```
-2. And then execute:
-    ```zsh
-    bundle install
-    ```
-3. Add this line to your application's `config/routes.rb` file:
-    ```ruby
-    mount NeetoWebhooksEngine::Engine => "/webhooks"
-    ```
-4. Run the following command to copy the migrations from the engine to the host application:
-    ```zsh
-    bundle exec rails neeto_webhooks_engine:install:migrations
-    ```
-5. Add the migrations to the database:
-    ```zsh
-    bundle exec rails db:migrate
-    ```
-6. Add the following line to application's config/initializer/neeto_webhooks_engine.rb file. Replace the event_identifiers with an array of unique keywords representing possible webhook events.
+1. Add this line to your application's Gemfile:
 
-    ```zsh
-    NeetoWebhooksEngine.event_identifiers = ["create", "update", "cancel"]
-    ```
-7. Add translations for the webhook events using the key format webhooks.events.webhook_event, where webhook_event is the custom-defined event_identifier.
+   ```ruby
+   source "NEETO_GEM_SERVER_URL" do
+      # ..existing gems
 
-    ```zsh
-    webhooks:
-      events:
-        create: "Booking creation"
-        update: "Booking reschedule"
-        cancel: "Booking cancellation"
-    ```
+      gem 'neeto-webhooks-engine'
 
+      # Use this for live development:
+      # gem 'neeto-webhooks-engine', path: "../neeto-webhooks-nano"
+   end
+   ```
 
+2. And then execute:
+   ```zsh
+   bundle install
+   ```
+3. Add this line to your application's `config/routes.rb` file:
+   ```ruby
+   mount NeetoWebhooksEngine::Engine => "/webhooks"
+   ```
+4. Run the following command to copy the migrations from the engine to the host
+   application:
+   ```zsh
+   bundle exec rails neeto_webhooks_engine:install:migrations
+   ```
+5. Add the migrations to the database:
+   ```zsh
+   bundle exec rails db:migrate
+   ```
+6. Add the following line to application's
+   config/initializer/neeto_webhooks_engine.rb file. Replace the
+   event_identifiers with an array of unique keywords representing possible
+   webhook events.
+
+   ```zsh
+   NeetoWebhooksEngine.event_identifiers = ["create", "update", "cancel"]
+   ```
+
+7. Add translations for the webhook events using the key format
+   webhooks.events.webhook_event, where webhook_event is the custom-defined
+   event_identifier.
+
+   ```zsh
+   webhooks:
+     events:
+       create: "Booking creation"
+       update: "Booking reschedule"
+       cancel: "Booking cancellation"
+   ```
 
 ### Usage
 
 You can learn more about the setup and usage here:
+
 1. [Models](/docs/engine/models.md)
 
 ## Frontend package
+
 ### Installation
+
 1. Install the latest `neeto-webhooks-nano` package using the below command:
-    ```zsh
-    yarn add @bigbinary/neeto-webhooks-frontend
-    ```
+   ```zsh
+   yarn add @bigbinary/neeto-webhooks-frontend
+   ```
+
 ### Instructions for development
-Check the [Frontend package development guide](https://neeto-engineering.neetokb.com/p/a-d34cb4b0) for step-by-step instructions to develop the frontend package.
+
+Check the
+[Frontend package development guide](https://neeto-engineering.neetokb.com/p/a-d34cb4b0)
+for step-by-step instructions to develop the frontend package.
 
 ### Components
+
 #### `NeetoWebhooks` ([source code](https://github.com/bigbinary/neeto-webhooks-nano/blob/52aa6b3fc38dce1afb9f6a7a821f3d2d12cb6a6a/app/javascript/src/components/NeetoWebhooks.jsx))
+
 This component is used to manage webhooks in your web application.
+
 1. It provides a user interface for viewing, adding, and editing webhooks.
-2. It also includes a user interface for listing deliveries and viewing delivery details, featuring tabs that display both request and response information.
+2. It also includes a user interface for listing deliveries and viewing delivery
+   details, featuring tabs that display both request and response information.
 
 ##### Props
+
 - `entityId`: Specifies the ID of the entity.
 - `entityType`: Specifies the type of the entity.
 
 ##### Optional Props
+
 - `breadcrumbs`: An array of objects that specify breadcrumbs for navigation.
 
 ##### Usage
+
 ```jsx
 import React from "react";
 
@@ -123,4 +154,7 @@ export default Main;
 ```
 
 # Instructions for Publishing
-Consult the [building and releasing packages](https://neeto-engineering.neetokb.com/articles/building-and-releasing-packages) guide for details on how to publish.
+
+Consult the
+[building and releasing packages](https://neeto-engineering.neetokb.com/articles/building-and-releasing-packages)
+guide for details on how to publish.

package/dist/index.cjs.js

@@ -627,6 +627,13 @@ var TransactionDetails = function TransactionDetails(_ref) {
       className: "flex w-full items-center justify-center py-6"
     }, /*#__PURE__*/React__default["default"].createElement(neetoui.Spinner, null));
   }
+  var renderPayload = function renderPayload() {
+    try {
+      return JSON.stringify(JSON.parse(deliveryDetails.requestBody), null, 2);
+    } catch (_unused) {
+      return "";
+    }
+  };
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-ui-bg-white sticky top-0 mb-2 flex w-full flex-col"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -656,7 +663,7 @@ var TransactionDetails = function TransactionDetails(_ref) {
       return setActiveHeader(DELIVERY_TAB.response);
     }
   }, t("neetoWebhooks.delivery.response")))), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "mt-2"
+    className: "mt-2 w-full"
   }, activeHeader === DELIVERY_TAB.request ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: "space-y-4"
   }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
@@ -667,7 +674,7 @@ var TransactionDetails = function TransactionDetails(_ref) {
     style: "h5"
   }, t("neetoWebhooks.delivery.payload")), /*#__PURE__*/React__default["default"].createElement(Snippet, {
     dataCy: "delivery-request-payload"
-  }, JSON.stringify(JSON.parse(deliveryDetails.requestBody), null, 2)))) : /*#__PURE__*/React__default["default"].createElement("div", {
+  }, renderPayload()))) : /*#__PURE__*/React__default["default"].createElement("div", {
     className: "space-y-4"
   }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
     style: "h5"