merge main

frontend/src/components/v2/InfisicalSecretInput/InfisicalSecretInput.tsx

@@ -51,6 +51,7 @@ type Props = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "val
   isVisible?: boolean;
   isReadOnly?: boolean;
   isDisabled?: boolean;
+  canEditButNotView?: boolean;
   secretPath?: string;
   environment?: string;
   containerClassName?: string;
@@ -70,6 +71,7 @@ export const InfisicalSecretInput = forwardRef<HTMLTextAreaElement, Props>(
       containerClassName,
       secretPath: propSecretPath,
       environment: propEnvironment,
+      canEditButNotView,
       ...props
     },
     ref
@@ -273,6 +275,7 @@ export const InfisicalSecretInput = forwardRef<HTMLTextAreaElement, Props>(
         <Popover.Trigger asChild>
           <SecretInput
             {...props}
+            canEditButNotView={canEditButNotView}
             ref={handleRef}
             onKeyDown={handleKeyDown}
             value={value}

frontend/src/components/v2/SecretInput/SecretInput.tsx

@@ -3,6 +3,7 @@ import { forwardRef, TextareaHTMLAttributes } from "react";
 import { twMerge } from "tailwind-merge";
 
 import { useToggle } from "@app/hooks";
+import { HIDDEN_SECRET_VALUE } from "@app/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretItem";
 
 const REGEX = /(\${([a-zA-Z0-9-_.]+)})/g;
 const replaceContentWithDot = (str: string) => {
@@ -51,6 +52,7 @@ type Props = TextareaHTMLAttributes<HTMLTextAreaElement> & {
   isReadOnly?: boolean;
   isDisabled?: boolean;
   containerClassName?: string;
+  canEditButNotView?: boolean;
 };
 
 const commonClassName = "font-mono text-sm caret-white border-none outline-none w-full break-all";
@@ -66,6 +68,7 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
       isDisabled,
       isReadOnly,
       onFocus,
+      canEditButNotView,
       ...props
     },
     ref
@@ -93,7 +96,15 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
             onFocus={(evt) => {
               onFocus?.(evt);
               setIsSecretFocused.on();
-              evt.currentTarget.select();
+              if (canEditButNotView && value === HIDDEN_SECRET_VALUE) {
+                evt.currentTarget.select();
+              }
+            }}
+            onMouseDown={(e) => {
+              if (canEditButNotView && value === HIDDEN_SECRET_VALUE) {
+                e.preventDefault();
+                e.currentTarget.select();
+              }
             }}
             disabled={isDisabled}
             spellCheck={false}

frontend/src/components/v2/Select/Select.tsx

@@ -125,6 +125,7 @@ export const SelectItem = forwardRef<HTMLDivElement, SelectItemProps>(
     return (
       <SelectPrimitive.Item
         {...props}
+        disabled={isDisabled}
         className={twMerge(
           "relative mb-0.5 cursor-pointer select-none items-center overflow-hidden truncate rounded-md py-2 pl-10 pr-4 text-sm outline-none transition-all hover:bg-mineshaft-500 data-[highlighted]:bg-mineshaft-700/80",
           isSelected && "bg-primary",