fedimint / ui

https://ui-umber-ten.vercel.app
MIT License
27 stars 41 forks source link

Shared: Common static assets like images #126

Open okjodom opened 1 year ago

okjodom commented 1 year ago

92 introduced a shared SPA experience across guardian and gateway UIs and these live in @fedimint/ui package. However, these UI's duplicate static assets in some scenarios (like the Fedimint logo, copy icons, etc.) because we don't have a good pipeline for bundling such assets.

wbobeirne commented 1 year ago

SVGs nicely side-step this issue, since they can get bundled as React components. Static assets like images and fonts will always need to ultimately be imported by the app that uses them though, not the package itself. This is because it's the app's bundler that will manage linking static assets.

The approach in https://github.com/fedimint/ui/blob/master/packages/ui/src/Header.tsx is fine, but could be more ergonomic by using something like svgr to do the transformation of regular svg files into JSX components at compile time: https://github.com/egoist/tsup/discussions/811. That way assets could be kept as raw svg files rather than giant JSX blobs in the middle of components.

wbobeirne commented 1 year ago

See #178 for an approach on how to share assets across projects (that PR handles fonts, but the same approach would work for any binary asset like images)