src/component/product/settingsTab/URLConfiguration.jsx

@@ -1,7 +1,7 @@
 import { Form, Formik } from "formik";
 import * as Yup from "yup";
 import { useMutation } from '@tanstack/react-query';
-import { completePWDReset } from '../../../services/services';
+import { setExternalURL } from '../../../services/services';
 
 const validationSchema = Yup.object().shape({
       url: Yup.string().required("URL is required").matches(/^https?:\/\/[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-]+\.[a-zA-Z]+/, 'Must be like: https://example.mysite.com'),
@@ -18,10 +18,19 @@ const URLConfiguration = ({productData}) => {
     // API to set url
     const setURL = useMutation({
         mutationFn: (fields) => {
-            return completePWDReset(fields)
+            return setExternalURL(fields)
         },
-        // onSuccess: (res) => {
-        // },
+        onSuccess: (res) => {
+            if(res.data.resultCode != '0'){
+                // throw({message: res?.data?.resultDescription})
+                throw({message: 'Something went wrong!'})
+            }
+        },
+        onSettled: () => {
+            setTimeout(()=>{
+                setURL.reset()
+            }, 3000)
+        }
         // onError: (err) => {
         //     console.log('err', err)
         // }
@@ -29,10 +38,12 @@ const URLConfiguration = ({productData}) => {
 
     const handleSubmit = (values) => {
         let reqData = {
-            url: values.url
+            token: localStorage.getItem('token'), // USER TOKEN
+            uid: localStorage.getItem('uid'), // USER UID
+            subscription_uid: productData?.subscription_uid,
+            external_url: values.url
         }
-        console.log('URL', values.url)
-        // setURL.mutate(reqData)
+        setURL.mutate(reqData)
     }
 
     return <>
@@ -71,8 +82,20 @@ const URLConfiguration = ({productData}) => {
                                 <label htmlFor="exampleInputEmail1">Enter your full URL <span className={`${(props.errors.url && props.touched.url) && 'text-danger'}`}>{props.errors.url}</span></label>
                                 <input value={props.values.url} onChange={props.handleChange} type="text" className="form-control" id="url" aria-describedby="url" placeholder="https://example.mysite.com"/>
                             </div>
-                            <button type="submit" className="btn btn-primary">Submit</button>
+                            <button type="submit" disabled={setURL.isPending} className="btn btn-primary">{setURL.isPending ? 'Loading...' : 'Submit'}</button>
                         </div>
+
+                        {setURL.error &&
+                            <div className="col-12">
+                                <p className='text-danger'>{setURL.error.message}</p>
+                            </div>
+                        }
+
+                        {setURL.isSuccess &&
+                            <div className="col-12">
+                                <p className='text-success'>{'Completed successfully'}</p>
+                            </div>
+                        }
                     </div>
                 </Form>
             );

src/services/services.js

@@ -246,6 +246,14 @@ export const getCommonPractice = (reqData) => {
     return postAuxEnd(`/panel/common/practice`, postData, false)
 }
 
+// FUNCTION TO SET EXTERNAL URL
+export const setExternalURL = (reqData) => {
+    let postData = {
+        ...reqData
+    }
+    return postAuxEnd('/panel/myproduct/external-url', postData, false)
+}
+