refactor: rework auth state change function

also renames a function
also extracts sign in out button code to its own file
This commit is contained in:
Miodec 2024-06-13 14:15:44 +02:00
parent 50b658b722
commit 120b660efc
2 changed files with 51 additions and 47 deletions

View file

@ -19,6 +19,7 @@ import * as RegisterCaptchaModal from "../modals/register-captcha";
import * as URLHandler from "../utils/url-handler";
import * as Account from "../pages/account";
import * as Alerts from "../elements/alerts";
import * as SignInOutButton from "../elements/sign-in-out-button";
import {
GoogleAuthProvider,
GithubAuthProvider,
@ -225,67 +226,53 @@ export async function loadUser(user: UserType): Promise<void> {
}
}
let authListener: Unsubscribe;
// eslint-disable-next-line no-constant-condition
if (Auth && ConnectionState.get()) {
authListener = Auth?.onAuthStateChanged(async function (user) {
// await UpdateConfig.loadPromise;
const search = window.location.search;
const hash = window.location.hash;
console.log(`auth state changed, user ${user ? true : false}`);
async function readyFunction(
authInitialisedAndConnected: boolean,
user: UserType | null
): Promise<void> {
const search = window.location.search;
const hash = window.location.hash;
console.debug(`account controller ready`);
if (authInitialisedAndConnected) {
console.debug(`auth state changed, user ${user ? true : false}`);
console.debug(user);
if (user) {
$("header .signInOut .icon").html(
`<i class="fas fa-fw fa-sign-out-alt"></i>`
);
await loadUser(user);
} else {
$("header .signInOut .icon").html(`<i class="far fa-fw fa-user"></i>`);
if (window.location.pathname === "/account") {
window.history.replaceState("", "", "/login");
}
PageTransition.set(false);
}
if (!user) {
navigate();
}
URLHandler.loadCustomThemeFromUrl(search);
URLHandler.loadTestSettingsFromUrl(search);
URLHandler.loadChallengeFromUrl(search);
void URLHandler.linkDiscord(hash);
Settings.updateAuthSections();
});
} else {
$("nav .signInOut").addClass("hidden");
$("document").ready(async () => {
// await UpdateConfig.loadPromise;
const search = window.location.search;
const hash = window.location.hash;
$("header .signInOut .icon").html(`<i class="far fa-fw fa-user"></i>`);
} else {
console.debug(`auth not initialised or not connected`);
if (window.location.pathname === "/account") {
window.history.replaceState("", "", "/login");
}
PageTransition.set(false);
navigate();
}
URLHandler.loadCustomThemeFromUrl(search);
URLHandler.loadTestSettingsFromUrl(search);
void URLHandler.linkDiscord(hash);
SignInOutButton.update();
if (/challenge_.+/g.test(window.location.pathname)) {
Notifications.add(
"Challenge links temporarily disabled. Please use the command line to load the challenge manually",
0,
{
duration: 7,
}
);
return;
}
URLHandler.loadCustomThemeFromUrl(search);
URLHandler.loadTestSettingsFromUrl(search);
URLHandler.loadChallengeFromUrl(search);
void URLHandler.linkDiscord(hash);
Settings.updateAuthSections();
}
let disableAuthListener: Unsubscribe;
if (Auth && ConnectionState.get()) {
disableAuthListener = Auth?.onAuthStateChanged(function (user) {
void readyFunction(true, user);
});
} else {
$((): void => {
void readyFunction(false, null);
});
}
@ -301,7 +288,7 @@ async function signIn(): Promise<void> {
return;
}
authListener();
disableAuthListener();
LoginPage.showPreloader();
LoginPage.disableInputs();
LoginPage.disableSignUpButton();
@ -365,7 +352,7 @@ async function signInWithProvider(provider: AuthProvider): Promise<void> {
LoginPage.showPreloader();
LoginPage.disableInputs();
LoginPage.disableSignUpButton();
authListener();
disableAuthListener();
const persistence = ($(".pageLogin .login #rememberMe input").prop(
"checked"
) as boolean)
@ -574,7 +561,7 @@ async function signUp(): Promise<void> {
return;
}
authListener();
disableAuthListener();
try {
const createdAuthUser = await createUserWithEmailAndPassword(

View file

@ -0,0 +1,17 @@
import { Auth, isAuthenticated } from "../firebase";
const el = $("header .signInOut");
export function update(): void {
if (!Auth) {
el.addClass("hidden");
} else {
el.removeClass("hidden");
}
if (isAuthenticated()) {
el.find(".icon").html(`<i class="fas fa-fw fa-sign-out-alt"></i>`);
} else {
el.find(".icon").html(`<i class="far fa-fw fa-user"></i>`);
}
}