fix: args were positioned incorrectly (#1799)

## Description:
@barnabasbusa submitted an
[issue](#1789) that
demonstrated that once run, the package would not apply the settings
provided in the package `args`. I identified a bug that meant that while
we were submitting the data it was in the wrong position and needed to
be moved up on level (destructured).

In this PR we are also setting the JSON type as the default arg type.

## Is this change user facing?
YES

## References (if applicable):
Closes #1789

enclave-manager/web/src/client/enclaveManager/KurtosisClient.ts

@@ -51,15 +51,12 @@ export abstract class KurtosisClient {
     this.client = client;
     this.cloudUrl = parentUrl;
     this.baseApplicationUrl = childUrl;
-    console.log("cloudUrl", this.cloudUrl);
-    console.log("baseApplicationUrl", this.baseApplicationUrl);
     this.getParentRequestedRoute();
   }
 
   getParentRequestedRoute() {
     const splits = this.cloudUrl.pathname.split("/enclave-manager");
     if (splits[1]) {
-      console.log("splits ", splits[1]);
       return splits[1];
     }
     return undefined;

enclave-manager/web/src/components/LocationBroadcaster.tsx

@@ -6,7 +6,6 @@ export const LocationBroadcaster = () => {
 
   useEffect(() => {
     const message = { message: "em-ui-location-pathname", value: location.pathname };
-    console.log("Broadcasting message to parent", message);
     // eslint-disable-next-line no-restricted-globals
     parent.postMessage(message, "*");
   }, [location.pathname]);

enclave-manager/web/src/components/LocationListener.tsx

@@ -8,7 +8,6 @@ export const LocationListener = () => {
 
   useEffect(() => {
     if (client.getCloudUrl()) {
-      console.log(client.getParentRequestedRoute());
       const route = client.getParentRequestedRoute();
       if (route) navigate(route);
     }

enclave-manager/web/src/components/enclaves/modals/ConfigureEnclaveModal.tsx

@@ -10,7 +10,7 @@ import {
   ModalHeader,
   ModalOverlay,
   Text,
-  Tooltip,
+  Tooltip, useToast,
 } from "@chakra-ui/react";
 import { EnclaveMode } from "enclave-manager-sdk/build/engine_service_pb";
 import { useMemo, useRef, useState } from "react";
@@ -55,6 +55,7 @@ export const ConfigureEnclaveModal = ({
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState<string>();
   const formRef = useRef<EnclaveConfigurationFormImperativeAttributes>(null);
+  const toast = useToast();
 
   const initialValues = useMemo(() => {
     if (isDefined(existingEnclave) && isDefined(existingEnclave.starlarkRun)) {
@@ -89,8 +90,10 @@ export const ConfigureEnclaveModal = ({
               return isDefined(value)
                 ? Object.entries(value).map(([k, v]) => ({ key: k, value: convertArgValue(innerType2, v) }), {})
                 : [];
+            case ArgumentValueType.JSON:
             default:
-              return value;
+              // By default, a typeless parameter is JSON.
+              return isDefined(value) ? JSON.stringify(value) : "{}";
           }
         };
 
@@ -129,6 +132,7 @@ export const ConfigureEnclaveModal = ({
           try {
             parsedForm.args[arg.name] = JSON.stringify(JSON.parse(parsedForm.args[arg.name]), undefined, 4);
           } catch (err: any) {
+            console.error("err", err);
             // do nothing, the input was not valid json.
           }
         }
@@ -155,6 +159,20 @@ export const ConfigureEnclaveModal = ({
   const handleLoadSubmit: SubmitHandler<ConfigureEnclaveForm> = async (formData) => {
     setError(undefined);
 
+    try {
+      console.debug("formData", formData);
+      if (formData.args && formData.args.args) {
+        formData.args.args = JSON.parse(formData.args.args);
+        console.debug("successfully parsed args as proper JSON", formData.args.args);
+      }
+    } catch (err) {
+      toast({
+        title: `An error occurred while preparing data for running package. The package arguments were not proper JSON: ${stringifyError(err)}`,
+        colorScheme: "red",
+      });
+      return;
+    }
+
     let apicInfo = existingEnclave?.apiContainerInfo;
     let enclaveUUID = existingEnclave?.shortenedUuid;
     if (!isDefined(existingEnclave)) {
@@ -179,7 +197,23 @@ export const ConfigureEnclaveModal = ({
       return;
     }
 
-    const logsIterator = await runStarlarkPackage(apicInfo, kurtosisPackage.name, formData.args);
+    let submissionData = {};
+    if (formData.args.args) {
+      const { args, ...rest } = formData.args;
+      submissionData = {
+        ...args,
+        ...rest,
+      };
+      console.debug("formData has `args` field and is merged with other potential args", submissionData);
+    } else {
+      submissionData = {
+        ...formData.args,
+      };
+      console.debug("formData does not have Args field", submissionData);
+    }
+    console.log("submissionData for runStarlarkPackage", submissionData);
+
+    const logsIterator = await runStarlarkPackage(apicInfo, kurtosisPackage.name, submissionData);
     navigator(`/enclave/${enclaveUUID}/logs`, { state: { logs: logsIterator } });
     onClose();
   };

enclave-manager/web/src/emui/enclaves/enclave/logs/EnclaveLogs.tsx

@@ -91,8 +91,6 @@ export const EnclaveLogs = ({ enclave }: EnclaveLogsProps) => {
                 refreshFilesAndArtifacts(enclave),
               ]);
             }
-
-            console.log(line.runResponseLine.value);
           }
         } catch (error: any) {
           if (cancelled) {

engine/server/webapp/asset-manifest.json

@@ -1,10 +1,10 @@
 {
   "files": {
-    "main.js": "./static/js/main.30986036.js",
+    "main.js": "./static/js/main.efcd178a.js",
     "index.html": "./index.html",
-    "main.30986036.js.map": "./static/js/main.30986036.js.map"
+    "main.efcd178a.js.map": "./static/js/main.efcd178a.js.map"
   },
   "entrypoints": [
-    "static/js/main.30986036.js"
+    "static/js/main.efcd178a.js"
   ]
 }

engine/server/webapp/index.html

@@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Kurtosis Enclave Manager"/><title>Kurtosis Enclave Manager</title><script defer="defer" src="./static/js/main.30986036.js"></script></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Kurtosis Enclave Manager"/><title>Kurtosis Enclave Manager</title><script defer="defer" src="./static/js/main.efcd178a.js"></script></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>