fix: use simple protocol for multi-statement queries; resizable results; show target server in tab

- Switch exec from sqlx::query (extended/prepared) to sqlx::raw_sql so multi-statement batches no longer fail with "cannot insert multiple commands into a prepared statement".
- Add a draggable splitter between the editor and results panes; ratio is clamped 15-85% and persisted to localStorage. Double-click resets to 40%.
- Show "@ {name} / {database}" next to each tab title (full user@host:port/db in tooltip) so it's clear which server a tab will execute against.

Author: rmnunes

crates/pg-core/src/exec.rs

@@ -93,12 +93,13 @@ where
     // `fetch_many` yields Either<QueryResult, Row>. A statement that returns
     // rows emits a series of Rows followed by a QueryResult with the command
     // tag; a non-returning statement emits only the QueryResult.
-    let query = sqlx::query(&sql);
-    // `Query::fetch_many` is deprecated in sqlx 0.8 in favor of the Executor
-    // trait approach, but the trait approach lifetimes fight the borrow
-    // checker here. Keep the deprecated path until sqlx 0.9 stabilizes.
-    #[allow(deprecated)]
-    let mut stream = query.fetch_many(&mut *conn);
+    //
+    // We route through `raw_sql` (simple query protocol) rather than `query`
+    // (extended protocol) because Postgres rejects multi-statement batches in
+    // a prepared statement with `cannot insert multiple commands into a
+    // prepared statement`. The simple protocol has no statement preparation
+    // and happily executes `BEGIN; UPDATE ...; COMMIT;`-style scripts.
+    let mut stream = sqlx::raw_sql(&sql).fetch_many(&mut *conn);
 
     let mut columns_reported = false;
     let mut batch: Vec<serde_json::Value> = Vec::with_capacity(BATCH_SIZE);

src/App.tsx

