Promised data is undefined

Unanswered

Northeast Congo Lion posted this in #help-forum

Northeast Congo LionOP

2023-10-05T20:30:34.000Z

I've tried a lot of things for this, but got no fix.
Here's my code:
[see next message] (had to remove some code bc char limit)
(sb.player returns a promise btw)
if I go http://localhost:3000/seen?username=xyz, the error is

 âœ“ Compiled in 1608ms (487 modules)
 âš  Fast Refresh had to perform a full reload due to a runtime error.
{}
 â¨¯ src\app\seen\page.tsx (76:34) @ last_username_pretty
 â¨¯ TypeError: Cannot read properties of undefined (reading 'last_username_pretty')
    at Page (./src/app/seen/page.tsx:126:45)
  74 |                 <div id="output">
  75 |                     <img src="_%= `https://minotar.net/avatar/${username}/125.png` %_" alt="avatar" />
> 76 |                     <p>{user.data.last_username_pretty}</p>
     |                                  ^
  77 |                     <p>UUID: {user.data.uuid}</p>
  78 |                     <p>First Seen: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.first_joined*1000))}</p>
  79 |                     <p>Last Joined: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.last_joined*1000))}</p>

and I have no idea what to do, does anyone know?

32 Replies

Northeast Congo LionOP

2023-10-05T20:31:56.000Z

'use client';
import { useSearchParams } from 'next/navigation';

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

import sb from 'skyblock.js'

import styles from './page.module.css'
import strftime from '../../../strftime/strftime'


export default function Page() {
    const params = useSearchParams();

    const username = params?.get('username');

    const [path, setPath] = useState('')
    const [loading, setLoading] = useState(false)

    useEffect(() => {
        setPath(window.location.pathname)
    })

    const [user, setUser] = useState({} as any) 

    useEffect(() => {
        setLoading(true)
        sb.player(username).then(_user => {
            setLoading(false)
            setUser(_user)
            console.log(_user)
        })
        
    }, [])


    const debugLog = (user: any) => {
        console.log(user)
        return true;
    }

    if (loading) return (
        <main className={styles.main}>
            <h1>/seen</h1>
            <h3>Loading...</h3>
        </main>
    )
    
    return (
        <main className={styles.main}>
            <h1>/seen</h1>
            
            {!username &&
                <form action={path} method="GET" id="seen-form" >
                    <input 
                        type="text" 
                        name="fill" 
                        placeholder="Username" 
                        required 
                        id="username" 
                        defaultValue=""
                    />
                    <input type="submit" value="Search" id="s_sub"/>
                </form>
            }

        
            <br />
            {debugLog(user) && username &&
                <div id="o">
                    <p>{user.data.last_username_pretty}</p>
                    <p>UUID: {user.data.uuid}</p>
                    <p>First Seen: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.first_joined*1000))}</p>

                </div>
            }
        </main>
    )
}

(please ping me if anyone knows btw)

Northeast Congo LionOP

2023-10-06T16:58:08.000Z

anyone know?

Northeast Congo LionOP

2023-10-06T17:59:22.000Z

do you mean the code or add it to the library?

of the library?

i mean.. it's on npm
can't you just check yourself

also weirdly, it seems to resolve the promise but then it keeps rerendering it (i added a console.log to it in node modules)

1 sec i think i got smth

oh no i did not

'use client';
import { useSearchParams } from 'next/navigation';

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

import sb from 'skyblock.js'

