Use correct ID in funcNode

ui/src/ifql/components/BodyBuilder.tsx

@@ -22,8 +22,8 @@ class BodyBuilder extends PureComponent<Props> {
           if (d.funcs) {
             return (
               <ExpressionNode
-                id={d.id}
-                key={d.id}
+                bodyID={b.id}
+                key={b.id}
                 funcNames={this.funcNames}
                 funcs={d.funcs}
               />
@@ -36,10 +36,10 @@ class BodyBuilder extends PureComponent<Props> {
 
       return (
         <ExpressionNode
-          id={b.id}
           key={b.id}
-          funcNames={this.funcNames}
+          bodyID={b.id}
           funcs={b.funcs}
+          funcNames={this.funcNames}
         />
       )
     })

ui/src/ifql/components/ExpressionNode.tsx

@@ -8,14 +8,14 @@ import {Func} from 'src/types/ifql'
 
 interface Props {
   funcNames: any[]
-  id: string
+  bodyID: string
   funcs: Func[]
 }
 
 // an Expression is a group of one or more functions
 class ExpressionNode extends PureComponent<Props> {
   public render() {
-    const {id, funcNames, funcs} = this.props
+    const {bodyID, funcNames, funcs} = this.props
     return (
       <IFQLContext.Consumer>
         {({onDeleteFuncNode, onAddNode, onChangeArg, onGenerateScript}) => {
@@ -23,7 +23,7 @@ class ExpressionNode extends PureComponent<Props> {
             <div className="func-nodes-container">
               <h4>
                 <FuncSelector
-                  bodyID={id}
+                  bodyID={bodyID}
                   funcs={funcNames}
                   onAddNode={onAddNode}
                 />
@@ -32,7 +32,7 @@ class ExpressionNode extends PureComponent<Props> {
                 <FuncNode
                   key={func.id}
                   func={func}
-                  bodyID={func.id}
+                  bodyID={bodyID}
                   onChangeArg={onChangeArg}
                   onDelete={onDeleteFuncNode}
                   onGenerateScript={onGenerateScript}

ui/src/ifql/components/FuncArgs.tsx

@@ -25,10 +25,10 @@ export default class FuncArgs extends PureComponent<Props> {
               type={type}
               argKey={key}
               value={value}
+              bodyID={bodyID}
               funcID={func.id}
               funcName={func.name}
               onChangeArg={onChangeArg}
-              bodyID={bodyID}
               onGenerateScript={onGenerateScript}
             />
           )

ui/src/ifql/components/FuncNode.tsx

@@ -36,8 +36,8 @@ export default class FuncNode extends PureComponent<Props, State> {
         {isOpen && (
           <FuncArgs
             func={func}
-            onChangeArg={onChangeArg}
             bodyID={bodyID}
+            onChangeArg={onChangeArg}
             onGenerateScript={onGenerateScript}
           />
         )}

ui/src/ifql/containers/IFQLPage.tsx

@@ -199,12 +199,12 @@ export class IFQLPage extends PureComponent<Props, State> {
   private handleDeleteFuncNode = (funcID: string, bodyID: string): void => {
     // TODO: export this and test functionality
     const script = this.state.body
-      .map((expression, expressionIndex) => {
-        if (expression.id !== bodyID) {
-          return expression.source
+      .map((body, bodyIndex) => {
+        if (body.id !== bodyID) {
+          return body.source
         }
 
-        const funcs = expression.funcs.filter(f => f.id !== funcID)
+        const funcs = body.funcs.filter(f => f.id !== funcID)
         const source = funcs.reduce((acc, f, i) => {
           if (i === 0) {
             return `${f.source}`
@@ -213,7 +213,7 @@ export class IFQLPage extends PureComponent<Props, State> {
           return `${acc}\n\t${f.source}`
         }, '')
 
-        const isLast = expressionIndex === this.state.body.length - 1
+        const isLast = bodyIndex === this.state.body.length - 1
         if (isLast) {
           return `${source}`
         }