feature: migrated path inputs to new component

frontend/src/views/Project/MembersPage/components/IdentityTab/components/IdentityRoleForm/SpecificPrivilegeSection.tsx

@@ -34,6 +34,7 @@ import {
   Tag,
   Tooltip
 } from "@app/components/v2";
+import { SecretPathInput } from "@app/components/v2/SecretPathInput";
 import {
   ProjectPermissionActions,
   ProjectPermissionSub,
@@ -115,6 +116,7 @@ const SpecificPrivilegeSecretForm = ({
   });
 
   const temporaryAccessField = privilegeForm.watch("temporaryAccess");
+  const selectedEnvironmentSlug = privilegeForm.watch("environmentSlug");
   const isTemporary = temporaryAccessField?.isTemporary;
   const isExpired =
     temporaryAccessField.isTemporary &&
@@ -220,7 +222,12 @@ const SpecificPrivilegeSecretForm = ({
             name="secretPath"
             render={({ field }) => (
               <FormControl label="Secret Path">
-                <Input {...field} isDisabled={isMemberEditDisabled} className="w-48" />
+                <SecretPathInput
+                  {...field}
+                  isDisabled={isMemberEditDisabled}
+                  environment={selectedEnvironmentSlug}
+                  containerClassName="w-48"
+                />
               </FormControl>
             )}
           />

frontend/src/views/Project/MembersPage/components/MemberListTab/MemberRoleForm/SpecificPrivilegeSection.tsx

@@ -34,6 +34,7 @@ import {
   Tag,
   Tooltip
 } from "@app/components/v2";
+import { SecretPathInput } from "@app/components/v2/SecretPathInput";
 import {
   ProjectPermissionActions,
   ProjectPermissionSub,
@@ -107,6 +108,7 @@ const SpecificPrivilegeSecretForm = ({ privilege }: { privilege: TProjectUserPri
   });
 
   const temporaryAccessField = privilegeForm.watch("temporaryAccess");
+  const selectedEnvironmentSlug = privilegeForm.watch("environmentSlug");
   const isTemporary = temporaryAccessField?.isTemporary;
   const isExpired =
     temporaryAccessField.isTemporary &&
@@ -208,7 +210,12 @@ const SpecificPrivilegeSecretForm = ({ privilege }: { privilege: TProjectUserPri
             name="secretPath"
             render={({ field }) => (
               <FormControl label="Secret Path">
-                <Input {...field} isDisabled={isMemberEditDisabled} className="w-48" />
+                <SecretPathInput
+                  {...field}
+                  isDisabled={isMemberEditDisabled}
+                  containerClassName="w-48"
+                  environment={selectedEnvironmentSlug}
+                />
               </FormControl>
             )}
           />

frontend/src/views/SecretApprovalPage/components/SecretApprovalPolicyList/components/SecretPolicyForm.tsx

@@ -20,6 +20,7 @@ import {
   Select,
   SelectItem
 } from "@app/components/v2";
+import { SecretPathInput } from "@app/components/v2/SecretPathInput";
 import { useWorkspace } from "@app/context";
 import { useCreateSecretApprovalPolicy, useUpdateSecretApprovalPolicy } from "@app/hooks/api";
 import { TSecretApprovalPolicy } from "@app/hooks/api/types";
@@ -59,13 +60,14 @@ export const SecretPolicyForm = ({
     control,
     handleSubmit,
     reset,
+    watch,
     formState: { isSubmitting }
   } = useForm<TFormSchema>({
     resolver: zodResolver(formSchema),
     values: editValues ? { ...editValues, environment: editValues.environment.slug } : undefined
   });
   const { currentWorkspace } = useWorkspace();
-  
+  const selectedEnvironment = watch("environment");
 
   const environments = currentWorkspace?.environments || [];
   useEffect(() => {
@@ -174,7 +176,11 @@ export const SecretPolicyForm = ({
             name="secretPath"
             render={({ field, fieldState: { error } }) => (
               <FormControl label="Secret Path" isError={Boolean(error)} errorText={error?.message}>
-                <Input {...field} value={field.value || ""} />
+                <SecretPathInput
+                  {...field}
+                  value={field.value || ""}
+                  environment={selectedEnvironment}
+                />
               </FormControl>
             )}
           />

frontend/src/views/SecretMainPage/components/ActionBar/CreateSecretImportForm.tsx

@@ -4,15 +4,8 @@ import { AxiosError } from "axios";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import {
-  Button,
-  FormControl,
-  Input,
-  Modal,
-  ModalContent,
-  Select,
-  SelectItem
-} from "@app/components/v2";
+import { Button, FormControl, Modal, ModalContent, Select, SelectItem } from "@app/components/v2";
+import { SecretPathInput } from "@app/components/v2/SecretPathInput";
 import { useWorkspace } from "@app/context";
 import { useCreateSecretImport } from "@app/hooks/api";
 
@@ -50,12 +43,12 @@ export const CreateSecretImportForm = ({
     handleSubmit,
     control,
     reset,
+    watch,
     formState: { isSubmitting }
   } = useForm<TFormSchema>({ resolver: zodResolver(typeSchema) });
   const { currentWorkspace } = useWorkspace();
   const environments = currentWorkspace?.environments || [];
-
-  
+  const selectedEnvironment = watch("environment");
 
   const { mutateAsync: createSecretImport } = useCreateSecretImport();
 
@@ -130,7 +123,7 @@ export const CreateSecretImportForm = ({
             defaultValue="/"
             render={({ field, fieldState: { error } }) => (
               <FormControl label="Secret Path" isError={Boolean(error)} errorText={error?.message}>
-                <Input {...field} />
+                <SecretPathInput {...field} environment={selectedEnvironment} />
               </FormControl>
             )}
           />

frontend/src/views/SecretMainPage/components/SecretDropzone/CopySecretsFromBoard.tsx

@@ -28,6 +28,7 @@ import {
   Skeleton,
   Tooltip
 } from "@app/components/v2";
+import { SecretPathInput } from "@app/components/v2/SecretPathInput";
 import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
 import { useDebounce } from "@app/hooks";
 import { useGetProjectSecrets } from "@app/hooks/api";
@@ -193,7 +194,11 @@ export const CopySecretsFromBoard = ({
               )}
             />
             <FormControl label="Secret Path" className="flex-grow" isRequired>
-              <Input {...register("secretPath")} placeholder="Provide a path, default is /" />
+              <SecretPathInput
+                {...register("secretPath")}
+                placeholder="Provide a path, default is /"
+                environment={selectedEnvSlug}
+              />
             </FormControl>
           </div>
           <div className="border-t border-mineshaft-600 pt-4">

frontend/src/views/SecretRotationPage/components/CreateRotationForm/steps/RotationOutputForm.tsx

@@ -3,6 +3,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { Button, FormControl, Input, Select, SelectItem, Spinner } from "@app/components/v2";
+import { SecretPathInput } from "@app/components/v2/SecretPathInput";
 import { useWorkspace } from "@app/context";
 import { useGetProjectSecrets, useGetUserWsKey } from "@app/hooks/api";
 
@@ -78,7 +79,7 @@ export const RotationOutputForm = ({ onSubmit, onCancel, outputSchema = {} }: Pr
         defaultValue="/"
         render={({ field }) => (
           <FormControl className="capitalize" label="Secret path">
-            <Input {...field} />
+            <SecretPathInput {...field} environment={environment} />
           </FormControl>
         )}
       />