How to use customized icon/images in UI Kit components to avoid egress?

Forge Forge UI Kit and Custom UI
1

Hi,
I’m using external images from flaticon in my Forge App. But it says as ‘egress’ though I only reference the image url.
Anyone knows how to use customized icon/images in UI Kit components to avoid egress?
Thanks,
YY1

2

Hey @YY1,

If you’re using images hosted externally, then you need to declare the resource in your manifest.yml:

permissions:
  scopes: []
  external:
    images:
      - i.imgur.com

If the image is stored in your app resources, you won’t need to do this - for example:

import smallLogo from '../../resources/logo_small.png';

/* the rest of your index.jsx file here */

      return (
        <>
           <Image src={smallLogo} />
        </>

Please note though, there is currently a bug in forge, and when you’re tunnelling the local image (smallLogo in the example above) will show an egress error. If you go ahead and deploy and close the tunnel, it will display correctly.

If this answers your question, please mark it as the solution!

Let me know if you have further questions.

Cheers!
Mel