@bigbinary/neeto-rules-frontend 0.8.0-beta1 → 0.8.0

package/README.md

@@ -23,6 +23,7 @@ The `neeto-rules-nano` facilitates the management of automation rules within nee
           - [Actions](#28-actions)
           - [Custom action component](#29-custom-action-component)
         - [RulePreview](#3-rulepreview)
+        - [RulesTable](#4-rulestable)
 2. [Instructions for Publishing](#instructions-for-publishing)
 
 ## Development with Host Application
@@ -615,6 +616,66 @@ The `RulesReorder` component is used to reorder the automation rule.
 6. `isReordering`: To specify if the reordering is in progress. (Boolean).
 7. `paginationProps`: To add pagination to the list of rules. Refer [Pagination component doc](https://neeto-ui.neeto.com/?path=/docs/components-pagination--docs).
 
+
+#### 5. `RulesTable`
+
+The `RulesTable` component is used to display the list of automation rules.
+> Includes subheader which displays count of the automation rules.
+
+#### Props
+
+1. `automationRulesEndpoint`: The endpoint for automation rules.
+
+Following actions will be used by the component
+| Action | Description |
+| --- | --- |
+| `clone` | To create the clone of the automation rule. |
+| `update` | To update the status of the automation rule. |
+| `destroy` | To delete the automation rule. |
+
+2. `additionalColumns`: To add additional columns to the table. Refer [Table component doc](https://neeto-ui.neeto.com/?path=/docs/components-table--docs)
+
+```jsx
+const additionalColumns = [
+    {
+      title: "Operated on",
+      dataIndex: "recentlyModifiedTickets",
+      width: 160,
+      description: "Number of tickets the rule has acted upon in the last 7 days",
+      render: recentlyModifiedTickets => (
+        <div className="text-center">{recentlyModifiedTickets}</div>
+      ),
+    },
+  ];
+```
+
+3. `automationRulesPath`: The path for automation rules component.
+
+Following additional routes are considered by the component: 
+| Routes | Description |
+| --- | --- |
+| `{automationRulesPath}/edit` | Page to display rule edit form. |
+| `{automationRulesPath}/new` | Page to display rule create form. |
+
+4. `onPreview`: The callback function to call when the preview is clicked.
+
+5. `helpDocUrl`: The URL of the help doc to be displayed when no data is available.
+
+6. `MoreDropdownItems`: Array of dropdown items to be added to the MoreDropdown component in the table. Refer [MoreDropdown in table doc](https://neeto-ui.neeto.com/?path=/docs/components-table--docs).
+
+```jsx
+const moreDropdownItems = [
+    {
+      key: "view-matching-tickets",
+      label: "View matching rules",
+      // onClick callback receives the selected rule
+      onClick: rule => {
+        setSelectedRule(rule);
+        setShowMatchingTickets(true);
+      },
+    },
+  ];
+```
 ## 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.

package/app/javascript/src/translations/en.json

@@ -1,6 +1,8 @@
 {
   "neetoRules": {
     "common": {
+      "automationRuleWithCount_one": "{{count}} automation rule",
+      "automationRuleWithCount_other": "{{count}} automation rules",
       "events": "Events",
       "name": "Name",
       "description": "Description",
@@ -33,7 +35,8 @@
       "phoneNumber": "Phone number",
       "phoneNumbers": "Phone numbers",
       "data": "Data",
-      "reorder": "Reorder"
+      "reorder": "Reorder",
+      "at": "at"
     },
     "form": {
       "noEvents": "A rule without events will run hourly.",
@@ -54,6 +57,7 @@
       "selectDate": "Select date"
     },
     "labels": {
+      "active": "Active",
       "body": "Body",
       "selectValues": "Select values",
       "multipleValues": "Multiple values",
@@ -306,6 +310,20 @@
     },
     "description": {
       "reorder": "Automation rules are applied from top to bottom."
+    },
+    "button": {
+      "clone": "Clone",
+      "delete": "Delete",
+      "edit": "Edit",
+      "addNew": "Add new automation rule"
+    },
+    "deleteAlert": {
+      "message": "You are permanently deleting the automation rule <strong>{{name, anyCase}}</strong>. This can't be undone.",
+      "title": "Delete automation rule?"
+    },
+    "noData": {
+      "title": "There are no automation rule to show",
+      "helpText": "Here is how you can use <a>automation rules.</a>"
     }
   }
 }