From fb69bb3c692f6e5e13925cd8f45f7dad021bcd4d Mon Sep 17 00:00:00 2001
From: Christopher Hubert <christopher.hubert@semanticbits.com>
Date: Fri, 6 Dec 2024 11:57:34 -0500
Subject: [PATCH] MAT-7791: update delete function

---
 .../argumentSection/ArgumentSection.tsx       | 14 +++++++--
 .../argumentSection/Arguments.tsx             | 30 ++++++++++++++++---
 .../functionBuilder/FunctionBuilder.tsx       | 12 ++++++++
 3 files changed, 50 insertions(+), 6 deletions(-)

diff --git a/src/CqlBuilderPanel/functionsSection/argumentSection/ArgumentSection.tsx b/src/CqlBuilderPanel/functionsSection/argumentSection/ArgumentSection.tsx
index cc31dc4..0fe3720 100644
--- a/src/CqlBuilderPanel/functionsSection/argumentSection/ArgumentSection.tsx
+++ b/src/CqlBuilderPanel/functionsSection/argumentSection/ArgumentSection.tsx
@@ -20,6 +20,7 @@ interface ArgumentsProps {
   functionArguments?: FunctionArgument[];
   canEdit: boolean;
   addArgumentToFunctionsArguments: Function;
+  deleteArgumentFromFunctionArguments: Function;
 }
 
 const availableDataTypes = [
@@ -35,7 +36,12 @@ const availableDataTypes = [
 ];
 
 export default function ArgumentSection(props: ArgumentsProps) {
-  const { addArgumentToFunctionsArguments, functionArguments, canEdit } = props;
+  const {
+    addArgumentToFunctionsArguments,
+    deleteArgumentFromFunctionArguments,
+    functionArguments,
+    canEdit,
+  } = props;
   const [functionDataType, setFunctionDataType] = useState("");
   const [confirmationDialog, setConfirmationDialog] = useState<boolean>(false);
 
@@ -159,7 +165,11 @@ export default function ArgumentSection(props: ArgumentsProps) {
         </Button>
       </div>
       <div style={{ paddingTop: "24px" }}>
-        <Arguments functionArguments={functionArguments} canEdit={canEdit} />
+        <Arguments
+          functionArguments={functionArguments}
+          canEdit={canEdit}
+          handleDeleteArgument={deleteArgumentFromFunctionArguments}
+        />
       </div>
       <ConfirmationDialog
         open={confirmationDialog}
diff --git a/src/CqlBuilderPanel/functionsSection/argumentSection/Arguments.tsx b/src/CqlBuilderPanel/functionsSection/argumentSection/Arguments.tsx
index 8b359d2..d13987d 100644
--- a/src/CqlBuilderPanel/functionsSection/argumentSection/Arguments.tsx
+++ b/src/CqlBuilderPanel/functionsSection/argumentSection/Arguments.tsx
@@ -29,7 +29,7 @@ import toastReducer from "../../../common/ToastReducer";
 
 type PropTypes = {
   functionArguments: Array<FunctionArgument>;
-  handleDeleteArgument?: (argument) => void;
+  handleDeleteArgument?: Function;
   canEdit: boolean;
 };
 
@@ -51,7 +51,7 @@ const Arguments = ({
   const [visibleArguments, setVisibleArguments] = useState<FunctionArgument[]>(
     []
   );
-
+  const [selectedArgument, setSelectedArgument] = useState<FunctionArgument>();
   const [deleteDialogOpen, setDeleteDialogOpen] = useState<boolean>(false);
 
   // toast utilities
@@ -118,6 +118,21 @@ const Arguments = ({
     managePagination();
   }, [functionArguments, currentPage, currentLimit]);
 
+  const deleteFunctionArgument = () => {
+    handleDeleteArgument(selectedArgument);
+    setDeleteDialogOpen(false);
+    dispatch({
+      type: "SHOW_TOAST",
+      payload: {
+        type: "success",
+        message:
+          "Argument " +
+          selectedArgument.argumentName +
+          " has been successfully removed from the function",
+      },
+    });
+  };
+
   // table data
   const data = visibleArguments.map((argument, i) => {
     return {
@@ -179,7 +194,14 @@ const Arguments = ({
                   "data-testid": `delete-button-${row.id}`,
                   "aria-label": `delete-button-${row.id}`,
                   size: "small",
-                  onClick: () => {},
+                  onClick: () => {
+                    // const rowModal = table.getRow(row.id).original;
+                    setSelectedArgument({
+                      argumentName: row.row.original.name,
+                      dataType: row.row.original.datatype,
+                    } as FunctionArgument);
+                    setDeleteDialogOpen(true);
+                  },
                 }}
               >
                 <DeleteOutlineIcon color="error" />
@@ -278,7 +300,7 @@ const Arguments = ({
       />
       <MadieDeleteDialog
         open={deleteDialogOpen}
-        onContinue={() => handleDeleteArgument(null)}
+        onContinue={() => deleteFunctionArgument()}
         onClose={() => setDeleteDialogOpen(false)}
         dialogTitle="Are you sure?"
         name={"this Argument"}
diff --git a/src/CqlBuilderPanel/functionsSection/functionBuilder/FunctionBuilder.tsx b/src/CqlBuilderPanel/functionsSection/functionBuilder/FunctionBuilder.tsx
index 1f4e47a..83a3ad8 100644
--- a/src/CqlBuilderPanel/functionsSection/functionBuilder/FunctionBuilder.tsx
+++ b/src/CqlBuilderPanel/functionsSection/functionBuilder/FunctionBuilder.tsx
@@ -62,6 +62,15 @@ export default function FunctionBuilder({
     formik.setFieldValue("functionsArguments", newArgs);
   };
 
+  const deleteArgumentFromFunctionArguments = (fn) => {
+    const newArgs = formik.values.functionsArguments.filter(
+      (argument) =>
+        argument?.argumentName !== fn.argumentName &&
+        argument?.dataType !== fn.dataType
+    );
+    formik.setFieldValue("functionsArguments", newArgs);
+  };
+
   return (
     <div>
       <form id="function-form" onSubmit={formik.handleSubmit}>
@@ -126,6 +135,9 @@ export default function FunctionBuilder({
           <ArgumentSection
             canEdit={canEdit}
             addArgumentToFunctionsArguments={addArgumentToFunctionsArguments}
+            deleteArgumentFromFunctionArguments={
+              deleteArgumentFromFunctionArguments
+            }
             functionArguments={formik.values.functionsArguments}
           />
         </ExpandingSection>