docs: Remix Support?

[tallowen]

Area of Improvement

I've heard folks mention that upload thing supports Remix. It looks like it's possible to piece it together based on fetch runtimes etc but it would be nice to have some docs that explain how to do this.

Link to related docs

No response

Additional information

No response

👨‍👧‍👦 Contributing

• 🙋‍♂️ Yes, I'd be down to file a PR implementing the suggested changes!

[markflorkowski]

It looks like it's possible to piece it together based on fetch runtimes etc

yeah, it should be, I know a few people have mentioned getting it working in the discord. Personally, I have not had a chance to go through and set it up myself.

it would be nice to have some docs that explain how to do this.

Agreed, if you are feeling up to it, definitely submit a PR, either with docs or a minimal example (or both 👀)

[DevTGhosh]

Has anyone written about this or is there a repo I can take a look at to see how this upload thing is connected in remix?

[markflorkowski]

Still working on getting SSR working, but here's a basic example.

https://github.com/markflorkowski/uploadthing-remix-sample

Keep in mind neither myself nor Julius are regular users of Remix, so there may be better ways to do this.

[DevTGhosh]

@markflorkowski This works thanks.

I am getting this ts error though for UploadButton

Type '{ endpoint: string; onClientUploadComplete: (r: any) => void; }' is not assignable to type '"You forgot to pass the generic"'

I seem to have passed the generic as you have mentioned here

import { generateReactHelpers, generateUploadButton } from '@uploadthing/react'
import { UploadRouter } from '~/routes/api.uploadthing'

export const { useUploadThing } = generateReactHelpers<UploadRouter>({
	url: new URL('http://localhost:5173/api/uploadthing'),
})
export const UploadButton = generateUploadButton<UploadRouter>({
	url: new URL('http://localhost:5173/api/uploadthing'),
})

[markflorkowski]

Check your imports, I was able to repro that error if I imported UploadButton from the package instead of the generated one

- import  { UploadButton } from "@uploadthing/react";
+ import  { UploadButton } from "~/utils/uploadthing";

[DevTGhosh]

Ah didn't realise that was the issue since the files were still being uploaded .

Thanks a lot!

[DevTGhosh]

You can close this with remix support being added in v7.