useState html attr not updating

[swift totem]

I'm sharing the shortest part of my code:

  const [oAuthsLoaded, setoAuthsLoaded] = useState<("google" | "discord")[]>(
    [],
  );


  useEffect(() => {
    console.log(oAuthsLoaded, oAuthsLoaded.length);
  }, [oAuthsLoaded]);

        <button
          disabled={oAuthsLoaded.length > 0}
          onClick={handleSignIn}
          className="w-fit rounded-full bg-white p-1"
        >


      <Script
        onLoad={() => setoAuthsLoaded(loaded => ([...loaded, "google"]))}
        src="https://accounts.google.com/gsi/client"
        async
        defer
      ></Script>

I've used .length > 0 on purpose.

However, the disabled is not going away. What can I do to fix?

[short swift]

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)

[swift totem]

Bump

[torn jay]

is oauth getting logged correctly?

[swift totem]

Yes

[torn jay]

wait u arent returning

[swift totem]

I see a item “google”

[swift totem]

I m returning while setting

[torn jay]

wha

  const [oAuthsLoaded, setoAuthsLoaded] = useState<("google" | "discord")[]>(
    [],
  );


  useEffect(() => {
    console.log(oAuthsLoaded, oAuthsLoaded.length);
  }, [oAuthsLoaded]);
 return (
<>
        <button
          disabled={oAuthsLoaded.length > 0}
          onClick={handleSignIn}
          className="w-fit rounded-full bg-white p-1"
        >


      <Script
        onLoad={() => setoAuthsLoaded(loaded => ([...loaded, "google"]))}
        src="https://accounts.google.com/gsi/client"
        async
        defer
      ></Script>
</>
);

try that maybe

[swift totem]

I literally told that I’ve shared a short part of my code

[swift totem]

I literally also stated this disabled isn’t going away

[torn jay]

you didnt say it was different parts of your code?

you just said "its a snippet of your code"

and then put it all in one block so it looks like its one of after the other

[swift totem]

Isn’t that exactly what shortest means

[torn jay]

nope? it just means its a snippet of your code, then ideally you put it in differnt blocks showing the different parts

i cant just say "this is a snippet of my code"

import Router from "next/router"
const router = useRouter();
router.push();

and then say the first line is in my pages dir, the rest is in my app dir

but fine, no clue on my side.. wait for Ray ig

[next pasture]

Can you show me your <Script /> component, please?

@swift totem

[swift totem]

It’s imported from next js

[next pasture]

ok, just was wondering if onLoad was being set properly that's all

if you do a console log in the onload you get that, right

[swift totem]

Yes

[next pasture]

does your useEffect trigger after the onload event?
(it depends on the state changing, so this narrows down if the state is being manipulated)

[swift totem]

yes

Hold on, I realized I made a typo in condition

the condition should be:

disabled={oAuthsLoaded.length <= 0}

sorry for my dumb mistake

[short swift]

✅ Success!

This question has been marked as answered! If you have any other questions, feel free to create another post

Jump to answer

[Click here](#1228582989332615168 message)