Merge remote-tracking branch 'origin/main' into auto-updater

CHANGELOG.md

@@ -2,6 +2,35 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [2.4.1](https://github.com/kubeshop/monokle/compare/v2.4.1-nightly-2023-10-11.0...v2.4.1) (2023-10-11)
+
+
+### Features
+
+* context menu for helm chart dry runs ([0618e91](https://github.com/kubeshop/monokle/commit/0618e919d4db726047e66272d606f89c9fcbead2))
+* delete action for dry run config ([7fcc8d2](https://github.com/kubeshop/monokle/commit/7fcc8d20a951b34dabd815f5f3910b12c058b0f9))
+* edit action for dry run configs ([e2f55cd](https://github.com/kubeshop/monokle/commit/e2f55cda39223d8c190e0264eba78eedb944e82c))
+* grouping for kustomizations ([f808a18](https://github.com/kubeshop/monokle/commit/f808a18521ea25f1fb473885323f0c198fec4b52))
+* new dropdown for dry run configs ([ec41b51](https://github.com/kubeshop/monokle/commit/ec41b513b373421943c459dffec4ebe81abf7592))
+* new selectors for dry runs ([105b89f](https://github.com/kubeshop/monokle/commit/105b89f44dd7b6c01b68e27b30567ac15e311e3f))
+* scroll to current dry run ([a6ae883](https://github.com/kubeshop/monokle/commit/a6ae88371f6c304d07355c211f5533ddbdeb840f))
+* show list of existing dry runs ([c37a98a](https://github.com/kubeshop/monokle/commit/c37a98ad772967a8a4e0b3a8247dc90aadfba521))
+* v1 of new DryRuns panel ([1b473d4](https://github.com/kubeshop/monokle/commit/1b473d4b34c6041d45066203327eb91d7e7fc0ef))
+* virtualization for dry runs pane ([e4fcf8a](https://github.com/kubeshop/monokle/commit/e4fcf8ab7dc99fa4eaddf248145433050c87349c))
+
+
+### Bug Fixes
+
+* cloud policy polling ([439b633](https://github.com/kubeshop/monokle/commit/439b63333779ead3ec9f8fabdeb0a4579ceaf5a8))
+* dry run config edit icon ([176566e](https://github.com/kubeshop/monokle/commit/176566e6c7ebeec4f2ad9d1d923fdf5980f1d71e))
+* dry run title bar label ([02e124b](https://github.com/kubeshop/monokle/commit/02e124b97e233f39e1b860075eb6615269e2fbe3))
+* ellipsis on previewable files ([d5b2e25](https://github.com/kubeshop/monokle/commit/d5b2e25555467e816ec287142194cdee3cebad7b))
+* file tree height ([f2934c5](https://github.com/kubeshop/monokle/commit/f2934c5a26f790f6807f9f642bcd4bb90e29b277))
+* file tree scroll to file ([4ace23c](https://github.com/kubeshop/monokle/commit/4ace23cc67e683eb407dc6b4bd3a26c5baf3e529))
+* preview & cluster states ([7cb9071](https://github.com/kubeshop/monokle/commit/7cb9071e733983aa9374eab033836f06e586b0a3))
+* selecting the file of current dry run ([1f3befe](https://github.com/kubeshop/monokle/commit/1f3befe16c403f0d905a642c4e38794e605ebcfd))
+* titlebars styling ([e210303](https://github.com/kubeshop/monokle/commit/e2103033432951f1b47e9e20c194e361aef979ec))
+
 ## [2.4.0](https://github.com/kubeshop/monokle/compare/v2.4.1-nightly-2023-09-28.0...v2.4.0) (2023-09-28)
 
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "monokle",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "author": "Kubeshop",
   "description": "UI for managing k8s manifests",
   "homepage": "./",
@@ -63,7 +63,7 @@
     "concurrently": "8.0.1",
     "craco-less": "2.0.0",
     "cross-env": "7.0.3",
-    "electron": "26.2.2",
+    "electron": "26.3.0",
     "electron-builder": "24.6.4",
     "electron-reload": "2.0.0-alpha.1",
     "eslint-config-airbnb": "19.0.4",

src/components/atoms/HoverableButton/HoverableButton.tsx

@@ -0,0 +1,27 @@
+import {PropsWithChildren, forwardRef, useMemo, useState} from 'react';
+
+import {Button, ButtonProps} from 'antd';
+
+type Props = PropsWithChildren<
+  ButtonProps & {
+    hoverProps?: ButtonProps;
+  }
+>;
+
+const HoverableButton = forwardRef<HTMLButtonElement, Props>((props, ref) => {
+  const {hoverProps = {}, children, ...buttonProps} = props;
+  const [isHovered, setIsHovered] = useState(false);
+
+  const thisProps = useMemo(
+    () => (isHovered ? {...buttonProps, ...hoverProps} : buttonProps),
+    [isHovered, buttonProps, hoverProps]
+  );
+
+  return (
+    <Button ref={ref} {...thisProps} onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}>
+      {children}
+    </Button>
+  );
+});
+
+export default HoverableButton;

src/components/atoms/HoverableButton/index.ts

@@ -0,0 +1 @@
+export {default} from './HoverableButton';

src/components/atoms/StyledComponents/TitleBarWrapper.tsx

@@ -1,11 +1,14 @@
 import styled from 'styled-components';
 
 export const TitleBarWrapper = styled.div<{$editor?: boolean; $navigator?: boolean}>`
-  padding: 20px 20px 10px 20px;
+  padding: 16px 20px 10px 16px;
 
   ${({$editor, $navigator}) => {
     if ($editor) {
-      return `padding-bottom: 6px;`;
+      return `
+        padding-bottom: 6px;
+        padding-right: 16px;
+      `;
     }
 
     if ($navigator) {

src/components/molecules/ResourceRefsIconPopover/ResourceRefsIconPopover.tsx

@@ -21,11 +21,13 @@ const ResourceRefsIconPopover = ({
   type,
   isDisabled,
   isSelected,
+  placeholderWidth,
 }: {
   resourceMeta: ResourceMeta;
   type: 'incoming' | 'outgoing';
-  isDisabled: boolean;
+  isDisabled?: boolean;
   isSelected: boolean;
+  placeholderWidth?: number;
 }) => {
   const resourceRefs = useMemo(
     () =>
@@ -48,7 +50,7 @@ const ResourceRefsIconPopover = ({
   const incomingColor = useMemo(() => (isSelected ? Colors.blackPure : Colors.blue10), [isSelected]);
 
   if (isDisabled || !resourceRefs || !size(resourceRefs)) {
-    return <span style={{width: '30px', minWidth: '30px'}} />;
+    return <span style={{width: `${placeholderWidth}px`, minWidth: `${placeholderWidth}px`}} />;
   }
 
   return (

src/components/organisms/ActionsPane/ActionsPane.styled.tsx

@@ -53,7 +53,7 @@ export const Tabs = styled(RawTabs)<{$height: number}>`
   width: 100%;
   height: ${({$height}) => `${$height}px`};
   overflow: visible;
-  padding: 0px 20px 0px 20px;
+  padding: 0px 16px 0px 16px;
   margin-top: -10px;
 
   & .ant-tabs-nav {

src/components/organisms/ExplorerPane/DryRunsPane/CommandRenderer.tsx

@@ -0,0 +1,49 @@
+import {memo, useState} from 'react';
+
+import {useAppSelector} from '@redux/hooks';
+
+import {CommandPreview} from '@shared/models/preview';
+
+import {usePreviewTrigger} from './usePreviewTrigger';
+
+import * as S from './styled';
+
+type IProps = {
+  id: string;
+};
+
+const CommandRenderer: React.FC<IProps> = props => {
+  const {id} = props;
+
+  const command = useAppSelector(state => state.config.projectConfig?.savedCommandMap?.[id]);
+
+  const isPreviewed = useAppSelector(
+    state => state.main.preview?.type === 'command' && state.main.preview.commandId === command?.id
+  );
+  const thisPreview: CommandPreview = {type: 'command', commandId: id};
+  const {isOptimisticLoading, triggerPreview, renderPreviewControls} = usePreviewTrigger(thisPreview);
+  const mightBePreview = isPreviewed || isOptimisticLoading;
+
+  const [isHovered, setIsHovered] = useState<boolean>(false);
+
+  if (!command) {
+    return null;
+  }
+
+  return (
+    <S.ItemContainer
+      indent={22}
+      isHovered={isHovered}
+      isPreviewed={mightBePreview}
+      onMouseEnter={() => setIsHovered(true)}
+      onMouseLeave={() => setIsHovered(false)}
+      onClick={triggerPreview}
+    >
+      <S.ItemName isPreviewed={mightBePreview}>{command.label}</S.ItemName>
+      {isOptimisticLoading && <S.ReloadIcon spin />}
+      {renderPreviewControls()}
+    </S.ItemContainer>
+  );
+};
+
+export default memo(CommandRenderer);