I am using rpldy/drive-uploady
to upload files to google drive. It works fine. However, I want to give a chance to user to edit the images and then upload. How do I do that?
Here is my current code
import DriveUploady from "drive-uploady";
import { UploadButton } from "@rpldy/upload-button";
...
...
<DriveUploady
clientId={CLIENT_ID}
scope="https://www.googleapis.com/auth/drive.file"
params={{ parents: [IMG_FOLDER_ID] }}
accept="image/*"
multiple>
<UploadButton />
</DriveUploady>
...
...
Finally, using useUploady
hook from @rpldy/uploady
worked like a charm.
export default function MyImgEditor() {
const { upload } = useUploady();
// process file and create blob and then
...
...
return(
...
<button
onClick={() => {
if (blob) {
upload(new File([blob], fileName));
}
}}>
Upload
</button>
);
}
Make sure this component is wrapped inside DriveUploady
like
<DriveUploady>
<MyImgEditor />
</DriveUploady>