Fix `<Modal>` scroll event handler

ts/components/Modal.tsx

@@ -38,6 +38,7 @@ export function Modal({
   theme,
 }: Readonly<PropsType>): ReactElement {
   const modalRef = useRef<HTMLDivElement | null>(null);
+  const bodyRef = useRef<HTMLDivElement | null>(null);
   const [scrolled, setScrolled] = useState(false);
   const [hasOverflow, setHasOverflow] = useState(false);
 
@@ -107,10 +108,14 @@ export function Modal({
                   ? getClassName('__body--overflow')
                   : null
               )}
-              onScroll={event => {
-                setScrolled((event.target as HTMLDivElement).scrollTop > 2);
+              onScroll={() => {
+                const scrollTop = bodyRef.current?.scrollTop || 0;
+                setScrolled(scrollTop > 2);
+              }}
+              ref={bodyEl => {
+                measureRef(bodyEl);
+                bodyRef.current = bodyEl;
               }}
-              ref={measureRef}
             >
               {children}
             </div>

ts/util/lint/exceptions.json

@@ -12659,6 +12659,13 @@
     "reasonCategory": "usageTrusted",
     "updated": "2021-08-05T00:22:31.660Z"
   },
+  {
+    "rule": "React-useRef",
+    "path": "ts/components/Modal.tsx",
+    "line": "  const bodyRef = useRef<HTMLDivElement | null>(null);",
+    "reasonCategory": "usageTrusted",
+    "updated": "2021-09-21T01:40:08.534Z"
+  },
   {
     "rule": "React-useRef",
     "path": "ts/components/ProfileEditor.tsx",
@@ -14367,4 +14374,4 @@
     "reasonCategory": "usageTrusted",
     "updated": "2021-09-17T21:02:59.414Z"
   }
-]
+]