Converting a Uint8Array into a file I can save in Supabase

Question

I'm creating a Figma plugin that will convert a frame into an image that I want to save into Supabase storage. I successfully exported a Uint8array from Figma and sent it to an API I made using Nextjs hosted on Vercel.

The part I'm struggling with is converting the Uint8array into an image I can send to Supabase storage.

Here is the code I have so far:

const imageData = new Uint8Array(Object.values(req.body.data));
const blob = new Blob([imageData], { type: "image/jpg" });

const { data: image, error } = await supabase.storage
    .from("blocks")
    .upload("image.jpg", blob);

if (error) console.log(error);
if (!error) console.log(image);

All I get from Supabase is Error: No browser detected.. I'm supposed to add a file object to .upload() but I can't find a way to convert my Uint8array into a file object I can send to Supabase.

Any idea how to make it work?

Answer 1

This post will probably help you. The relevant code looks the same as your approach:

const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], {type: contentType});