feat(errorboundary): format stack trace properly (OHIF#3931)

uc-cdis · Apr 30, 2024 · 3201fc5 · 3201fc5
1 parent eb19a2d
commit 3201fc5
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/platform/ui/src/components/ErrorBoundary/ErrorBoundary.tsx b/platform/ui/src/components/ErrorBoundary/ErrorBoundary.tsx
@@ -24,8 +24,12 @@ const DefaultFallback = ({ error, context, resetErrorBoundary, fallbackRoute })
       <p className="text-primary-light text-base">{subtitle}</p>
       {!isProduction && (
         <div className="bg-secondary-dark mt-5 space-y-2 rounded-md p-5 font-mono">
-          <p className="text-primary-light">{t('Context')}: {context}</p>
-          <p className="text-primary-light">{t('Error Message')}: {error.message}</p>
+          <p className="text-primary-light">
+            {t('Context')}: {context}
+          </p>
+          <p className="text-primary-light">
+            {t('Error Message')}: {error.message}
+          </p>
 
           <IconButton
             variant="contained"
@@ -44,7 +48,9 @@ const DefaultFallback = ({ error, context, resetErrorBoundary, fallbackRoute })
             </React.Fragment>
           </IconButton>
 
-          {showDetails && <p className="text-primary-light px-4">Stack: {error.stack}</p>}
+          {showDetails && (
+            <pre className="text-primary-light whitespace-pre-wrap px-4">Stack: {error.stack}</pre>
+          )}
         </div>
       )}
     </div>

diff --git a/platform/ui/src/components/Modal/Modal.tsx b/platform/ui/src/components/Modal/Modal.tsx
@@ -53,7 +53,7 @@ const Modal = ({
 
   return (
     <ReactModal
-      className="relative max-h-full w-11/12 text-white outline-none lg:w-10/12  xl:w-1/2"
+      className="relative max-h-full w-11/12 text-white outline-none lg:w-10/12  xl:w-9/12"
       overlayClassName="fixed top-0 left-0 right-0 bottom-0 z-50 bg-overlay flex items-start justify-center py-16"
       shouldCloseOnEsc={shouldCloseOnEsc}
       onRequestClose={handleClose}