use controls offered by the user interface to select your query time frame in DQL

Lejil — Tue, 23 Sep 2025 15:32:19 GMT

How can I use controls offered by the user interface to select your query time frame in DQL .

I want to change this DQL fetch logs ,from:now() - 5d to use query timeframe from user interface

Re: use controls offered by the user interface to select your query time frame in DQL

dani_coll — Tue, 23 Sep 2025 16:27:15 GMT

Hi Lejil,
It's possible to do that by using the onChange callback from the TimeframeSelector component to dynamically modify your DQL query string.

Another solution, which in my opinion is simpler because you don't need to modify the DQL query, is to set the defaultTimeframeStart and defaultTimeframeEnd attributes on your useDql hook instead of modifying the DQL query.

Here's a full snippet of the solution

import { useDql } from "@dynatrace-sdk/react-hooks"; import { TimeframeSelector } from "@dynatrace/strato-components-preview/forms"; import { TimeframeV2 } from "@dynatrace/strato-components-preview/core"; import { useState } from "react"; import React from "react"; export const App = () => { const [timeframe, setTimeframe] = useState<TimeframeV2>({ from: { absoluteDate: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000).toISOString(), value: 'now()-5d', type: 'expression', }, to: { absoluteDate: new Date().toISOString(), value: 'now()', type: 'expression', }, }); const logsResult = useDql({ query: 'fetch logs', defaultTimeframeStart: timeframe.from.absoluteDate, defaultTimeframeEnd: timeframe.to.absoluteDate, }) return ( <> <TimeframeSelector value={timeframe} onChange={(tf) => {if(tf) setTimeframe(tf)}} precision="seconds" /> </>) }

topic use controls offered by the user interface to select your query time frame in DQL in Developer Q&A Forum

use controls offered by the user interface to select your query time frame in DQL

Re: use controls offered by the user interface to select your query time frame in DQL