[BUG] Query Details page crash when refreshing

[ansjcy]

What is the bug?

On query details page, a simply refresh will make it crash.

How can one reproduce the bug?

• Enable top queries by latency on the UI
• Make search requests to the cluster
• When top queries pops up on the UI, click one of the queries and enter the details page
• Do a refresh, the page will crash with the below error

QueryDetails.tsx:34 Uncaught TypeError: Cannot read properties of undefined (reading 'timestamp')
    at QueryDetails (QueryDetails.tsx:34:1)
    at renderWithHooks (react-dom.development.js:14803:1)
    at mountIndeterminateComponent (react-dom.development.js:17482:1)
    at beginWork (react-dom.development.js:18596:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:188:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:237:1)
    at invokeGuardedCallback (react-dom.development.js:292:1)
    at beginWork$1 (react-dom.development.js:23203:1)
    at performUnitOfWork (react-dom.development.js:22157:1)
    at workLoopSync (react-dom.development.js:22130:1)

What is the expected behavior?

The page should not crash with Query details correctly displayed.

What is your host/environment?

macos

Do you have any screenshots?

[ansjcy]

This looks like a bug in navigation. Need to pick this up for 2.18.

[kkhatua]

@ansjcy The cause is not clear. Is this due to the browser referring to an "updated" timestamp for retrieving the query details instead of the original timestamp when the page was first loaded?

[ansjcy]

@kkhatua the cause is we fetch all the top queries from backend when we load the overview page, and when we navigate to detailed page from overview page we can pass the selected record details from overview. However the same query that is passed to the detail page won't be available after refreshing. We can fix this bug by either adding the query to session storage or introducing an UUID field and support getting records by UUID.

Considering the point made by @derek-ho in this thread: #21 (review), I would recommend adding an UUID field in the backend record.