Сделал адекватное отображение ключей / и при регистрации ключи спрашивают какие сохранять

(что то работает что то сложно)
This commit is contained in:
AidarKC
2026-03-30 03:11:09 +03:00
parent 089146a137
commit eb5593c7be
35 changed files with 396 additions and 247 deletions
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { channelPosts, channels } from '../mock-data.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { channelPosts, channels } from '../mock-data.js?v=20260330001044';
export const pageMeta = { id: 'channel-view', title: 'Канал' };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { channels } from '../mock-data.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { channels } from '../mock-data.js?v=20260330001044';
export const pageMeta = { id: 'channels-list', title: 'Каналы' };
+3 -3
View File
@@ -1,6 +1,6 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { directMessages } from '../mock-data.js?v=20260327192619';
import { addChatMessage, getChatMessages } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { directMessages } from '../mock-data.js?v=20260330001044';
import { addChatMessage, getChatMessages } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'chat-view', title: 'Чат' };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'connect-device-view', title: 'Подключить устройство' };
+3 -3
View File
@@ -1,6 +1,6 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { contactDirectory, directMessages } from '../mock-data.js?v=20260327192619';
import { ensureChat } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { contactDirectory, directMessages } from '../mock-data.js?v=20260330001044';
import { ensureChat } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'contact-search-view', title: 'Поиск контактов' };
+1 -1
View File
@@ -1,4 +1,4 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
export const pageMeta = { id: 'device-camera-view', title: 'Подключить через камеру' };
+3 -3
View File
@@ -1,6 +1,6 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { profile } from '../mock-data.js?v=20260327192619';
import { state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { profile } from '../mock-data.js?v=20260330001044';
import { state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'device-qr-view', title: 'Показать QR-код' };
+37 -2
View File
@@ -1,5 +1,12 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { authService, refreshSessions, setAuthError, state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import {
authService,
isSessionInvalidError,
refreshSessions,
setAuthError,
state,
terminateCurrentSession,
} from '../state.js?v=20260330001044';
export const pageMeta = { id: 'device-session-view', title: 'Сеанс устройства' };
@@ -51,11 +58,39 @@ export function render({ navigate, route }) {
actionBtn.textContent = 'Завершить сеанс';
actionBtn.addEventListener('click', async () => {
const isCurrentSession = session.sessionId === state.session.sessionId;
const confirmed = window.confirm(
isCurrentSession ? 'Хотите завершить текущую сессию?' : 'Хотите завершить этот сеанс?',
);
if (!confirmed) return;
try {
await authService.closeSession(session.sessionId);
} catch (error) {
if (!isSessionInvalidError(error)) {
setAuthError(error.message);
window.alert(error.message);
return;
}
}
if (isCurrentSession) {
await terminateCurrentSession({
infoMessage: 'Текущая сессия завершена, данные на устройстве очищены.',
});
return;
}
try {
await refreshSessions();
navigate('device-view');
} catch (error) {
if (isSessionInvalidError(error)) {
await terminateCurrentSession({
infoMessage: 'Сессия на этом устройстве уже завершена. Выполните вход заново.',
});
return;
}
setAuthError(error.message);
window.alert(error.message);
}
+27 -5
View File
@@ -1,11 +1,13 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import {
authService,
isSessionInvalidError,
refreshSessions,
setAuthError,
setAuthInfo,
state,
terminateCurrentSession,
} from '../state.js?v=20260327192619';
} from '../state.js?v=20260330001044';
export const pageMeta = { id: 'device-view', title: 'Устройства' };
@@ -83,9 +85,23 @@ export function render({ navigate }) {
endCurrentSessionBtn.className = 'text-btn';
endCurrentSessionBtn.type = 'button';
endCurrentSessionBtn.textContent = 'Завершить текущую сессию';
endCurrentSessionBtn.addEventListener('click', () => {
terminateCurrentSession();
navigate('start-view');
endCurrentSessionBtn.addEventListener('click', async () => {
const confirmed = window.confirm('Хотите завершить текущую сессию?');
if (!confirmed) return;
try {
await authService.closeSession(state.session.sessionId);
} catch (error) {
if (!isSessionInvalidError(error)) {
setAuthError(error.message);
window.alert(error.message);
return;
}
}
await terminateCurrentSession({
infoMessage: 'Текущая сессия завершена, данные на устройстве очищены.',
});
});
currentMenu.append(endCurrentSessionBtn);
@@ -113,6 +129,12 @@ export function render({ navigate }) {
buildList();
setAuthInfo('Список сессий обновлён.');
} catch (error) {
if (isSessionInvalidError(error)) {
await terminateCurrentSession({
infoMessage: 'Сессия на этом устройстве уже завершена. Выполните вход заново.',
});
return;
}
setAuthError(error.message);
window.alert(error.message);
}
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { checkServerAvailability, saveEntrySettings, state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { checkServerAvailability, saveEntrySettings, state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'entry-settings-view', title: 'Настройки входа', showAppChrome: false };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { authorizeSession, state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { authorizeSession, state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'key-storage-view', title: 'Какие ключи сохранить', showAppChrome: false };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'language-view', title: 'Язык' };
+1 -1
View File
@@ -1,4 +1,4 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
export const pageMeta = { id: 'login-camera-view', title: 'Войти по камере', showAppChrome: false };
+10 -10
View File
@@ -1,14 +1,11 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import {
authService,
authorizeSession,
clearAuthMessages,
refreshSessions,
setAuthBusy,
setAuthError,
setAuthInfo,
state,
} from '../state.js?v=20260327192619';
} from '../state.js?v=20260330001044';
export const pageMeta = { id: 'login-password-view', title: 'Войти по логину', showAppChrome: false };
@@ -75,11 +72,14 @@ export function render({ navigate }) {
try {
await authService.reconnect(state.entrySettings.shineServer);
const result = await authService.createSessionForExistingUser(state.loginDraft.login, state.loginDraft.password);
await authService.persistSessionMaterial(state.loginDraft.login, result.sessionMaterial);
authorizeSession(result);
await refreshSessions();
setAuthInfo('Успешный вход выполнен.');
navigate('profile-view');
state.registrationDraft.flowType = 'login';
state.registrationDraft.login = result.login;
state.registrationDraft.password = state.loginDraft.password;
state.registrationDraft.sessionId = result.sessionId;
state.registrationDraft.storagePwd = result.storagePwd;
state.registrationDraft.pendingKeyBundle = result.keyBundle;
state.registrationDraft.pendingSessionMaterial = result.sessionMaterial;
navigate('registration-keys-view');
} catch (error) {
setAuthError(error.message);
window.alert(error.message);
+1 -1
View File
@@ -1,4 +1,4 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
export const pageMeta = { id: 'login-view', title: 'Войти', showAppChrome: false };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { directMessages } from '../mock-data.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { directMessages } from '../mock-data.js?v=20260330001044';
export const pageMeta = { id: 'messages-list', title: 'Личные сообщения' };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { networkGraph } from '../mock-data.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { networkGraph } from '../mock-data.js?v=20260330001044';
export const pageMeta = { id: 'network-view', title: 'Связи' };
+3 -3
View File
@@ -1,6 +1,6 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { notifications } from '../mock-data.js?v=20260327192619';
import { state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { notifications } from '../mock-data.js?v=20260330001044';
import { state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'notifications-view', title: 'Уведомления' };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { profile } from '../mock-data.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { profile } from '../mock-data.js?v=20260330001044';
export const pageMeta = { id: 'profile-view', title: 'Профиль' };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { authService, state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { authService, clearAuthMessages, state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'register-view', title: 'Зарегистрироваться', showAppChrome: false };
+27 -7
View File
@@ -1,4 +1,4 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import {
authService,
authorizeSession,
@@ -6,7 +6,7 @@ import {
setAuthError,
setAuthInfo,
state,
} from '../state.js?v=20260327192619';
} from '../state.js?v=20260330001044';
export const pageMeta = { id: 'registration-keys-view', title: 'Сохранение ключей', showAppChrome: false };
@@ -14,6 +14,7 @@ export function render({ navigate }) {
const screen = document.createElement('section');
screen.className = 'stack';
const isLoginFlow = state.registrationDraft.flowType === 'login';
const normalizedLogin = (state.registrationDraft.login || '').trim();
const displayLogin = normalizedLogin || '@new.user';
@@ -22,7 +23,9 @@ export function render({ navigate }) {
const title = document.createElement('p');
title.className = 'auth-copy';
title.textContent = `Отлично, логин ${displayLogin} зарегистрирован.`;
title.textContent = isLoginFlow
? `Вход выполнен для логина ${displayLogin}.`
: `Отлично, логин ${displayLogin} зарегистрирован.`;
const question = document.createElement('p');
question.className = 'auth-copy';
@@ -43,17 +46,17 @@ export function render({ navigate }) {
const rootRow = document.createElement('label');
rootRow.className = 'checkbox-row';
rootRow.innerHTML = `<input type="checkbox" ${state.keyStorage.saveRoot ? 'checked' : ''} disabled /> <span>root key</span>`;
rootRow.append(rootToggle, document.createTextNode('root key'));
const blockchainRow = document.createElement('label');
blockchainRow.className = 'checkbox-row';
blockchainRow.innerHTML = `<input type="checkbox" ${state.keyStorage.saveBlockchain ? 'checked' : ''} disabled /> <span>blockchain key</span>`;
blockchainRow.append(blockchainToggle, document.createTextNode('blockchain.key'));
const deviceRow = document.createElement('label');
deviceRow.className = 'checkbox-row';
deviceRow.append(deviceToggle, document.createTextNode('device key (всегда)'));
card.append(title, question, rootRow, deviceRow, blockchainRow);
card.append(title, question, rootRow, blockchainRow, deviceRow);
const actions = document.createElement('div');
actions.className = 'auth-footer-actions';
@@ -91,13 +94,30 @@ export function render({ navigate }) {
state.registrationDraft.pendingSessionMaterial,
);
if (!state.keyStorage.saveRoot && state.registrationDraft.pendingKeyBundle) {
state.registrationDraft.pendingKeyBundle.rootPair = null;
}
if (!state.keyStorage.saveBlockchain && state.registrationDraft.pendingKeyBundle) {
state.registrationDraft.pendingKeyBundle.blockchainPair = null;
}
authorizeSession({
login: state.registrationDraft.login,
sessionId: state.registrationDraft.sessionId,
storagePwd: state.registrationDraft.storagePwd,
});
state.loginDraft.login = state.registrationDraft.login;
state.loginDraft.password = '';
state.registrationDraft.flowType = '';
state.registrationDraft.password = '';
state.registrationDraft.storagePwd = '';
state.registrationDraft.sessionId = '';
state.registrationDraft.pendingKeyBundle = null;
state.registrationDraft.pendingSessionMaterial = null;
await refreshSessions();
setAuthInfo('Ключи сохранены, регистрация завершена.');
setAuthInfo(isLoginFlow ? 'Ключи сохранены, вход завершён.' : 'Ключи сохранены, регистрация завершена.');
navigate('profile-view');
} catch (error) {
setAuthError(error.message);
@@ -1,11 +1,11 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import {
authService,
refreshRegistrationBalance,
setAuthError,
setAuthInfo,
state,
} from '../state.js?v=20260327192619';
} from '../state.js?v=20260330001044';
export const pageMeta = { id: 'registration-payment-view', title: 'Оплата регистрации', showAppChrome: false };
@@ -79,6 +79,7 @@ export function render({ navigate }) {
await authService.reconnect(state.entrySettings.shineServer);
const result = await authService.registerUser(state.registrationDraft.login, state.registrationDraft.password);
state.registrationDraft.flowType = 'registration';
state.registrationDraft.sessionId = result.sessionId;
state.registrationDraft.storagePwd = result.storagePwd;
state.registrationDraft.pendingKeyBundle = result.keyBundle;
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { checkServerAvailability, saveEntrySettings, state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { checkServerAvailability, saveEntrySettings, state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'server-settings-view', title: 'Настройки серверов' };
+1 -1
View File
@@ -1,4 +1,4 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
export const pageMeta = { id: 'settings-view', title: 'Настройки' };
+63 -64
View File
@@ -1,32 +1,25 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { state } from '../state.js?v=20260330001044';
import { loadEncryptedUserSecrets } from '../services/key-vault.js?v=20260330001044';
export const pageMeta = { id: 'show-keys-view', title: 'Показать ключи' };
function randomKey(length = 44) {
const chars = 'ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz123456789';
let result = '';
for (let i = 0; i < length; i += 1) {
result += chars[Math.floor(Math.random() * chars.length)];
}
return result;
}
export function render({ navigate }) {
const screen = document.createElement('section');
screen.className = 'stack';
const keys = {
root: randomKey(),
blockchain: randomKey(),
device: randomKey(),
};
const visible = {
root: false,
blockchain: false,
device: false,
};
const keys = {
root: '',
blockchain: '',
device: '',
};
screen.append(
renderHeader({
title: 'Показать ключи',
@@ -37,6 +30,11 @@ export function render({ navigate }) {
const card = document.createElement('div');
card.className = 'card stack';
const status = document.createElement('p');
status.className = 'meta-muted';
status.textContent = 'Загружаем сохранённые ключи...';
card.append(status);
const renderField = (id, label) => {
const row = document.createElement('div');
row.className = 'key-card stack';
@@ -50,79 +48,80 @@ export function render({ navigate }) {
return row;
};
card.append(renderField('root', 'root key'), renderField('blockchain', 'blockchain key'), renderField('device', 'device key'));
card.append(
renderField('root', 'root key'),
renderField('blockchain', 'blockchain.key'),
renderField('device', 'device key'),
);
const setMissingState = (id) => {
const valueEl = card.querySelector(`[data-value="${id}"]`);
const btnEl = card.querySelector(`[data-toggle="${id}"]`);
valueEl.textContent = 'нет данных';
btnEl.disabled = true;
btnEl.textContent = 'Нет';
};
const updateField = (id) => {
const valueEl = card.querySelector(`[data-value="${id}"]`);
const btnEl = card.querySelector(`[data-toggle="${id}"]`);
if (!keys[id]) {
setMissingState(id);
return;
}
valueEl.textContent = visible[id] ? keys[id] : '*****';
btnEl.disabled = false;
btnEl.textContent = visible[id] ? 'Скрыть' : 'Показать';
};
card.querySelectorAll('[data-toggle]').forEach((button) => {
button.addEventListener('click', () => {
const { toggle } = button.dataset;
if (!keys[toggle]) return;
visible[toggle] = !visible[toggle];
updateField(toggle);
});
});
['root', 'blockchain', 'device'].forEach((id) => updateField(id));
const actions = document.createElement('div');
actions.className = 'auth-footer-actions';
actions.innerHTML = `
<button class="primary-btn" type="button" id="save-keys">Сохранить новые</button>
<button class="ghost-btn" type="button" id="cancel-keys">Отмена</button>
`;
const confirmModal = document.createElement('div');
confirmModal.className = 'modal-shell';
confirmModal.hidden = true;
confirmModal.innerHTML = `
<div class="modal-backdrop" data-close="true"></div>
<div class="modal-dialog card" role="dialog" aria-modal="true" tabindex="-1">
<p>Вы уверены, что хотите изменить ключи?</p>
<div class="auth-footer-actions">
<button class="primary-btn" type="button" id="confirm-keys-ok">ОК</button>
<button class="ghost-btn" type="button" data-close="true">Отмена</button>
</div>
</div>
`;
const closeButton = document.createElement('button');
closeButton.className = 'ghost-btn';
closeButton.type = 'button';
closeButton.textContent = 'Назад';
closeButton.addEventListener('click', () => navigate('device-view'));
actions.append(closeButton);
const openModal = () => {
confirmModal.hidden = false;
confirmModal.querySelector('.modal-dialog').focus();
};
(async () => {
try {
if (!state.session.login || !state.session.storagePwdInMemory) {
throw new Error('Нет активной сессии для чтения ключей');
}
const closeModal = () => {
confirmModal.hidden = true;
};
const savedKeys = await loadEncryptedUserSecrets(
state.session.login,
state.session.storagePwdInMemory,
);
actions.querySelector('#save-keys').addEventListener('click', openModal);
actions.querySelector('#cancel-keys').addEventListener('click', () => navigate('device-view'));
keys.root = savedKeys.rootKey || '';
keys.blockchain = savedKeys.blockchainKey || '';
keys.device = savedKeys.deviceKey || '';
confirmModal.querySelector('#confirm-keys-ok').addEventListener('click', () => {
keys.root = randomKey();
keys.blockchain = randomKey();
keys.device = randomKey();
updateField('root');
updateField('blockchain');
updateField('device');
closeModal();
});
confirmModal.addEventListener('click', (event) => {
const target = event.target;
if (target instanceof HTMLElement && target.dataset.close === 'true') {
closeModal();
if (keys.root || keys.blockchain || keys.device) {
status.textContent = 'Показаны только ключи, сохранённые на этом устройстве.';
} else {
status.textContent = 'На этом устройстве нет сохранённых ключей.';
}
} catch (error) {
status.textContent = 'На этом устройстве нет сохранённых ключей.';
}
});
confirmModal.addEventListener('keydown', (event) => {
if (event.key === 'Escape') {
closeModal();
}
});
['root', 'blockchain', 'device'].forEach((id) => updateField(id));
})();
screen.append(card, actions, confirmModal);
screen.append(card, actions);
return screen;
}
+1 -1
View File
@@ -1,4 +1,4 @@
import { clearStartHint, state } from '../state.js?v=20260327192619';
import { clearStartHint, state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'start-view', title: 'Старт', showAppChrome: false };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { state } from '../state.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { state } from '../state.js?v=20260330001044';
export const pageMeta = { id: 'topup-view', title: 'Пополнение счета', showAppChrome: false };
+2 -2
View File
@@ -1,5 +1,5 @@
import { renderHeader } from '../components/header.js?v=20260327192619';
import { wallet } from '../mock-data.js?v=20260327192619';
import { renderHeader } from '../components/header.js?v=20260330001044';
import { wallet } from '../mock-data.js?v=20260330001044';
export const pageMeta = { id: 'wallet-view', title: 'Кошелёк' };