Automate method form conversion

amalvijayan03 · Jan 25, 2024 · 81e357e · 81e357e
1 parent a9b21f4
commit 81e357e
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 34 deletions.
diff --git a/app/javascript/components/automate-method-form/combinedSchema.js b/app/javascript/components/automate-method-form/combinedSchema.js
@@ -36,7 +36,8 @@ const combinedSchema = (options, selectedOption) => {
       component: componentTypes.TEXT_FIELD,
       id: 'built-in',
       name: 'built-in',
-      label: __('Optional, if not specified, method name is used'),
+      label: __('Builtin name'),
+      helperText: 'Optional, if not specified, method name is used',
     },
   ];
 

diff --git a/app/javascript/components/automate-method-form/method-input-parameters/index.js b/app/javascript/components/automate-method-form/method-input-parameters/index.js
@@ -1,13 +1,10 @@
 import React from 'react';
-import {
-  DataTable,
-} from 'carbon-components-react';
+import { DataTable } from 'carbon-components-react';
 
 const InputParams = () => {
-  /**SAmple data */
   const data = [
-    { inputName: 'username', dataType: 'string', defaultValue: 'guest', actions: 'Edit, Delete' },
-    { inputName: 'password', dataType: 'password', defaultValue: '********', actions: 'Edit, Delete' },
+    { id: '1', inputName: 'username', dataType: 'string', defaultValue: 'guest', actions: 'Edit, Delete' },
+    { id: '2', inputName: 'password', dataType: 'password', defaultValue: '********', actions: 'Edit, Delete' },
   ];
 
   const headers = [
@@ -21,36 +18,27 @@ const InputParams = () => {
     <DataTable
       rows={data}
       headers={headers}
-      render={({
-        rows,
-        headers,
-        getHeaderProps,
-        getRowProps,
-        getTableProps,
-        getTableContainerProps,
-      }) => (
-        <div {...getTableContainerProps()}>
-          <table {...getTableProps()} className="bx--data-table">
-            <thead>
-              <tr>
+      render={({ rows, headers, getHeaderProps, getRowProps, getTableProps }) => (
+        <table {...getTableProps()} className="bx--data-table">
+          <thead>
+            <tr>
+              {headers.map((header) => (
+                <th key={header.key} {...getHeaderProps({ header })}>
+                  {header.header}
+                </th>
+              ))}
+            </tr>
+          </thead>
+          <tbody>
+            {rows.map((row) => (
+              <tr key={row.id} {...getRowProps({ row })}>
                 {headers.map((header) => (
-                  <th key={header.key} {...getHeaderProps({ header })}>
-                    {header.header}
-                  </th>
+                  <td key={header.key}>{row[header.key]}</td>
                 ))}
               </tr>
-            </thead>
-            <tbody>
-              {rows.map((row) => (
-                <tr key={row.id} {...getRowProps({ row })}>
-                  {headers.map((header) => (
-                    <td key={header.key}>{row[header.key]}</td>
-                  ))}
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
+            ))}
+          </tbody>
+        </table>
       )}
     />
   );