Accessibility: Duplicated query editors fields IDs

Quite a bunch of query editor rely on the query `refId` to generate html ids for input and labels. While this works ok in dashboards, it doesn't necessarily work in Explore or in general in places where multiple set of queries may be shown at the same time as `refId` is only guaranteed to be unique withing a single `QueryRows`. we should stop relying on `refId` and most likely migrate to `useId` fro, `react`. How to easily reproduce this: Open explore in split mode, using the same datasource in both panes (make also sure the editors are in the same state if they have dynamic elements and the queries have the same refId). clicking on a field label in the right pane should focus the expected element in the same pane. If it focuses the same element on the left pane then the editor should be fixed. ```[tasklist] ### Tasks - [ ] Prometheus: Metric field in builder mode does not have a unique id (other fields are completely unlabelled) - [ ] https://github.com/grafana/grafana/issues/73815 - [ ] Tempo: when query type is search, every label click in the right pane focuses fields in the left pane - [ ] TestData: in almost every scenario, elements in the left and right panes have the same ids - [ ] CloudWach: In builder mode, `statistics` fields have the same IDs - [ ] https://github.com/grafana/grafana/issues/73816 - [ ] Jeaeger: when query type is search, fields in the right pane have the same ids as fields in the right pane - [ ] https://github.com/grafana/grafana/issues/74086 ```