feat: add script to auto update icons

[Jh123x]

• [x] feat: add svg downloader
• [x] feat: auto update documents in example website

I think this feature will be good for adding future icons to the page.

Possible future use:

• We can make icons into a config file and generate the Docs for it via CI

Please let me know if there is anything else required for this MR.

[netlify[bot]]

✅ Deploy Preview for hugo-congo ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	ed8f750b2127b9594fb883727b706a35f6655c7d
🔍 Latest deploy log	https://app.netlify.com/sites/hugo-congo/deploys/662fa139bf06af0008dd78ce
😎 Deploy Preview	https://deploy-preview-760--hugo-congo.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[jpanther]

I think this is an interesting idea... although I wonder if the HTTP requests could be better avoided if this was included as an NPM package and copied across that way? It could then also be adapted to work with dependabot similarly to how the theme is rebuilt on other dependency updates.

I believe the brands icons are available through NPM at @fortawesome/free-brands-svg-icons. Thoughts?

[wolfspyre]

I'm all for an automagic tool to make dev life better.... eradicating toil for the win.

That being said, I do wonder about the challenges that might arise from baking a python script into the CI pipeline for a codebase that's predominantly golang and node.

I could see this being problematic, for example, if CI containers don't have a fully functional system... rather just the pieces to do the needful; and in this case, there's no existing python, so it'd be introducing the possibility of CI management pain for futureUs™️.

the brands icons' availability as an NPM package helps in one fashion for sure, but that doesn't really address the underlying need to manipulate the SVGs to get the fill/stroke properties set properly so's tailwind's voodoo works properly....

I wonder if it's worth trying to get fontAwesome to release the icons preprocessed such that this is a solved problem....

It seems to me that we're not the only ones... BY FAR... to have this need... Perhaps this is already a solved problem?

[Jh123x]

I think this is an interesting idea... although I wonder if the HTTP requests could be better avoided if this was included as an NPM package and copied across that way? It could then also be adapted to work with dependabot similarly to how the theme is rebuilt on other dependency updates.

I believe the brands icons are available through NPM at @fortawesome/free-brands-svg-icons. Thoughts?

This seems like a good idea, maybe I'll give it a go.

[Jh123x]

I'm all for an automagic tool to make dev life better.... eradicating toil for the win.

That being said, I do wonder about the challenges that might arise from baking a python script into the CI pipeline for a codebase that's predominantly golang and node.

I could see this being problematic, for example, if CI containers don't have a fully functional system... rather just the pieces to do the needful; and in this case, there's no existing python, so it'd be introducing the possibility of CI management pain for futureUs™️.

the brands icons' availability as an NPM package helps in one fashion for sure, but that doesn't really address the underlying need to manipulate the SVGs to get the fill/stroke properties set properly so's tailwind's voodoo works properly....

I wonder if it's worth trying to get fontAwesome to release the icons preprocessed such that this is a solved problem....

It seems to me that we're not the only ones... BY FAR... to have this need... Perhaps this is already a solved problem?

Let me try to do more searching online

[Jh123x]

I can't seem to get the direct import from fontawesome working, but this script should work fine.

To run it just do

npm run add-icon <icon_name>

Please let me know if there is anything I missed out/any other suggestions

I will add the jsdocs for the functions when i am free later

[jpanther]

I really like this script but I still feel like a lot of the logic could be done locally if the SVG was just a direct file copy from node_modules/@fortawesome/free-brands-svg-icons/svgs/brands. Where was the issue you were having with this approach?

[Jh123x]

I really like this script but I still feel like a lot of the logic could be done locally if the SVG was just a direct file copy from node_modules/@fortawesome/free-brands-svg-icons/svgs/brands. Where was the issue you were having with this approach?

I'm not sure how the SVG works with the .ts files and .js files in the node modules.

[wolfspyre]

yeah, afaict that scaffolding allows one to use fontawesome elements more easily in node, when that module is installed does it put a bunch of svg files in the node_modules directory? i think that’s what James is referring to; (but correct me if i’m wrong here :) )

[Jh123x]

yeah, afaict that scaffolding allows one to use fontawesome elements more easily in node, when that module is installed does it put a bunch of svg files in the node_modules directory? i think that’s what James is referring to; (but correct me if i’m wrong here :) )

Nope, I don't see any SVGs in the directory sadly. Not sure if these were the packages that you guys were referring to.

[Jh123x]

yeah, afaict that scaffolding allows one to use fontawesome elements more easily in node, when that module is installed does it put a bunch of svg files in the node_modules directory? i think that’s what James is referring to; (but correct me if i’m wrong here :) )

@wolfspyre @jpanther

Turns out I was using the wrong npm package. Changed the package and it is now able to work offline

[jpanther]

Thanks for the update, I think this is now complete in terms of functionality. Are you happy with the current state of the PR?

[Jh123x]

Thanks for the update, I think this is now complete in terms of functionality. Are you happy with the current state of the PR?

Yeap, currently happy with the state of the MR. Do we need anything else on top of it?

[jpanther]

No, I'm happy with how this is working now. The only potential addition is calling Prettier to reformat the Markdown files once the icon is added to the table but it's something that could be added later. Thanks for all your work on this one. I'll merge this in!