ReactJS: already declared in the upper scope

The name you use in the setListRealm callback can be anything you want, so you can just make it previousListRealm or just previous or something:

setListRealm(previousListRealm => [...previousListRealm, { value: res.id, label: res.name}]);

It doesn't have to match the name of the constant you've put the value from useState in.

A few other suggestions:

1. As Nick pointed out, you'd be better off doing your map first, and then adding all the elements to state at the same time. (And separately, please see my post Misusing map — map isn't the right tool if you're not using the array it returns.)

2. Your findList is an async function. In general, it's best to avoid mising async/await with explicit promise methods like then. Just use await without using then.

3. The code calling findList needs to handle the fact it may reject its promise.

4. There's no need to re-create the findList function on every render if you only use it on the first render.

5. There's no point to the template literal in axios.get(`${apiUrl}`), just use axios.get(apiUrl).

So for example:

useEffect(() => {
    const findList = async () => {
        const { data } = await axios.get(apiUrl);
        const additions = data.map(({ id, name }) => ({ value: id, label: name }));
        setListRealm((previous) => [...previous, ...additions]);
    };
    findList()
    .catch((error) => {
        // ...handle.report error...
    });
}, []);

Or don't use an extra function at all:

useEffect(() => {
    axios.get(apiUrl)
    .then(({data}) => {
        const additions = data.map(({ id, name }) => ({ value: id, label: name }));
        setListRealm((previous) => [...previous, ...additions]);
    })
    .catch((error) => {
        // ...handle.report error...
    });
}, []);