How to test functions inside functional component and also using hooks values

[MimoJSRepo]

Hello

I will try to explain the case in the simplest way that I could:

I have a component: Employee.tsx

It has a pseudo code like this:

const Employee = () => {

   const { name, status } = useEmployeeDetails();
    const { updateEmployeeInfo } = useEmployeeData(();
    const { clearStorage} = useCleanData();

    const generalUpdate = async() => {
          await updateEmployeeInfo(name, status);
           clearStorage();
    }

    return(
            <>
               <span>update</update>
               <button onClick={generalUpdate}></button>
           </>
           )

}

I am trying to write a test for 'generalUpdate' function that contains async function (updateEmployeeInfo) that is using hooks data as parameters, also I want to have a way how to access or spy on this function to be able to manipulate it and test different scenarios.

So :
1- How to access a function inside a functional component.
2- how to mock this function, especially if it is using another async function in its implementation?

I hope my explanation is clear 😄

[MimoJSRepo]

No one faced this issue before!! 😮
it seems like a common case !

Basically testing a function that is using data from hooks (or using async function inside it) and it exists inside a functional compoenent