UI: queries become uneditable after cut/paste

[siavashs]

Thanos, Prometheus and Golang version used: Docker image with tag v0.38.0

Object Storage Provider: N/A

What happened: queries become readonly in the UI after cut/paste with errors in console

Screen recording https://github.com/user-attachments/assets/6a863802-d18c-4576-9372-6ac18de7cd2f

What you expected to happen: cut/pasted queries must still be editable

How to reproduce it (as minimally and precisely as possible):

1. docker run -it --rm -p 10902:10902 thanosio/thanos:v0.38.0 query
2. open http://localhost:10902/
3. exec query true == true
4. cut == true
5. add a new panel and paste the cut portion of the query
6. try to edit the pasted query to remove ==

Full logs to relevant components:

Logs

RangeError: Position 65536 is out of range for changeset of length 8
    mapPos index.js:801
    map index.js:3099
    map index.js:3234
    update index.js:88
    update index.js:1795
    applyTransaction index.js:2627
    Td index.js:2031
    Gd index.js:2564
    applyTransaction index.js:2627
    get state index.js:2278
    update index.js:6098
    _dispatch index.js:6015
    dispatch index.js:6079
    yw index.js:1003
    ww index.js:1019
    xw index.js:1041
    u index.js:7003
    gb index.js:7012
    keydown index.js:6913
    runCustomHandlers index.js:3376
    Ym index.js:3320
    Ym index.js:3313
    ib index.js:6029
    zT ExpressionInput.tsx:179
    React 2
    unstable_runWithPriority scheduler.production.min.js:19
    React 4
    unstable_runWithPriority scheduler.production.min.js:19
    React 20
    <anonymous> index.tsx:28
    <anonymous> index.tsx:28
    <anonymous> index.tsx:28
index.js:1745:16

Anything else we need to know:

[dosubot]

Hello @siavashs! I'm here to help you with any bugs or questions you might have while you wait for a human maintainer. If you need assistance or want to become a contributor, just let me know!

The issue you're encountering seems to be related to a RangeError that occurs when handling cut and paste operations in the Thanos query UI. This error is specifically related to the mapPos and applyTransaction functions in the index.js file, which are part of the query UI's internal mechanisms for managing text input and state updates.

The error message "Position 65536 is out of range for changeset of length 8" suggests that there is an inconsistency in how the positions are being mapped or updated during the cut and paste operations. This could be due to a bug in the logic that handles these operations, causing the query to become uneditable.

To address this issue, you might want to investigate the following:

1. Check for Updates: Ensure that you are using the latest version of Thanos, as this issue might have been addressed in a newer release.

2. Review the Code: Look into the mapPos and applyTransaction functions in the index.js file to understand how they handle position mapping and transaction application. There might be a need to adjust the logic to correctly handle the changeset length and position mapping.

3. Error Handling: Consider adding additional error handling or logging around these functions to capture more detailed information about the state when the error occurs. This can help in diagnosing the root cause.

Unfortunately, without direct access to the specific code in question, these are general suggestions. If the issue persists, further investigation into the codebase or reaching out to the maintainers for a potential fix might be necessary.

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Bug Report | Other}