fix: edit apropriate FormRows.Row in varBinds and Conditions

splunk · Sep 15, 2022 · 0253391 · 0253391
1 parent c67b2bc
commit 0253391
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 15 deletions.
diff --git a/frontend/packages/manager/src/components/profiles/Conditions.jsx b/frontend/packages/manager/src/components/profiles/Conditions.jsx
@@ -53,7 +53,7 @@ class Conditions extends Component {
                         <Text value={this.state.field} onChange={this.handleFieldChange}/>
                     </ControlGroup>
                     <ControlGroup label="patterns">
-                        <PatternsCreator onPatternsCreator={this.handlePatterns}/>
+                        <PatternsCreator onPatternsCreator={this.handlePatterns} value={this.state.patterns}/>
                     </ControlGroup>
                 </div>
                 ) : <div/>}

diff --git a/frontend/packages/manager/src/components/profiles/PatternsCreator.jsx b/frontend/packages/manager/src/components/profiles/PatternsCreator.jsx
@@ -8,14 +8,25 @@ class PatternsCreator extends Component {
     constructor(props) {
         super(props);
 
-        this.patterns = [
-            {pattern: "*.SNMP.*"}
-        ]
-        const items = [
-            <FormRows.Row index={0} key="0" onRequestRemove={e => this.handleRequestRemove(0, e)}>
-                <Text defaultValue={this.patterns[0].pattern} onChange={e => this.handleItemValue(0, e)}/>
-            </FormRows.Row>
-        ];
+        if(this.props.value){
+            this.patterns = this.props.value
+        }else{
+            this.patterns = [
+                {pattern: "*.SNMP.*"}
+            ]
+        }
+
+        let item_id = -1;
+        const items = this.patterns.map(value => {
+            item_id += 1;
+            let internal_id = item_id;
+            console.log(`${item_id}, ${value.pattern}`)
+            return(
+                <FormRows.Row index={internal_id} key={createDOMID()} onRequestRemove={this.handleRequestRemove}>
+                    <Text defaultValue={value.pattern} onChange={e => this.handleItemValue(internal_id, e)}/>
+                </FormRows.Row>
+            );
+        });
 
         this.state = {
             items,
@@ -30,6 +41,7 @@ class PatternsCreator extends Component {
     }
 
     handleItemValue = (index, e) => {
+        console.log(`old patter: ${this.patterns[index].pattern}, new pattern: ${e.target.value}, index: ${index}`)
         this.patterns[index].pattern = e.target.value
     }
 
@@ -56,9 +68,11 @@ class PatternsCreator extends Component {
     };
 
     handleRequestRemove = (e, { index }) => {
+         console.log(`patter: ${this.patterns[index].pattern}, index: ${index}`)
         this.setState((state) => ({
             items: FormRows.removeRow(index, state.items),
         }));
+        this.patterns.splice(index, 1);
     };
 
     render() {

diff --git a/frontend/packages/manager/src/components/profiles/VarbindsCreator.jsx b/frontend/packages/manager/src/components/profiles/VarbindsCreator.jsx
@@ -13,15 +13,19 @@ class VarbindsCreator extends Component {
             this.varBinds = [{family: "IF-MIB", category: "ifDescr", index: "1"}];
         }
 
-        const items = this.varBinds.map(value => (
-            <FormRows.Row index={0} key={ createDOMID() } onRequestRemove={this.handleRequestRemove}>
+        let item_id = -1;
+        const items = this.varBinds.map(value => {
+            item_id +=1;
+            let internal_id = item_id;
+            return (
+            <FormRows.Row index={internal_id} key={ createDOMID() } onRequestRemove={this.handleRequestRemove}>
                 <div style={{ display: 'flex' }}>
-                <Text defaultValue={value.family} onChange={e => this.handleItemValueFamily(0, e)}/>
-                <Text defaultValue={value.category} onChange={e => this.handleItemValueCategory(0, e)}/>
-                <Text defaultValue={value.index} onChange={e => this.handleItemValueIndex(0, e)}/>
+                <Text defaultValue={value.family} onChange={e => this.handleItemValueFamily(internal_id, e)}/>
+                <Text defaultValue={value.category} onChange={e => this.handleItemValueCategory(internal_id, e)}/>
+                <Text defaultValue={value.index} onChange={e => this.handleItemValueIndex(internal_id, e)}/>
                 </div>
             </FormRows.Row>
-        ))
+        );});
 
         this.state = {
             items,