smolnar82 opened a new pull request, #1444: URL: https://github.com/apache/knox/pull/1444
[KNOX-3508](https://issues.apache.org/jira/browse/KNOX-3508) - Bundle UI icons locally so they render in air-gapped networks ## What changes were proposed in this pull request? The Angular 21 UI upgrade ([KNOX-3234](https://issues.apache.org/jira/browse/KNOX-3234)) and the newer `mat-icon`-based UIs reintroduced external font `<link>` tags pointing at `fonts.googleapis.com` / `fonts.gstatic.com` for Material Icons (and Roboto in admin-ui), **regressing [KNOX-1731](https://issues.apache.org/jira/browse/KNOX-1731)** ("Gateway Admin UI should not include external js/css"). In air-gapped environments this fails two ways: 1. **Runtime** — the browser can't reach Google Fonts, so icons render as literal ligature text (e.g. the gear and pin show as the words `settings` / `push_pin`). 2. **Build-time** — the production build's Beasties critical-CSS inlining fetches the fonts from Google and inlines them, so the build itself required internet access. The previously-built `admin-ui/index.html` embedded the exact `fonts.gstatic.com/.../materialicons...woff2` URL from the bug report plus 27 Roboto glyph-range URLs. This PR vendors every icon used by the UIs as **local inline SVGs** (Google [Material Symbols Outlined](https://github.com/google/material-design-icons), Apache-2.0), removes all external font links, and drops the Roboto web font in favor of the system font stack. Nothing is fetched from the network at build or runtime. - **gateway-admin-ui**: new standalone `<app-icon>` component + `icon.data.ts` render the SVGs inline; the host keeps the `material-icons` class so all existing `styles.scss` theming (color-by-action, hover, sizing) applies unchanged. The inline-edit hover pencil (formerly the `\e254` icon-font glyph) now uses a vendored `assets/icons/edit.svg` via CSS `mask`. - **knox-homepage-ui, knox-token-generation-ui, knox-token-management-ui**: register inline SVGs with `MatIconRegistry.addSvgIconLiteral` through a per-module `provideIconRegistry()` and switch templates to `<mat-icon svgIcon="…">`. - Removed the Google font `<link>` / `preconnect` tags from all four `index.html` files; added a system-font fallback (`-apple-system, …, Roboto, …, sans-serif`) for the dropped Roboto web font. - Cleaned up two pre-existing dead icon references found during analysis: an `<i class="icon-warning">` with no backing CSS/font, and a Bootstrap-3 `glyphicon-info-sign` that Bootstrap 5 no longer renders. - Deleted orphaned `fontawesome` and `fontopensans` font binaries (zero references). - Added a Material Symbols attribution paragraph to the repo-root `NOTICE` (Apache-2.0, same license as Knox — no LICENSE grant required), plus per-file provenance comments and a short `README.md` beside the icon data. `knox-webshell-ui` is unaffected (no icons/fonts) and left untouched. ## How was this patch tested? - **Offline build:** `mvn package` on `gateway-admin-ui,knox-homepage-ui,knox-token-generation-ui,knox-token-management-ui` — all four modules build successfully (lint + production bundle), with no fetch/timeout, proving Beasties no longer reaches Google. - **No external references in built output:** grepped the built `index.html` and hashed `*.css`/`*.js` under each `target/classes/*/app` for `googleapis`/`gstatic` → **zero matches** (down from 30 references previously). Confirmed the inline SVG path data is bundled in the JS and `edit.svg` is copied into the built assets. - **Lint:** `npm run lint` passes in all four modules. - **Manual, offline:** disabled networking on the machine and loaded the UIs — all icons render as glyphs (not text), with correct admin-ui color/hover theming and working expand/collapse chevron toggles; DevTools shows no requests to `fonts.g*`. ## Integration Tests N/A ## UI changes This patch restores icon glyphs that were rendering as literal text in air-gapped networks. Screenshots (air-gapped) of the UIs with the new icons: <img width="376" height="542" alt="image" src="https://github.com/user-attachments/assets/00fb0284-9abd-42c9-b76b-ba7901bb4fc9"; /> <img width="1727" height="704" alt="image" src="https://github.com/user-attachments/assets/eb686eea-ce5a-4235-b4f4-a66efea1cb67"; /> <img width="1719" height="518" alt="image" src="https://github.com/user-attachments/assets/3d8b2be1-a00b-42c6-ba0d-c2c91d507196"; /> <img width="1718" height="949" alt="image" src="https://github.com/user-attachments/assets/2454532d-dcb4-4630-a0dc-4c78ab314cfb"; /> <img width="1717" height="752" alt="image" src="https://github.com/user-attachments/assets/f913b346-b2b0-473b-8ae5-45d148f77028"; /> <img width="1716" height="856" alt="image" src="https://github.com/user-attachments/assets/8b4a927c-0814-4169-b7ce-01cf1c9ec75a"; /> -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected]
