1 files changed, 28 insertions, 1 deletions
diff --git a/extension/react-app/src/components/Layout.tsx b/extension/react-app/src/components/Layout.tsx
index a54c0ed4..db31c8db 100644
--- a/extension/react-app/src/components/Layout.tsx
+++ b/extension/react-app/src/components/Layout.tsx
@@ -30,6 +30,20 @@ const LayoutTopDiv = styled.div`
   border-radius: ${defaultBorderRadius};
   scrollbar-base-color: transparent;
   scrollbar-width: thin;
+
+  & * {
+    ::-webkit-scrollbar {
+      width: 4px;
+    }
+
+    ::-webkit-scrollbar:horizontal {
+      height: 4px;
+    }
+
+    ::-webkit-scrollbar-thumb {
+      border-radius: 2px;
+    }
+  }
 `;
 
 const BottomMessageDiv = styled.div<{ displayOnBottom: boolean }>`
@@ -47,7 +61,6 @@ const BottomMessageDiv = styled.div<{ displayOnBottom: boolean }>`
   z-index: 100;
   box-shadow: 0px 0px 2px 0px ${vscForeground};
   max-height: 35vh;
-  overflow: scroll;
 `;
 
 const Footer = styled.footer`
@@ -131,6 +144,20 @@ const Layout = () => {
     };
   }, [client, timeline]);
 
+  useEffect(() => {
+    const handler = (event: any) => {
+      if (event.data.type === "addModel") {
+        navigate("/models");
+      } else if (event.data.type === "openSettings") {
+        navigate("/settings");
+      }
+    };
+    window.addEventListener("message", handler);
+    return () => {
+      window.removeEventListener("message", handler);
+    };
+  }, []);
+
   return (
     <LayoutTopDiv>
       <div