From 0a1a985de6e9a53896d2ba17e26d042009b3e1b4 Mon Sep 17 00:00:00 2001
From: rohan09-raj <rajrohan1914@gmail.com>
Date: Thu, 18 Aug 2022 16:12:35 +0530
Subject: Condtional update handling

---
 client/src/components/UpdateInput/UpdateInput.jsx | 54 ++++++++++++++---------
 1 file changed, 34 insertions(+), 20 deletions(-)

(limited to 'client/src/components/UpdateInput')

diff --git a/client/src/components/UpdateInput/UpdateInput.jsx b/client/src/components/UpdateInput/UpdateInput.jsx
index 8fa3ba1..1cbfcbd 100644
--- a/client/src/components/UpdateInput/UpdateInput.jsx
+++ b/client/src/components/UpdateInput/UpdateInput.jsx
@@ -2,7 +2,22 @@ import React from 'react'
 import styles from './UpdateInput.module.css'
 import EditButton from '../EditButton/EditButton'
 
-const UpdateInput = ({ label, id, value, type, name, onChange, placeholder, maxLength, pattern, minLength, onInvalid, onValid, readOnly }) => {
+const UpdateInput = ({
+  label,
+  id,
+  value,
+  defaultValue,
+  type,
+  name,
+  onChange,
+  placeholder,
+  maxLength,
+  pattern,
+  minLength,
+  onInvalid,
+  onValid,
+  readOnly
+}) => {
   const [editable, setEditable] = React.useState(true)
 
   const handleEdit = () => {
@@ -14,25 +29,24 @@ const UpdateInput = ({ label, id, value, type, name, onChange, placeholder, maxL
       <div className={styles.input__container}>
         <label htmlFor={id}>{label}</label>
         <div className={styles.input__edit}>
-        <input
-          className={styles.input__field}
-          type={type}
-          id={id}
-          name={name}
-          value={value}
-          onChange={onChange}
-          required
-          placeholder={placeholder}
-          pattern={pattern}
-          maxLength={maxLength}
-          minLength={minLength}
-          onInvalid={onInvalid}
-          onValid={onValid}
-          readOnly={editable}
-        />
-        <EditButton
-          onClick={handleEdit}
-          enabled={!editable ? '1' : '0' } />
+          <input
+            className={styles.input__field}
+            type={type}
+            id={id}
+            name={name}
+            value={value}
+            defaultValue={defaultValue}
+            onChange={onChange}
+            required
+            placeholder={placeholder}
+            pattern={pattern}
+            maxLength={maxLength}
+            minLength={minLength}
+            onInvalid={onInvalid}
+            onValid={onValid}
+            readOnly={editable}
+          />
+          <EditButton onClick={handleEdit} enabled={!editable ? '1' : '0'} />
         </div>
       </div>
     </div>
-- 
cgit