## Summary
This PR is the first step towards raw SQL-driven charts.
- It introduces updated ChartConfig types, which are now unions of `BuilderChartConfig` (which is unchanged from the current `ChartConfig` types` and `RawSqlChartConfig` types which represent sql-driven charts.
- It adds _very basic_ support for SQL-driven tables in the Chart Explorer and Dashboard pages. This is currently behind a feature toggle and enabled only in preview environments and for local development.
The changes in most of the files in this PR are either type updates or the addition of type guards to handle the new ChartConfig union type.
The DBEditTimeChartForm has been updated significantly to (a) add the Raw SQL option to the table chart editor and (b) handle conversion from internal form state (which can now include properties from either branch of the ChartConfig union) to valid SavedChartConfigs (which may only include properties from one branch).
Significant changes are in:
- packages/app/src/components/ChartEditor/types.ts
- packages/app/src/components/ChartEditor/RawSqlChartEditor.tsx
- packages/app/src/components/ChartEditor/utils.ts
- packages/app/src/components/DBEditTimeChartForm.tsx
- packages/app/src/components/DBTableChart.tsx
- packages/app/src/components/SQLEditor.tsx
- packages/app/src/hooks/useOffsetPaginatedQuery.tsx
Future PRs will add templating to the Raw SQL driven charts for date range and granularity injection; support for other chart types driven by SQL; improved placeholder, validation, and error states; and improved support in the external API and import/export.
### Screenshots or video
https://github.com/user-attachments/assets/008579cc-ef3c-496e-9899-88bbb21eaa5e
### How to test locally or on Vercel
The SQL-driven table can be tested in the preview environment or locally.
### References
- Linear Issue: HDX-3580
- Related PRs:
Adds custom nuqs parsers (parseAsStringEncoded, parseAsJsonEncoded) that pre-encode values with encodeURIComponent, producing %XX sequences instead of + form-encoding. This protects against re-encoding + to %2B when sharing links, which was causing ClickHouse query errors when accessed from tools like Microsoft Teams.
Backward compatible: parsers fall back to plain JSON.parse for old-format URLs.
Test:
- New URLs
- Grab a play.hyperdx.io URL and change the source and domain in the URL. Proves "old" URLS still work.
I verified that links generated from this branch work as intended in Microsoft Teams, which was the original source of this report.
Fixes: HDX-3184
Revisit the bug fix for https://github.com/hyperdxio/hyperdx/pull/1614.
The alias map should be used in useRowWhere hook
Ref: HDX-3196
Example:
For select
```
Timestamp,ServiceName,SeverityText,Body AS b, concat(b, 'blabla')
```
The generated query from useRowWhere is
```
WITH (Body) AS b
SELECT
*,
Timestamp AS "__hdx_timestamp",
Body AS "__hdx_body",
TraceId AS "__hdx_trace_id",
SpanId AS "__hdx_span_id",
SeverityText AS "__hdx_severity_text",
ServiceName AS "__hdx_service_name",
ResourceAttributes AS "__hdx_resource_attributes",
LogAttributes AS "__hdx_event_attributes"
FROM
DEFAULT.otel_logs
WHERE
(
Timestamp = parseDateTime64BestEffort('2026-01-20T06:11:00.170000000Z', 9)
AND ServiceName = 'hdx-oss-dev-api'
AND SeverityText = 'info'
AND Body = 'Received alert metric [saved_search source]'
AND concat(b, 'blabla') = 'Received alert metric [saved_search source]blabla'
AND TimestampTime = parseDateTime64BestEffort('2026-01-20T06:11:00Z', 9)
)
LIMIT
1
```
1. Ensures that multiple scrollbars are not shown for nested panels (click row -> surrounding context -> repeat a few times)
<img width="1402" height="876" alt="scrollbars" src="https://github.com/user-attachments/assets/f41c99e5-5fcb-47fa-9c40-243dbd926291" />
2. In the same state as above, closing the panel (clicking outside) then clicking another row caused the subpanel to re-open, this isn't ideal (should open to root drawer)
3. fix issue with drawers where you can scroll, then open a nested drawer, the nested drawer would appear incorrectly
<img width="910" height="878" alt="Screenshot 2026-01-09 at 5 10 29 PM" src="https://github.com/user-attachments/assets/fd1fbc0c-4453-46fb-b310-2323ec2792e2" />
Fixes HDX-3171
Across the app, we are inconsistent with when we can open the sidebar and expand functionality. This is because the sidebar and logic was managed by the parent component.
Additionally, the expand logic was set to assume a certain structure that some places in the application could not support (ex clickhouse dashboard doesn't have a 'source').
As a result, I have created the `DBSqlRowTableWithSideBar` component which will manage a lot of the common use cases for us. This PR introduces that new component, and updates all references (that could be easily upgraded) to use the new component when applciable.
The result: a lot less duplicate code (see # of lines removed) and the ability to more easily maintain the components down the road.
This PR also fixes several bugs I found as I tested these flows, especially around sidebars opening subpanels.
Fixes: HDX-2341
