diff --git a/tools/server.js b/tools/server.js
index 3272fe5..ce55228 100644
--- a/tools/server.js
+++ b/tools/server.js
@@ -119,8 +119,8 @@ function esc(value) {
const appHeader = (session, active) => {
const toolLink = (href, label, key) =>
`${label}`;
- const sideLink = (href, label, key) =>
- `${label}`;
+ const sideLink = (href, label, key, icon) =>
+ `${icon || ''}${label}`;
const name = session ? (session.firstName || session.phone || '') : '';
const right = session
? `${esc(name.trim().slice(0, 2).toUpperCase())}${esc(name)}
@@ -145,10 +145,10 @@ const appHeader = (session, active) => {
YOUreka Tools
- ${sideLink('/cropper', 'Image Cropper', 'cropper')}
- ${sideLink('/fingerprint', 'Fingerprint Agent', 'fingerprint')}
+ ${sideLink('/cropper', 'Image Cropper', 'cropper', SIDE_NAV_ICONS.crop)}
+ ${sideLink('/fingerprint', 'Fingerprint Agent', 'fingerprint', SIDE_NAV_ICONS.fingerprint)}
- Sign out
+ ${SIDE_NAV_ICONS.logout}Sign out
@@ -187,6 +187,13 @@ const appHeader = (session, active) => {
`;
};
+/** Carbon icons for the mobile side nav (inlined so they inherit the theme). */
+const SIDE_NAV_ICONS = {
+ crop: '',
+ fingerprint: '',
+ logout: '',
+};
+
// ── app factory ──────────────────────────────────────────────────────────────
export function createApp(overrides = {}) {
const cfg = {
diff --git a/tools/test/server.test.js b/tools/test/server.test.js
index 7573efc..41d16e7 100644
--- a/tools/test/server.test.js
+++ b/tools/test/server.test.js
@@ -355,6 +355,10 @@ test('landing header is server-rendered for the session', async () => {
assert.match(anon, /cds-header-nav-item href="\/fingerprint"/);
assert.match(anon, /cds-side-nav-link href="\/cropper"/);
assert.match(anon, /cds-side-nav-divider/);
+ // side nav items carry Carbon icons in the title-icon slot
+ assert.match(anon, /cds-side-nav-link href="\/cropper"[^>]*>