refactor: Remove manual authentication button, improve auto-flow
**Motivations :** - Remove unnecessary 'Authenticate with Browser' button since authentication is automatic - Simplify UI by removing manual interaction requirement - Add better logging for relay connection debugging **Modifications :** - Removed mainPairingButton from home.html template - Simplified setupMainPairing() to not handle button events - Cleaned up handleMainPairing() to remove button state management - Added relay connection success logging in router.ts **Pages affectées :** - src/pages/home/home.html - Removed authentication button - src/pages/home/home.ts - Simplified authentication flow - src/router.ts - Added relay connection logging
This commit is contained in:
parent
73b8d722c2
commit
3260ea9695
@ -15,8 +15,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button id="mainPairingButton" class="primary-btn">Authenticate with Browser</button>
|
|
||||||
|
|
||||||
<div class="account-actions">
|
<div class="account-actions">
|
||||||
<button id="deleteAccountButton" class="danger-btn">🗑️ Delete Account</button>
|
<button id="deleteAccountButton" class="danger-btn">🗑️ Delete Account</button>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -524,34 +524,21 @@ export function setupIframePairingButtons() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Main Pairing Interface
|
// Main Pairing Interface - Auto-triggered, no button needed
|
||||||
export function setupMainPairing(): void {
|
export function setupMainPairing(): void {
|
||||||
const container = getCorrectDOM('login-4nk-component') as HTMLElement;
|
// No button setup needed since authentication is automatic
|
||||||
|
console.log('🔐 Main pairing setup - authentication will be automatic');
|
||||||
const mainPairingButton = container.querySelector('#mainPairingButton') as HTMLButtonElement;
|
|
||||||
const mainStatus = container.querySelector('#main-status') as HTMLElement;
|
|
||||||
|
|
||||||
if (mainPairingButton) {
|
|
||||||
mainPairingButton.addEventListener('click', async () => {
|
|
||||||
await handleMainPairing();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function handleMainPairing(): Promise<void> {
|
async function handleMainPairing(): Promise<void> {
|
||||||
const container = getCorrectDOM('login-4nk-component') as HTMLElement;
|
const container = getCorrectDOM('login-4nk-component') as HTMLElement;
|
||||||
const mainStatus = container.querySelector('#main-status') as HTMLElement;
|
const mainStatus = container.querySelector('#main-status') as HTMLElement;
|
||||||
const mainPairingButton = container.querySelector('#mainPairingButton') as HTMLButtonElement;
|
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// Update UI
|
// Update UI
|
||||||
if (mainStatus) {
|
if (mainStatus) {
|
||||||
mainStatus.innerHTML = '<div class="spinner"></div><span>Authenticating with browser...</span>';
|
mainStatus.innerHTML = '<div class="spinner"></div><span>Authenticating with browser...</span>';
|
||||||
}
|
}
|
||||||
if (mainPairingButton) {
|
|
||||||
mainPairingButton.disabled = true;
|
|
||||||
mainPairingButton.textContent = 'Authenticating...';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Always trigger WebAuthn flow for authentication
|
// Always trigger WebAuthn flow for authentication
|
||||||
console.log('🔐 Triggering WebAuthn authentication...');
|
console.log('🔐 Triggering WebAuthn authentication...');
|
||||||
@ -594,23 +581,12 @@ async function handleMainPairing(): Promise<void> {
|
|||||||
// Now proceed with pairing process
|
// Now proceed with pairing process
|
||||||
await prepareAndSendPairingTx();
|
await prepareAndSendPairingTx();
|
||||||
|
|
||||||
// Re-enable button
|
|
||||||
if (mainPairingButton) {
|
|
||||||
mainPairingButton.disabled = false;
|
|
||||||
mainPairingButton.textContent = 'Authenticate with Browser';
|
|
||||||
}
|
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Pairing failed:', error);
|
console.error('Pairing failed:', error);
|
||||||
|
|
||||||
if (mainStatus) {
|
if (mainStatus) {
|
||||||
mainStatus.innerHTML = '<span style="color: var(--error-color)">❌ Authentication failed</span>';
|
mainStatus.innerHTML = '<span style="color: var(--error-color)">❌ Authentication failed</span>';
|
||||||
}
|
}
|
||||||
|
|
||||||
if (mainPairingButton) {
|
|
||||||
mainPairingButton.disabled = false;
|
|
||||||
mainPairingButton.textContent = 'Authenticate with Browser';
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -55,7 +55,7 @@ async function handleLocation(path: string) {
|
|||||||
'width: 100vw; height: 100vh; position: relative; grid-row: 2;'
|
'width: 100vw; height: 100vh; position: relative; grid-row: 2;'
|
||||||
);
|
);
|
||||||
if (container) container.appendChild(accountComponent);
|
if (container) container.appendChild(accountComponent);
|
||||||
|
|
||||||
// Initialize the home page after component is added to DOM
|
// Initialize the home page after component is added to DOM
|
||||||
console.log('🏠 Initializing home page...');
|
console.log('🏠 Initializing home page...');
|
||||||
try {
|
try {
|
||||||
@ -164,8 +164,10 @@ export async function init(): Promise<void> {
|
|||||||
try {
|
try {
|
||||||
console.log('🌐 Connecting to relays...');
|
console.log('🌐 Connecting to relays...');
|
||||||
await services.connectAllRelays();
|
await services.connectAllRelays();
|
||||||
|
console.log('✅ Relays connected successfully');
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.warn('⚠️ Failed to connect to some relays:', error);
|
console.warn('⚠️ Failed to connect to some relays:', error);
|
||||||
|
console.log('🔄 Continuing despite relay connection issues...');
|
||||||
}
|
}
|
||||||
|
|
||||||
// We register all the event listeners if we run in an iframe
|
// We register all the event listeners if we run in an iframe
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user