feat: add /zookeeper explorer

app/[query]/clickhouse-queries.ts

@@ -13,6 +13,7 @@ import { settingsConfig } from './more/settings'
 import { topUsageColumnsConfig } from './more/top-usage-columns'
 import { topUsageTablesConfig } from './more/top-usage-tables'
 import { usersConfig } from './more/users'
+import { zookeeperConfig } from './more/zookeeper'
 import { commonErrorsConfig } from './queries/common-errors'
 import { expensiveQueriesConfig } from './queries/expensive-queries'
 import { expensiveQueriesByMemoryConfig } from './queries/expensive-queries-by-memory'
@@ -61,6 +62,7 @@ export const queries: Array<QueryConfig> = [
   asynchronousMetricsConfig,
   usersConfig,
   rolesConfig,
+  zookeeperConfig,
 ]
 
 export const getQueryConfigByName = (

app/[query]/more/zookeeper.ts

@@ -0,0 +1,32 @@
+import { ColumnFormat } from '@/components/data-table/column-defs'
+import { type QueryConfig } from '@/lib/types/query-config'
+
+export const zookeeperConfig: QueryConfig = {
+  name: 'zookeeper',
+  description: 'Zookeeper browser',
+  sql: `
+      SELECT *
+      FROM system.zookeeper
+      WHERE path = replaceOne({path: String}, '//', '/')
+  `,
+  columns: [
+    'name',
+    'value',
+    'path',
+    'dataLength',
+    'numChildren',
+    'czxid',
+    'mzxid',
+    'ctime',
+    'mtime',
+    'version',
+    'cversion',
+    'aversion',
+    'ephemeralOwner',
+  ],
+  columnFormats: {
+    name: [ColumnFormat.Link, { href: `/zookeeper?path=[path]/[name]` }],
+    value: ColumnFormat.CodeToggle,
+  },
+  defaultParams: { path: '/' },
+}

app/pageview.tsx

@@ -3,7 +3,7 @@
 import { usePathname, useSearchParams } from 'next/navigation'
 import { useEffect } from 'react'
 
-export async function PageView() {
+export function PageView() {
   const pathname = usePathname()
   const searchParams = useSearchParams()
 

menu.ts

@@ -25,6 +25,7 @@ import {
   CombineIcon,
   FilePlus2Icon,
   HardDriveIcon,
+  RollerCoasterIcon,
   UngroupIcon,
 } from 'lucide-react'
 import { type MenuItem } from './components/menu/types'
@@ -239,6 +240,13 @@ export const menuItemsConfig: MenuItem[] = [
           'Information about clusters available in the config file and the servers in them',
         icon: UngroupIcon,
       },
+      {
+        title: 'Zookeeper',
+        href: '/zookeeper?path=/',
+        description:
+          'Exposes data from the Keeper cluster defined in the config',
+        icon: RollerCoasterIcon,
+      },
     ],
   },
 ]