From da7eaadc17bf05d392664dd6038fe4210575ce72 Mon Sep 17 00:00:00 2001
From: Roy Johnson <roy.e.johnson@rice.edu>
Date: Tue, 16 Apr 2024 14:17:29 -0500
Subject: [PATCH] Handle forwardedRef properly

---
 src/app/components/MainContent.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/app/components/MainContent.tsx b/src/app/components/MainContent.tsx
index 122f51866b..2e3f9fce42 100644
--- a/src/app/components/MainContent.tsx
+++ b/src/app/components/MainContent.tsx
@@ -31,15 +31,18 @@ const ContentStyles = styled(({ textSize, ...props }) => <DynamicContentStyles {
 
 // tslint:disable-next-line:variable-name
 const MainContent = React.forwardRef<HTMLDivElement, React.PropsWithChildren<Props>>(
-  ({book, children, className, ...props}, ref) => {
+  ({book, children, className, ...props}, forwardedRef) => {
     const initialLoad = React.useRef(true);
+    const ref = React.useRef<HTMLDivElement>(null);
+
+    React.useImperativeHandle(forwardedRef, () => ref.current as HTMLDivElement);
 
     React.useEffect(
       () => {
         if (initialLoad.current) {
           initialLoad.current = false;
         } else {
-          (ref as React.MutableRefObject<HTMLDivElement>).current?.focus();
+          ref.current?.focus();
         }
       },
       [children, ref]