From 7dceb0e88916ef4e75ee2537a4ce22caea2a90de Mon Sep 17 00:00:00 2001 From: Miodec Date: Fri, 14 Oct 2022 16:31:22 +0200 Subject: [PATCH] no longer force signing out user when offline --- .../src/ts/controllers/account-controller.ts | 30 ++++++--- .../src/ts/controllers/route-controller.ts | 5 +- frontend/src/ts/db.ts | 6 ++ frontend/src/ts/elements/alerts.ts | 18 +++-- frontend/src/ts/pages/account.ts | 7 +- frontend/src/ts/popups/ape-keys-popup.ts | 5 ++ frontend/src/ts/popups/edit-preset-popup.ts | 6 ++ frontend/src/ts/popups/edit-profile-popup.ts | 5 ++ frontend/src/ts/popups/edit-tags-popup.ts | 6 ++ frontend/src/ts/popups/result-tags-popup.ts | 5 ++ frontend/src/ts/popups/simple-popups.ts | 65 +++++++++++++++++++ frontend/src/ts/ready.ts | 2 +- frontend/src/ts/test/test-logic.ts | 12 ++++ 13 files changed, 153 insertions(+), 19 deletions(-) diff --git a/frontend/src/ts/controllers/account-controller.ts b/frontend/src/ts/controllers/account-controller.ts index f92e242b0..e23be68a2 100644 --- a/frontend/src/ts/controllers/account-controller.ts +++ b/frontend/src/ts/controllers/account-controller.ts @@ -49,7 +49,6 @@ import { } from "../test/test-config"; import { navigate } from "../observables/navigate-event"; import { update as updateTagsCommands } from "../commandline/lists/tags"; -import * as ConnectionEvent from "../observables/connection-event"; import * as ConnectionState from "../states/connection"; export const gmailProvider = new GoogleAuthProvider(); @@ -358,6 +357,10 @@ export function signIn(): void { Notifications.add("Authentication uninitialized", -1, 3); return; } + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } UpdateConfig.setChangedBeforeDb(false); authListener(); @@ -431,6 +434,10 @@ export async function signInWithGoogle(): Promise { Notifications.add("Authentication uninitialized", -1, 3); return; } + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } UpdateConfig.setChangedBeforeDb(false); LoginPage.showPreloader(); @@ -561,6 +568,10 @@ async function signUp(): Promise { Notifications.add("Authentication uninitialized", -1, 3); return; } + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } RegisterCaptchaPopup.show(); const captcha = await RegisterCaptchaPopup.promise; if (!captcha) { @@ -756,18 +767,17 @@ $(".pageLogin .register .button").on("click", () => { }); $(".pageSettings #addGoogleAuth").on("click", async () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } addGoogleAuth(); }); $(document).on("click", ".pageAccount .sendVerificationEmail", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } sendVerificationEmail(); }); - -ConnectionEvent.subscribe((state) => { - if (state) { - $("#menu .signInOut").removeClass("hidden"); - } else { - $("#menu .signInOut").addClass("hidden"); - signOut(); - } -}); diff --git a/frontend/src/ts/controllers/route-controller.ts b/frontend/src/ts/controllers/route-controller.ts index 121d58cbb..b165e31e8 100644 --- a/frontend/src/ts/controllers/route-controller.ts +++ b/frontend/src/ts/controllers/route-controller.ts @@ -12,7 +12,6 @@ import * as TestUI from "../test/test-ui"; import * as PageTransition from "../states/page-transition"; import * as NavigateEvent from "../observables/navigate-event"; import { Auth } from "../firebase"; -import * as ConnectionState from "../states/connection"; //source: https://www.youtube.com/watch?v=OstALBk-jTc // https://www.youtube.com/watch?v=OstALBk-jTc @@ -85,7 +84,7 @@ const routes: Route[] = [ { path: "/login", load: (): void => { - if (!Auth || !ConnectionState.get()) { + if (!Auth) { nav("/"); return; } @@ -95,7 +94,7 @@ const routes: Route[] = [ { path: "/account", load: (_params, options): void => { - if (!Auth || !ConnectionState.get()) { + if (!Auth) { nav("/"); return; } diff --git a/frontend/src/ts/db.ts b/frontend/src/ts/db.ts index dcf05ab22..0ace9fdd9 100644 --- a/frontend/src/ts/db.ts +++ b/frontend/src/ts/db.ts @@ -4,6 +4,7 @@ import * as LoadingPage from "./pages/loading"; import DefaultConfig from "./constants/default-config"; import { Auth } from "./firebase"; import { defaultSnap } from "./constants/default-snapshot"; +import * as ConnectionState from "./states/connection"; let dbSnapshot: MonkeyTypes.Snapshot; @@ -191,6 +192,11 @@ export async function getUserResults(): Promise { const user = Auth?.currentUser; if (!user) return false; if (dbSnapshot === null) return false; + + if (!ConnectionState.get()) { + return false; + } + if (dbSnapshot.results !== undefined) { return true; } else { diff --git a/frontend/src/ts/elements/alerts.ts b/frontend/src/ts/elements/alerts.ts index cee37585d..d729666f4 100644 --- a/frontend/src/ts/elements/alerts.ts +++ b/frontend/src/ts/elements/alerts.ts @@ -6,6 +6,7 @@ import * as DB from "../db"; import * as NotificationEvent from "../observables/notification-event"; import * as BadgeController from "../controllers/badge-controller"; import * as Notifications from "../elements/notifications"; +import * as ConnectionState from "../states/connection"; let accountAlerts: MonkeyTypes.MonkeyMail[] = []; let maxMail = 0; @@ -143,21 +144,30 @@ export async function show(): Promise { } async function getAccountAlerts(): Promise { - const inboxResponse = await Ape.users.getInbox(); - $("#alertsPopup .accountAlerts .list").empty(); + if (!ConnectionState.get()) { + $("#alertsPopup .accountAlerts .list").html(` +
+ You are offline +
+ `); + return; + } + + const inboxResponse = await Ape.users.getInbox(); + if (inboxResponse.status === 503) { $("#alertsPopup .accountAlerts .list").html(`
- Account inboxes are temporarily unavailable. + Account inboxes are temporarily unavailable
`); return; } else if (inboxResponse.status !== 200) { $("#alertsPopup .accountAlerts .list").html(`
- Error getting inbox: ${inboxResponse.message} Please try again later. + Error getting inbox: ${inboxResponse.message} Please try again later
`); return; diff --git a/frontend/src/ts/pages/account.ts b/frontend/src/ts/pages/account.ts index b0633ffa1..2deca3e44 100644 --- a/frontend/src/ts/pages/account.ts +++ b/frontend/src/ts/pages/account.ts @@ -14,6 +14,7 @@ import Page from "./page"; import * as Misc from "../utils/misc"; import * as Profile from "../elements/profile"; import format from "date-fns/format"; +import * as ConnectionState from "../states/connection"; import type { ScaleChartOptions } from "chart.js"; @@ -30,7 +31,7 @@ let filteredResults: MonkeyTypes.Result[] = []; let visibleTableLines = 0; function loadMoreLines(lineIndex?: number): void { - if (filteredResults == [] || filteredResults.length == 0) return; + if (!filteredResults || filteredResults.length == 0) return; let newVisibleLines; if (lineIndex && lineIndex > visibleTableLines) { newVisibleLines = Math.ceil(lineIndex / 10) * 10; @@ -903,6 +904,10 @@ function fillContent(): void { export async function downloadResults(): Promise { if (DB.getSnapshot().results !== undefined) return; const results = await DB.getUserResults(); + if (results === false && !ConnectionState.get()) { + Notifications.add("Could not get results - you are offline", -1, 5); + return; + } TodayTracker.addAllFromToday(); if (results) { ResultFilters.updateActive(); diff --git a/frontend/src/ts/popups/ape-keys-popup.ts b/frontend/src/ts/popups/ape-keys-popup.ts index 93fb2f8bb..9d90c209b 100644 --- a/frontend/src/ts/popups/ape-keys-popup.ts +++ b/frontend/src/ts/popups/ape-keys-popup.ts @@ -2,6 +2,7 @@ import Ape from "../ape"; import * as Loader from "../elements/loader"; import * as Notifications from "../elements/notifications"; import format from "date-fns/format"; +import * as ConnectionState from "../states/connection"; let apeKeys: MonkeyTypes.ApeKeys = {}; @@ -85,6 +86,10 @@ export function hide(): void { //show the popup export async function show(): Promise { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } if ($("#apeKeysPopupWrapper").hasClass("hidden")) { await getData(); refreshList(); diff --git a/frontend/src/ts/popups/edit-preset-popup.ts b/frontend/src/ts/popups/edit-preset-popup.ts index 71165470d..7dd3b1b35 100644 --- a/frontend/src/ts/popups/edit-preset-popup.ts +++ b/frontend/src/ts/popups/edit-preset-popup.ts @@ -4,8 +4,14 @@ import * as Config from "../config"; import * as Loader from "../elements/loader"; import * as Settings from "../pages/settings"; import * as Notifications from "../elements/notifications"; +import * as ConnectionState from "../states/connection"; export function show(action: string, id?: string, name?: string): void { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } + if (action === "add") { $("#presetWrapper #presetEdit").attr("action", "add"); $("#presetWrapper #presetEdit .title").html("Add new preset"); diff --git a/frontend/src/ts/popups/edit-profile-popup.ts b/frontend/src/ts/popups/edit-profile-popup.ts index f6e948a23..eb07ab0e2 100644 --- a/frontend/src/ts/popups/edit-profile-popup.ts +++ b/frontend/src/ts/popups/edit-profile-popup.ts @@ -3,10 +3,15 @@ import { getHTMLById } from "../controllers/badge-controller"; import * as DB from "../db"; import * as Loader from "../elements/loader"; import * as Notifications from "../elements/notifications"; +import * as ConnectionState from "../states/connection"; let callbackFuncOnHide: (() => void) | null = null; export function show(callbackOnHide: () => void): void { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } if ($("#editProfilePopupWrapper").hasClass("hidden")) { callbackFuncOnHide = callbackOnHide; diff --git a/frontend/src/ts/popups/edit-tags-popup.ts b/frontend/src/ts/popups/edit-tags-popup.ts index e9a83ee81..590bb555e 100644 --- a/frontend/src/ts/popups/edit-tags-popup.ts +++ b/frontend/src/ts/popups/edit-tags-popup.ts @@ -5,8 +5,14 @@ import * as Notifications from "../elements/notifications"; import * as Loader from "../elements/loader"; import * as Settings from "../pages/settings"; import * as ResultTagsPopup from "./result-tags-popup"; +import * as ConnectionState from "../states/connection"; export function show(action: string, id?: string, name?: string): void { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } + if (action === "add") { $("#tagsWrapper #tagsEdit").attr("action", "add"); $("#tagsWrapper #tagsEdit .title").html("Add new tag"); diff --git a/frontend/src/ts/popups/result-tags-popup.ts b/frontend/src/ts/popups/result-tags-popup.ts index 47a6e4144..714e8924f 100644 --- a/frontend/src/ts/popups/result-tags-popup.ts +++ b/frontend/src/ts/popups/result-tags-popup.ts @@ -2,8 +2,13 @@ import Ape from "../ape"; import * as DB from "../db"; import * as Loader from "../elements/loader"; import * as Notifications from "../elements/notifications"; +import * as ConnectionState from "../states/connection"; function show(): void { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } if ($("#resultEditTagsPanelWrapper").hasClass("hidden")) { $("#resultEditTagsPanelWrapper") .stop(true, true) diff --git a/frontend/src/ts/popups/simple-popups.ts b/frontend/src/ts/popups/simple-popups.ts index a7d4567a3..23aa8ce8a 100644 --- a/frontend/src/ts/popups/simple-popups.ts +++ b/frontend/src/ts/popups/simple-popups.ts @@ -12,6 +12,7 @@ import * as SavedTextsPopup from "./saved-texts-popup"; import * as AccountButton from "../elements/account-button"; import { FirebaseError } from "firebase/app"; import { Auth } from "../firebase"; +import * as ConnectionState from "../states/connection"; import { EmailAuthProvider, reauthenticateWithCredential, @@ -1230,51 +1231,99 @@ list["deleteCustomTheme"] = new SimplePopup( $(".pageSettings .section.discordIntegration #unlinkDiscordButton").on( "click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["unlinkDiscord"].show(); } ); $(".pageSettings #removeGoogleAuth").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["removeGoogleAuth"].show(); }); $("#resetSettingsButton").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["resetSettings"].show(); }); $(".pageSettings #resetPersonalBestsButton").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["resetPersonalBests"].show(); }); $(".pageSettings #updateAccountName").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["updateName"].show(); }); $(document).on("click", "#bannerCenter .banner .text .openNameChange", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["updateName"].show(); }); $(".pageSettings #addPasswordAuth").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["addPasswordAuth"].show(); }); $(".pageSettings #emailPasswordAuth").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["updateEmail"].show(); }); $(".pageSettings #passPasswordAuth").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["updatePassword"].show(); }); $(".pageSettings #deleteAccount").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["deleteAccount"].show(); }); $(".pageSettings #resetAccount").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["resetAccount"].show(); }); $("#apeKeysPopup .generateApeKey").on("click", () => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } list["generateApeKey"].show(); }); @@ -1282,6 +1331,10 @@ $(document).on( "click", ".pageSettings .section.themes .customTheme .delButton", (e) => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } const $parentElement = $(e.currentTarget).parent(".customTheme.button"); const customThemeId = $parentElement.attr("customThemeId") as string; list["deleteCustomTheme"].show([customThemeId]); @@ -1292,6 +1345,10 @@ $(document).on( "click", ".pageSettings .section.themes .customTheme .editButton", (e) => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } const $parentElement = $(e.currentTarget).parent(".customTheme.button"); const customThemeId = $parentElement.attr("customThemeId") as string; list["updateCustomTheme"].show([customThemeId]); @@ -1326,11 +1383,19 @@ $(document).on( ); $(document).on("click", "#apeKeysPopup table tbody tr .button.delete", (e) => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } const keyId = $(e.target).closest("tr").attr("keyId") as string; list["deleteApeKey"].show([keyId]); }); $(document).on("click", "#apeKeysPopup table tbody tr .button.edit", (e) => { + if (!ConnectionState.get()) { + Notifications.add("You are offline", 0, 2); + return; + } const keyId = $(e.target).closest("tr").attr("keyId") as string; list["editApeKey"].show([keyId]); }); diff --git a/frontend/src/ts/ready.ts b/frontend/src/ts/ready.ts index b9d612428..9a48c301c 100644 --- a/frontend/src/ts/ready.ts +++ b/frontend/src/ts/ready.ts @@ -72,7 +72,7 @@ if ("serviceWorker" in navigator) { window.addEventListener("load", () => { // disabling service workers on localhost - they dont really work well with local development // and cause issues with hot reloading - if (window.location.hostname === "localhost") { + if (window.location.hostname === "localhos") { navigator.serviceWorker.getRegistrations().then(function (registrations) { for (const registration of registrations) { // if (registration.scope !== "https://monkeytype.com/") diff --git a/frontend/src/ts/test/test-logic.ts b/frontend/src/ts/test/test-logic.ts index 0e45b2388..1f9a6c25f 100644 --- a/frontend/src/ts/test/test-logic.ts +++ b/frontend/src/ts/test/test-logic.ts @@ -56,6 +56,7 @@ import * as AnalyticsController from "../controllers/analytics-controller"; import { Auth } from "../firebase"; import * as AdController from "../controllers/ad-controller"; import * as TestConfig from "./test-config"; +import * as ConnectionState from "../states/connection"; let failReason = ""; const koInputVisual = document.getElementById("koInputVisual") as HTMLElement; @@ -1728,6 +1729,17 @@ async function saveResult( return; } + if (!ConnectionState.get()) { + Notifications.add("Result not saved: offline", -1, 2, "Notice"); + AccountButton.loading(false); + retrySaving.canRetry = true; + $("#retrySavingResultButton").removeClass("hidden"); + if (!isRetrying) { + retrySaving.completedEvent = completedEvent; + } + return; + } + const response = await Ape.results.save(completedEvent); AccountButton.loading(false);