From 8ae91505f420fad455da46e961b64fe9d6f9be40 Mon Sep 17 00:00:00 2001
From: Will Chen <willchen90@gmail.com>
Date: Fri, 18 Oct 2024 22:07:23 -0700
Subject: [PATCH] Fix server error dialog UI

---
 mesop/web/src/error/error_box.scss | 1 -
 mesop/web/src/error/error_box.ts   | 1 +
 mesop/web/src/shell/shell.ts       | 1 +
 3 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/mesop/web/src/error/error_box.scss b/mesop/web/src/error/error_box.scss
index e8ec8cf0..76591ed6 100644
--- a/mesop/web/src/error/error_box.scss
+++ b/mesop/web/src/error/error_box.scss
@@ -1,7 +1,6 @@
 .error {
   padding: 28px;
   color: #9e4242;
-  overflow: auto;
 }
 
 .ok-button {
diff --git a/mesop/web/src/error/error_box.ts b/mesop/web/src/error/error_box.ts
index cf3d97f1..fb12a08a 100644
--- a/mesop/web/src/error/error_box.ts
+++ b/mesop/web/src/error/error_box.ts
@@ -82,6 +82,7 @@ export class ErrorBox {
       display: block;
       max-height: 80vh;
       background-color: #ffe5e5;
+      overflow: auto;
     }
   `,
   standalone: true,
diff --git a/mesop/web/src/shell/shell.ts b/mesop/web/src/shell/shell.ts
index 016efe2e..54ce740e 100644
--- a/mesop/web/src/shell/shell.ts
+++ b/mesop/web/src/shell/shell.ts
@@ -240,6 +240,7 @@ export class Shell {
     this.dialog.open(ServerErrorBoxDialogComponent, {
       width: 'min(90vw, max(60vw, 600px))',
       data: {error: error},
+      autoFocus: 'dialog',
     });
   }