Skip to content

"Cannot read properties of undefined" error on usePaginatedQuery in fresh install #4426

Open

Description

@michalgm

What is the problem?

I created a new project with blitz, and followed the instructions to run blitz generate all project. When I navigate to /projects, i get the following error:

    at ProjectsList (ProjectsList.tsx:15:12)

The issue seems to be that usePaginatedQuery returns [undefined, {status, isPending, etc..}] in the initial loading state. I can workaround by changing

const [{ projects, hasMore }] = usePaginatedQuery(getProjects,

to

  const [{ projects, hasMore } = { projects: [], hasMore: false }] = usePaginatedQuery(
    getProjects,

but I thought it odd that the generators are generating invalid code. fwiw, I see the same behavior on new projects using either blitz v3.0.1 or v.2.2.2. I also see the same issue if I use useQuery instead of usePaginatedQuery.

Since I don't see any other reports of what seems like a very fundamental issue with either the useQuery API or the default generators, I feel this must be some local environment issue, or I missed some step or am doing something dumb. But hopefully I can get an answer and anyone else who managed to do whatever I did will find this ;)

Paste all your error logs here:

intercept-console-error.ts:44 TypeError: Cannot read properties of undefined (reading 'projects')
    at ProjectsList (ProjectsList.tsx:15:12)
    at react-stack-bottom-frame (react-dom-client.development.js:22348:1)
    at renderWithHooks (react-dom-client.development.js:5739:1)
    at updateFunctionComponent (react-dom-client.development.js:8000:1)
    at beginWork (react-dom-client.development.js:9614:1)
    at runWithFiberInDEV (react-dom-client.development.js:543:1)
    at performUnitOfWork (react-dom-client.development.js:14996:1)
    at workLoopSync (react-dom-client.development.js:14826:39)
    at renderRootSync (react-dom-client.development.js:14806:1)
    at performWorkOnRoot (react-dom-client.development.js:14341:1)
    at performWorkOnRootViaSchedulerTask (react-dom-client.development.js:15852:1)
    at MessagePort.performWorkUntilDeadline (scheduler.development.js:44:1)

The above error occurred in the <NotFoundErrorBoundary> component.

React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundaryHandler.

Paste all relevant code snippets here:

  const [{ projects, hasMore }] = usePaginatedQuery(getProjects, {
    orderBy: { id: "asc" },
    skip: ITEMS_PER_PAGE * page,
    take: ITEMS_PER_PAGE,
  });```


### What are detailed steps to reproduce this?

1.`blitz new`
2. `blitz generate all project`
3. `npm run dev`
4. Do sign-up flow on localhost:3000
5. Click the link to /projects on the home page
result: "Something went wrong!"

### Run `blitz -v` and paste the output here:

PASTE_HERE (leave the ``` marks)

dameat@nopants:~/work/songs-library$ blitz -v
Blitz version: 3.0.1 (global)
Blitz version: 3.0.1 (local)
Linux 6.11 | linux-x64 | Node: v20.18.1


 Package manager: npm

  System:
    OS: Linux 6.11 Ubuntu 24.10 24.10 (Oracular Oriole)
    CPU: (16) x64 AMD Ryzen 7 5700G with Radeon Graphics
    Memory: 43.77 GB / 61.10 GB
    Shell: 5.2.32 - /bin/bash
  Binaries:
    Node: 20.18.1 - ~/.nvm/versions/node/v20.18.1/bin/node
    Yarn: 4.5.3 - ~/.nvm/versions/node/v20.18.1/bin/yarn
    npm: 11.0.0 - ~/.nvm/versions/node/v20.18.1/bin/npm
  npmPackages:
    @blitzjs/auth: 3.0.1 => 3.0.1 
    @blitzjs/next: 3.0.1 => 3.0.1 
    @blitzjs/rpc: 3.0.1 => 3.0.1 
    @prisma/client: 5.4.2 => 5.4.2 
    blitz: 3.0.1 => 3.0.1 
    next: 15.0.1 => 15.0.1 
    prisma: 5.4.2 => 5.4.2 
    react: 19.0.0 => 19.0.0 
    react-dom: 19.0.0 => 19.0.0 
    typescript: ^4.8.4 => 4.9.5

Please include below any other applicable logs and screenshots that show your problem:

Image

Activity

  1. siddhsuresh commented on Mar 1, 2025

    @siddhsuresh
    Member

    thanks for the issue @michalgm. I might have missed this file during the upgrade to react query v5. Will work on it.

  2. florian-klemt commented on Mar 1, 2025

    @florian-klemt

    Not sure if it is the same issue but when I tried to upgrade to blitz v3, usePaginatedQuery() suddenly returned a promise. Is the fix you are suggesting, @siddhsuresh , to change the return value back from async to sync?

  3. siddhsuresh commented on Mar 2, 2025

    @siddhsuresh
    Member

    @florian-klemt thanks for reporting, I can reproduce

    to change the return value back from async to sync

    yeah seems to be a bug, will be working on it.

  4. self-assigned this
    on Mar 2, 2025
  5. DrJukka commented on Sep 29, 2025

    @DrJukka

    I'm still experiencing this issue with 3.0.2, though the fix would be included in it. or am I missing something ?

  6. nikhaldi commented on Oct 23, 2025

    @nikhaldi

    Upvoting, I'm also experiencing this with 3.0.2 out of the box. The workaround works fine enough, but it's quite a confusing experience for a newcomer to the framework until you find this issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions