Дизайн Артёма

shine-UI/js/components/toolbar.js

@@ -1,23 +1,18 @@
 import { resolveToolbarActive } from '../router.js';
 import { state, authService } from '../state.js';
 import { openAuthRequiredModal } from '../services/auth-required-modal.js';
-import { SHINE_CONNECTIONS_LOGO_SRC } from './shine-logo.js';
-
-// iconImg — путь к неоновой PNG (если есть, рисуем картинку вместо эмодзи); glow — цвет доп.свечения
-// активной/нажатой вкладки (var --tab-glow); hero — «герой»-вкладка (крупнее/ярче, всегда светится).
-// Пока подключена только «Связи»; остальные 4 — эмодзи до подготовки ассетов (имена подставлю).
+import { iconHtml as lineIcon } from './ui-icon.js';
 const ITEMS = [
-  { pageId: 'messages-list', label: 'Личные', icon: '💬', iconImg: '/assets/icon_lichnye.png', glow: 'rgba(0, 229, 255, .6)' },
-  { pageId: 'channels-list', label: 'Каналы', icon: '📢', iconImg: '/assets/icon_kanaly.png', glow: 'rgba(0, 229, 255, .6)' },
-  { pageId: 'network-view', label: 'Связи', icon: '🕸', iconImg: SHINE_CONNECTIONS_LOGO_SRC, glow: 'rgba(0, 229, 255, .6)', hero: true },
-  { pageId: 'notifications-view', label: 'Уведомления', icon: '🔔', iconImg: '/assets/icon_uvedomleniya.png', glow: 'rgba(0, 229, 255, .6)' },
-  { pageId: 'profile-view', label: 'Профиль', icon: '👤', iconImg: '/assets/icon_profil.png', glow: 'rgba(0, 229, 255, .6)' },
+  { pageId: 'messages-list', label: 'Личные' },
+  { pageId: 'channels-list', label: 'Каналы' },
+  { pageId: 'network-view', label: 'Связи' },
+  { pageId: 'notifications-view', label: 'Уведомления' },
+  { pageId: 'profile-view', label: 'Профиль' },
 ];
 
 function iconHtml(item) {
-  return item.iconImg
-    ? `<img class="toolbar-icon-img" src="${item.iconImg}" alt="" aria-hidden="true" style="--tab-glow:${item.glow}" />`
-    : `<span>${item.icon}</span>`;
+  const names = { 'messages-list': 'message', 'channels-list': 'channels', 'network-view': 'network', 'notifications-view': 'bell', 'profile-view': 'profile' };
+  return lineIcon(names[item.pageId]);
 }
 
 function normalizeCounters(payload = {}) {
@@ -126,6 +121,8 @@ export function renderToolbar(currentPageId, navigate) {
     const isMessages = item.pageId === 'messages-list';
     const isNetwork = item.pageId === 'network-view';
     const isNotifications = item.pageId === 'notifications-view';
+    btn.type = 'button';
+    if (item.pageId === active) btn.setAttribute('aria-current', 'page');
     btn.dataset.toolbarPage = item.pageId;
     btn.className = `toolbar-btn${item.pageId === active ? ' active' : ''}${isProfile ? ' toolbar-btn-profile' : ''}${isMessages ? ' toolbar-btn-messages' : ''}${isNetwork ? ' toolbar-btn-network' : ''}${item.hero ? ' toolbar-btn-hero' : ''}`;
     if (isProfile) {