SHiNE-server/shine-UI/js/pages/account-switcher-view.js

77 lines
2.9 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { renderHeader } from '../components/header.js';
import { beginAddAccountFlow, state, switchToAccount } from '../state.js';
import { toUserMessage } from '../services/ui-error-texts.js';
export const pageMeta = { id: 'account-switcher-view', title: 'Сменить профиль' };
export function render({ navigate }) {
const screen = document.createElement('section');
screen.className = 'stack';
screen.append(
renderHeader({
title: 'Сменить профиль',
leftAction: { label: '<', onClick: () => navigate('profile-view') },
}),
);
const list = document.createElement('div');
list.className = 'stack';
const status = document.createElement('div');
status.className = 'meta-muted';
const accounts = Array.isArray(state.accounts) ? state.accounts : [];
const activeLogin = String(state.session.login || '').trim().toLowerCase();
if (!accounts.length) {
const empty = document.createElement('div');
empty.className = 'card meta-muted';
empty.textContent = 'Сохранённых аккаунтов пока нет.';
list.append(empty);
} else {
accounts.forEach((account) => {
const login = String(account?.login || '').trim();
if (!login) return;
const card = document.createElement('button');
card.type = 'button';
card.className = 'card row';
card.style.justifyContent = 'space-between';
card.style.alignItems = 'center';
card.innerHTML = `
<strong>${login}</strong>
<span class="meta-muted">${login.toLowerCase() === activeLogin ? 'Активный' : 'Переключить'}</span>
`;
card.addEventListener('click', async () => {
if (login.toLowerCase() === activeLogin) return;
status.textContent = 'Переключаем аккаунт...';
try {
await switchToAccount(login);
status.textContent = '';
navigate('profile-view');
} catch (error) {
status.textContent = toUserMessage(error, 'Не удалось переключить аккаунт.');
}
});
list.append(card);
});
}
const actions = document.createElement('div');
actions.className = 'form-actions-grid';
actions.innerHTML = `
<button class="secondary-btn" id="account-switcher-add-login" type="button">Добавить аккаунт (Войти)</button>
<button class="secondary-btn" id="account-switcher-add-register" type="button">Добавить аккаунт (Регистрация)</button>
`;
actions.querySelector('#account-switcher-add-login')?.addEventListener('click', () => {
beginAddAccountFlow();
navigate('login-view');
});
actions.querySelector('#account-switcher-add-register')?.addEventListener('click', () => {
beginAddAccountFlow();
navigate('register-view');
});
screen.append(list, actions, status);
return screen;
}