Why do I get the following error ?

[sullen fiber]

"use client"
function Navbar() {
    const [providers, setProviders] = useState(null)
    const isUserLoggedIn = true

    useEffect(() => {
        const setProviders = async () => {
            const response = await getProviders()
            setProviders(response)
        }
        setProviders()
    }, [])

    return (
      {providers && Object.values(providers).map((provider) => (
              <button 
                  type="button" 
                  key={provider.name}
                  onClick={() => {signIn(provider.id)}}
                  className="black_btn"
              >
                  Sign In
              </button>
       )
      }
    )
}

This is my navbar component that I would like to use state in. However for some reason I get 2 errorrs. One on the setProviders(response) line where it says that the setProviders functions takes 0 arguments but I have provided 1. And more inside the map function because it says provider is of type uknown

[distant goblet]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[bold cradle]

Are you sure the response is not empty? console log and see

[sullen fiber]

But its a syntax error

The linter says that I have passed 1 argument to the method when I should have passed 0

[bold cradle]

Maybe because the response is empty?

[sullen fiber]

empty as in what ? Even if the response is null its an argument and the syntax highlighting would not know that its empty. Besides, the error is that I have passed 1 argument when the function asks for 0, so I dont see how the response being empty is relevant

[hazy glen]

1. rename the setProviders function instede the useEfecct

2. in order to see the error in the maping it would be good to see how are the providers comming from getProviders

[blissful aurora]

you have a name clash indeed reusing setProviders in the closure

[sullen fiber]

I switched it to an unnamed async and that seems to have worked