feat: add column sort, SQL formatter, table stats, insert dialog, saved queries & sessions monitor
- Column sort by header click in table view (ASC/DESC/none cycle, server-side) - SQL formatter with Format button and Shift+Alt+F keybinding (sql-formatter) - Table size and row count display in schema tree via pg_class - Insert row dialog with column type hints and auto-skip for identity columns - Saved queries (bookmarks) with CRUD backend, sidebar panel, and save dialog - Active sessions monitor (pg_stat_activity) with auto-refresh, cancel & terminate Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -20,6 +20,7 @@ import {
|
||||
ChevronRight,
|
||||
HardDrive,
|
||||
Users,
|
||||
Activity,
|
||||
Loader2,
|
||||
} from "lucide-react";
|
||||
import type { Tab, RoleInfo } from "@/types";
|
||||
@@ -57,6 +58,18 @@ export function AdminPanel() {
|
||||
addTab(tab);
|
||||
}}
|
||||
/>
|
||||
<SessionsSection
|
||||
connectionId={activeConnectionId}
|
||||
onOpenSessions={() => {
|
||||
const tab: Tab = {
|
||||
id: crypto.randomUUID(),
|
||||
type: "sessions",
|
||||
title: "Active Sessions",
|
||||
connectionId: activeConnectionId,
|
||||
};
|
||||
addTab(tab);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -298,3 +311,34 @@ function RolesSection({
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function SessionsSection({
|
||||
connectionId,
|
||||
onOpenSessions,
|
||||
}: {
|
||||
connectionId: string;
|
||||
onOpenSessions: () => void;
|
||||
}) {
|
||||
return (
|
||||
<div className="border-b">
|
||||
<div className="flex items-center gap-1 px-3 py-2">
|
||||
<Activity className="h-3.5 w-3.5 text-muted-foreground" />
|
||||
<span className="text-xs font-semibold flex-1">Sessions</span>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="h-5 px-1 text-[10px]"
|
||||
onClick={onOpenSessions}
|
||||
title="View active sessions"
|
||||
>
|
||||
View Sessions
|
||||
</Button>
|
||||
</div>
|
||||
<div className="px-6 pb-2 text-xs text-muted-foreground">
|
||||
Monitor active database connections and running queries.
|
||||
{/* The connectionId is used by parent to open the sessions tab */}
|
||||
<span className="hidden">{connectionId}</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user