Merge branch 'master' into master

sanidhyas3s · Sep 28, 2023 · b102cfc · b102cfc
2 parents 7540304 + 47e10de
commit b102cfc
Show file tree

Hide file tree

Showing 44 changed files with 704 additions and 464 deletions.
diff --git a/CONTRIBUTING_ADVANCED.md b/CONTRIBUTING_ADVANCED.md
@@ -14,7 +14,7 @@
 
 ## Prerequisites
 
-This contribution guide is for cases in which you need to test the functionality of your changes, or if you need to take screenshots of your changes. You will need a computer with a stable internet connection, a text editor, Git, and NodeJS with version 16.13.2. There are some additional requirements depending on what you're looking to contribute, such as Firebase for authentication, Mongo and Docker for the backend. Read the below sections to understand how to set up each of these tools.
+This contribution guide is for cases in which you need to test the functionality of your changes, or if you need to take screenshots of your changes. You will need a computer with a stable internet connection, a text editor, Git, and NodeJS with version 18.17.1. There are some additional requirements depending on what you're looking to contribute, such as Firebase for authentication, Mongo and Docker for the backend. Read the below sections to understand how to set up each of these tools.
 
 ### Git
 

diff --git a/backend/src/api/routes/leaderboards.ts b/backend/src/api/routes/leaderboards.ts
@@ -48,7 +48,7 @@ const requireDailyLeaderboardsEnabled = validateConfiguration({
 
 router.get(
   "/",
-  authenticateRequest({ isPublic: true, acceptApeKeys: true }),
+  authenticateRequest({ isPublic: true }),
   withApeRateLimiter(RateLimit.leaderboardsGet),
   validateRequest({
     query: LEADERBOARD_VALIDATION_SCHEMA_WITH_LIMIT,

diff --git a/backend/src/api/routes/users.ts b/backend/src/api/routes/users.ts
@@ -496,7 +496,6 @@ router.get(
   requireProfilesEnabled,
   authenticateRequest({
     isPublic: true,
-    acceptApeKeys: true,
   }),
   withApeRateLimiter(RateLimit.userProfileGet),
   validateRequest({

diff --git a/backend/src/constants/funbox-list.ts b/backend/src/constants/funbox-list.ts
@@ -320,6 +320,13 @@ const FunboxList: MonkeyTypes.FunboxMetadata[] = [
     properties: ["noLigatures"],
     name: "crt",
   },
+  {
+    name: "backwards",
+    properties: ["noLigatures", "conflictsWithSymmetricChars"],
+    frontendFunctions: ["applyCSS"],
+    canGetPb: true,
+    difficultyLevel: 3,
+  },
 ];
 
 export default FunboxList;
diff --git a/backend/src/middlewares/auth.ts b/backend/src/middlewares/auth.ts
@@ -45,18 +45,18 @@ function authenticateRequest(authOptions = DEFAULT_OPTIONS): Handler {
     const { authorization: authHeader } = req.headers;
 
     try {
-      if (authHeader) {
-        token = await authenticateWithAuthHeader(
-          authHeader,
-          req.ctx.configuration,
-          options
-        );
-      } else if (options.isPublic) {
+      if (options.isPublic === true) {
         token = {
           type: "None",
           uid: "",
           email: "",
         };
+      } else if (authHeader) {
+        token = await authenticateWithAuthHeader(
+          authHeader,
+          req.ctx.configuration,
+          options
+        );
       } else if (process.env.MODE === "dev") {
         token = authenticateWithBody(req.body);
       } else {

diff --git a/frontend/src/styles/ads.scss b/frontend/src/styles/ads.scss
@@ -11,7 +11,7 @@
 
 #ad-result-wrapper,
 #ad-result-small-wrapper {
-  margin: 1rem auto 0 auto;
+  margin: 0 auto;
 }
 
 .pageSettings .ad,

diff --git a/frontend/src/styles/buttons.scss b/frontend/src/styles/buttons.scss
@@ -84,7 +84,7 @@ input[type="submit"] {
     outline: none;
   }
   &:focus-visible {
-    box-shadow: 0 0 0 0.1em var(--bg-color), 0 0 0 0.2em var(--text-color);
+    box-shadow: 0 0 0 0.1rem var(--bg-color), 0 0 0 0.2rem var(--text-color);
     outline: none;
   }
   &:active {
@@ -154,7 +154,7 @@ button.text,
     outline: none;
   }
   &:focus-visible {
-    box-shadow: 0 0 0 0.1em var(--text-color);
+    box-shadow: 0 0 0 0.1rem var(--text-color);
     outline: none;
   }
   &:active {

diff --git a/frontend/src/styles/core.scss b/frontend/src/styles/core.scss
@@ -85,7 +85,7 @@ a {
   }
   &:focus-visible {
     outline: none;
-    box-shadow: 0 0 0 0.1em var(--bg-color), 0 0 0 0.2em var(--text-color);
+    box-shadow: 0 0 0 0.1rem var(--bg-color), 0 0 0 0.2rem var(--text-color);
     border-radius: var(--roundness);
   }
 }

diff --git a/frontend/src/styles/inputs.scss b/frontend/src/styles/inputs.scss
@@ -11,7 +11,7 @@ textarea {
   caret-color: var(--main-color);
   line-height: 1.25em;
   &:focus-visible {
-    box-shadow: 0 0 0 0.1em var(--bg-color), 0 0 0 0.2em var(--text-color);
+    box-shadow: 0 0 0 0.1rem var(--bg-color), 0 0 0 0.2rem var(--text-color);
   }
 }
 
@@ -57,7 +57,7 @@ input[type="range"] {
     }
   }
   &:focus-visible {
-    box-shadow: 0 0 0 0.1em var(--bg-color), 0 0 0 0.2em var(--text-color);
+    box-shadow: 0 0 0 0.1rem var(--bg-color), 0 0 0 0.2rem var(--text-color);
   }
 }
 

diff --git a/frontend/src/styles/nav.scss b/frontend/src/styles/nav.scss
@@ -261,6 +261,10 @@ header {
   &.focus {
     color: var(--sub-color) !important;
 
+    .notificationBubble {
+      opacity: 0;
+    }
+
     .result {
       opacity: 0 !important;
     }

diff --git a/frontend/src/styles/popups.scss b/frontend/src/styles/popups.scss
@@ -415,10 +415,13 @@
     background: var(--bg-color);
     border-radius: var(--roundness);
     padding: 2rem;
-    display: grid;
-    gap: 1rem;
     width: 400px;
 
+    form {
+      display: grid;
+      gap: 1rem;
+    }
+
     .title {
       font-size: 1.5rem;
       color: var(--sub-color);

diff --git a/frontend/src/styles/settings.scss b/frontend/src/styles/settings.scss
@@ -9,22 +9,16 @@
 
   .sectionGroupTitle {
     font-size: 2rem;
-    color: var(--sub-color);
-    line-height: 2rem;
-    cursor: pointer;
-    transition: 0.25s;
-    display: flex;
-    align-items: baseline;
-    &:hover {
-      color: var(--text-color);
-    }
+    width: max-content;
+    margin: -0.25em;
+    padding: 0.25em;
 
     .fas {
-      margin-right: 0.5em;
+      transition: transform 0.25s;
+    }
 
-      &.rotate {
-        transform: rotate(-90deg);
-      }
+    &.rotateIcon .fas {
+      transform: rotate(-90deg);
     }
   }
 

diff --git a/frontend/src/styles/test.scss b/frontend/src/styles/test.scss
@@ -947,10 +947,7 @@
   display: none;
   height: max-content;
   margin-bottom: 1rem;
-  transition: 0.125s;
-  &.focus {
-    opacity: 0;
-  }
+  transition: opacity 0.125s;
 }
 
 #testConfig {
@@ -1035,9 +1032,6 @@
   .customText {
     display: grid;
   }
-  &.focus {
-    opacity: 0;
-  }
 }
 
 .pageTest {
@@ -1191,6 +1185,12 @@ main.focus .pageTest {
   #testModesNotice {
     opacity: 0 !important;
   }
+  #testConfig {
+    opacity: 0 !important;
+  }
+  #mobileTestConfig {
+    opacity: 0 !important;
+  }
 }
 
 /* funbox nospace */

diff --git a/frontend/src/ts/config.ts b/frontend/src/ts/config.ts
@@ -361,6 +361,7 @@ export function setStopOnError(
   config.stopOnError = soe;
   if (config.stopOnError !== "off") {
     config.confidenceMode = "off";
+    saveToLocalStorage("confidenceMode", nosave);
   }
   saveToLocalStorage("stopOnError", nosave);
   ConfigEvent.dispatch("stopOnError", config.stopOnError, nosave);
@@ -1284,6 +1285,8 @@ export function setConfidenceMode(
   if (config.confidenceMode !== "off") {
     config.freedomMode = false;
     config.stopOnError = "off";
+    saveToLocalStorage("freedomMode", nosave);
+    saveToLocalStorage("stopOnError", nosave);
   }
   saveToLocalStorage("confidenceMode", nosave);
   ConfigEvent.dispatch("confidenceMode", config.confidenceMode, nosave);

diff --git a/frontend/src/ts/controllers/ad-controller.ts b/frontend/src/ts/controllers/ad-controller.ts
@@ -251,7 +251,7 @@ export async function renderResult(): Promise<void> {
   }
 }
 
-export function updateTestPageAds(visible: boolean): void {
+export function updateFooterAndVerticalAds(visible: boolean): void {
   if (visible) {
     $("#ad-vertical-left-wrapper").removeClass("testPage");
     $("#ad-vertical-right-wrapper").removeClass("testPage");

diff --git a/frontend/src/ts/controllers/input-controller.ts b/frontend/src/ts/controllers/input-controller.ts
@@ -1268,6 +1268,16 @@ $("#wordsInput").on("copy paste", (event) => {
   event.preventDefault();
 });
 
+$("#wordsInput").on("select selectstart", (event) => {
+  event.preventDefault();
+});
+
+$("#wordsInput").on("keydown", (event) => {
+  if (event.key.startsWith("Arrow")) {
+    event.preventDefault();
+  }
+});
+
 // Composing events
 $("#wordsInput").on("compositionstart", () => {
   if (Config.layout !== "default") return;

diff --git a/frontend/src/ts/controllers/page-controller.ts b/frontend/src/ts/controllers/page-controller.ts
@@ -74,6 +74,14 @@ export async function change(
         AdController.reinstate();
       },
       async () => {
+        if (nextPage.name === "test") {
+          Misc.updateTitle();
+        } else {
+          Misc.updateTitle(
+            Misc.capitalizeFirstLetterOfEachWord(nextPage.name) +
+              " | Monkeytype"
+          );
+        }
         Focus.set(false);
         ActivePage.set(nextPage.name);
         previousPage?.afterHide();

diff --git a/frontend/src/ts/controllers/route-controller.ts b/frontend/src/ts/controllers/route-controller.ts
@@ -134,6 +134,13 @@ export function navigate(
     TestUI.resultCalculating ||
     PageTransition.get()
   ) {
+    console.debug(
+      `navigate: ${url} ignored, page is busy (testRestarting: ${
+        TestUI.testRestarting
+      }, resultCalculating: ${
+        TestUI.resultCalculating
+      }, pageTransition: ${PageTransition.get()})`
+    );
     return;
   }
   url = url.replace(/\/$/, "");

diff --git a/frontend/src/ts/elements/keymap.ts b/frontend/src/ts/elements/keymap.ts
@@ -323,7 +323,7 @@ export async function refresh(
   }
 }
 
-ConfigEvent.subscribe((eventKey) => {
+ConfigEvent.subscribe((eventKey, newValue) => {
   if (eventKey === "layout" && Config.keymapLayout === "overrideSync") {
     refresh(Config.keymapLayout);
   }
@@ -335,6 +335,9 @@ ConfigEvent.subscribe((eventKey) => {
   ) {
     refresh();
   }
+  if (eventKey === "keymapMode") {
+    newValue === "off" ? hide() : show();
+  }
 });
 
 KeymapEvent.subscribe((mode, key, correct) => {

diff --git a/frontend/src/ts/pages/settings.ts b/frontend/src/ts/pages/settings.ts
@@ -671,6 +671,21 @@ export function hideAccountSection(): void {
   $(`.sectionGroupTitle[group='account']`).addClass("hidden");
   $(`.settingsGroup.account`).addClass("hidden");
   $(`.pageSettings .section.needsAccount`).addClass("hidden");
+  $(".pageSettings .quickNav .accountTitleLink").addClass("hidden");
+}
+
+function showAccountSection(): void {
+  $(`.sectionGroupTitle[group='account']`).removeClass("hidden");
+  $(`.settingsGroup.account`).removeClass("hidden");
+  $(`.pageSettings .section.needsAccount`).removeClass("hidden");
+  $(".pageSettings .quickNav .accountTitleLink").removeClass("hidden");
+  refreshTagsSettingsSection();
+  refreshPresetsSettingsSection();
+  updateDiscordSection();
+
+  if (DB.getSnapshot()?.lbOptOut === true) {
+    $(".pageSettings .section.optOutOfLeaderboards").remove();
+  }
 }
 
 export function updateDiscordSection(): void {
@@ -827,19 +842,6 @@ function refreshPresetsSettingsSection(): void {
   }
 }
 
-function showAccountSection(): void {
-  $(`.sectionGroupTitle[group='account']`).removeClass("hidden");
-  $(`.settingsGroup.account`).removeClass("hidden");
-  $(`.pageSettings .section.needsAccount`).removeClass("hidden");
-  refreshTagsSettingsSection();
-  refreshPresetsSettingsSection();
-  updateDiscordSection();
-
-  if (DB.getSnapshot()?.lbOptOut === true) {
-    $(".pageSettings .section.optOutOfLeaderboards").remove();
-  }
-}
-
 export async function update(groupUpdate = true): Promise<void> {
   // Object.keys(groups).forEach((group) => {
   if (groupUpdate) {
@@ -910,42 +912,16 @@ export async function update(groupUpdate = true): Promise<void> {
 }
 
 function toggleSettingsGroup(groupName: string): void {
-  $(`.pageSettings .settingsGroup.${groupName}`)
-    .stop(true, true)
-    .slideToggle(250)
-    .toggleClass("slideup");
-  if ($(`.pageSettings .settingsGroup.${groupName}`).hasClass("slideup")) {
-    $(`.pageSettings .sectionGroupTitle[group=${groupName}] .fas`)
-      .stop(true, true)
-      .animate(
-        {
-          deg: -90,
-        },
-        {
-          duration: 250,
-          step: function (now) {
-            $(this).css({
-              transform: "rotate(" + now + "deg)",
-            });
-          },
-        }
-      );
+  const groupEl = $(`.pageSettings .settingsGroup.${groupName}`);
+  groupEl.stop(true, true).slideToggle(250).toggleClass("slideup");
+  if (groupEl.hasClass("slideup")) {
+    $(`.pageSettings .sectionGroupTitle[group=${groupName}]`).addClass(
+      "rotateIcon"
+    );
   } else {
-    $(`.pageSettings .sectionGroupTitle[group=${groupName}] .fas`)
-      .stop(true, true)
-      .animate(
-        {
-          deg: 0,
-        },
-        {
-          duration: 250,
-          step: function (now) {
-            $(this).css({
-              transform: "rotate(" + now + "deg)",
-            });
-          },
-        }
-      );
+    $(`.pageSettings .sectionGroupTitle[group=${groupName}]`).removeClass(
+      "rotateIcon"
+    );
   }
 }