master merge

src/Explorer/Panes/ExecuteSprocParamsPane/ExecuteSprocParamsPane.tsx

@@ -2,11 +2,9 @@ import { IDropdownOption, IImageProps, Image, Stack, Text } from "@fluentui/reac
 import { useBoolean } from "@fluentui/react-hooks";
 import AddPropertyIcon from "images/Add-property.svg";
 import React, { FunctionComponent, useState } from "react";
+import { logConsoleError } from "../../../Utils/NotificationConsoleUtils";
 import StoredProcedure from "../../Tree/StoredProcedure";
-import {
-  GenericRightPaneComponent,
-  GenericRightPaneProps,
-} from "../GenericRightPaneComponent/GenericRightPaneComponent";
+import { RightPaneForm, RightPaneFormProps } from "../RightPaneForm/RightPaneForm";
 import { InputParameter } from "./InputParameter";
 
 interface ExecuteSprocParamsPaneProps {
@@ -35,24 +33,11 @@ export const ExecuteSprocParamsPane: FunctionComponent<ExecuteSprocParamsPanePro
   const [partitionValue, setPartitionValue] = useState<string>(); // Defaulting to undefined here is important. It is not the same partition key as ""
   const [selectedKey, setSelectedKey] = React.useState<IDropdownOption>({ key: "string", text: "" });
   const [formError, setFormError] = useState<string>("");
-  const [formErrorsDetails, setFormErrorsDetails] = useState<string>("");
 
   const onPartitionKeyChange = (event: React.FormEvent<HTMLDivElement>, item: IDropdownOption): void => {
     setSelectedKey(item);
   };
 
-  const genericPaneProps: GenericRightPaneProps = {
-    expandConsole,
-    formError: formError,
-    formErrorDetail: formErrorsDetails,
-    id: "executesprocparamspane",
-    isExecuting: isLoading,
-    title: "Input parameters",
-    submitButtonText: "Execute",
-    onClose: () => closePanel(),
-    onSubmit: () => submit(),
-  };
-
   const validateUnwrappedParams = (): boolean => {
     const unwrappedParams: UnwrappedExecuteSprocParam[] = paramKeyValues;
     for (let i = 0; i < unwrappedParams.length; i++) {
@@ -66,7 +51,7 @@ export const ExecuteSprocParamsPane: FunctionComponent<ExecuteSprocParamsPanePro
 
   const setInvalidParamError = (invalidParam: string): void => {
     setFormError(`Invalid param specified: ${invalidParam}`);
-    setFormErrorsDetails(`Invalid param specified: ${invalidParam} is not a valid literal value`);
+    logConsoleError(`Invalid param specified: ${invalidParam} is not a valid literal value`);
   };
 
   const submit = (): void => {
@@ -128,8 +113,16 @@ export const ExecuteSprocParamsPane: FunctionComponent<ExecuteSprocParamsPanePro
     setParamKeyValues(cloneParamKeyValue);
   };
 
+  const props: RightPaneFormProps = {
+    expandConsole,
+    formError: formError,
+    isExecuting: isLoading,
+    submitButtonText: "Execute",
+    onSubmit: () => submit(),
+  };
+
   return (
-    <GenericRightPaneComponent {...genericPaneProps}>
+    <RightPaneForm {...props}>
       <div className="panelFormWrapper">
         <div className="panelMainContent">
           <InputParameter
@@ -169,6 +162,6 @@ export const ExecuteSprocParamsPane: FunctionComponent<ExecuteSprocParamsPanePro
           </Stack>
         </div>
       </div>
-    </GenericRightPaneComponent>
+    </RightPaneForm>
   );
 };