fix(app): sort builder tables by output identifiers

[fallintoplace]

What changed

Builder table sorting now uses the returned column name as a quoted ClickHouse identifier.

This fixes sorting for:

• generated metric columns like avg(metric.total)
• formula output columns
• group-by columns with special characters

Also:

• keeps quoted sort state after a table remount or reload
• escapes quotes and backslashes in output names
• keeps raw SQL and PromQL table sorting unchanged

Why

The composed metric query sorts in the outer result scope. The table was sending generated names as expressions, so ClickHouse could not resolve them.

The sort state parser also split on every space, so a quoted name like "error rate" DESC was lost after reload.

Tests

• yarn workspace @hyperdx/app jest --runInBand src/__tests__/utils.test.ts src/components/__tests__/DBTableChart.test.tsx
• yarn workspace @hyperdx/app tsc --noEmit
• yarn lint:fix

[changeset-bot]

🦋 Changeset detected

Latest commit: 3aa6af4

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@hyperdx/app	Patch
@hyperdx/api	Patch
@hyperdx/otel-collector	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

@fallintoplace is attempting to deploy a commit to the HyperDX Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps]

Greptile Summary

The PR fixes builder-table sorting by treating returned column names as quoted ClickHouse output identifiers and updates persisted sorting-state parsing to support quoted names containing spaces.

• Quotes and escapes generated aggregate, formula, and group-by output names.
• Leaves raw SQL and PromQL column identifiers unchanged.
• Adds typed query fixtures and regression tests for identifier generation, server-side sorting, escaping, and sorting-state round trips.

Confidence Score: 5/5

The PR appears safe to merge.

No blocking failure remains.

Important Files Changed

Filename	Overview
packages/app/src/components/DBTableChart.tsx	Builder columns now use escaped, quoted output identifiers while raw SQL and PromQL columns remain unchanged.
packages/app/src/utils.ts	The order-by parser now restores quoted identifiers containing spaces while retaining validation for unquoted identifiers.
packages/app/src/components/tests/DBTableChart.test.tsx	Adds typed fixtures and regression coverage for builder output identifiers, escaping, and generated server-side ordering.
packages/app/src/tests/utils.test.ts	Adds parsing and round-trip coverage for quoted sorting identifiers containing spaces.

_{Reviews (2): Last reviewed commit: "fix(app): preserve quoted table sort sta..." | Re-trigger Greptile}

[greptile-apps]

Quoted sort state cannot round-trip

When a builder output name contains spaces, such as error rate, its quoted ID is serialized as "error rate" DESC, but the existing parser splits on every space and rejects the resulting three tokens. After the chart remounts or reloads, the persisted ordering is not restored and the sort indicator and selected ordering are lost.

[greptile-apps]

New mocks bypass type checking

The two added query mocks use as any, so changes to the query result contract will not be checked against these fixtures. Please give these mock return values their proper type so missing or malformed fields remain visible to TypeScript.

Context Used: AGENTS.md (source)

Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!

[github-actions]

Deep Review

✅ No critical issues found.

The core change is sound: builder-table sort IDs are now quoted ClickHouse identifiers, escaping is applied backslash-first then double-quote-doubling (""), and the identifier is only ever emitted after quoting for builder configs — raw SQL (client-side sort) and PromQL paths are correctly left unquoted. Both prior review comments appear resolved in the current diff: the orderByStringToSortingState rewrite in packages/app/src/utils.ts now accepts quoted identifiers containing spaces (with a round-trip test), and the newly added builder test mocks use a typed createTableQueryResult helper instead of as any.

🔵 P3 nitpicks (3)

• packages/app/src/components/DBTableChart.tsx:200 — Pre-existing saved builder sorts persisted before this change store unquoted names (e.g. ServiceName DESC), which parse back to an id of ServiceName that no longer matches the now-quoted column.id ("ServiceName"), so the header sort indicator and click-to-toggle are lost until the user re-clicks (the applied ORDER BY still resolves for plain identifiers).
  • Fix: Normalize incoming controlled sort ids through the same quoting helper when reconciling against builder column ids, or migrate persisted builder order-by strings on read.
• packages/app/src/components/DBTableChart.tsx:38 — The quoting contract is split across two files: quoteClickHouseOutputIdentifier here and the isQuotedIdentifier regex in packages/app/src/utils.ts, which must stay in sync (both handle "" but only the helper escapes backslashes) with no shared reference tying them together.
  • Fix: Extract the quote/unquote/detect helpers into one shared module so the escaping and detection rules cannot drift apart.
• packages/app/src/components/__tests__/DBTableChart.test.tsx:364 — There is no test covering the end-to-end persisted-sort round-trip for a builder chart (quoted column.id → sortingStateToOrderByString → orderByStringToSortingState → controlled sort matching the quoted column), which is the integration the two commits jointly enable.
  • Fix: Add a test asserting a quoted-with-spaces builder sort survives a serialize/parse cycle and re-matches the rendered column id.

---

Reviewers (7): correctness, security, testing, maintainability, kieran-typescript, project-standards, previous-comments.

Testing gaps: No integration-level test that a persisted quoted builder sort (spaces/special chars) round-trips through the ChartPreviewPanel order-by string back onto the matching column id.