From 759829a6fbff0a99b6e72ca28a7f797aede6e4d5 Mon Sep 17 00:00:00 2001
From: theiereman <141121240+theiereman@users.noreply.github.com>
Date: Mon, 6 Jan 2025 11:57:16 +0100
Subject: [PATCH] feat(result page): open daily leaderboard when clicking the
 daily leaderboard rank (@theiereman) (#6133)

### Description

Clicking on the rank (after getting a better rank in the daily
leaderboard) will automatically open the leaderboard modal on the
corresponding language screen


![gifgit](https://github.com/user-attachments/assets/92c974c5-acd1-4f2a-a7e7-bb61e30b692b)

Honestly, I mostly added this for me because I like to go to the daily
leaderboard after I did a good run and it was annoying me to have to
open it + change the language to french + change to daily.
---
 frontend/src/html/pages/test.html        |  9 ++++++++-
 frontend/src/styles/test.scss            |  1 -
 frontend/src/ts/elements/leaderboards.ts | 12 ++++++++++++
 3 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/frontend/src/html/pages/test.html b/frontend/src/html/pages/test.html
index c83dbadde..54bdc8217 100644
--- a/frontend/src/html/pages/test.html
+++ b/frontend/src/html/pages/test.html
@@ -269,7 +269,14 @@
 
         <div class="group dailyLeaderboard hidden">
           <div class="top">daily leaderboard</div>
-          <div class="bottom">-</div>
+          <div
+            id="dailyLeaderboardRank"
+            aria-label="Show daily leaderboard"
+            data-balloon-pos="up"
+            class="bottom"
+          >
+            -
+          </div>
         </div>
 
         <div class="group source hidden">
diff --git a/frontend/src/styles/test.scss b/frontend/src/styles/test.scss
index 2d06e5bb2..3544dbeaf 100644
--- a/frontend/src/styles/test.scss
+++ b/frontend/src/styles/test.scss
@@ -831,7 +831,6 @@
 
         &.dailyLeaderboard {
           max-width: 13rem;
-          overflow: hidden;
           white-space: nowrap;
         }
 
diff --git a/frontend/src/ts/elements/leaderboards.ts b/frontend/src/ts/elements/leaderboards.ts
index 4a5c8521f..33c9421c9 100644
--- a/frontend/src/ts/elements/leaderboards.ts
+++ b/frontend/src/ts/elements/leaderboards.ts
@@ -21,6 +21,7 @@ import {
   LeaderboardRank,
 } from "@monkeytype/contracts/schemas/leaderboards";
 import { Mode } from "@monkeytype/contracts/schemas/shared";
+import * as TestStats from "../test/test-stats";
 
 const wrapperId = "leaderboardsWrapper";
 
@@ -973,4 +974,15 @@ $("header nav").on("click", ".textButton", (e) => {
   }
 });
 
+$(".pageTest").on("click", "#dailyLeaderboardRank", () => {
+  currentTimeRange = "daily";
+  updateYesterdayButton();
+  languageSelector?.enable();
+
+  currentLanguage = TestStats.lastResult.language;
+  languageSelector?.setSelected(currentLanguage);
+  void update();
+  show();
+});
+
 Skeleton.save(wrapperId);