Icon not uploaded from the database

I want to use an icon from a database in a component. I have set up a Supabase table that stores a name of a category and and an url to an associated icon. I have set up props on the component as well as a query to Supabase that pull required data. I do see that names are pulled correctly and in the data query editor I do see that the script pulls the expected URL, but for some reason it does not appear in the UI. I would be grateful for any help in sorting out the issue.

I enclose an image for a reference

Hi, inside of your component, where does it use that icon prop that’s defined on the component? Make sure it is an image element and that the image source is what your prop is connected to.

Also, in case the issue is something deeper, can you share your plasmic project URL as well?

So the icon prop is used on the Image’s URL. Does the icon component support SVGs?

Here’s the link to my project:

Yeah you’ll need to make sure it’s an image element and not an icon element, can you try that out and see if that works

I’ve changed the icon to a png image but it still doesn’t work. Also, fallback images don’t appear as well.

Sorry what I mean is that in the screenshot I see you are using an icon element instead of an image element, can you try using an image element instead?

it works with the image component. Nevertheless, I’d expect the dynamic data to work with icon component since it allows to set up a prop. Also I’d expect SVGs to be a supported file format.

1 Like