fix: refactor and handle modify

backend/src/ee/services/dynamic-secret/providers/ldap.ts

@@ -5,11 +5,10 @@ import { render } from "mustache";
 import { customAlphabet } from "nanoid";
 import { z } from "zod";
 
-import { logger } from "@app/lib/logger";
 import { alphaNumericNanoId } from "@app/lib/nanoid";
 
 import { LdapSchema, TDynamicProviderFns } from "./models";
-
+import { BadRequestError } from "@app/lib/errors";
 const ldif = require("ldif");
 
 const generatePassword = () => {
@@ -17,8 +16,15 @@ const generatePassword = () => {
   return customAlphabet(charset, 64)();
 };
 
+const encodePassword = (password?: string) => {
+  const quotedPassword = `"${password}"`;
+  const utf16lePassword = Buffer.from(quotedPassword, "utf16le");
+  const base64Password = utf16lePassword.toString("base64");
+  return base64Password;
+}
+
 const generateUsername = () => {
-  return alphaNumericNanoId(32);
+  return alphaNumericNanoId(20);
 };
 
 const generateLDIF = ({
@@ -30,9 +36,11 @@ const generateLDIF = ({
   password?: string;
   ldifTemplate: string;
 }): string => {
+
   const data = {
     Username: username,
-    Password: password
+    Password: password,
+    EncodedPassword: encodePassword(password)
   };
 
   const ldif = render(ldifTemplate, data);
@@ -47,7 +55,7 @@ export const LdapProvider = (): TDynamicProviderFns => {
   };
 
   const getClient = async (providerInputs: z.infer<typeof LdapSchema>): Promise<ldapjs.Client> => {
-    return new Promise((resolve) => {
+    return new Promise((resolve, reject) => {
       const client = ldapjs.createClient({
         url: providerInputs.url,
         tlsOptions: {
@@ -57,18 +65,17 @@ export const LdapProvider = (): TDynamicProviderFns => {
         reconnect: true,
         bindDN: providerInputs.binddn,
         bindCredentials: providerInputs.bindpass,
-        log: logger
       });
 
       client.on("error", (err) => {
         client.unbind();
-        throw new Error(err.message);
+        reject(new BadRequestError({ message: err.message }));
       });
 
       client.bind(providerInputs.binddn, providerInputs.bindpass, (err) => {
         if (err) {
           client.unbind();
-          throw new Error(err.message);
+          reject(new BadRequestError({ message: err.message }));
         } else {
           resolve(client);
         }
@@ -100,10 +107,10 @@ export const LdapProvider = (): TDynamicProviderFns => {
           attributes[attrName] = Array.isArray(attrValue) ? attrValue : [attrValue];
         });
 
-        response_dn = await new Promise((resolve) => {
+        response_dn = await new Promise((resolve, reject) => {
           client.add(dn, attributes, (err) => {
             if (err) {
-              throw new Error(err.message);
+              reject(new BadRequestError({ message: err.message }));
             } else {
               resolve(dn);
             }
@@ -117,28 +124,27 @@ export const LdapProvider = (): TDynamicProviderFns => {
             new ldapjs.Change({
               operation: change.operation || "replace",
               modification: {
-                [change.attribute.attribute]: Array.isArray(change.value.value)
-                  ? change.value.value
-                  : [change.value.value]
+                type: change.attribute.attribute,
+                values: change.values.map((value: any) => value.value)
               }
             })
           );
         });
 
-        response_dn = await new Promise((resolve) => {
+        response_dn = await new Promise((resolve, reject) => {
           client.modify(dn, changes, (err) => {
             if (err) {
-              throw new Error(err.message);
+              reject(new BadRequestError({ message: err.message }));
             } else {
               resolve(dn);
             }
           });
         });
       } else if (entry.type === "delete") {
-        response_dn = await new Promise((resolve) => {
+        response_dn = await new Promise((resolve, reject) => {
           client.del(dn, (err) => {
             if (err) {
-              throw new Error(err.message);
+              reject(new BadRequestError({ message: err.message }));
             } else {
               resolve(dn);
             }
@@ -168,11 +174,11 @@ export const LdapProvider = (): TDynamicProviderFns => {
 
       return { entityId: username, data: { DN_ARRAY: dnArray, USERNAME: username, PASSWORD: password } };
     } catch (err) {
-      const rollbackLdif = generateLDIF({ username, password, ldifTemplate: providerInputs.rollbackLdif });
-
-      await executeLdif(client, rollbackLdif);
-
-      throw new Error((err as Error).message);
+      if (providerInputs.rollbackLdif) {
+        const rollbackLdif = generateLDIF({ username, password, ldifTemplate: providerInputs.rollbackLdif });
+        await executeLdif(client, rollbackLdif);
+      }
+      throw new BadRequestError({ message: (err as Error).message });
     }
   };
 

backend/src/ee/services/dynamic-secret/providers/models.ts

@@ -180,9 +180,9 @@ export const LdapSchema = z.object({
   bindpass: z.string().trim().min(1),
   ca: z.string().optional(),
 
-  creationLdif: z.string().trim().min(1),
-  revocationLdif: z.string().trim().min(1),
-  rollbackLdif: z.string().trim().min(1)
+  creationLdif: z.string().min(1),
+  revocationLdif: z.string().min(1),
+  rollbackLdif: z.string().optional()
 });
 
 export enum DynamicSecretProviders {

frontend/src/hooks/api/dynamicSecret/types.ts

@@ -199,7 +199,7 @@ export type TDynamicSecretProvider =
         ca?: string | undefined;
         creationLdif: string;
         revocationLdif: string;
-        rollbackLdif: string;
+        rollbackLdif?: string;
       };
     };
   ;

frontend/src/views/SecretMainPage/components/ActionBar/CreateDynamicSecretForm/LdapInputForm.tsx

@@ -10,274 +10,270 @@ import { useCreateDynamicSecret } from "@app/hooks/api";
 import { DynamicSecretProviders } from "@app/hooks/api/dynamicSecret/types";
 
 const formSchema = z.object({
-    provider: z.object({
-        url: z.string().trim().min(1),
-        binddn: z.string().trim().min(1),
-        bindpass: z.string().trim().min(1),
-        ca: z.string().optional(),
+  provider: z.object({
+    url: z.string().trim().min(1),
+    binddn: z.string().trim().min(1),
+    bindpass: z.string().trim().min(1),
+    ca: z.string().optional(),
 
-        creationLdif: z.string().trim().min(1),
-        revocationLdif: z.string().trim().min(1),
-        rollbackLdif: z.string().trim().min(1),
-    }),
+    creationLdif: z.string().min(1),
+    revocationLdif: z.string().min(1),
+    rollbackLdif: z.string().optional()
+  }),
 
-    defaultTTL: z.string().superRefine((val, ctx) => {
-        const valMs = ms(val);
-        if (valMs < 60 * 1000)
-            ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be a greater than 1min" });
-        // a day
-        if (valMs > 24 * 60 * 60 * 1000)
-            ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be less than a day" });
+  defaultTTL: z.string().superRefine((val, ctx) => {
+    const valMs = ms(val);
+    if (valMs < 60 * 1000)
+      ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be a greater than 1min" });
+    // a day
+    if (valMs > 24 * 60 * 60 * 1000)
+      ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be less than a day" });
+  }),
+  maxTTL: z
+    .string()
+    .optional()
+    .superRefine((val, ctx) => {
+      if (!val) return;
+      const valMs = ms(val);
+      if (valMs < 60 * 1000)
+        ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be a greater than 1min" });
+      // a day
+      if (valMs > 24 * 60 * 60 * 1000)
+        ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be less than a day" });
     }),
-    maxTTL: z
-        .string()
-        .optional()
-        .superRefine((val, ctx) => {
-            if (!val) return;
-            const valMs = ms(val);
-            if (valMs < 60 * 1000)
-                ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be a greater than 1min" });
-            // a day
-            if (valMs > 24 * 60 * 60 * 1000)
-                ctx.addIssue({ code: z.ZodIssueCode.custom, message: "TTL must be less than a day" });
-        }),
-    name: z.string().refine((val) => val.toLowerCase() === val, "Must be lowercase")
+  name: z.string().refine((val) => val.toLowerCase() === val, "Must be lowercase")
 });
 
 type TForm = z.infer<typeof formSchema>;
 
 type Props = {
-    onCompleted: () => void;
-    onCancel: () => void;
-    secretPath: string;
-    projectSlug: string;
-    environment: string;
+  onCompleted: () => void;
+  onCancel: () => void;
+  secretPath: string;
+  projectSlug: string;
+  environment: string;
 };
 
-export const LdapInputForm = (
-    {
-        onCompleted,
-        onCancel,
-        secretPath,
+export const LdapInputForm = ({
+  onCompleted,
+  onCancel,
+  secretPath,
+  projectSlug,
+  environment
+}: Props) => {
+  const {
+    control,
+    formState: { isSubmitting },
+    handleSubmit
+  } = useForm<TForm>({
+    resolver: zodResolver(formSchema),
+    defaultValues: {
+      provider: {
+        url: "",
+        binddn: "",
+        bindpass: "",
+        ca: "",
+        creationLdif: "",
+        revocationLdif: "",
+        rollbackLdif: ""
+      }
+    }
+  });
+
+  const createDynamicSecret = useCreateDynamicSecret();
+
+  const handleCreateDynamicSecret = async ({ name, maxTTL, provider, defaultTTL }: TForm) => {
+    // wait till previous request is finished
+    if (createDynamicSecret.isLoading) return;
+    try {
+      await createDynamicSecret.mutateAsync({
+        provider: { type: DynamicSecretProviders.Ldap, inputs: provider },
+        maxTTL,
+        name,
+        path: secretPath,
+        defaultTTL,
         projectSlug,
-        environment,
-    }: Props
-) => {
-    const {
-        control,
-        formState: { isSubmitting },
-        handleSubmit
-    } = useForm<TForm>({
-        resolver: zodResolver(formSchema),
-        defaultValues: {
-            provider: {
-                url: "",
-                binddn: "",
-                bindpass: "",
-                ca: "",
-                creationLdif: "",
-                revocationLdif: "",
-                rollbackLdif: ""
-            },
-        }
-    });
+        environmentSlug: environment
+      });
+      onCompleted();
+    } catch (err) {
+      createNotification({
+        type: "error",
+        text: "Failed to create dynamic secret"
+      });
+    }
+  };
 
-    const createDynamicSecret = useCreateDynamicSecret();
+  return (
+    <form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
+      <div>
+        <div className="flex items-center space-x-2">
+          <div className="flex-grow">
+            <Controller
+              control={control}
+              defaultValue=""
+              name="name"
+              render={({ field, fieldState: { error } }) => (
+                <FormControl
+                  label="Secret Name"
+                  isError={Boolean(error)}
+                  errorText={error?.message}
+                >
+                  <Input {...field} placeholder="dynamic-secret" />
+                </FormControl>
+              )}
+            />
+          </div>
+          <div className="w-32">
+            <Controller
+              control={control}
+              name="defaultTTL"
+              defaultValue="1h"
+              render={({ field, fieldState: { error } }) => (
+                <FormControl
+                  label={<TtlFormLabel label="Default TTL" />}
+                  isError={Boolean(error?.message)}
+                  errorText={error?.message}
+                >
+                  <Input {...field} />
+                </FormControl>
+              )}
+            />
+          </div>
+          <div className="w-32">
+            <Controller
+              control={control}
+              name="maxTTL"
+              defaultValue="24h"
+              render={({ field, fieldState: { error } }) => (
+                <FormControl
+                  label={<TtlFormLabel label="Max TTL" />}
+                  isError={Boolean(error?.message)}
+                  errorText={error?.message}
+                >
+                  <Input {...field} />
+                </FormControl>
+              )}
+            />
+          </div>
+        </div>
+        <div>
+          <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
+            Configuration
+          </div>
+          <div className="flex flex-col">
+            <div className="flex items-center space-x-2">
+              <div className="flex-grow">
+                <Controller
+                  control={control}
+                  name="provider.url"
+                  render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                      label="URL"
+                      isError={Boolean(error?.message)}
+                      errorText={error?.message}
+                    >
+                      <Input {...field} />
+                    </FormControl>
+                  )}
+                />
 
-    const handleCreateDynamicSecret = async ({ name, maxTTL, provider, defaultTTL }: TForm) => {
-        // wait till previous request is finished
-        if (createDynamicSecret.isLoading) return;
-        try {
-            await createDynamicSecret.mutateAsync({
-                provider: { type: DynamicSecretProviders.Ldap, inputs: provider },
-                maxTTL,
-                name,
-                path: secretPath,
-                defaultTTL,
-                projectSlug,
-                environmentSlug: environment
-            });
-            onCompleted();
-        } catch (err) {
-            createNotification({
-                type: "error",
-                text: "Failed to create dynamic secret"
-            });
-        }
-    };
+                <Controller
+                  control={control}
+                  name="provider.binddn"
+                  render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                      label="Bind DN"
+                      isError={Boolean(error?.message)}
+                      errorText={error?.message}
+                    >
+                      <Input {...field} />
+                    </FormControl>
+                  )}
+                />
 
-    return (
-        <form onSubmit={handleSubmit(handleCreateDynamicSecret)} autoComplete="off">
-                <div>
-                    <div className="flex items-center space-x-2">
-                        <div className="flex-grow">
-                            <Controller
-                                control={control}
-                                defaultValue=""
-                                name="name"
-                                render={({ field, fieldState: { error } }) => (
-                                    <FormControl
-                                        label="Secret Name"
-                                        isError={Boolean(error)}
-                                        errorText={error?.message}
-                                    >
-                                        <Input {...field} placeholder="dynamic-secret" />
-                                    </FormControl>
-                                )}
-                            />
-                        </div>
-                        <div className="w-32">
-                            <Controller
-                                control={control}
-                                name="defaultTTL"
-                                defaultValue="1h"
-                                render={({ field, fieldState: { error } }) => (
-                                    <FormControl
-                                        label={<TtlFormLabel label="Default TTL" />}
-                                        isError={Boolean(error?.message)}
-                                        errorText={error?.message}
-                                    >
-                                        <Input {...field} />
-                                    </FormControl>
-                                )}
-                            />
-                        </div>
-                        <div className="w-32">
-                            <Controller
-                                control={control}
-                                name="maxTTL"
-                                defaultValue="24h"
-                                render={({ field, fieldState: { error } }) => (
-                                    <FormControl
-                                        label={<TtlFormLabel label="Max TTL" />}
-                                        isError={Boolean(error?.message)}
-                                        errorText={error?.message}
-                                    >
-                                        <Input {...field} />
-                                    </FormControl>
-                                )}
-                            />
-                        </div>
-                    </div>
-                    <div>
-                        <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
-                            Configuration
-                        </div>
-                        <div className="flex flex-col">
-                            <div className="flex items-center space-x-2">
-                                <div className="flex-grow">
-                                    <Controller
-                                        control={control}
-                                        name="provider.url"
-                                        render={({ field, fieldState: { error } }) => (
-                                            <FormControl
-                                                label="URL"
-                                                isError={Boolean(error?.message)}
-                                                errorText={error?.message}
-                                            >
-                                                <Input {...field} />
-                                            </FormControl>
-                                        )}
-                                    />
+                <Controller
+                  control={control}
+                  name="provider.bindpass"
+                  render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                      label="Bind Password"
+                      isError={Boolean(error?.message)}
+                      errorText={error?.message}
+                    >
+                      <Input {...field} type="password" />
+                    </FormControl>
+                  )}
+                />
 
-                                    <Controller
-                                        control={control}
-                                        name="provider.binddn"
-                                        render={({ field, fieldState: { error } }) => (
-                                            <FormControl
-                                                label="Bind DN"
-                                                isError={Boolean(error?.message)}
-                                                errorText={error?.message}
-                                            >
-                                                <Input {...field} />
-                                            </FormControl>
-                                        )}
-                                    />
+                <Controller
+                  control={control}
+                  name="provider.ca"
+                  render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                      label="CA"
+                      isError={Boolean(error?.message)}
+                      errorText={error?.message}
+                    >
+                      <TextArea {...field} placeholder="-----BEGIN CERTIFICATE----- ..." />
+                    </FormControl>
+                  )}
+                />
 
-                                    <Controller
-                                        control={control}
-                                        name="provider.bindpass"
-                                        render={({ field, fieldState: { error } }) => (
-                                            <FormControl
-                                                label="Bind Password"
-                                                isError={Boolean(error?.message)}
-                                                errorText={error?.message}
-                                            >
-                                                <Input {...field} />
-                                            </FormControl>
-                                        )}
-                                    />
+                <Controller
+                  control={control}
+                  name="provider.creationLdif"
+                  render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                      label="Creation LDIF"
+                      isError={Boolean(error?.message)}
+                      errorText={error?.message}
+                    >
+                      <TextArea {...field} />
+                    </FormControl>
+                  )}
+                />
 
-                                    <Controller
-                                        control={control}
-                                        name="provider.ca"
-                                        render={({ field, fieldState: { error } }) => (
-                                            <FormControl
-                                                label="CA"
-                                                isError={Boolean(error?.message)}
-                                                errorText={error?.message}
-                                            >
-                                                <TextArea {...field} placeholder="-----BEGIN CERTIFICATE----- ..." />    
-                                            </FormControl>
-                                        )}
-                                    />
+                <Controller
+                  control={control}
+                  name="provider.revocationLdif"
+                  render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                      label="Revocation LDIF"
+                      isError={Boolean(error?.message)}
+                      errorText={error?.message}
+                    >
+                      <TextArea {...field} />
+                    </FormControl>
+                  )}
+                />
 
-                                    <Controller
-                                        control={control}
-                                        name="provider.creationLdif"
-                                        render={({ field, fieldState: { error } }) => (
-                                            <FormControl
-                                                label="Creation LDIF"
-                                                isError={Boolean(error?.message)}
-                                                errorText={error?.message}
-                                            >
-                                                <TextArea {...field} />
-                                            </FormControl>
-                                        )}
-                                    />
-
-                                    <Controller
-                                        control={control}
-                                        name="provider.revocationLdif"
-                                        render={({ field, fieldState: { error } }) => (
-                                            <FormControl
-                                                label="Revocation LDIF"
-                                                isError={Boolean(error?.message)}
-                                                errorText={error?.message}
-                                            >
-                                                <TextArea {...field} />
-                                            </FormControl>
-                                        )}
-                                    />
-
-                                    <Controller
-                                        control={control}
-                                        name="provider.rollbackLdif"
-                                        render={({ field, fieldState: { error } }) => (
-                                            <FormControl
-                                                label="Rollback LDIF"
-                                                isError={Boolean(error?.message)}
-                                                errorText={error?.message}
-                                            >
-                                                <TextArea {...field} />
-                                            </FormControl>
-                                        )}
-                                    />
-
-
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                <div className="mt-4 flex items-center space-x-4">
-                    <Button type="submit" isLoading={isSubmitting}>
-                        Submit
-                    </Button>
-                    <Button variant="outline_bg" onClick={onCancel}>
-                        Cancel
-                    </Button>
-                </div>
-            </form>
-    )
-};
+                <Controller
+                  control={control}
+                  name="provider.rollbackLdif"
+                  render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                      label="Rollback LDIF"
+                      isError={Boolean(error?.message)}
+                      errorText={error?.message}
+                    >
+                      <TextArea {...field} />
+                    </FormControl>
+                  )}
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="mt-4 flex items-center space-x-4">
+        <Button type="submit" isLoading={isSubmitting}>
+          Submit
+        </Button>
+        <Button variant="outline_bg" onClick={onCancel}>
+          Cancel
+        </Button>
+      </div>
+    </form>
+  );
+};

frontend/src/views/SecretMainPage/components/DynamicSecretListView/EditDynamicSecretForm/EditDynamicSecretLdapForm.tsx

@@ -12,13 +12,13 @@ import { TDynamicSecret } from "@app/hooks/api/dynamicSecret/types";
 const formSchema = z.object({
   inputs: z
     .object({
-        url: z.string().trim().min(1),
-        binddn: z.string().trim().min(1),
-        bindpass: z.string().trim().min(1),
-        ca: z.string().optional(),
-        creationLdif: z.string().trim().min(1),
-        revocationLdif: z.string().trim().min(1),
-        rollbackLdif: z.string().trim().min(1),
+      url: z.string().trim().min(1),
+      binddn: z.string().trim().min(1),
+      bindpass: z.string().trim().min(1),
+      ca: z.string().optional(),
+      creationLdif: z.string().min(1),
+      revocationLdif: z.string().min(1),
+      rollbackLdif: z.string().optional()
     })
     .partial(),
   defaultTTL: z.string().superRefine((val, ctx) => {
@@ -58,62 +58,62 @@ type Props = {
 };
 
 export const EditDynamicSecretLdapForm = ({
-    onClose,
-    dynamicSecret,
-    environment,
-    secretPath,
-    projectSlug
-  }: Props) => {
-    const {
-      control,
-      formState: { isSubmitting },
-      handleSubmit
-    } = useForm<TForm>({
-      resolver: zodResolver(formSchema),
-      values: {
-        defaultTTL: dynamicSecret.defaultTTL,
-        maxTTL: dynamicSecret.maxTTL,
-        newName: dynamicSecret.name,
-        inputs: {
-          ...(dynamicSecret.inputs as TForm["inputs"])
+  onClose,
+  dynamicSecret,
+  environment,
+  secretPath,
+  projectSlug
+}: Props) => {
+  const {
+    control,
+    formState: { isSubmitting },
+    handleSubmit
+  } = useForm<TForm>({
+    resolver: zodResolver(formSchema),
+    values: {
+      defaultTTL: dynamicSecret.defaultTTL,
+      maxTTL: dynamicSecret.maxTTL,
+      newName: dynamicSecret.name,
+      inputs: {
+        ...(dynamicSecret.inputs as TForm["inputs"])
+      }
+    }
+  });
+
+  const updateDynamicSecret = useUpdateDynamicSecret();
+
+  const handleUpdateDynamicSecret = async ({ inputs, maxTTL, defaultTTL, newName }: TForm) => {
+    // wait till previous request is finished
+    if (updateDynamicSecret.isLoading) return;
+    try {
+      await updateDynamicSecret.mutateAsync({
+        name: dynamicSecret.name,
+        path: secretPath,
+        projectSlug,
+        environmentSlug: environment,
+        data: {
+          maxTTL: maxTTL || undefined,
+          defaultTTL,
+          inputs,
+          newName: newName === dynamicSecret.name ? undefined : newName
         }
-      }
-    });
-  
-    const updateDynamicSecret = useUpdateDynamicSecret();
-  
-    const handleUpdateDynamicSecret = async ({ inputs, maxTTL, defaultTTL, newName }: TForm) => {
-      // wait till previous request is finished
-      if (updateDynamicSecret.isLoading) return;
-      try {
-        await updateDynamicSecret.mutateAsync({
-          name: dynamicSecret.name,
-          path: secretPath,
-          projectSlug,
-          environmentSlug: environment,
-          data: {
-            maxTTL: maxTTL || undefined,
-            defaultTTL,
-            inputs,
-            newName: newName === dynamicSecret.name ? undefined : newName
-          }
-        });
-        onClose();
-        createNotification({
-          type: "success",
-          text: "Successfully updated dynamic secret"
-        });
-      } catch (err) {
-        createNotification({
-          type: "error",
-          text: "Failed to update dynamic secret"
-        });
-      }
-    };
-  
-    return (
-      <div>
-        <form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
+      });
+      onClose();
+      createNotification({
+        type: "success",
+        text: "Successfully updated dynamic secret"
+      });
+    } catch (err) {
+      createNotification({
+        type: "error",
+        text: "Failed to update dynamic secret"
+      });
+    }
+  };
+
+  return (
+    <div>
+      <form onSubmit={handleSubmit(handleUpdateDynamicSecret)} autoComplete="off">
         <div className="flex items-center space-x-2">
           <div className="flex-grow">
             <Controller
@@ -162,107 +162,95 @@ export const EditDynamicSecretLdapForm = ({
           </div>
         </div>
         <div className="mt-4">
-            <Controller
-                control={control}
-                name="inputs.url"
-                render={({ field, fieldState: { error } }) => (
-                <FormControl
-                    label="URL"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                >
-                    <Input {...field} />
-                </FormControl>
-                )}
-            />
-            <Controller
-                control={control}
-                name="inputs.binddn"
-                render={({ field, fieldState: { error } }) => (
-                <FormControl
-                    label="Bind DN"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                >
-                    <Input {...field} />
-                </FormControl>
-                )}
-            />
-            <Controller
-                control={control}
-                name="inputs.bindpass"
-                render={({ field, fieldState: { error } }) => (
-                <FormControl
-                    label="Bind Password"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                >
-                    <Input {...field} />
-                </FormControl>
-                )}
-            />
-            <Controller
-                control={control}
-                name="inputs.ca"
-                render={({ field, fieldState: { error } }) => (
-                    <FormControl
-                    label="CA"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                    >
-                    <TextArea {...field} />
-                </FormControl>
-                )}
-                />
-            <Controller
-                control={control}
-                name="inputs.creationLdif"
-                render={({ field, fieldState: { error } }) => (
-                    <FormControl
-                    label="Creation LDIF"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                    >
-                    <TextArea {...field} />
-                </FormControl>
-                )}
-                />
-            <Controller
-                control={control}
-                name="inputs.revocationLdif"
-                render={({ field, fieldState: { error } }) => (
-                    <FormControl
-                    label="Revocation LDIF"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                    >
-                    <TextArea {...field} />
-                </FormControl>
-                )}
-            />
-            <Controller
-                control={control}
-                name="inputs.rollbackLdif"
-                render={({ field, fieldState: { error } }) => (
-                    <FormControl
-                    label="Rollback LDIF"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                    >
-                    <TextArea {...field} />
-                </FormControl>
-                )}
-            />
-            </div>
-            <div className="mt-4 flex items-center space-x-4">
-                <Button type="submit" isLoading={isSubmitting}>
-                    Submit
-                </Button>
-                <Button variant="outline_bg" onClick={onClose}>
-                    Cancel
-                </Button>
-            </div>
+          <Controller
+            control={control}
+            name="inputs.url"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl label="URL" isError={Boolean(error)} errorText={error?.message}>
+                <Input {...field} />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            name="inputs.binddn"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl label="Bind DN" isError={Boolean(error)} errorText={error?.message}>
+                <Input {...field} />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            name="inputs.bindpass"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Bind Password"
+                isError={Boolean(error)}
+                errorText={error?.message}
+              >
+                <Input {...field} type="password" />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            name="inputs.ca"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl label="CA" isError={Boolean(error)} errorText={error?.message}>
+                <TextArea {...field} />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            name="inputs.creationLdif"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Creation LDIF"
+                isError={Boolean(error)}
+                errorText={error?.message}
+              >
+                <TextArea {...field} />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            name="inputs.revocationLdif"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Revocation LDIF"
+                isError={Boolean(error)}
+                errorText={error?.message}
+              >
+                <TextArea {...field} />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            name="inputs.rollbackLdif"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Rollback LDIF"
+                isError={Boolean(error)}
+                errorText={error?.message}
+              >
+                <TextArea {...field} />
+              </FormControl>
+            )}
+          />
+        </div>
+        <div className="mt-4 flex items-center space-x-4">
+          <Button type="submit" isLoading={isSubmitting}>
+            Submit
+          </Button>
+          <Button variant="outline_bg" onClick={onClose}>
+            Cancel
+          </Button>
+        </div>
       </form>
-      </div>
-    )
-}  
+    </div>
+  );
+};