How can I refactor this code to conform best practices?

Question

import React, { useEffect, useState } from 'react';

export default TestComponent = (props) => {

const [state1, setState1] = useState(props.prop1);

useEffect(async () => {
let functionRes = null;
callTestFunction().then((output) => {
functionRes = output;
});
await setState1(functionRes);
})

return (
...
)
}

Answer 1

Since you are using an async function, you don't need to use promises (.then)

useEffect(async () => {
const output = await callTestFunction();
await setState1(output);
});

if you have error exception handling promise (.catch), you can use try catch

useEffect(async () => {
try {
const output = await callTestFunction();
await setState1(output);
} catch (err) {
console.error('callTest failed ', err);
}
});

Answer 2

Calviղ Thanks