Custom Datasource with QueryVariable

[suikast42]

I am playing with scenes. It works so far so good. But I have a lttle issue with gathering Query Variables from my custom datasource.

I see in the sourcecode the place

I am using the scafolded datasource.

import {
    DataSourceInstanceSettings,
    CoreApp,
    ScopedVars, DataQueryRequest, DataQueryResponse, LiveChannelScope, CustomVariableSupport,

} from '@grafana/data';
import {DataSourceWithBackend, getGrafanaLiveSrv, getTemplateSrv} from '@grafana/runtime';

import {BiQuery, BiDataSourceOptions, DEFAULT_QUERY} from './types';
import {merge, Observable} from "rxjs";


export class DataSource extends DataSourceWithBackend<BiQuery, BiDataSourceOptions> {
    constructor(instanceSettings: DataSourceInstanceSettings<BiDataSourceOptions>) {
        super(instanceSettings);
        // Important to specify a unique pluginId and uid for your data source that is unlikely to confict with any other scene app plugin.
    }


    getDefaultQuery(_: CoreApp): Partial<BiQuery> {
        return DEFAULT_QUERY;
    }

    applyTemplateVariables(query: BiQuery, scopedVars: ScopedVars) {
        return {
            ...query,
            service: getTemplateSrv().replace(`${query.service}`, scopedVars),
            path: getTemplateSrv().replace(`${query.path}}`, scopedVars),
            pathFilter: getTemplateSrv().replace(`${query.pathFilter}`, scopedVars),
        };
    }

    filterQuery(query: BiQuery): boolean {
        // return !!query.pathFilter;
        // return false for preventing query from execution
        return !!query.service && !!query.path
    }

    query(request: DataQueryRequest<BiQuery>): Observable<DataQueryResponse> {
        if (request.liveStreaming) {
            const observables = request.targets.map((query, index) => {
                console.log(`liveStreaming request: ${query.service}/${query.path}`)
                return getGrafanaLiveSrv().getDataStream({
                    addr: {
                        scope: LiveChannelScope.DataSource,
                        namespace: this.uid,
                        path: `${query.service}/${query.path}`,
                        data: {
                            ...query,
                        },
                    },
                });
            });
            return merge(...observables);
        } else {
            const observables = request.targets.map((query, index) => {
                // console.log(`Query request: ${query.service}/${query.path}`)
                return super.query(request);
            });
            return merge(...observables);
        }
        // return super.query(request);
    }
}

[torkelo]

did you register it with sceneUtils.registerRuntimeDataSource ?

[torkelo]

or is it a separate plugin you have installed in Grafana?

[suikast42]

It's a seperate plugin

[suikast42]

I create a dastasource with backend with

npx @grafana/create-plugin@latest 

After run from the scratch I have the same sitiuation. The query ediyot works fine but can't use the DS in variable query.

[torkelo]

you might need to set

this.variables to a StandardVariableSupport in your data source constructor

[suikast42]

Oh perfect. That does the work realy. Thanks a lot.

Have only two questions for fulfil the here.

1. Have extended a class

export class BiStandardVariableSupport extends StandardVariableSupport<DataSource, BiQuery, BiDataSourceOptions> {

    toDataQuery(query: StandardVariableQuery): BiQuery {
        const biQueryInstance: BiQuery = {
    // How to get my query parameters here ?? the         query.query contains the whole query
        };
        return biQueryInstance
    }
}

2. How can Implent q variable query editor or use the standard query editor ?

[suikast42]

The last push points to the problem.

The datasource.ts line 18 - 20 have three VariableSupport classes. You can change between them and maybe can tell me where is my config leaking. Thanks a lot @torkelo .

[torkelo]

@suikast42 config leaking?

[suikast42]

@suikast42 config leaking?

can't find it