diff --git a/shine-UI/js/pages/messages-list.js b/shine-UI/js/pages/messages-list.js index dad7b45..1cfa204 100644 --- a/shine-UI/js/pages/messages-list.js +++ b/shine-UI/js/pages/messages-list.js @@ -1,6 +1,12 @@ import { renderHeader } from '../components/header.js'; import { directMessages } from '../mock-data.js'; -import { getChatMessages, setContacts, state } from '../state.js'; +import { + getChatMessages, + isSessionInvalidError, + setContacts, + state, + terminateCurrentSession, +} from '../state.js'; import { loadCurrentRelations } from '../services/user-connections.js'; export const pageMeta = { id: 'messages-list', title: 'Личные сообщения' }; @@ -103,6 +109,37 @@ export function render({ navigate }) { status.className = 'status-line is-available'; status.textContent = `Загружено диалогов: ${rows.length}`; } catch (error) { + if (isSessionInvalidError(error)) { + list.innerHTML = ''; + status.className = 'status-line is-unavailable'; + status.textContent = 'Сессия устарела.'; + + const card = document.createElement('div'); + card.className = 'card stack'; + + const title = document.createElement('strong'); + title.textContent = 'Сессия устарела'; + + const details = document.createElement('p'); + details.className = 'meta-muted'; + details.textContent = 'Ваша сессия больше не действует. Авторизуйтесь заново.'; + + const okBtn = document.createElement('button'); + okBtn.type = 'button'; + okBtn.className = 'primary-btn'; + okBtn.textContent = 'ОК'; + okBtn.addEventListener('click', async () => { + await terminateCurrentSession({ + infoMessage: 'Ваша сессия устарела. Выполните вход заново.', + }); + navigate('start-view'); + }); + + card.append(title, details, okBtn); + list.append(card); + return; + } + list.innerHTML = ''; const fail = document.createElement('div'); fail.className = 'card meta-muted'; diff --git a/shine-UI/styles/components.css b/shine-UI/styles/components.css index 2e48629..7914932 100644 --- a/shine-UI/styles/components.css +++ b/shine-UI/styles/components.css @@ -621,11 +621,18 @@ position: relative; } +.toolbar-btn-profile .toolbar-label-wrap { + padding-bottom: 10px; +} + .toolbar-connection-indicator { + position: absolute; + left: 50%; + bottom: 2px; + transform: translateX(-50%); display: inline-flex; align-items: center; gap: 3px; - margin-top: 1px; min-height: 9px; } diff --git a/shine-UI/styles/layout.css b/shine-UI/styles/layout.css index 9b2c4c9..c8d4b04 100644 --- a/shine-UI/styles/layout.css +++ b/shine-UI/styles/layout.css @@ -45,7 +45,7 @@ body { position: absolute; left: 12px; right: 12px; - bottom: calc(74px + env(safe-area-inset-bottom)); + bottom: calc(96px + env(safe-area-inset-bottom)); z-index: 5; border-radius: 11px; border: 1px solid rgba(133, 156, 201, 0.3);