From eed6f67fca2b9105be347f646d1b6ebb6e44477a Mon Sep 17 00:00:00 2001
From: Adarsh Tiwari <xoldyckk@gmail.com>
Date: Sun, 2 Apr 2023 00:13:58 +0530
Subject: [PATCH] ts: Migrate scroll_bar.js to typescript.

Remove the winjs specific `getScrollbarWidth` property while we're at it;
WinJS isn't relevant anymore.

Reorders methods due to TypeScript files enforcing define-before-use when
this commit was drafted.
---
 tools/test-js-with-node                  |  2 +-
 web/src/{scroll_bar.js => scroll_bar.ts} | 23 +++++++++++------------
 2 files changed, 12 insertions(+), 13 deletions(-)
 rename web/src/{scroll_bar.js => scroll_bar.ts} (89%)

diff --git a/tools/test-js-with-node b/tools/test-js-with-node
index c1da23f974..8f789122a4 100755
--- a/tools/test-js-with-node
+++ b/tools/test-js-with-node
@@ -144,7 +144,7 @@ EXEMPT_FILES = make_set(
         "web/src/reminder.js",
         "web/src/resize.js",
         "web/src/rows.js",
-        "web/src/scroll_bar.js",
+        "web/src/scroll_bar.ts",
         "web/src/search_pill_widget.js",
         "web/src/sent_messages.js",
         "web/src/sentry.ts",
diff --git a/web/src/scroll_bar.js b/web/src/scroll_bar.ts
similarity index 89%
rename from web/src/scroll_bar.js
rename to web/src/scroll_bar.ts
index 843df4d2f4..cdcd180185 100644
--- a/web/src/scroll_bar.js
+++ b/web/src/scroll_bar.ts
@@ -9,11 +9,10 @@ import {user_settings} from "./user_settings";
 // number of element widths based on the value detected here.
 //
 // From https://stackoverflow.com/questions/13382516/getting-scroll-bar-width-using-javascript
-function getScrollbarWidth() {
+function getScrollbarWidth(): number {
     const outer = document.createElement("div");
     outer.style.visibility = "hidden";
     outer.style.width = "100px";
-    outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
 
     document.body.append(outer);
 
@@ -34,9 +33,17 @@ function getScrollbarWidth() {
     return widthNoScroll - widthWithScroll;
 }
 
-let sbWidth;
+export function set_layout_width(): void {
+    if (user_settings.fluid_layout_width) {
+        $(".header-main, .app .app-main, #compose-container").css("max-width", "inherit");
+    } else {
+        $(".header-main, .app .app-main, #compose-container").css("max-width", "1400px");
+    }
+}
 
-export function initialize() {
+let sbWidth: number;
+
+export function initialize(): void {
     // Workaround for browsers with fixed scrollbars
     sbWidth = getScrollbarWidth();
     if (sbWidth > 0) {
@@ -45,11 +52,3 @@ export function initialize() {
     }
     set_layout_width();
 }
-
-export function set_layout_width() {
-    if (user_settings.fluid_layout_width) {
-        $(".header-main, .app .app-main, #compose-container").css("max-width", "inherit");
-    } else {
-        $(".header-main, .app .app-main, #compose-container").css("max-width", "1400px");
-    }
-}