Embed icons into js module to avoid xhr requests

[giuscris]

This pull request introduces a new script to automate the generation of TypeScript icon exports from SVG files and adds a corresponding npm script for convenience. The main improvement is making it easier to keep icon exports up to date and consistent across the codebase.

Automation of icon exports:

• Added a new script panel/src/scripts/dump-icons.js that scans the SVG icon directory, sanitizes icon names, and generates a TypeScript module exporting each icon as a string. This helps ensure icons are always up to date and reduces manual work.

Build process enhancements:

• Added a new npm script dump:icons to panel/package.json for running the icon export automation script. This makes it easy to regenerate icon exports as part of the build or development workflow.

[Copilot]

Pull request overview

This PR refactors the icon loading system from dynamic XHR requests to embedding icons directly into a JavaScript module. The change eliminates runtime HTTP requests for icons and improves performance.

Key Changes:

• Added a build-time script (dump-icons.js) that converts SVG files to TypeScript exports
• Replaced the callback-based passIcon/insertIcon API with direct string exports
• Updated icon references from kebab-case to camelCase throughout the codebase
• Added string utility functions (toCamelCase, uppercaseFirstLetter) to support icon name transformations

Reviewed changes

Copilot reviewed 18 out of 18 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
panel/src/scripts/dump-icons.js	Build script that reads SVG files and generates TypeScript exports with camelCase naming
panel/src/ts/utils/strings.ts	New utility functions for string case conversion
panel/src/ts/components/icons.ts	Refactored from XHR-based loading to static exports containing embedded SVG strings
panel/src/ts/components/views/updates.ts	Updated to use direct icon imports and innerHTML assignment
panel/src/ts/components/views/pages.ts	Updated icon names from kebab-case to camelCase
panel/src/ts/components/views/dashboard.ts	Updated icon names from kebab-case to camelCase
panel/src/ts/components/views/backups.ts	Updated to use direct icon imports and innerHTML assignment
panel/src/ts/components/statistics-chart.ts	Replaced callback-based icon loading with direct icon reference
panel/src/ts/components/notification.ts	Updated types and icon usage to support new camelCase icon exports
panel/src/ts/components/inputs/upload-input.ts	Updated icon name construction with uppercaseFirstLetter helper
panel/src/ts/components/inputs/tags-input.ts	Updated icon types and conversion using toCamelCase
panel/src/ts/components/inputs/select-input.ts	Updated icon conversion using toCamelCase
panel/src/ts/components/inputs/editor/markdown/menu.ts	Updated button creation to use direct icon references
panel/src/ts/components/inputs/editor/markdown/linktooltip.ts	Updated to use direct icon imports
panel/src/ts/components/inputs/editor/code/menu.ts	Updated button creation to use direct icon references
panel/src/ts/components/inputs/editor-input.ts	Updated to use direct icon import
panel/src/ts/components/inputs/date-input.ts	Updated to use direct icon imports and innerHTML assignment
panel/package.json	Added dump:icons script for icon generation

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.