update state after fetching data on button click

Question

I am fetching some data from my server (express) and i am fetching that data when a button is clicked in my react but i want that , that state should also update at the same time and the text of that button should change to what i send from server , but it only changes when i refresh page , because on refresh another route is called from server which also contains the same data , the thing is i am making a facebook clone and working on send friend request function right now but the problem is , my program sends the friend reqeuest on button click but doesnt update in the render till it gets refresh (thats when the other route is called which includes all the data of that profile including name and friendship status) so here is my code , i am only showing the code which is relevant to this problem :-

const{id} = useParams()
  const token = localStorage.getItem('token')
  const [profile_info, setprofile_info] = useState({first_name:'',second_name:'',status:''})
  const Profile_data = async() =>{
    const res = await fetch(`/profile/${id}`,{
        method:'POST',
        headers:{
            'Content-Type' : 'application/json',
            'x-auth-token':token
        },
        body:JSON.stringify({
          id
        }),
    })
    const data = await res.json();
    setprofile_info(data.profile_data)
}

useEffect(()=>{
  Profile_data()
},[])

const sendFriendRequest =  async()=>{
  const res = await fetch(`/addFriend/${id}`,{
    method:'POST',
    headers:{
        'Content-Type' : 'application/json',
        'x-auth-token':token
    },
    body:JSON.stringify({
      id
    }),
})

const data = await res.json()
setprofile_info(data.profile_data)
}
return(
     <div>
         {
             profile_info.status == 'Sent' 
            ? <Button variant="secondary" className={Public_profilecss.button} id={Public_profilecss.button_1} size="lg">
           <img src={friend} alt='friend' /> {profile_info.status}
            </Button>   
           : <Button variant="secondary" className={Public_profilecss.button} id={Public_profilecss.button_1} onClick={sendFriendRequest}>
          <PersonAddIcon/> {profile_info.status}
          </Button>
           }
        </div>)