|
1 | | -import { useState } from "react"; |
| 1 | +import { useMemo, useState } from "react"; |
2 | 2 | import { Header3 } from "~/components/primitives/Headers"; |
3 | 3 | import { Paragraph } from "~/components/primitives/Paragraph"; |
4 | 4 | import SegmentedControl from "~/components/primitives/SegmentedControl"; |
5 | 5 | import type { QueryScope } from "~/services/queryService.server"; |
6 | | -import { visibleQuerySchemas } from "~/v3/querySchemas"; |
| 6 | +import { listableQuerySchemas } from "~/v3/querySchemas"; |
| 7 | +import { useFeatures } from "~/hooks/useFeatures"; |
7 | 8 | import { TryableCodeBlock } from "./TRQLGuideContent"; |
8 | 9 |
|
9 | 10 | // Example queries for the Examples tab |
@@ -211,14 +212,21 @@ LIMIT 20`, |
211 | 212 | }, |
212 | 213 | ]; |
213 | 214 |
|
214 | | -const tableOptions = visibleQuerySchemas.map((s) => ({ label: s.name, value: s.name })); |
215 | | - |
216 | 215 | export function ExamplesContent({ |
217 | 216 | onTryExample, |
218 | 217 | }: { |
219 | 218 | onTryExample: (query: string, scope: QueryScope) => void; |
220 | 219 | }) { |
221 | | - const [selectedTable, setSelectedTable] = useState(visibleQuerySchemas[0].name); |
| 220 | + const { queueMetricsQueryTables } = useFeatures(); |
| 221 | + const schemas = useMemo( |
| 222 | + () => listableQuerySchemas({ includeQueueMetrics: queueMetricsQueryTables }), |
| 223 | + [queueMetricsQueryTables] |
| 224 | + ); |
| 225 | + const tableOptions = useMemo( |
| 226 | + () => schemas.map((s) => ({ label: s.name, value: s.name })), |
| 227 | + [schemas] |
| 228 | + ); |
| 229 | + const [selectedTable, setSelectedTable] = useState(schemas[0].name); |
222 | 230 | const filtered = exampleQueries.filter((e) => e.table === selectedTable); |
223 | 231 |
|
224 | 232 | return ( |
|
0 commit comments