diff --git a/shared/studio/tabs/queryEditor/index.tsx b/shared/studio/tabs/queryEditor/index.tsx
index d79181f4..6f70c1ab 100644
--- a/shared/studio/tabs/queryEditor/index.tsx
+++ b/shared/studio/tabs/queryEditor/index.tsx
@@ -318,6 +318,11 @@ const QueryResult = observer(function QueryResult() {
       <div className={styles.queryError}>
         <span className={styles.errorName}>{result.error.data.name}</span>:{" "}
         {result.error.data.msg}
+        {result.error.data.details ? (
+          <div className={styles.errorHint}>
+            Details: {result.error.data.details}
+          </div>
+        ) : null}
         {result.error.data.hint ? (
           <div className={styles.errorHint}>
             Hint: {result.error.data.hint}
diff --git a/shared/studio/tabs/repl/index.tsx b/shared/studio/tabs/repl/index.tsx
index 4e54a8d9..3fb52d13 100644
--- a/shared/studio/tabs/repl/index.tsx
+++ b/shared/studio/tabs/repl/index.tsx
@@ -415,6 +415,11 @@ const ReplHistoryItem = observer(function ReplHistoryItem({
       <div className={styles.queryError}>
         <span className={styles.errorName}>{item.error.data.name}</span>:{" "}
         {item.error.data.msg}
+        {item.error.data.details ? (
+          <div className={styles.errorHint}>
+            Details: {item.error.data.details}
+          </div>
+        ) : null}
         {item.error.data.hint ? (
           <div className={styles.errorHint}>Hint: {item.error.data.hint}</div>
         ) : null}
@@ -561,6 +566,7 @@ const ReplHistoryItem = observer(function ReplHistoryItem({
           >
             <div
               className={cn(styles.historyOutput, {
+                [styles.wrapContent]: item.error != null,
                 [styles.explain]: isExplain,
               })}
               style={{
diff --git a/shared/studio/tabs/repl/repl.module.scss b/shared/studio/tabs/repl/repl.module.scss
index ddb43f34..59d7386b 100644
--- a/shared/studio/tabs/repl/repl.module.scss
+++ b/shared/studio/tabs/repl/repl.module.scss
@@ -381,6 +381,10 @@
   height: max-content;
   height: fit-content;
 
+  &.wrapContent {
+    min-width: auto;
+  }
+
   .explain {
     height: 100%;
     display: flex;
diff --git a/shared/studio/utils/extractErrorDetails.ts b/shared/studio/utils/extractErrorDetails.ts
index aa7a3f6f..8477ad61 100644
--- a/shared/studio/utils/extractErrorDetails.ts
+++ b/shared/studio/utils/extractErrorDetails.ts
@@ -20,6 +20,7 @@ export interface ErrorDetails {
   name: string;
   msg: string;
   hint?: string;
+  details?: string;
   range?: [number, number];
 }
 
@@ -47,6 +48,10 @@ export function extractErrorDetails(err: any, query: string): ErrorDetails {
     if (hint) {
       errDetails.hint = utf8Decoder.decode(hint);
     }
+    const details = attrs.get(ErrorField.details);
+    if (details) {
+      errDetails.details = utf8Decoder.decode(details);
+    }
 
     const lineStart = tryParseInt(attrs.get(ErrorField.lineStart));
     const lineEnd = tryParseInt(attrs.get(ErrorField.lineEnd));