diff --git a/apps/client/src/layouts/desktop_layout.tsx b/apps/client/src/layouts/desktop_layout.tsx
index ffc94aec3..c0f43d46c 100644
--- a/apps/client/src/layouts/desktop_layout.tsx
+++ b/apps/client/src/layouts/desktop_layout.tsx
@@ -46,7 +46,6 @@ import ScrollPadding from "../widgets/scroll_padding.js";
 import SearchResult from "../widgets/search_result.jsx";
 import SharedInfo from "../widgets/shared_info.jsx";
 import RightPanelContainer from "../widgets/sidebar/RightPanelContainer.jsx";
-import SqlResults from "../widgets/sql_result.js";
 import SqlTableSchemas from "../widgets/sql_table_schemas.js";
 import TabRowWidget from "../widgets/tab_row.js";
 import TabHistoryNavigationButtons from "../widgets/TabHistoryNavigationButtons.jsx";
@@ -167,7 +166,6 @@ export default class DesktopLayout {
                                                                 .child(<NoteDetail />)
                                                                 .child(<NoteList media="screen" />)
                                                                 .child(<SearchResult />)
-                                                                .child(<SqlResults />)
                                                                 .child(<ScrollPadding />)
                                                         )
                                                         .child(<ApiLog />)
diff --git a/apps/client/src/widgets/sql_result.tsx b/apps/client/src/widgets/sql_result.tsx
deleted file mode 100644
index 7aaa5739d..000000000
--- a/apps/client/src/widgets/sql_result.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import { SqlExecuteResults } from "@triliumnext/commons";
-import { useNoteContext, useTriliumEvent } from "./react/hooks";
-import "./sql_result.css";
-import { useState } from "preact/hooks";
-import Alert from "./react/Alert";
-import { t } from "../services/i18n";
-
-export default function SqlResults() {
-    const { note, ntxId } = useNoteContext();
-    const [ results, setResults ] = useState<SqlExecuteResults>();
-
-    useTriliumEvent("sqlQueryResults", ({ ntxId: eventNtxId, results }) => {
-        if (eventNtxId !== ntxId) return;
-        setResults(results);
-    })
-
-    const isEnabled = note?.mime === "text/x-sqlite;schema=trilium";
-    return (
-        <div className={`sql-result-widget ${!isEnabled ? "hidden-ext" : ""}`}>
-            {isEnabled && (
-                results?.length === 1 && Array.isArray(results[0]) && results[0].length === 0 ? (
-                    <Alert type="info">
-                        {t("sql_result.no_rows")}
-                    </Alert>
-                ) : (
-                    <div className="sql-console-result-container selectable-text">
-                        {results?.map(rows => {
-                            // inserts, updates
-                            if (typeof rows === "object" && !Array.isArray(rows)) {
-                                return <pre>{JSON.stringify(rows, null, "\t")}</pre>
-                            }
-
-                            // selects
-                            return <SqlResultTable rows={rows} />
-                        })}
-                    </div>
-                )
-            )}
-        </div>
-    )
-}
-
-function SqlResultTable({ rows }: { rows: object[] }) {
-    if (!rows.length) return;
-
-    return (
-        <table className="table table-striped">
-            <thead>
-                <tr>
-                    {Object.keys(rows[0]).map(key => <th>{key}</th>)}
-                </tr>
-            </thead>
-
-            <tbody>
-                {rows.map(row => (
-                    <tr>
-                        {Object.values(row).map(cell => <td>{cell}</td>)}
-                    </tr>
-                ))}
-            </tbody>
-        </table>
-    )
-}
diff --git a/apps/client/src/widgets/type_widgets/SqlConsole.tsx b/apps/client/src/widgets/type_widgets/SqlConsole.tsx
index dcb025ad5..06b30c462 100644
--- a/apps/client/src/widgets/type_widgets/SqlConsole.tsx
+++ b/apps/client/src/widgets/type_widgets/SqlConsole.tsx
@@ -1,3 +1,9 @@
+import { SqlExecuteResults } from "@triliumnext/commons";
+import { useState } from "preact/hooks";
+
+import { t } from "../../services/i18n";
+import Alert from "../react/Alert";
+import { useTriliumEvent } from "../react/hooks";
 import SplitEditor from "./helpers/SplitEditor";
 import { TypeWidgetProps } from "./type_widget";
 
@@ -6,6 +12,63 @@ export default function SqlConsole(props: TypeWidgetProps) {
         <SplitEditor
             noteType="code"
             {...props}
+            previewContent={<SqlResults {...props} />}
         />
     );
 }
+
+function SqlResults({ note, ntxId }: TypeWidgetProps) {
+    const [ results, setResults ] = useState<SqlExecuteResults>();
+
+    useTriliumEvent("sqlQueryResults", ({ ntxId: eventNtxId, results }) => {
+        if (eventNtxId !== ntxId) return;
+        setResults(results);
+    });
+
+    const isEnabled = note?.mime === "text/x-sqlite;schema=trilium";
+    return (
+        <div className={`sql-result-widget ${!isEnabled ? "hidden-ext" : ""}`}>
+            {isEnabled && (
+                results?.length === 1 && Array.isArray(results[0]) && results[0].length === 0 ? (
+                    <Alert type="info">
+                        {t("sql_result.no_rows")}
+                    </Alert>
+                ) : (
+                    <div className="sql-console-result-container selectable-text">
+                        {results?.map(rows => {
+                            // inserts, updates
+                            if (typeof rows === "object" && !Array.isArray(rows)) {
+                                return <pre>{JSON.stringify(rows, null, "\t")}</pre>;
+                            }
+
+                            // selects
+                            return <SqlResultTable rows={rows} />;
+                        })}
+                    </div>
+                )
+            )}
+        </div>
+    );
+}
+
+function SqlResultTable({ rows }: { rows: object[] }) {
+    if (!rows.length) return;
+
+    return (
+        <table className="table table-striped">
+            <thead>
+                <tr>
+                    {Object.keys(rows[0]).map(key => <th>{key}</th>)}
+                </tr>
+            </thead>
+
+            <tbody>
+                {rows.map(row => (
+                    <tr>
+                        {Object.values(row).map(cell => <td>{cell}</td>)}
+                    </tr>
+                ))}
+            </tbody>
+        </table>
+    );
+}