Shadcn and UploadThing component

"use client";
import { UploadButton } from "@/lib/uploadthing";
import { toast } from "sonner";

export const StatementUploadForm = () => {
return (
<UploadButton
endpoint="uploadStatement"
appearance={{
button:
"bg-primary focus-within:ring-primary ut-uploading:bg-primary ut-readying:bg-primary ut-ready:bg-primary after:bg-primary w-full",
container: "w-full",
}}
onClientUploadComplete={() => {
toast.success("File Uploaded");
}}
onUploadError={(error: Error) => {
toast.error("Error Uploading File", { description: error.message });
}}
/>
);
};
"use client";
import { UploadButton } from "@/lib/uploadthing";
import { toast } from "sonner";

export const StatementUploadForm = () => {
return (
<UploadButton
endpoint="uploadStatement"
appearance={{
button:
"bg-primary focus-within:ring-primary ut-uploading:bg-primary ut-readying:bg-primary ut-ready:bg-primary after:bg-primary w-full",
container: "w-full",
}}
onClientUploadComplete={() => {
toast.success("File Uploaded");
}}
onUploadError={(error: Error) => {
toast.error("Error Uploading File", { description: error.message });
}}
/>
);
};
idk if this would help anybody but heres a quick copy and paste of my upload button for use with shadcn. I found tracking down all of the classnames for the button to be cumbersome so I imagine this could help someone. Or maybe there is a better way and im just dumb lol
0 Replies
No replies yetBe the first to reply to this messageJoin
Want results from more Discord servers?
Add your server