kjh2064
40cffb3beb
TaxBaik CI/CD / build-and-deploy (push) Successful in 2m26s
Problem: JavaScript login form saved tokens to localStorage but didn't notify CustomAuthenticationStateProvider, causing [Authorize] pages to remain in 'loading' state indefinitely. The provider only reads tokens when: 1. GetAuthenticationStateAsync() is called (page load) 2. NotifyAuthenticationStateChanged() is triggered (UI updates) But JavaScript login didn't trigger either, leaving the authentication state stale. Solution: Convert AdminLoginForm from HTML+JavaScript to pure Blazor component. Now the login flow is: 1. User enters credentials in Blazor form 2. HttpClient POST to /api/auth/login 3. Save tokens to localStorage 4. Call CustomAuthenticationStateProvider.LoginAsync() directly 5. Blazor detects auth state change and re-evaluates [Authorize] pages 6. Dashboard [Authorize] page renders successfully Result: Immediate authentication state update, no loading timeout on protected pages. Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
33 lines
1.4 KiB
JavaScript
33 lines
1.4 KiB
JavaScript
document.addEventListener("DOMContentLoaded", function () {
|
|
// Set the indeterminate state for the checkbox
|
|
document.getElementById("defaultIndeterminate").indeterminate = true;
|
|
// Get buttons
|
|
const checkboxToggleBtn = document.getElementById("js-checkbox-toggle");
|
|
const radioToggleBtn = document.getElementById("js-radio-toggle");
|
|
// Add click event listeners
|
|
if (checkboxToggleBtn) {
|
|
checkboxToggleBtn.addEventListener("click", toggleCheckbox);
|
|
}
|
|
if (radioToggleBtn) {
|
|
radioToggleBtn.addEventListener("click", toggleRadio);
|
|
}
|
|
|
|
// Function to toggle checkbox styles
|
|
function toggleCheckbox() {
|
|
let checkboxes = document.querySelectorAll(".demo-checkbox .form-check-input");
|
|
toggleText(this, "Change to CIRCLE", "Change back to default");
|
|
checkboxes.forEach(checkbox => checkbox.classList.toggle("rounded-circle"));
|
|
}
|
|
|
|
// Function to toggle radio button styles
|
|
function toggleRadio() {
|
|
let radios = document.querySelectorAll(".demo-radio .form-check-input");
|
|
toggleText(this, "Change to ROUNDED", "Change back to default");
|
|
radios.forEach(radio => radio.classList.toggle("rounded"));
|
|
}
|
|
|
|
// Function to toggle button text
|
|
function toggleText(element, text1, text2) {
|
|
element.textContent = element.textContent.trim() === text1 ? text2 : text1;
|
|
}
|
|
}); |