grafana / grafana/google-bigquery-datasource
Feature Request: Add `defaultEditorMode` Configuration Option to BigQuery Datasource
- Dominant language
- TypeScript
- Stars
- 40
- Forks
- 24
- Avg merge
- 3d 21h
- Merged PRs (30d)
- 8
Description
## Summary
Allow users to configure the default query editor mode (Builder vs Code) at the datasource level via `jsonData` configuration. Currently, the plugin always defaults to Builder mode for new queries, but many users prefer working directly in SQL/Code mode.
## Problem Statement
When creating new queries in the BigQuery datasource, the query editor always opens in **Builder mode** by default. This is hardcoded in [`src/utils.ts` line 205](https://github.com/grafana/google-bigquery-datasource/blob/main/src/utils.ts#L205):
```typescript
let editorMode = q.editorMode || EditorMode.Builder;
```
For teams that primarily work with SQL and prefer the Code editor, this requires manually clicking the "Code" button on every new query. This becomes tedious when creating multiple panels or dashboards.
## Use Case
Our team is migrating 500+ dashboards from AWS Redshift to GCP BigQuery. All our dashboard developers are comfortable writing SQL directly and prefer the Code editor for:
1. **Direct SQL editing** - More control over query structure
2. **Copy/paste workflows** - Easy to adapt existing SQL queries
3. **Template variables** - Better visibility of variable interpolation
4. **Debugging** - See the actual SQL that will be executed
Having to switch from Builder → Code on every new panel slows down our workflow significantly.
## Proposed Solution
Add a `defaultEditorMode` option to the `BigQueryOptions` interface that can be configured via datasource provisioning:
### 1. Update `src/types.ts`
```typescript
export interface BigQueryOptions extends DataSourceOptions {
flatRateProject?: string;
processingLocation?: string;
queryPriority?: QueryPriority;
enableSecureSocksProxy?: boolean;
MaxBytesBilled?: number;
serviceEndpoint?: string;
oauthPassThru?: boolean;
defaultEditorMode?: 'code' | 'builder'; // <-- NEW OPTION
}
```
### 2. Update `src/utils.ts` - `applyQueryDefaults()` function
```typescript
export function applyQueryDefaults(q: BigQueryQueryNG, ds: BigQueryDatasource, apiClient?: BigQueryAPI) {
// Use datasource config default if available, otherwise Builder
const defaultMode = ds.jsonData.defaultEditorMode === 'code' ? EditorMode.Code : EditorMode.Builder;
let editorMode = q.editorMode || defaultMode; // <-- USE CONFIG DEFAULT
// Switching to code editor if the query was created before visual query builder was introduced.
if (q.editorMode === undefined && q.rawSql !== undefined) {
editorMode = EditorMode.Code;
}
const result = {
...q,
project: q.project || apiClient?.getDefaultProject() || '',
location: q.location ?? (ds.jsonData.processingLocation || ''),
format: q.format !== undefined ? q.format : QueryFormat.Table,
rawSql: q.rawSql || '',
editorMode,
sql: q.sql || {
columns: [createFunctionField()],
groupBy: [setGroupByField()],
limit: 50,
},
};
return result;
}
```
### 3. Update `src/components/ConfigEditor.tsx` (optional)
Add a UI field in the "Additional Settings" section:
```typescript
onOptionsChange({
...options,
jsonData: {
...jsonData,
defaultEditorMode: value
}
})}
/>
```
### 4. Datasource Provisioning Example
```yaml
datasources:
- name: BigQuery
type: grafana-bigquery-datasource
access: proxy
isDefault: true
jsonData:
authenticationType: gce
defaultProject: my-gcp-project
defaultEditorMode: code # <-- NEW OPTION
```
Or via Terraform/Helm:
```hcl
jsonData:
authenticationType: gce
defaultProject: ${var.bigquery_default_project}
defaultEditorMode: code # <-- NEW OPTION
```
## Benefits
1. **Improved Developer Experience** - Users can choose their preferred starting mode
2. **Backward Compatible** - Defaults to `builder` if not specified (current behavior)
3. **Per-Datasource Configuration** - Different teams/environments can have different defaults
4. **Infrastructure as Code** - Can be set via Terraform/provisioning (no manual clicks)
5. **Respects Per-Query Overrides** - Users can still manually switch modes per query
## Alternatives Considered
1. **Global Grafana Setting** - Would affect all datasources, less flexible
2. **Per-Organization Default** - More complex to implement, not datasource-specific
3. **User Preference** - Would require authentication and user-level settings
4. **Do Nothing** - Users continue clicking "Code" button manually (current state)
## Additional Context
- **Similar Features**: Other SQL datasources (PostgreSQL, MySQL, MSSQL) have similar builder/code interfaces but also default to a specific mode
- **Team Size Impact**: For teams with 10+ developers creating 100+ dashboards, this saves significant time
- **Migration Workflows**: Especially helpful during migrations where teams import/convert many queries
---
**Environment:**
- BigQuery Plugin Version: 3.1.5
- Grafana Version: 10.4.0
- Deployment: Kubernetes/GKE with Helm provisioning
Contributor guide
Research direction
Start with src/types.ts and src/utils.ts, especially applyQueryDefaults() and the existing EditorMode handling. Then inspect src/components/ConfigEditor.tsx to determine whether the datasource setting should be exposed in the UI. Done means provisioning can set defaultEditorMode, new queries use that default while existing query and rawSql behavior remains intact, and the default stays Builder when unset.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- google-cloud, typescript
- Domain
- databases
- Issue type
- Feature
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 72/100