upstream/grafana
1
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-12-18 22:16:21 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 116

Dashboards: Add missing keyboard shortcuts for new layouts (#115377)

Browse source 
* missing key bindings

* Collapse repeted panels
This commit is contained in:
Kristina Demeshchik 2025-12-16 09:34:10 -05:00 committed by GitHub
parent c6dda2dfc3
commit 321e60e69c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 90 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
e2e-playwright/dashboard-new-layouts/dashboard-keybindings.spec.ts Normal file
View file

@ -0,0 +1,59 @@
import { test, expect } from '@grafana/plugin-e2e';
test.use({
featureToggles: {
kubernetesDashboards: true,
dashboardNewLayouts: true,
},
});
test.describe('Dashboard keybindings with new layouts', { tag: ['@dashboards'] }, () => {
test.use({
viewport: { width: 1280, height: 1080 },
});
test('should collapse and expand all rows', async ({ gotoDashboardPage, page, selectors }) => {
const dashboardPage = await gotoDashboardPage({ uid: 'Repeating-rows-uid/repeating-rows' });
const panelContents = dashboardPage.getByGrafanaSelector(selectors.components.Panels.Panel.content);
await expect(panelContents).toHaveCount(5);
await expect(
dashboardPage.getByGrafanaSelector(selectors.components.Panels.Panel.title('server = A, pod = Bob'))
).toBeVisible();
await expect(
dashboardPage.getByGrafanaSelector(selectors.components.Panels.Panel.title('server = B, pod = Bob'))
).toBeVisible();
// Collapse all rows using keyboard shortcut: d + Shift+C
await page.keyboard.press('d');
await page.keyboard.press('Shift+C');
await expect(panelContents).toHaveCount(0);
await expect(page.getByText('server = A, pod = Bob')).toBeHidden();
await expect(page.getByText('server = B, pod = Bob')).toBeHidden();
// Expand all rows using keyboard shortcut: d + Shift+E
await page.keyboard.press('d');
await page.keyboard.press('Shift+E');
await expect(panelContents).toHaveCount(6);
await expect(page.getByText('server = A, pod = Bob')).toBeVisible();
await expect(page.getByText('server = B, pod = Bob')).toBeVisible();
});
test('should open panel inspect', async ({ gotoDashboardPage, page, selectors }) => {
const dashboardPage = await gotoDashboardPage({ uid: 'edediimbjhdz4b/a-tall-dashboard' });
// Find Panel #1 and press 'i' to open inspector
const panel1 = dashboardPage.getByGrafanaSelector(selectors.components.Panels.Panel.title('Panel #1'));
await expect(panel1).toBeVisible();
await panel1.press('i');
await expect(dashboardPage.getByGrafanaSelector(selectors.components.PanelInspector.Json.content)).toBeVisible();
// Press Escape to close inspector
await page.keyboard.press('Escape');
await expect(page.getByTestId(selectors.components.PanelInspector.Json.content)).toBeHidden();
});
});

5
public/app/features/dashboard-scene/scene/keyboardShortcuts.ts
View file

@ -18,6 +18,7 @@ import { getPanelIdForVizPanel } from '../utils/utils';
import { DashboardScene } from './DashboardScene';
import { onRemovePanel, toggleVizPanelLegend } from './PanelMenuBehavior';
import { DefaultGridLayoutManager } from './layout-default/DefaultGridLayoutManager';
import { RowsLayoutManager } from './layout-rows/RowsLayoutManager';
export function setupKeyboardShortcuts(scene: DashboardScene) {
const keybindings = new KeybindingSet();
@ -265,6 +266,8 @@ export function setupKeyboardShortcuts(scene: DashboardScene) {
onTrigger: () => {
if (scene.state.body instanceof DefaultGridLayoutManager) {
scene.state.body.collapseAllRows();
} else if (scene.state.body instanceof RowsLayoutManager) {
scene.state.body.collapseAllRows();
}
},
});
@ -275,6 +278,8 @@ export function setupKeyboardShortcuts(scene: DashboardScene) {
onTrigger: () => {
if (scene.state.body instanceof DefaultGridLayoutManager) {
scene.state.body.expandAllRows();
} else if (scene.state.body instanceof RowsLayoutManager) {
scene.state.body.expandAllRows();
}
},
});

26
public/app/features/dashboard-scene/scene/layout-rows/RowsLayoutManager.tsx
View file

@ -390,4 +390,30 @@ export class RowsLayoutManager extends SceneObjectBase<RowsLayoutManagerState> i
return duplicateTitles;
}
public collapseAllRows() {
this.state.rows.forEach((row) => {
if (!row.getCollapsedState()) {
row.setCollapsedState(true);
}
row.state.repeatedRows?.forEach((repeatedRow) => {
if (!repeatedRow.getCollapsedState()) {
repeatedRow.setCollapsedState(true);
}
});
});
}
public expandAllRows() {
this.state.rows.forEach((row) => {
if (row.getCollapsedState()) {
row.setCollapsedState(false);
}
row.state.repeatedRows?.forEach((repeatedRow) => {
if (repeatedRow.getCollapsedState()) {
repeatedRow.setCollapsedState(false);
}
});
});
}
}