From 400dc75656b363e75f9903aaa73491c71a495fcb Mon Sep 17 00:00:00 2001
From: Daniel Hougaard <daniel@infisical.com>
Date: Fri, 13 Jun 2025 19:38:40 +0400
Subject: [PATCH] Update SecretApprovalRequestChangeItem.tsx

---
 .../SecretApprovalRequestChangeItem.tsx          | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChangeItem.tsx b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChangeItem.tsx
index 5439d46a8..3720b63dc 100644
--- a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChangeItem.tsx
+++ b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChangeItem.tsx
@@ -11,10 +11,10 @@ import {
   faKey
 } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { twMerge } from "tailwind-merge";
 
 import { SecretInput, Tag, Tooltip } from "@app/components/v2";
 import { CommitType, SecretV3Raw, TSecretApprovalSecChange, WsTag } from "@app/hooks/api/types";
-import { twMerge } from "tailwind-merge";
 
 export type Props = {
   op: CommitType;
@@ -107,8 +107,11 @@ export const SecretApprovalRequestChangeItem = ({
                   ) : (
                     <div className="relative">
                       {secretVersion?.secretValueHidden && (
-                        <div className="absolute left-1 top-1/2 -translate-y-1/2">
-                          <Tooltip content="You do not have access to view the old secret value.">
+                        <div className="absolute left-1 top-1/2 z-50 -translate-y-1/2">
+                          <Tooltip
+                            position="right"
+                            content="You do not have access to view the old secret value."
+                          >
                             <FontAwesomeIcon
                               className="pl-2 text-mineshaft-300"
                               size="sm"
@@ -230,8 +233,11 @@ export const SecretApprovalRequestChangeItem = ({
                   ) : (
                     <div className="relative">
                       {newVersion?.secretValueHidden && (
-                        <div className="absolute left-1 top-1/2 -translate-y-1/2">
-                          <Tooltip content="You do not have access to view the new secret value.">
+                        <div className="absolute left-1 top-1/2 z-50 -translate-y-1/2">
+                          <Tooltip
+                            position="right"
+                            content="You do not have access to view the new secret value."
+                          >
                             <FontAwesomeIcon
                               className="pl-2 text-mineshaft-300"
                               size="sm"