import styles from './page.module.css'
import strftime from '../../../strftime/strftime'
export default function Page() {
    const params = useSearchParams();
    const username = params?.get('username');
    const [path, setPath] = useState('')
    const [loading, setLoading] = useState(false)
    useEffect(() => {
        setPath(window.location.pathname)
    })
    const [user, setUser] = useState({} as any) 
    setLoading(true)
    if (username) {
        sb.player(username).then(_user => {
            console.log(_user)
            setLoading(false)
            setUser(_user)
        }).catch(e => {
            console.log(e)})
    }
    if (loading) return (
<main className={styles.main}>
<h1>Skyblock /seen</h1>
<h3>Loading...</h3>
</main>
    )
    return (
        <main className={styles.main}>
            <h1>Skyblock /seen</h1>
            {!username &&
                <form action={path} method="GET" id="seen-form" >
                    <input 
                        type="text" 
                        name="username" 
                        placeholder="Username" 
required 
id="username" 
defaultValue={username ?? 'Noobcrew'}
                    />
<input type="submit" value="Search" id="searchsubmit"/>
</form>
}
<br />
{&& username && 
<div id="output">
<img src="_%= `https://minotar.net/avatar/${username}/125.png` %_" alt="avatar" />
<p>{user.data.last_username_pretty}</p>
<p>UUID: {user.data.uuid}</p>
<p>First Seen: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.first_joined*1000))}</p>
<p>Last Joined: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.last_joined*1000))}</p>
<p>Last Seen: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.last_seen*1000))}</p>
</div>
}
        </main>
    )
}

don't mind the horrific indenting, character limit ðŸ˜…

and it's just

> dev
> next dev

  â–² Next.js 13.5.4
  - Local:        http://localhost:3000

 âœ“ Ready in 4.5s
 âœ“ Compiled /seen/page in 1133ms (482 modules)
null
 â¨¯ Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.
    at Page (./src/app/seen/page.tsx:32:5)
Terminate batch job (Y/N)?

oh yes that one

this a couple times

i know, i was saying "oh yes that one [the browser one]"

oh and

i know

but the player function gets the uuid

i also don't know why it's rendering even though it shouldn't with no username specified

https://friends.skyblock.net/api/friends/data/1ba2d16f-3d11-4a1f-b214-09e83906e6b5

it outputs this, presumably thanks to the console.log i added in skyblock.js

> dev
> next dev

  â–² Next.js 13.5.4
  - Local:        http://localhost:3000

 âœ“ Ready in 4.7s
 âœ“ Compiled /seen/page in 1236ms (482 modules)
noobcrew
 â¨¯ src\app\seen\page.tsx (73:34) @ last_username_pretty
 â¨¯ TypeError: Cannot read properties of undefined (reading 'last_username_pretty')
    at Page (./src/app/seen/page.tsx:128:45)
  71 |                 <div id="output">
  72 |                     <img src="_%= `https://minotar.net/avatar/${username}/125.png` %_" alt="avatar" />
> 73 |                     <p>{user.data.last_username_pretty}</p>
     |                                  ^
  74 |                     <p>UUID: {user.data.uuid}</p>
  75 |                     <p>First Seen: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.first_joined*1000))}</p>
  76 |                     <p>Last Joined: {strftime('%H:%M on %d/%m/%Y', new Date(user.data.info.last_joined*1000))}</p>
{
  online: false,
  forums_user_id: 1,
  data: {
    uuid: '1ba2d16f-3d11-4a1f-b214-09e83906e6b5',
    last_username: 'noobcrew',
    last_username_pretty: 'Noobcrew',
    info: {
      last_joined: 1696581846,
      first_joined: 1550183176,
      last_seen: 1696583158
    }
  }
}

Northeast Congo LionOP

2023-10-06T18:39:37.000Z

i fixed the rerendering issue

useEffect(() => {
        if (username !== null) {
            setLoading(true)
            sb.player(username).then(_user => {
                console.log(_user)
                setLoading(false)
                setUser(_user)
            }).catch(e => {
                console.log(e)
            })
        }
    }, [])

Northeast Congo LionOP

2023-10-06T18:58:50.000Z

could I do onsubmit too?

Northeast Congo LionOP

2023-10-06T19:04:20.000Z

alr

Northeast Congo LionOP

2023-10-06T19:11:37.000Z

it's doing it clientside again https://file.coffee/u/wiUoW-u406_Mq_UKUCRzm.txt

(the file.coffee link is the code as of rn btw)

the point is it shouldn't be doing it clientside tho?

like i know the code you said forces it to be clientside but still

..serverside?

Northeast Congo LionOP

2023-10-06T19:24:20.000Z

how do I get the url query when getting it? since I don't have access to anything within the Page() export

Northeast Congo LionOP

2023-10-06T19:38:04.000Z

oh ðŸ¤¦ nvm

Northeast Congo LionOP

2023-10-06T20:07:21.000Z

it works!!
css is broken but i can probably fix that, thank you so so much!!