This is an automated email from the ASF dual-hosted git repository.
michaelsmolina pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 935bbe6061d docs: Updates extensions docs (#37704)
935bbe6061d is described below
commit 935bbe6061d510996391f43baebd540a7a107ae5
Author: Michael S. Molina <[email protected]>
AuthorDate: Fri Feb 6 13:18:25 2026 -0300
docs: Updates extensions docs (#37704)
---
docs/developer_portal/extensions/development.md | 16 ++---
.../extensions/extension-points/sqllab.md | 82 ++++++++++++----------
2 files changed, 53 insertions(+), 45 deletions(-)
diff --git a/docs/developer_portal/extensions/development.md
b/docs/developer_portal/extensions/development.md
index 5c4abf7a5f1..e26c9b00e51 100644
--- a/docs/developer_portal/extensions/development.md
+++ b/docs/developer_portal/extensions/development.md
@@ -134,9 +134,9 @@ export const onDidChangeActivePanel: Event<Panel>;
export const onDidChangeTabTitle: Event<string>;
-export const onDidQueryRun: Event<Editor>;
+export const onDidQueryRun: Event<QueryContext>;
-export const onDidQueryStop: Event<Editor>;
+export const onDidQueryStop: Event<QueryContext>;
```
The following code demonstrates more examples of the existing frontend APIs:
@@ -150,16 +150,16 @@ export function activate(context) {
const panelDisposable = core.registerView('my_extension.panel',
<MyPanel><Button/></MyPanel>);
// Register a custom command
- const commandDisposable =
commands.registerCommand('my_extension.copy_query', {
- title: 'Copy Query',
- execute: () => {
+ const commandDisposable = commands.registerCommand(
+ 'my_extension.copy_query',
+ () => {
// Command logic here
},
- });
+ );
// Listen for query run events in SQL Lab
- const eventDisposable = sqlLab.onDidQueryRun(editor => {
- // Handle query execution event
+ const eventDisposable = sqlLab.onDidQueryRun(queryContext => {
+ console.log('Query started on database:', queryContext.tab.databaseId);
});
// Access a CSRF token for secure API requests
diff --git a/docs/developer_portal/extensions/extension-points/sqllab.md
b/docs/developer_portal/extensions/extension-points/sqllab.md
index 95108bbc024..11c9fac33b0 100644
--- a/docs/developer_portal/extensions/extension-points/sqllab.md
+++ b/docs/developer_portal/extensions/extension-points/sqllab.md
@@ -24,7 +24,7 @@ under the License.
# SQL Lab Extension Points
-SQL Lab provides 5 extension points where extensions can contribute custom UI
components. Each area serves a specific purpose and can be customized to add
new functionality.
+SQL Lab provides 4 extension points where extensions can contribute custom UI
components. Each area serves a specific purpose and supports different types of
customizations. These areas will evolve over time as new features are added to
SQL Lab.
## Layout Overview
@@ -41,42 +41,44 @@ SQL Lab provides 5 extension points where extensions can
contribute custom UI co
│ │ │ │
│ │ │ │
│ │ │ │
-├──────────┴─────────────────────────────────────────┴─────────────┤
-│ Status Bar │
-└──────────────────────────────────────────────────────────────────┘
+└──────────┴─────────────────────────────────────────┴─────────────┘
```
-| Extension Point | ID | Description
|
-| ----------------- | --------------------- |
---------------------------------------------------------- |
-| **Left Sidebar** | `sqllab.leftSidebar` | Navigation and browsing
(database explorer, saved queries) |
-| **Editor** | `sqllab.editor` | SQL query editor workspace
|
-| **Right Sidebar** | `sqllab.rightSidebar` | Contextual tools (AI assistants,
query analysis) |
-| **Panels** | `sqllab.panels` | Results and related views
(visualizations, data profiling) |
-| **Status Bar** | `sqllab.statusBar` | Connection status and query
metrics |
+| Extension Point | ID | Views | Menus | Description
|
+| ----------------- | --------------------- | ----- | ----- |
---------------------------------------------- |
+| **Left Sidebar** | `sqllab.leftSidebar` | — | ✓ | Menu actions for
the database explorer |
+| **Editor** | `sqllab.editor` | ✓\* | ✓ | Custom editors +
toolbar actions |
+| **Right Sidebar** | `sqllab.rightSidebar` | ✓ | — | Custom panels
(AI assistants, query analysis) |
+| **Panels** | `sqllab.panels` | ✓ | ✓ | Custom tabs +
toolbar actions (data profiling) |
-## Area Customizations
+\*Editor views are contributed via [Editor Contributions](./editors), not
standard view contributions.
-Each extension point area supports three types of action customizations:
+## Customization Types
+
+### Views
+
+Extensions can add custom views (React components) to **Right Sidebar** and
**Panels**. Views appear as new panels or tabs in their respective areas.
+
+### Menus
+
+Extensions can add toolbar actions to **Left Sidebar**, **Editor**, and
**Panels**. Menu contributions support:
```
┌───────────────────────────────────────────────────────────────┐
-│ Area Title [Button] [Button] [•••] │
+│ [Button] [Button] [•••] │
├───────────────────────────────────────────────────────────────┤
-│ │
-│ │
│ Area Content │
-│ │
-│ (right-click for context menu) │
-│ │
-│ │
└───────────────────────────────────────────────────────────────┘
```
-| Action Type | Location | Use Case
|
-| --------------------- | ----------------- |
----------------------------------------------------- |
-| **Primary Actions** | Top-right buttons | Frequently used actions (e.g.,
run, refresh, add new) |
-| **Secondary Actions** | 3-dot menu (•••) | Less common actions (e.g.,
export, settings) |
-| **Context Actions** | Right-click menu | Context-sensitive actions on
content |
+| Action Type | Location | Use Case
|
+| --------------------- | ---------------- |
----------------------------------------------------- |
+| **Primary Actions** | Toolbar buttons | Frequently used actions (e.g.,
run, refresh, add new) |
+| **Secondary Actions** | 3-dot menu (•••) | Less common actions (e.g.,
export, settings) |
+
+### Custom Editors
+
+Extensions can replace the default SQL editor with custom implementations
(Monaco, CodeMirror, etc.). See [Editor Contributions](./editors) for details.
## Examples
@@ -171,32 +173,38 @@ import { commands, sqlLab } from '@apache-superset/core';
export function activate(context) {
// Register the commands declared in extension.json
- const formatCommand = commands.registerCommand('query_tools.format', {
- execute: () => {
+ const formatCommand = commands.registerCommand(
+ 'query_tools.format',
+ async () => {
const tab = sqlLab.getCurrentTab();
- if (tab?.editor) {
+ if (tab) {
+ const editor = await tab.getEditor();
// Format the SQL query
}
},
- });
+ );
- const explainCommand = commands.registerCommand('query_tools.explain', {
- execute: () => {
+ const explainCommand = commands.registerCommand(
+ 'query_tools.explain',
+ async () => {
const tab = sqlLab.getCurrentTab();
- if (tab?.editor) {
+ if (tab) {
+ const editor = await tab.getEditor();
// Show query explanation
}
},
- });
+ );
- const copyAsCteCommand = commands.registerCommand('query_tools.copy_as_cte',
{
- execute: () => {
+ const copyAsCteCommand = commands.registerCommand(
+ 'query_tools.copy_as_cte',
+ async () => {
const tab = sqlLab.getCurrentTab();
- if (tab?.editor) {
+ if (tab) {
+ const editor = await tab.getEditor();
// Copy selected text as CTE
}
},
- });
+ );
context.subscriptions.push(formatCommand, explainCommand, copyAsCteCommand);
}
