Skip to content

fix: label array/object variable options as JSON so the dropdown renders (#781) - #951

Merged
Slach merged 4 commits into
masterfrom
fix/781-complex-variable-values
Nov 9, 2026
Merged

fix: label array/object variable options as JSON so the dropdown renders (#781)#951
Slach merged 4 commits into
masterfrom
fix/781-complex-variable-values

Conversation

@lunaticusgreen

@lunaticusgreen lunaticusgreen commented Oct 25, 2026

Copy link
Copy Markdown
Collaborator

fix #781

Roman M
fix: label array/object variable options as JSON so the dropdown rend…
5181ed1 
…ers (#781)

Variable queries returning an Array/Map/Tuple column (e.g. array_var in
the clickhouse dashboard, SELECT DISTINCT [service_name, ' test array'])
pushed the raw JS arrays as option text. The virtualized Select menu in
@grafana/ui treats an option whose children are an array as an option
group (SelectMenu.mjs: child.props.children.at(-1).props), so opening the
variable dropdown crashed with "props.children.at(...).props is
undefined".

When a column holds arrays or objects, emit a text field with their JSON
form for the label and a value field with the raw values. Grafana's
QueryVariable reads text and value independently, so the selected value
is still the array and keeps interpolating as a ClickHouse array literal
(`[service_name, ' test array'] IN (${array_var})` works as before).
Variables with scalar columns produce exactly the same frames as before.
@Slach Slach added this to the 3.6.0 milestone Oct 26, 2026
Slach
Slach requested changes Nov 3, 2026
View reviewed changes

@Slach Slach left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

still have error
steps to reproduce

gh pr checkout 951
docker compose down
docker compose pull
docker volume rm clickhouse-grafana_node_modules
docker compose run --rm frontend_builder
docker compose run --rm backend_builder
docker compose run --rm plugin_signer
docker compose up -d grafana

open
http://localhost:3000/d/DnOcQSGGz/clickhouse-dashboard?orgId=1&from=now-6h&to=now&timezone=browser&var-array_var=$__all&var-remote_host=localhost:9000&var-cluster_name=default&var-repeated_service=postgresql&var-repeated_service=mysql&var-adhoc=default.test_grafana.service_name%7C%3D~%7C%25sql%25

press "array_var"

Image

got the same error

Image 
An unexpected error happened
Details
TypeError: Cannot read properties of undefined (reading 'innerProps')

    at v (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:6:195569)
    at W (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:689211)
    at div (<anonymous>)
    at http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:12857
    at Menu (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:734362)
    at B (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:723083)
    at div (<anonymous>)
    at http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:12857
    at MenuPortal (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:734683)
    at div (<anonymous>)
    at http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:12857
    at SelectContainer (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:737692)
    at j (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:6:186002)
    at p (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:696231)
    at http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:680620
    at U (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:6:188310)
    at K (<anonymous>)
    at w (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:298873)
    at E (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:300909)
    at Q.Component (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:364648)
    at http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:128496
    at div (<anonymous>)
    at m (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:504447)
    at H (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:478018)
    at G (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:477627)
    at div (<anonymous>)
    at e3 (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:311949)
    at http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:128496
    at div (<anonymous>)
    at tc (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:347712)
    at s (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:503662)
    at div (<anonymous>)
    at tL (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:355691)
    at tN (<anonymous>)
    at div (<anonymous>)
    at V (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:29:92202)
    at t2 (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:365461)
    at http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:128496
    at i (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:1:200308)
    at eC (http://localhost:3000/public/build/97417.253edfc081798061.js:1:16718)
    at default (<anonymous>)
    at Suspense (<anonymous>)
    at Suspense (<anonymous>)
    at d (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:6:91610)
    at ra (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:202418)
    at rr (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:203387)
    at L (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:654484)
    at ea (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:660339)
    at div (<anonymous>)
    at http://localhost:3000/public/build/18631.e012edea7c7c9657.js:6:134073
    at main (<anonymous>)
    at div (<anonymous>)
    at div (<anonymous>)
    at div (<anonymous>)
    at op (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:307555)
    at oD (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:317164)
    at oR (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:318236)
    at u (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:66:98141)
    at L (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:654484)
    at ea (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:660339)
    at eo (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:659707)
    at ef (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:647966)
    at _K (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:1:766779)
    at t (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:667764)
    at oA (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:318503)
    at div (<anonymous>)
    at o (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:90:24326)
    at AT (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:29:52606)
    at k (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:29:47764)
    at AZ (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:9666)
    at E (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:100492)
    at t.KBarProvider (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:235940)
    at f (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:91:87358)
    at a (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:91:89122)
    at N (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:55:90090)
    at C (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:31:1018489)
    at d (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:6:91610)
    at http://localhost:3000/public/build/18631.e012edea7c7c9657.js:6:92266
    at Y (http://localhost:3000/public/build/69375.1a6742753d23de1d.js:95:459)
    at oL (http://localhost:3000/public/build/18631.e012edea7c7c9657.js:70:318994)

@Slach

Slach commented Nov 9, 2026

Copy link
Copy Markdown
Collaborator

don't reproduce after cache clear let's merge it

@Slach
Slach merged commit 3123ae2 into master Nov 9, 2026
45 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@Slach Slach Slach requested changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

3.6.0

Development

Successfully merging this pull request may close these issues.

Array template variables shall show proper error messages instead of stacktrace

2 participants

@lunaticusgreen @Slach