Michael Schaufelberger Posts

Michael Schaufelberger

Explore posts from servers

TtRPC TTCTheo's Typesafe Cult XXata DTDrizzle Team

•Created by Michael Schaufelberger on 8/9/2023 in #questions

"Body is unusable" or "fetch failed" when using server to upload Zip files

Hi I'm getting errors like

- error Error: [object Promise]
    at getProperError (/path-to-project/node_modules/next/dist/lib/is-error.js:41:12)
    at DevServer.run (/path-to-project/node_modules/next/dist/server/dev/next-dev-server.js:924:53)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async DevServer.handleRequestImpl (/path-to-project/node_modules/next/dist/server/base-server.js:533:20) {
  digest: undefined
}
- error unhandledRejection: Error [TypeError]: Body is unusable
    at specConsumeBody (/path-to-project/node_modules/next/dist/compiled/undici/index.js:2:4358)
    at Response.json (/path-to-project/node_modules/next/dist/compiled/undici/index.js:2:2573)
    at Function.fromResponse (file:///path-to-project/node_modules/@uploadthing/shared/dist/index.mjs:198:33)
    at uploadFilesInternal (file:///path-to-project/node_modules/uploadthing/dist/server.mjs:53:28)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async Object.uploadFiles (file:///path-to-project/node_modules/uploadthing/dist/server.mjs:126:19)

- error Error: [object Promise]
    at getProperError (/path-to-project/node_modules/next/dist/lib/is-error.js:41:12)
    at DevServer.run (/path-to-project/node_modules/next/dist/server/dev/next-dev-server.js:924:53)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async DevServer.handleRequestImpl (/path-to-project/node_modules/next/dist/server/base-server.js:533:20) {
  digest: undefined
}
- error unhandledRejection: Error [TypeError]: Body is unusable
    at specConsumeBody (/path-to-project/node_modules/next/dist/compiled/undici/index.js:2:4358)
    at Response.json (/path-to-project/node_modules/next/dist/compiled/undici/index.js:2:2573)
    at Function.fromResponse (file:///path-to-project/node_modules/@uploadthing/shared/dist/index.mjs:198:33)
    at uploadFilesInternal (file:///path-to-project/node_modules/uploadthing/dist/server.mjs:53:28)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async Object.uploadFiles (file:///path-to-project/node_modules/uploadthing/dist/server.mjs:126:19)

if I don't set the (readonly) property name on myBlob or

{
  data: null,
  error: { code: undefined, message: 'fetch failed', data: undefined }
}

{
  data: null,
  error: { code: undefined, message: 'fetch failed', data: undefined }
}

when trying to upload files using utapi.uploadFiles(myBlob). The file is a ZIP file and I can perfectly serve it later in the code using

res.setHeader("Content-Type", "application/zip");
res.setHeader("Content-Disposition", "attachment; filename=foo.zip");
return res.status(200).send(Buffer.from(await myBlob.arrayBuffer()));

res.setHeader("Content-Type", "application/zip");
res.setHeader("Content-Disposition", "attachment; filename=foo.zip");
return res.status(200).send(Buffer.from(await myBlob.arrayBuffer()));

What am I doing wrong?

5 replies

TTCTheo's Typesafe Cult

•Created by Michael Schaufelberger on 8/1/2023 in #questions

How do you handle global state with RSCs?

Hi Im having a hard time to understand how you can leverage RSCs for data fetching if the data you want to fetch is dependent on user input. Case Example For example. I have rooms in a building you can book. But some rooms can only be accessed by being a manager. Now, a user can see if a room is booked and who has booked it (booking status field). But for rooms which can only be accessed by a manager this info us hidden. Except if the user is a manager and is in the "manager" mode (global state). Question How do you handle such a case where you want to show the information of a room based on the user's role and mode? Imagine you need this booking status info in the overview list and then in the whole tree when you have chosen a room to book (and proceed to the next steps). Also, switching manager mode should be instant. Pre RSCs, I would fetch the whole list of rooms with all the booking state info the user is allowed to see and store it in a context. Then I would render the big component tree, making use of useContext. If a manager turns on the manager mode, I could just switch to show the previously hidden data, without having to refetch. Is there a way to leverage the power of RSCs for that? Does it even make sense to use RSCs? I enjoy querying my DB directly...

2 replies

TTCTheo's Typesafe Cult

•Created by Michael Schaufelberger on 5/13/2023 in #questions

Alternative to Planetscale for multiple smaller apps

Hi While creating our latest tool, I used the tRPC + Planetscale + Clerk stack and fell in love with the Planetscale branching feature. Now the problem is their pricing. We're developing a few smaller, oftentimes internal apps/tools. We wondered if there's an alternative to Planetscale that doesn't charge as much per database. We'll never reach 100 billion row reads per month with our small apps. But having the database branching feature is still a way better workflow than classic migrations. We don't mind paying for it, of course. It's just, 600 bucks/mo for 3 small internal tools that want their own databases, is a bit steep. Is there an alternative to Planetscale that still has this branching feature?

4 replies

TTCTheo's Typesafe Cult

•Created by Michael Schaufelberger on 2/7/2023 in #questions

Data fetching strategy with Next.js for a dashboard-like app

Hi I hope this is the right place for a discussion like this 🙂 In the past, I was mainly developing mostly static websites with a few interactive elements. Now I'm planning to do a personal project with a more app-like behaviour and was wondering what the best practice is regarding data fetching with Next.js, especially with the T3 Stack. Some challenges that come to mind: - getServerSideProps is probably preferred over getInitialProps, since caching is only so useful if you want to analyze live-data as a user. - Different users may want to display different data on the home page, so I need to have a way to prepare that view for each user seperately. - Some data may come from a 3rd party API that won't be as quick to respond as the main data source. - Loading states and navigation should be smooth. What I thought could work: - Use client side queries for all the data that is user-specific. - Use getServerSideProps to fetch all the non-user specific stuff on a page. E.g. navigation bar state, form views (where you can edit entities) etc. What I ask myself: - Is it worth to make this distinction, or should I just go with client-side fetching all the way? - Also, what about the future of the stack with Next.js' app folder and server components. Will the transition be easier if I fetch everything client side?

4 replies

Gaming

Programming