Merge branch 'main' into lporoli/detecting-flaky-tests-xlarge

kurtosis-tech · Nov 17, 2023 · b902d87 · b902d87
2 parents 69576d6 + 161cd0e
commit b902d87
Show file tree

Hide file tree

Showing 30 changed files with 137 additions and 96 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,12 @@
 # Changelog
 
+## [0.85.31](https://github.com/kurtosis-tech/kurtosis/compare/0.85.30...0.85.31) (2023-11-17)
+
+
+### Bug Fixes
+
+* implement minor emui feedback tweaks ([#1827](https://github.com/kurtosis-tech/kurtosis/issues/1827)) ([8161a34](https://github.com/kurtosis-tech/kurtosis/commit/8161a340a9f4724c885ffecbc61b31b1af9bc3fa))
+
 ## [0.85.30](https://github.com/kurtosis-tech/kurtosis/compare/0.85.29...0.85.30) (2023-11-17)
 
 

diff --git a/LICENSE.md b/LICENSE.md
@@ -3,7 +3,7 @@ Business Source License 1.1
 Parameters
 
 Licensor:             Kurtosis Technologies, Inc.
-Licensed Work:        Kurtosis 0.85.30
+Licensed Work:        Kurtosis 0.85.31
 The Licensed Work is (c) 2023 Kurtosis Technologies, Inc.
 Additional Use Grant: You may make use of the Licensed Work, provided that
 you may not use the Licensed Work for an Environment Orchestration Service.

diff --git a/api/golang/kurtosis_version/kurtosis_version.go b/api/golang/kurtosis_version/kurtosis_version.go
@@ -9,6 +9,6 @@ const (
 	// !!!!!!!!!!! DO NOT UPDATE! WILL BE MANUALLY UPDATED DURING THE RELEASE PROCESS !!!!!!!!!!!!!!!!!!!!!!
 	// This is necessary so that Kurt Core consumers will know if they're compatible with the currently-running
 	//  API container
-	KurtosisVersion = "0.85.30"
+	KurtosisVersion = "0.85.31"
 	// !!!!!!!!!!! DO NOT UPDATE! WILL BE MANUALLY UPDATED DURING THE RELEASE PROCESS !!!!!!!!!!!!!!!!!!!!!!
 )
diff --git a/api/rust/Cargo.toml b/api/rust/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "kurtosis-sdk"
-version = "0.85.30"
+version = "0.85.31"
 license = "BUSL-1.1"
 description = "Rust SDK for Kurtosis"
 edition = "2021"

diff --git a/api/typescript/package.json b/api/typescript/package.json
@@ -1,7 +1,7 @@
 {
     "name": "kurtosis-sdk",
     "//": "NOTE: DO NOT UPDATE THIS VERSION MANUALLY - IT WILL BE UPDATED DURING THE RELEASE PROCESS!",
-    "version": "0.85.30",
+    "version": "0.85.31",
     "main": "./build/index",
     "description": "This repo contains a Typescript client for communicating with the Kurtosis Engine server, which is responsible for creating, managing and destroying Kurtosis Enclaves.",
     "types": "./build/index",

diff --git a/api/typescript/src/kurtosis_version/kurtosis_version.ts b/api/typescript/src/kurtosis_version/kurtosis_version.ts
@@ -1,5 +1,5 @@
 // !!!!!!!!!!! DO NOT UPDATE! WILL BE MANUALLY UPDATED DURING THE RELEASE PROCESS !!!!!!!!!!!!!!!!!!!!!!
 // This is necessary so that Kurt Core consumers (e.g. modules) will know if they're compatible with the currently-running
 //  API container
-export const KURTOSIS_VERSION: string = "0.85.30"
+export const KURTOSIS_VERSION: string = "0.85.31"
 // !!!!!!!!!!! DO NOT UPDATE! WILL BE MANUALLY UPDATED DURING THE RELEASE PROCESS !!!!!!!!!!!!!!!!!!!!!!
diff --git a/enclave-manager/web/package.json b/enclave-manager/web/package.json
@@ -48,9 +48,9 @@
     "prebuild": "rm -rf ../../engine/server/webapp",
     "clean": "rm -rf build",
     "cleanInstall": "rm -rf node_modules; yarn install",
-    "start": "react-scripts start",
+    "start": "REACT_APP_VERSION=$(git fetch origin --tags -q && git describe --dirty --match '[0-9]*' --tags)-development react-scripts start",
     "start:prod": "serve -s build",
-    "build": "react-scripts build",
+    "build": "REACT_APP_VERSION=$(git fetch origin --tags -q && git describe --dirty --match '[0-9]*' --tags) react-scripts build",
     "postbuild": "cp -r build/ ../../engine/server/webapp",
     "prettier": "prettier . --check",
     "prettier:fix": "prettier . --write",

diff --git a/enclave-manager/web/src/components/AppLayout.tsx b/enclave-manager/web/src/components/AppLayout.tsx
@@ -14,7 +14,7 @@ export const AppLayout = ({ Nav, children }: AppLayoutProps) => {
       <Flex
         as="main"
         w={"100%"}
-        h={"100%"}
+        minH={"calc(100vh - 40px)"}
         justifyContent={"flex-start"}
         p={"20px 40px 20px 112px"}
         className={"app-container"}

diff --git a/enclave-manager/web/src/components/enclaves/configuration/inputs/IntegerArgumentInput.tsx b/enclave-manager/web/src/components/enclaves/configuration/inputs/IntegerArgumentInput.tsx
@@ -25,6 +25,7 @@ export const IntegerArgumentInput = (props: KurtosisArgumentTypeInputImplProps)
       placeholder={props.placeholder}
       width={props.width}
       size={props.size || "lg"}
+      tabIndex={props.tabIndex}
     />
   );
 };
diff --git a/...ve-manager/web/src/components/enclaves/configuration/inputs/KurtosisArgumentTypeInput.tsx b/...ve-manager/web/src/components/enclaves/configuration/inputs/KurtosisArgumentTypeInput.tsx
@@ -21,6 +21,7 @@ type KurtosisArgumentTypeInputProps = {
   disabled?: boolean;
   width?: CSS.Property.Width;
   size?: string;
+  tabIndex?: number;
 };
 
 export type KurtosisArgumentTypeInputImplProps = Omit<KurtosisArgumentTypeInputProps, "type" | "subType1" | "subType2">;
@@ -36,6 +37,7 @@ export const KurtosisArgumentTypeInput = ({
   disabled,
   width,
   size,
+  tabIndex,
 }: KurtosisArgumentTypeInputProps) => {
   const childProps: KurtosisArgumentTypeInputImplProps = {
     name,
@@ -45,6 +47,7 @@ export const KurtosisArgumentTypeInput = ({
     disabled,
     width,
     size,
+    tabIndex,
   };
 
   switch (type) {

diff --git a/enclave-manager/web/src/components/enclaves/configuration/inputs/StringArgumentInput.tsx b/enclave-manager/web/src/components/enclaves/configuration/inputs/StringArgumentInput.tsx
@@ -11,6 +11,7 @@ export const StringArgumentInput = (props: KurtosisArgumentTypeInputImplProps) =
       placeholder={props.placeholder}
       width={props.width}
       size={props.size || "lg"}
+      tabIndex={props.tabIndex}
     />
   );
 };
diff --git a/enclave-manager/web/src/components/enclaves/logs/LogViewer.tsx b/enclave-manager/web/src/components/enclaves/logs/LogViewer.tsx
@@ -55,8 +55,8 @@ export const LogViewer = ({
   };
 
   return (
-    <Flex flexDirection={"column"} gap={"32px"}>
-      <Flex flexDirection={"column"} position={"relative"} bg={"gray.800"}>
+    <Flex flexDirection={"column"} gap={"32px"} h={"100%"}>
+      <Flex flexDirection={"column"} position={"relative"} bg={"gray.800"} h={"100%"}>
         {isDefined(ProgressWidget) && (
           <Box
             display={"inline-flex"}
@@ -82,7 +82,7 @@ export const LogViewer = ({
           followOutput={automaticScroll}
           atBottomStateChange={handleBottomStateChange}
           isScrolling={setUserIsScrolling}
-          style={{ height: "660px" }}
+          style={{ height: "100%" }}
           data={logLines.filter(({ message }) => isDefined(message))}
           itemContent={(_, line) => <LogLine {...line} />}
         />

diff --git a/enclave-manager/web/src/components/enclaves/modals/ConfigureEnclaveModal.tsx b/enclave-manager/web/src/components/enclaves/modals/ConfigureEnclaveModal.tsx
@@ -10,7 +10,8 @@ import {
   ModalHeader,
   ModalOverlay,
   Text,
-  Tooltip, useToast,
+  Tooltip,
+  useToast,
 } from "@chakra-ui/react";
 import { EnclaveMode } from "enclave-manager-sdk/build/engine_service_pb";
 import { useMemo, useRef, useState } from "react";
@@ -168,7 +169,9 @@ export const ConfigureEnclaveModal = ({
       }
     } catch (err) {
       toast({
-        title: `An error occurred while preparing data for running package. The package arguments were not proper JSON: ${stringifyError(err)}`,
+        title: `An error occurred while preparing data for running package. The package arguments were not proper JSON: ${stringifyError(
+          err,
+        )}`,
         colorScheme: "red",
       });
       return;
@@ -277,7 +280,7 @@ export const ConfigureEnclaveModal = ({
                   <CopyButton contentName={"url"} valueToCopy={getLinkToCurrentConfig} text={"Copy link"} />
                 </Tooltip>
               </Flex>
-              <KurtosisArgumentFormControl name={"enclaveName"} label={"Enclave name"} type={"string"}>
+              <KurtosisArgumentFormControl name={"enclaveName"} label={"Enclave name"} type={"text"}>
                 <StringArgumentInput
                   name={"enclaveName"}
                   disabled={isDefined(existingEnclave)}
@@ -286,6 +289,7 @@ export const ConfigureEnclaveModal = ({
                       return `The enclave name must match ${allowedEnclaveNamePattern}`;
                     }
                   }}
+                  tabIndex={1}
                 />
               </KurtosisArgumentFormControl>
               {kurtosisPackage.args.map((arg, i) => (

diff --git a/enclave-manager/web/src/components/enclaves/widgets/DeleteEnclavesButton.tsx b/enclave-manager/web/src/components/enclaves/widgets/DeleteEnclavesButton.tsx
@@ -1,5 +1,5 @@
 import { Button, Tooltip } from "@chakra-ui/react";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { FiTrash2 } from "react-icons/fi";
 import { useNavigate } from "react-router-dom";
 import { useEmuiAppContext } from "../../../emui/EmuiAppContext";
@@ -11,28 +11,15 @@ type DeleteEnclavesButtonProps = {
 };
 
 export const DeleteEnclavesButton = ({ enclaves }: DeleteEnclavesButtonProps) => {
-  const { destroyEnclave } = useEmuiAppContext();
+  const { destroyEnclaves } = useEmuiAppContext();
   const navigator = useNavigate();
 
   const [showModal, setShowModal] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
 
-  const enclaveUUIDsKey = enclaves.map(({ enclaveUuid }) => enclaveUuid).join(",");
-
-  useEffect(
-    () => {
-      setIsLoading(false);
-      setShowModal(false);
-    },
-    // These deps are defined this way to detect whether or not the enclaves in props are actually different
-    [enclaveUUIDsKey],
-  );
-
   const handleDelete = async () => {
     setIsLoading(true);
-    for (const enclaveUUID of enclaves.map(({ enclaveUuid }) => enclaveUuid)) {
-      await destroyEnclave(enclaveUUID);
-    }
+    await destroyEnclaves(enclaves.map(({ enclaveUuid }) => enclaveUuid));
     navigator("/enclaves");
     setIsLoading(false);
     setShowModal(false);

diff --git a/enclave-manager/web/src/components/enclaves/widgets/DownloadFileArtifactButton.tsx b/enclave-manager/web/src/components/enclaves/widgets/DownloadFileArtifactButton.tsx
@@ -18,7 +18,7 @@ export const DownloadFileArtifactButton = ({ file, enclave }: DownloadFileButton
     setIsLoading(true);
     // todo: get tgz download instead
     const fileParts = await kurtosisClient.downloadFilesArtifact(enclave, file);
-    const writableStream = streamsaver.createWriteStream(`${enclave.name}-${file.fileName}.tgz`);
+    const writableStream = streamsaver.createWriteStream(`${enclave.name}--${file.fileName}.tgz`);
     const writer = writableStream.getWriter();
 
     for await (const part of fileParts) {

diff --git a/enclave-manager/web/src/components/enclaves/widgets/EnclaveStatus.tsx b/enclave-manager/web/src/components/enclaves/widgets/EnclaveStatus.tsx
@@ -1,4 +1,4 @@
-import { Tag } from "@chakra-ui/react";
+import { Tag, Tooltip } from "@chakra-ui/react";
 import { EnclaveContainersStatus } from "enclave-manager-sdk/build/engine_service_pb";
 
 export function enclaveStatusToString(status: EnclaveContainersStatus) {
@@ -12,31 +12,31 @@ export function enclaveStatusToString(status: EnclaveContainersStatus) {
   }
 }
 
+export function enclaveStatusToColorScheme(status: EnclaveContainersStatus) {
+  switch (status) {
+    case EnclaveContainersStatus.EnclaveContainersStatus_RUNNING:
+      return "green";
+    case EnclaveContainersStatus.EnclaveContainersStatus_STOPPED:
+      return "red";
+    case EnclaveContainersStatus.EnclaveContainersStatus_EMPTY:
+      return "gray";
+  }
+}
+
 type EnclaveStatusProps = {
   status: EnclaveContainersStatus;
   variant?: string;
 };
 
 export const EnclaveStatus = ({ status, variant }: EnclaveStatusProps) => {
   const display = enclaveStatusToString(status);
-  switch (status) {
-    case EnclaveContainersStatus.EnclaveContainersStatus_RUNNING:
-      return (
-        <Tag variant={variant} colorScheme={"green"}>
-          {display}
-        </Tag>
-      );
-    case EnclaveContainersStatus.EnclaveContainersStatus_STOPPED:
-      return (
-        <Tag variant={variant} colorScheme={"red"}>
-          {display}
-        </Tag>
-      );
-    case EnclaveContainersStatus.EnclaveContainersStatus_EMPTY:
-      return (
-        <Tag variant={variant} colorScheme={"gray"}>
-          {display}
-        </Tag>
-      );
-  }
+  const colorScheme = enclaveStatusToColorScheme(status);
+
+  return (
+    <Tooltip closeDelay={1000} label={"This is the status of the container running the enclave"}>
+      <Tag variant={variant} colorScheme={colorScheme}>
+        {display}
+      </Tag>
+    </Tooltip>
+  );
 };
diff --git a/enclave-manager/web/src/components/enclaves/widgets/ServiceStatus.tsx b/enclave-manager/web/src/components/enclaves/widgets/ServiceStatus.tsx
@@ -1,4 +1,4 @@
-import { Tag } from "@chakra-ui/react";
+import { Tag, Tooltip } from "@chakra-ui/react";
 import { ServiceStatus } from "enclave-manager-sdk/build/api_container_service_pb";
 
 export function serviceStatusToString(status: ServiceStatus) {
@@ -12,31 +12,31 @@ export function serviceStatusToString(status: ServiceStatus) {
   }
 }
 
+export function serviceStatusToColorScheme(status: ServiceStatus) {
+  switch (status) {
+    case ServiceStatus.RUNNING:
+      return "green";
+    case ServiceStatus.STOPPED:
+      return "red";
+    case ServiceStatus.UNKNOWN:
+      return "orange";
+  }
+}
+
 type ServiceStatusTagProps = {
   status: ServiceStatus;
   variant?: string;
 };
 
 export const ServiceStatusTag = ({ status, variant }: ServiceStatusTagProps) => {
   const display = serviceStatusToString(status);
-  switch (status) {
-    case ServiceStatus.RUNNING:
-      return (
-        <Tag variant={variant} colorScheme={"green"}>
-          {display}
-        </Tag>
-      );
-    case ServiceStatus.STOPPED:
-      return (
-        <Tag variant={variant} colorScheme={"red"}>
-          {display}
-        </Tag>
-      );
-    case ServiceStatus.UNKNOWN:
-      return (
-        <Tag variant={variant} colorScheme={"orange"}>
-          {display}
-        </Tag>
-      );
-  }
+  const colorScheme = serviceStatusToColorScheme(status);
+
+  return (
+    <Tooltip label={"The status of the container providing this service."} openDelay={1000}>
+      <Tag variant={variant} colorScheme={colorScheme}>
+        {display}
+      </Tag>
+    </Tooltip>
+  );
 };
diff --git a/enclave-manager/web/src/components/theme/tabsTheme.ts b/enclave-manager/web/src/components/theme/tabsTheme.ts
@@ -11,6 +11,9 @@ export const tabsTheme = defineMultiStyleConfig({
   },
   variants: {
     "soft-rounded": (props: StyleFunctionProps) => ({
+      root: {
+        height: "100%",
+      },
       tab: {
         fontStyle: "normal",
         fontWeight: "medium",
@@ -27,8 +30,12 @@ export const tabsTheme = defineMultiStyleConfig({
         },
         textTransform: "capitalize",
       },
+      tabpanels: {
+        height: "100%",
+      },
       tabpanel: {
         padding: "32px 0px",
+        height: "100%",
       },
     }),
   },

diff --git a/enclave-manager/web/src/emui/App.tsx b/enclave-manager/web/src/emui/App.tsx
@@ -15,6 +15,29 @@ import { EmuiAppContextProvider } from "./EmuiAppContext";
 import { enclaveRoutes } from "./enclaves/EnclaveRoutes";
 import { Navbar } from "./Navbar";
 
+const logLogo = (t: string) => console.log(`%c ${t}`, "background: black; color: #00C223");
+logLogo(`                                                                               
+                                                ///////////////////             
+                    //////////                 ///////////////////              
+                 .////     ,///             /////          ////*                
+               /////        ///           /////         /////                   
+            ,////        ,////         *////          ////*                     
+             //        /////         /////         /////                        
+                    *////         *////          ////*                          
+                  /////         /////         /////                             
+               *////         /////          /////                               
+             .////         /////         /////                                  
+            .///        /////          ////*        //                          
+            ///.      /////         //////          /////                       
+            ////                  ////*.////          *////                     
+             ////              /////      /////          /////                  
+              /////         *////*          .////          *////                
+                 //////////////                ////////////////////             
+                                                                                
+`);
+
+console.log(`Kurtosis web UI version: ${process.env.REACT_APP_VERSION || "Unknown"}`);
+
 export const EmuiApp = () => {
   return (
     <KurtosisThemeProvider>