populate fields from backend

src/component/product/settingsTab/Settings.jsx

@@ -63,8 +63,23 @@ const Settings = memo(({productData}) => {
     },[])
 
 
+    const [fieldsChanged, setFieldsChanged] = useState(false)
+
     const [activeTab, setActiveTab] = useState(Object.entries(settingsObject)[0][1]?.controls)
 
+    const handleChangeTab = (value) => {
+        // if(fieldsChanged){
+        //     const proceed = confirm('Continue without saving changes')
+        //     if(proceed){
+        //         setActiveTab(value)
+        //         setFieldsChanged(false)
+        //     }
+        // }else{
+        //     setActiveTab(value)
+        // }
+        setActiveTab(value)
+    }
+
 
     const {data, isFetching, isError, error} = useQuery({
         queryKey: queryKeys.settingsData,
@@ -78,7 +93,7 @@ const Settings = memo(({productData}) => {
         }
     })
 
-    const settingsData = data?.data
+    const settingsData = data?.data?.settings
     // console.log('data', settingsData)
 
       return (
@@ -104,12 +119,14 @@ const Settings = memo(({productData}) => {
                         {Object.entries(settingsObject).map(([key, value]) => (
                             <li key={key} className="nav-item">
                             <a className={`nav-link ${activeTab == value.controls && 'active show'}`}
-                                id={key} data-bs-toggle="pill"
+                                id={key} 
+                                // data-bs-toggle="pill"
                                 // data-bs-target={`#${value.controls}`}
-                                type="button" role="tab"
+                                type="button" 
+                                // role="tab"
                                 // aria-controls={value.controls}
                                 // aria-selected="true"
-                                onClick={()=>setActiveTab(value.controls)}
+                                onClick={()=>handleChangeTab(value.controls)}
                             >
                                 {value.title}
                             </a>
@@ -124,7 +141,7 @@ const Settings = memo(({productData}) => {
                                 // id={value.controls} role="tabpanel"
                                 // aria-labelledby={key}
                             >
-                                <GeneralTab name={value.title} data={value.data} isCustom={value.custom} productData={productData} />
+                                <GeneralTab name={value.title} data={value.data} isCustom={value.custom} productData={productData} backendValues={settingsData} setFieldsChanged={setFieldsChanged} />
                             </div>
                         ))}
                     </>