final small fixes

backend/src/ee/services/pam-account/pam-account-service.ts

@@ -611,6 +611,8 @@ export const pamAccountServiceFactory = ({
             }
           });
         } catch (error) {
+          logger.error(error, `Failed to rotate credentials for account [accountId=${account.id}]`);
+
           const errorMessage = error instanceof Error ? error.message : "An unknown error occurred";
 
           await auditLogService.createAuditLog({
@@ -630,8 +632,6 @@ export const pamAccountServiceFactory = ({
               }
             }
           });
-
-          logger.error(error, `Failed to rotate credentials for account ${account.id}`);
         }
       });
 

frontend/src/pages/organization/SettingsPage/components/AuditLogStreamTab/AuditLogStreamForm/CustomProviderAuditLogStreamForm.tsx

@@ -7,6 +7,7 @@ import { z } from "zod";
 import { Button, FormControl, FormLabel, IconButton, Input, ModalClose } from "@app/components/v2";
 import { LogProvider } from "@app/hooks/api/auditLogStreams/enums";
 import { TCustomProviderLogStream } from "@app/hooks/api/auditLogStreams/types/providers/custom-provider";
+import { useState } from "react";
 
 type Props = {
   auditLogStream?: TCustomProviderLogStream;
@@ -29,6 +30,8 @@ const formSchema = z.object({
 type FormData = z.infer<typeof formSchema>;
 
 export const CustomProviderAuditLogStreamForm = ({ auditLogStream, onSubmit }: Props) => {
+  const [showPassword, setShowPassword] = useState(false);
+
   const isUpdate = Boolean(auditLogStream);
 
   const form = useForm<FormData>({
@@ -96,10 +99,10 @@ export const CustomProviderAuditLogStreamForm = ({ auditLogStream, onSubmit }: P
                 >
                   <Input
                     {...field}
-                    type="password"
+                    type={showPassword ? "text" : "password"}
-                    placeholder="Bearer <token>"
                     autoComplete="new-password"
-                    onFocus={(e) => {
+                    placeholder="Bearer <token>"
+                    onFocus={() => {
                       if (
                         auditLogStream &&
                         auditLogStream.credentials.headers[i] &&
@@ -108,9 +111,9 @@ export const CustomProviderAuditLogStreamForm = ({ auditLogStream, onSubmit }: P
                       ) {
                         field.onChange("");
                       }
-                      e.target.type = "text";
+                      setShowPassword(true);
                     }}
-                    onBlur={(e) => {
+                    onBlur={() => {
                       if (
                         auditLogStream &&
                         auditLogStream.credentials.headers[i] &&
@@ -119,7 +122,7 @@ export const CustomProviderAuditLogStreamForm = ({ auditLogStream, onSubmit }: P
                       ) {
                         field.onChange("******");
                       }
-                      e.target.type = "password";
+                      setShowPassword(false);
                     }}
                   />
                 </FormControl>

frontend/src/pages/pam/PamAccountsPage/components/PamAccountForm/shared/SqlAccountFields.tsx

@@ -1,9 +1,11 @@
 import { Controller, useFormContext } from "react-hook-form";
 
 import { FormControl, Input } from "@app/components/v2";
+import { useState } from "react";
 
 export const SqlAccountFields = ({ isUpdate }: { isUpdate: boolean }) => {
   const { control } = useFormContext();
+  const [showPassword, setShowPassword] = useState(false);
 
   return (
     <div className="flex gap-2">
@@ -33,19 +35,19 @@ export const SqlAccountFields = ({ isUpdate }: { isUpdate: boolean }) => {
           >
             <Input
               {...field}
-              type="password"
+              type={showPassword ? "text" : "password"}
               autoComplete="new-password"
-              onFocus={(e) => {
+              onFocus={() => {
                 if (isUpdate && field.value === "******") {
                   field.onChange("");
                 }
-                e.target.type = "text";
+                setShowPassword(true);
               }}
-              onBlur={(e) => {
+              onBlur={() => {
                 if (isUpdate && field.value === "") {
                   field.onChange("******");
                 }
-                e.target.type = "password";
+                setShowPassword(false);
               }}
             />
           </FormControl>

frontend/src/pages/pam/PamResourcesPage/components/PamResourceForm/shared/SqlRotateAccountFields.tsx

@@ -1,3 +1,4 @@
+import { useState } from "react";
 import { Controller, useFormContext } from "react-hook-form";
 
 import {
@@ -11,6 +12,7 @@ import {
 
 export const SqlRotateAccountFields = ({ isUpdate }: { isUpdate: boolean }) => {
   const { control } = useFormContext();
+  const [showPassword, setShowPassword] = useState(false);
 
   return (
     <Accordion type="single" collapsible className="w-full">
@@ -50,19 +52,19 @@ export const SqlRotateAccountFields = ({ isUpdate }: { isUpdate: boolean }) => {
                 >
                   <Input
                     {...field}
-                    type="password"
+                    type={showPassword ? "text" : "password"}
                     autoComplete="new-password"
-                    onFocus={(e) => {
+                    onFocus={() => {
                       if (isUpdate && field.value === "******") {
                         field.onChange("");
                       }
-                      e.target.type = "text";
+                      setShowPassword(true);
                     }}
-                    onBlur={(e) => {
+                    onBlur={() => {
                       if (isUpdate && field.value === "") {
                         field.onChange("******");
                       }
-                      e.target.type = "password";
+                      setShowPassword(false);
                     }}
                   />
                 </FormControl>