Using images in Development across web and native

[KaivG]

I am currently building a web + mobile app with solito (and tamagui). I am not a very experienced developer so apologies if this is an ignorant question. I am trying to use the SolitoImage component and struggling to use it in a way that works for web and native. I have gone through the documentation https://solito.dev/usage/image#configuration and it seems that the only way to use the same code for native and web is to use the SolitoImageProvider with a nextjsurl:

<SolitoImageProvider nextJsURL="https://beatgig.com">

However, this seems to require the images to already being available on the internet under that url. I am still in development and can't rely on the images being publicly available. Does it mean I need to define every image in two ways, one that uses the local public folder and path for my nextjs web app and one that imports the image as a static asset?

After trying different things, the best solution seems to be to use Platform.os to define different sources for the image based on platform like:

<SolitoImage src={Platform.OS === 'web' ? '/images/website_logo.png' : require('../../../../../apps/expo/assets/images/website_logo.png')}
, correct? Is that the recommended way?

While trying to solve this in the best way, I also noticed that if I try to use a path with require that links to the public folder under apps/next, I don't get an error, but the images do not load. Only if I define an image path under apps/expo as in the example, the image actually shows. The components itself is defined under packages/app. I assume the reason is that the images under apps/next are not properly accessible in the expo native app? That would be much preferable though, so I don't have to duplicate all images across apps/expo and apps/next. Is there a better way to go about this?

[Edited after some more testing]