added settings endpoint

src/component/product/settingsTab/GeneralTab.jsx

@@ -1,20 +1,54 @@
 import React, {memo, useState} from 'react'
+import { useMutation } from "@tanstack/react-query";
+import { pageSettings } from "../../../services/services";
 import SiteTemplateSelector from './SiteTemplateSelector';
 
 const GeneralTab = memo(({name='Full Name', data, isCustom, productData}) =>{
-      console.log("Page data == ", data)
+    //   console.log("Page data == ", data)
+
+      const [reqStatus, setReqStatus] = useState({error: null, message: ''})
 
       const fieldData = {}
       Object.entries(data)?.forEach(([key, value]) => { // LOOP TO POPULATE FIELDDATA PROPERTIES WITH DATA OF EACH TAB
-        fieldData[value.name] = ''
+        fieldData[value?.name?.toLowerCase().replace(" ", "_")] = ''
       })
       const [fields, setFields] = useState(fieldData)
       const handleChange = ({target:{name, value}}) => {
         setFields(prev => ({...prev, [name]:value}))
       }
 
+
+    const submitSettings = useMutation({
+        mutationFn: (fields) => {
+            return pageSettings(fields)
+        },
+        onSuccess: (res) => {
+            if(res?.data?.resultCode != '0'){
+                return setReqStatus({error: true, message: 'Unable to complete, try again later'})
+            }
+            setReqStatus({error: false, message: 'Completed successfully'})
+        },
+        onError: (err) => {
+            setReqStatus({error: true, message: 'Unable to complete, try again later'})
+        },
+        onSettled: () => {
+            setTimeout(()=>{
+                setReqStatus({error: null, message: ''})
+            },3000)
+        },
+    })
+
       const handleSubmit = () => {
-        console.log('formInfo', fields)
+        const reqData = {
+            token: localStorage.getItem('token'), // USER TOKEN
+            uid: localStorage.getItem('uid'), // USER UID
+            product_id: productData?.product_id,
+            settings : {
+            ...fields
+            }
+        }
+        // console.log('formInfo', reqData)
+        submitSettings.mutate(reqData)
       }
 
       if (isCustom ===  true){
@@ -33,17 +67,24 @@ const GeneralTab = memo(({name='Full Name', data, isCustom, productData}) =>{
                                 <div key={key} className="form-group col-md-12">
                                     <label htmlFor="name1">{value.name}</label>
                                     {value.controls == 'TEXT' ?
-                                        <input name={value.name} type="text" className="form-control" id={key} value={fields[value.name]} onChange={handleChange} />
+                                        <input name={value.name.toLowerCase().replace(" ", "_")} type="text" className="form-control" id={key} value={fields[value.name.toLowerCase().replace(" ", "_")]} onChange={handleChange} />
                                         :value.controls == 'TEXTAREA' ?
-                                        <textarea name={value.name} rows={5} style={{resize: 'none'}} type="text" className="form-control" id={key} value={fields[value.name]} onChange={handleChange} />
+                                        <textarea name={value.name.toLowerCase().replace(" ", "_")} rows={5} style={{resize: 'none'}} type="text" className="form-control" id={key} value={fields[value.name.toLowerCase().replace(" ", "_")]} onChange={handleChange} />
                                         :
                                         null
                                     }
                                 </div>
                             ))}
                         </>
+                        {reqStatus.message &&
+                            <>
+                            <div className="col-12">
+                                <p className={reqStatus.error ? 'text-danger' : 'text-success'}>{reqStatus.message}</p>
+                            </div>
+                            </>
+                        }
                         <div className="form-group col-md-12" style={{textAlign:'right'}}>
-                            <button onClick={handleSubmit} type="button" className="btn btn-primary">Update</button>
+                            <button onClick={handleSubmit} type="button" className="btn btn-primary" disabled={submitSettings.isPending}>{submitSettings.isPending ? 'Loading...' : 'Update'}</button>
                         </div>
                     </div>
                 </form>