refact: added autoComplete and spellCheck to off

Author: Yashh56

src/components/ui/input.tsx

@@ -2,10 +2,12 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 
-function Input({ className, type, ...props }: React.ComponentProps<"input">) {
+function Input({ className, type, autoComplete = "off", spellCheck = false, ...props }: React.ComponentProps<"input">) {
   return (
     <input
       type={type}
+      autoComplete={autoComplete}
+      spellCheck={spellCheck}
       data-slot="input"
       className={cn(
         "file:text-foreground placeholder:text-muted-foreground/70 selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-background/45 px-3 py-1 text-base shadow-xs transition-[color,box-shadow,border-color,background-color] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",

src/components/ui/textarea.tsx

@@ -2,9 +2,11 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 
-function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
+function Textarea({ className, autoComplete = "off", spellCheck = false, ...props }: React.ComponentProps<"textarea">) {
   return (
     <textarea
+      autoComplete={autoComplete}
+      spellCheck={spellCheck}
       data-slot="textarea"
       className={cn(
         "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",

src/features/schema-explorer/components/AddIndexesDialog.tsx

@@ -41,6 +41,7 @@ export default function AddIndexesDialog({
         indexes,
         isSubmitting }
         = useAddIndexDialog({
+            open,
             onOpenChange,
             dbId,
             schemaName,

src/features/schema-explorer/hooks/useAddIndexDialog.ts

@@ -1,10 +1,11 @@
 import { CreateIndexDefinition } from "@/features/database/types";
 import { databaseService } from "@/services/bridge/database";
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import { toast } from "sonner";
 
 
 interface AddIndexesDialogProps {
+    open: boolean;
     onOpenChange: (open: boolean) => void;
     dbId: string;
     schemaName: string;
@@ -13,14 +14,20 @@ interface AddIndexesDialogProps {
 }
 
 
-export function useAddIndexDialog({ onOpenChange, dbId, schemaName, tableName, onSuccess }: AddIndexesDialogProps) {
+export function useAddIndexDialog({ open, onOpenChange, dbId, schemaName, tableName, onSuccess }: AddIndexesDialogProps) {
     const [indexes, setIndexes] = useState<CreateIndexDefinition[]>([]);
     const [isSubmitting, setIsSubmitting] = useState(false);
 
     const resetForm = () => {
         setIndexes([]);
     };
 
+    useEffect(() => {
+        if (open) {
+            resetForm();
+        }
+    }, [open]);
+
     const handleClose = () => {
         if (!isSubmitting) {
             resetForm();

src/features/schema-explorer/hooks/useAlterTableDialog.ts

@@ -1,6 +1,6 @@
 import { AlterTableOperation } from "@/features/database/types";
 import { migrationService } from "@/services/bridge/migration";
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import { toast } from "sonner";
 
 
@@ -17,14 +17,20 @@ interface AlterTableDialogProps {
 
 
 
-export function useAlterTableDialog({ onOpenChange, dbId, schemaName, tableName, onSuccess }: AlterTableDialogProps) {
+export function useAlterTableDialog({ open, onOpenChange, dbId, schemaName, tableName, onSuccess }: AlterTableDialogProps) {
     const [operations, setOperations] = useState<AlterTableOperation[]>([]);
     const [isSubmitting, setIsSubmitting] = useState(false);
 
     const resetForm = () => {
         setOperations([]);
     };
 
+    useEffect(() => {
+        if (open) {
+            resetForm();
+        }
+    }, [open]);
+
     const handleClose = () => {
         if (!isSubmitting) {
             resetForm();

src/features/schema-explorer/hooks/useCreateTableDialog.ts

@@ -28,6 +28,7 @@ export function useCreateTableDialog({ onOpenChange, dbId, schemaName, onSuccess
     useEffect(() => {
         if (open && dbId) {
             fetchAvailableTables();
+            resetForm();
         }
     }, [open, dbId]);
 

src/features/schema-explorer/hooks/useDropTableDialog.ts

@@ -1,6 +1,6 @@
 import { DropMode } from "@/features/database/types";
 import { migrationService } from "@/services/bridge/migration";
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import { toast } from "sonner";
 
 interface DropTableDialogProps {
@@ -13,7 +13,7 @@ interface DropTableDialogProps {
 }
 
 
-export default function useDropTableDialog({ onOpenChange, dbId, schemaName, tableName, onSuccess }: DropTableDialogProps) {
+export default function useDropTableDialog({ open, onOpenChange, dbId, schemaName, tableName, onSuccess }: DropTableDialogProps) {
     const [mode, setMode] = useState<DropMode>("RESTRICT");
     const [confirmText, setConfirmText] = useState("");
     const [isSubmitting, setIsSubmitting] = useState(false);
@@ -23,6 +23,12 @@ export default function useDropTableDialog({ onOpenChange, dbId, schemaName, tab
         setConfirmText("");
     };
 
+    useEffect(() => {
+        if (open) {
+            resetForm();
+        }
+    }, [open]);
+
     const handleClose = () => {
         if (!isSubmitting) {
             resetForm();