Merge pull request #32 from hcw0915/hotfix/issue_#31_phoneInput_passw…

…ord_refined bugfix(passwordInput, phoneInput):countryCode issue #31 & make PasswordInput editable.
hasanharman · Nov 17, 2024 · 74df84b · 74df84b
2 parents 3d3ecbf + 0f18367
commit 74df84b
Showing 1 changed file with 22 additions and 3 deletions.
diff --git a/screens/render-form-field/index.tsx b/screens/render-form-field/index.tsx
@@ -1,6 +1,6 @@
 'use client'
 
-import { useRef, useState } from 'react'
+import { ChangeEvent, useRef, useState } from 'react'
 
 import { FormFieldType } from '@/types'
 import { cn } from '@/lib/utils'
@@ -122,6 +122,7 @@ export const renderFormField = (field: FormFieldType, form: any) => {
   const [smartDatetime, setSmartDatetime] = useState<Date | null>()
   const [countryName, setCountryName] = useState<string>('')
   const [stateName, setStateName] = useState<string>('')
+  const [password, setPassword] = useState<string>('')
   const canvasRef = useRef<HTMLCanvasElement>(null)
 
   const dropZoneConfig = {
@@ -557,7 +558,17 @@ export const renderFormField = (field: FormFieldType, form: any) => {
         <FormItem>
           <FormLabel>{field.label}</FormLabel>
           <FormControl>
-            <PasswordInput value="password" />
+            <PasswordInput 
+              value={password}
+              placeholder='password'
+              onChange={(e:ChangeEvent<HTMLInputElement>)=>{
+                setPassword(e.target.value)
+                form.setValue(field.name, e.target.value, {
+                  shouldValidate: true,
+                  shouldDirty: true,
+                })
+              }}
+            />
           </FormControl>
           <FormDescription>{field.description}</FormDescription>
           <FormMessage />
@@ -568,7 +579,15 @@ export const renderFormField = (field: FormFieldType, form: any) => {
         <FormItem>
           <FormLabel>{field.label}</FormLabel>
           <FormControl>
-            <PhoneInput defaultCountry="TR" />
+
+            <PhoneInput 
+              defaultCountry="TR" 
+              onChange={(phoneNumber)=>{
+              form.setValue(field.name, phoneNumber, {
+                shouldValidate: true,
+                shouldDirty: true,
+              })
+            }}/>
           </FormControl>
           <FormDescription>{field.description}</FormDescription>
           <FormMessage />