fixed the autocapitalization ability

frontend/src/components/v2/Input/Input.tsx

@@ -1,4 +1,4 @@
-import { forwardRef, InputHTMLAttributes, ReactNode } from "react";
+import { ChangeEvent, forwardRef, InputHTMLAttributes, ReactNode } from "react";
 import { cva, VariantProps } from "cva";
 import { twMerge } from "tailwind-merge";
 
@@ -10,6 +10,7 @@ type Props = {
   rightIcon?: ReactNode;
   isDisabled?: boolean;
   isReadOnly?: boolean;
+  autoCapitalization?: boolean;
 };
 
 const inputVariants = cva(
@@ -80,10 +81,19 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
       variant = "filled",
       size = "md",
       isReadOnly,
+      autoCapitalization,
       ...props
     },
     ref
   ): JSX.Element => {
+    const handleInput = (event: ChangeEvent<HTMLInputElement>) => {
+      console.log(123, props, autoCapitalization)
+      if (autoCapitalization) {
+        // eslint-disable-next-line no-param-reassign
+        event.target.value = event.target.value.toUpperCase();
+      }
+    };
+
     return (
       <div className={inputParentContainerVariants({ isRounded, isError, isFullWidth, variant })}>
         {leftIcon && <span className="absolute left-0 ml-3 text-sm">{leftIcon}</span>}
@@ -93,6 +103,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
           ref={ref}
           readOnly={isReadOnly}
           disabled={isDisabled}
+          onInput={handleInput}
           className={twMerge(
             leftIcon ? "pl-10" : "pl-2.5",
             rightIcon ? "pr-10" : "pr-2.5",

frontend/src/views/DashboardPage/DashboardPage.tsx

@@ -971,6 +971,7 @@ export const DashboardPage = () => {
                         register={register}
                         control={control}
                         setValue={setValue}
+                        autoCapitalization={currentWorkspace?.autoCapitalization}
                       />
                     ))}
                     {!isReadOnly && !isRollbackMode && (

frontend/src/views/DashboardPage/components/SecretInputRow/SecretInputRow.tsx

@@ -79,6 +79,7 @@ type Props = {
   setValue: UseFormSetValue<FormData>;
   isKeyError?: boolean;
   keyError?: string;
+  autoCapitalization?: boolean;
 };
 
 export const SecretInputRow = memo(
@@ -98,7 +99,8 @@ export const SecretInputRow = memo(
     setValue,
     isKeyError,
     keyError,
-    secUniqId
+    secUniqId,
+    autoCapitalization
   }: Props): JSX.Element => {
     const isKeySubDisabled = useRef<boolean>(false);
     // comment management in a row
@@ -243,6 +245,7 @@ export const SecretInputRow = memo(
                         isKeySubDisabled.current = false;
                         field.onBlur();
                       }}
+                      autoCapitalization={autoCapitalization}
                     />
                   </div>
                 </td>