@@ -161,7 +161,11 @@ export default function App() {
         </aside>
         <section className="workspace">
           {active?.connected ? (
-            <Workspace profileId={active.id} injectedSql={injectedSql} />
+            <Workspace
+              profileId={active.id}
+              connections={connections}
+              injectedSql={injectedSql}
+            />
           ) : server ? (
             <div className="empty-hint">
               <h2>Connected</h2>

src/styles.css

@@ -648,10 +648,28 @@ label {
 }
 
 .tab-title {
-  flex: 1;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  flex-shrink: 1;
+}
+
+.tab-target {
+  color: var(--fg-2);
+  font-size: 10.5px;
+  font-family: var(--font-mono);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-left: 4px;
+  opacity: 0.75;
+  flex: 1;
+  min-width: 0;
+}
+
+.tab.active .tab-target {
+  opacity: 1;
+  color: var(--fg-1, var(--fg-0));
 }
 
 .tab-close {
@@ -713,16 +731,48 @@ label {
 .query-split {
   flex: 1;
   display: grid;
-  grid-template-rows: 40% 1fr;
+  /* Inline style overrides this with the user-chosen split. */
+  grid-template-rows: 40% 6px 1fr;
   min-height: 0;
 }
 
 .query-editor-pane {
-  border-bottom: 1px solid var(--border);
   min-height: 0;
   overflow: hidden;
 }
 
+.query-splitter {
+  cursor: row-resize;
+  background: var(--border);
+  position: relative;
+  user-select: none;
+  transition: background 120ms ease;
+}
+
+.query-splitter::after {
+  content: "";
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  width: 32px;
+  height: 2px;
+  border-radius: 2px;
+  background: var(--fg-2);
+  opacity: 0.35;
+  transform: translate(-50%, -50%);
+}
+
+.query-splitter:hover,
+.query-splitter:active {
+  background: var(--accent, #4d9cf6);
+}
+
+.query-splitter:hover::after,
+.query-splitter:active::after {
+  opacity: 0.8;
+  background: #fff;
+}
+
 .query-results-pane {
   min-height: 0;
   display: flex;

src/workspace/QueryTab.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useRef } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import QueryEditor, { type QueryEditorHandle } from "../editor/QueryEditor";
 import CommandsPanel from "../results/CommandsPanel";
 import ResultsGrid from "../results/ResultsGrid";
@@ -91,6 +91,38 @@ export default function QueryTab({ tab }: Props) {
 
   const running = tab.runState.phase === "running";
 
+  const splitRef = useRef<HTMLDivElement | null>(null);
+  const [editorPct, setEditorPct] = useState<number>(() => readSplitPct());
+  const dragging = useRef(false);
+  const onSplitterDown = useCallback((e: React.MouseEvent) => {
+    e.preventDefault();
+    dragging.current = true;
+    document.body.style.cursor = "row-resize";
+    document.body.style.userSelect = "none";
+  }, []);
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => {
+      if (!dragging.current || !splitRef.current) return;
+      const rect = splitRef.current.getBoundingClientRect();
+      const pct = ((e.clientY - rect.top) / rect.height) * 100;
+      const clamped = Math.min(85, Math.max(15, pct));
+      setEditorPct(clamped);
+    };
+    const onUp = () => {
+      if (!dragging.current) return;
+      dragging.current = false;
+      document.body.style.cursor = "";
+      document.body.style.userSelect = "";
+      writeSplitPct(editorPct);
+    };
+    window.addEventListener("mousemove", onMove);
+    window.addEventListener("mouseup", onUp);
+    return () => {
+      window.removeEventListener("mousemove", onMove);
+      window.removeEventListener("mouseup", onUp);
+    };
+  }, [editorPct]);
+
   return (
     <div className="query-tab">
       <div className="query-toolbar">
@@ -124,7 +156,11 @@ export default function QueryTab({ tab }: Props) {
         <span className="toolbar-spacer" />
         <span className="toolbar-status">{statusLine}</span>
       </div>
-      <div className="query-split">
+      <div
+        className="query-split"
+        ref={splitRef}
+        style={{ gridTemplateRows: `${editorPct}% 6px 1fr` }}
+      >
         <div className="query-editor-pane">
           <QueryEditor
             ref={editorRef}
@@ -135,6 +171,17 @@ export default function QueryTab({ tab }: Props) {
             profileId={tab.profileId}
           />
         </div>
+        <div
+          className="query-splitter"
+          role="separator"
+          aria-orientation="horizontal"
+          title="Drag to resize · double-click to reset"
+          onMouseDown={onSplitterDown}
+          onDoubleClick={() => {
+            setEditorPct(40);
+            writeSplitPct(40);
+          }}
+        />
         <div className="query-results-pane">
           {tab.runState.phase === "error" ? (
             <div className="query-error">{tab.runState.message}</div>
@@ -160,6 +207,28 @@ export default function QueryTab({ tab }: Props) {
   );
 }
 
+const SPLIT_KEY = "pg-shell.querySplit.editorPct";
+
+function readSplitPct(): number {
+  try {
+    const raw = localStorage.getItem(SPLIT_KEY);
+    if (!raw) return 40;
+    const n = Number.parseFloat(raw);
+    if (!Number.isFinite(n)) return 40;
+    return Math.min(85, Math.max(15, n));
+  } catch {
+    return 40;
+  }
+}
+
+function writeSplitPct(pct: number): void {
+  try {
+    localStorage.setItem(SPLIT_KEY, String(pct));
+  } catch {
+    // ignore
+  }
+}
+
 function statusText(tab: QueryTabState): string {
   const liveRows = tab.rows.length;
   switch (tab.runState.phase) {

src/workspace/TabStrip.tsx

@@ -1,8 +1,17 @@
 import type { QueryTabState } from "./tabs";
 
+export interface TabTarget {
+  /** Short label shown in the tab, e.g. "prod-db / orders". */
+  label: string;
+  /** Full server description for the tooltip. */
+  detail: string;
+}
+
 export interface TabStripProps {
   tabs: QueryTabState[];
   activeId: string | null;
+  /** Resolves the connection a tab will execute against. Null means unknown. */
+  getTarget: (tab: QueryTabState) => TabTarget | null;
   onActivate: (id: string) => void;
   onClose: (id: string) => void;
   onNew: () => void;
@@ -17,6 +26,7 @@ export interface TabStripProps {
 export default function TabStrip({
   tabs,
   activeId,
+  getTarget,
   onActivate,
   onClose,
   onNew,
@@ -29,6 +39,7 @@ export default function TabStrip({
           <Tab
             key={t.id}
             tab={t}
+            target={getTarget(t)}
             active={t.id === activeId}
             onActivate={() => onActivate(t.id)}
             onClose={() => onClose(t.id)}
@@ -51,18 +62,22 @@ export default function TabStrip({
 
 function Tab({
   tab,
+  target,
   active,
   onActivate,
   onClose,
 }: {
   tab: QueryTabState;
+  target: TabTarget | null;
   active: boolean;
   onActivate: () => void;
   onClose: () => void;
 }) {
   const running = tab.runState.phase === "running";
   const errored = tab.runState.phase === "error";
 
+  const tooltip = target ? `${tab.title} — ${target.detail}` : tab.title;
+
   return (
     <div
       className={`tab ${active ? "active" : ""}`}
@@ -74,14 +89,15 @@ function Tab({
           onClose();
         }
       }}
-      title={tab.title}
+      title={tooltip}
     >
       <span
         className={`tab-status ${running ? "running" : errored ? "error" : ""}`}
       >
         {running ? "●" : tab.dirty ? "●" : " "}
       </span>
       <span className="tab-title">{tab.title}</span>
+      {target && <span className="tab-target">@ {target.label}</span>}
       <button
         className="tab-close"
         onClick={(e) => {

src/workspace/Workspace.tsx

@@ -1,11 +1,17 @@
-import { useEffect, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import type { ConnectionSummary } from "../ipc/types";
 import HistoryPanel from "./HistoryPanel";
 import QueryTab from "./QueryTab";
-import TabStrip from "./TabStrip";
-import { useTabStore } from "./tabs";
+import TabStrip, { type TabTarget } from "./TabStrip";
+import { useTabStore, type QueryTabState } from "./tabs";
 
 interface Props {
   profileId: string;
+  /**
+   * Known connection profiles. Used to surface the target server next to each
+   * tab title — so the user sees where the SQL will execute.
+   */
+  connections: ConnectionSummary[];
   /**
    * SQL to open a new tab with when the tree injects a script. Bumped via a
    * version id so the same script can be re-opened.
@@ -18,7 +24,7 @@ interface Props {
  * tab when a profile activates, open new tab for injected scripts, keyboard
  * shortcuts for new/close).
  */
-export default function Workspace({ profileId, injectedSql }: Props) {
+export default function Workspace({ profileId, connections, injectedSql }: Props) {
   const tabs = useTabStore((s) => s.tabs);
   const activeId = useTabStore((s) => s.activeId);
   const openTab = useTabStore((s) => s.openTab);
@@ -81,11 +87,30 @@ export default function Workspace({ profileId, injectedSql }: Props) {
   const activeTab =
     profileTabs.find((t) => t.id === activeId) ?? profileTabs[profileTabs.length - 1] ?? null;
 
+  const connectionMap = useMemo(() => {
+    const m = new Map<string, ConnectionSummary>();
+    for (const c of connections) m.set(c.id, c);
+    return m;
+  }, [connections]);
+
+  const getTarget = useCallback(
+    (tab: QueryTabState): TabTarget | null => {
+      const c = connectionMap.get(tab.profileId);
+      if (!c) return null;
+      return {
+        label: `${c.name} / ${c.database}`,
+        detail: `${c.user}@${c.host}:${c.port}/${c.database}${c.connected ? "" : " (disconnected)"}`,
+      };
+    },
+    [connectionMap],
+  );
+
   return (
     <div className="workspace-shell">
       <TabStrip
         tabs={profileTabs}
         activeId={activeTab?.id ?? null}
+        getTarget={getTarget}
         onActivate={setActive}
         onClose={closeTab}
         onNew={() => openTab(profileId)}