From 1af97096f8b7c71967279694c3f5271061d633ad Mon Sep 17 00:00:00 2001
From: Blaster4385 <venkateshchaturvedi12@gmail.com>
Date: Wed, 17 Aug 2022 17:03:22 +0530
Subject: Fix this shit

---
 .../src/pages/Update/Demographic/Demographic.jsx   | 55 ++++++++++++----------
 1 file changed, 31 insertions(+), 24 deletions(-)

(limited to 'client/src/pages/Update/Demographic/Demographic.jsx')

diff --git a/client/src/pages/Update/Demographic/Demographic.jsx b/client/src/pages/Update/Demographic/Demographic.jsx
index 8853678..6ce06a1 100644
--- a/client/src/pages/Update/Demographic/Demographic.jsx
+++ b/client/src/pages/Update/Demographic/Demographic.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useQuery } from 'react-query'
 import { getUserByAadhaar } from '../../../services/apiservice'
 import Address from '../Address/Address'
@@ -25,29 +25,6 @@ const Demographic = () => {
 
   const isLongEnough = aadhaarNumber?.toString().length > 11
 
-  const { data } = useQuery(
-    ['user', aadhaarNumber],
-    () => getUserByAadhaar(aadhaarNumber),
-    {
-      enabled: isLongEnough,
-      retry: 1,
-      onSuccess: () => {
-        while (!data?.data?.name) {
-          console.log(formData.name)
-          console.log('success')
-          setUserData(data?.data)
-          console.log(data?.data)
-          console.log(userData?.name)
-          console.log(data?.data?.name)
-          setFormData({
-            ...formData,
-            name: userData?.name
-          })
-        }
-      }
-    }
-  )
-
   const [formData, setFormData] = useState({
     name: '',
     gender: '',
@@ -67,6 +44,36 @@ const Demographic = () => {
     // address: userData?.address
   })
 
+  useEffect(() => {
+    setFormData({
+      ...formData,
+      ...userData
+    })
+  }, [userData])
+
+// Make api call using the provided aadhaar number and set the user data in the context if the api call is successful. Set form data to the user data if the api call is successful and prevent too many re-renders.
+  const { isLoading, isError, data } = useQuery(
+    'user',
+    async () => {
+      if (isLongEnough) {
+        const response = await getUserByAadhaar(aadhaarNumber)
+        return response
+      }
+    }
+  )
+
+  if (isLoading) {
+    return <div>{t('loading')}</div>
+  }
+
+  if (isError) {
+    return <div>{t('error')}</div>
+  }
+
+  if (data) {
+    setUserData(data?.data)
+  }
+
   const address = userData?.address
   console.log(address)
 
-- 
cgit 

