generateReactHelpers is not exported from '@uploadthing/react'

[fabianszabo]

I just updated from 2.0.5 to 3.0.1 and now I'm getting this error.

It seems to be there in the uploadthing code, but somehow it's not exported correctly? I don't quite know what's the issue

[MichaelSmithAI]

Seeing a similar issue when importing UploadButton in the way the docs suggested on the latest update.

[t3dotgg]

Anyone have a repro in a codesandbox? Would make this much easier for us to debug

[fabianszabo]

Sorry, I've tried and failed to put it in a codesandbox (ngl, i've never used a codesandbox for anything other than basic css/html stuff but I'll keep trying ...) @MichaelSmithAI Maybe you could reproduce it in a codesandbox? 😅 🤔

Maybe I can help you by providing additional information though?

I've been using pnpm. When I import @uploadthing/react it links to this file: node_modules/.pnpm/@uploadthing+react@3.0.2-canary.9ebcffa_react-dropzone@14.2.3_react@18.2.0_uploadthing@3.0.2-canary.9ebcffa/node_modules/@uploadthing/react/dist/index.d.ts

Which looks like this:

Using npm instead I get different path (obviously) but the same file: node_modules/@uploadthing/react/dist/index.d.ts

Deleting node_modules and the lock file and reinstalling didn't help 😕

pnpm version: 8.5.0 npm version: 8.5.5

These are my dependencies:

"dependencies": {
    "@clerk/nextjs": "^4.17.3",
    "@prisma/client": "^4.11.0",
    "@t3-oss/env-nextjs": "^0.2.1",
    "@tanstack/react-query": "^4.28.0",
    "@trpc/client": "^10.18.0",
    "@trpc/next": "^10.18.0",
    "@trpc/react-query": "^10.18.0",
    "@trpc/server": "^10.18.0",
    "@uploadthing/react": "3.0.2-canary.9ebcffa",
    "@upstash/ratelimit": "^0.4.2",
    "@upstash/redis": "^1.20.6",
    "dayjs": "^1.11.7",
    "next": "^13.2.4",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-dropzone": "^14.2.3",
    "react-hook-form": "^7.43.9",
    "react-hot-toast": "^2.4.1",
    "superjson": "1.12.2",
    "uploadthing": "3.0.2-canary.9ebcffa",
    "zod": "^3.21.4"
  },
  "devDependencies": {
    "@types/eslint": "^8.21.3",
    "@types/node": "^18.15.5",
    "@types/prettier": "^2.7.2",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "@typescript-eslint/eslint-plugin": "^5.56.0",
    "@typescript-eslint/parser": "^5.56.0",
    "autoprefixer": "^10.4.14",
    "eslint": "^8.36.0",
    "eslint-config-next": "^13.2.4",
    "postcss": "^8.4.21",
    "prettier": "^2.8.6",
    "prettier-plugin-tailwindcss": "^0.2.6",
    "prisma": "^4.11.0",
    "tailwindcss": "^3.3.0",
    "typescript": "^5.0.2"
  },
  "ct3aMetadata": {
    "initVersion": "7.12.1"
  }

[fabianszabo]

Wait. I'm just reading the examples on npmjs.com (https://www.npmjs.com/package/@uploadthing/react)

I suppose you completely broke the previous way of using uploadthing with version >3.0.0? 😓 😅

[Arechii]

This is how you can import generateReactHelpers for now, since it's not re-exported through index (yet):

import { generateReactHelpers } from "@uploadthing/react/hooks";

[fabianszabo]

You're a hero. Thank you!

[fabianszabo]

This solves the issue on my end. @MichaelSmithAI hope you don't mind me closing this issue. 🙏🏼