Skip to content

chore: create new plugin info menu#1985

Open
joey-grafana wants to merge 3 commits into
mainfrom
joey/plugin-info-menu
Open

chore: create new plugin info menu#1985
joey-grafana wants to merge 3 commits into
mainfrom
joey/plugin-info-menu

Conversation

@joey-grafana

Copy link
Copy Markdown
Contributor

✨ Description

Related issue(s): grafana/profiles-drilldown#973

Create new hew plugin info menu to better align with other Drilldown apps.

🧪 How to test?

Before
Screenshot 2026-07-03 at 09 16 38

After
Screenshot 2026-07-03 at 09 16 12

@joey-grafana joey-grafana requested a review from a team July 3, 2026 08:18
@joey-grafana joey-grafana self-assigned this Jul 3, 2026
Copilot AI review requested due to automatic review settings July 3, 2026 08:19

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR introduces a new “Plugin info” dropdown in the header to align Logs Drilldown’s UI with other Drilldown apps, replacing the previous standalone “Give feedback” link and adding supporting navigation/test/analytics plumbing.

Changes:

  • Added a new header toolbar container and “Plugin info” dropdown menu (docs/feedback/config links + build metadata).
  • Reworked header control rendering to group toolbar controls and the new info button together; removed the old GiveFeedbackButton.
  • Updated analytics events, test IDs, and i18n strings; adjusted build/tooling deps (webpack override + webpack-merge).

Reviewed changes

Copilot reviewed 31 out of 33 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
src/services/testIds.ts Added test IDs for the new header toolbar + info button.
src/services/plugin.ts Added helper to generate plugin configuration page location.
src/services/analytics.ts Added analytics action keys for new menu interactions.
src/locales/en-US/grafana-lokiexplore-app.json Removed old “give feedback button” strings; added new plugin-info strings.
src/locales/cs-CZ/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/de-DE/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/es-ES/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/fr-FR/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/hu-HU/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/id-ID/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/it-IT/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/ja-JP/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/ko-KR/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/nl-NL/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/pl-PL/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/pt-BR/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/pt-PT/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/ru-RU/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/sv-SE/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/tr-TR/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/zh-Hans/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/locales/zh-Hant/grafana-lokiexplore-app.json Removed unused “give feedback button” i18n stub.
src/Components/IndexScene/VariableLayoutScene.tsx Moved toolbar rendering into a new grouped header toolbar; removed feedback button placement.
src/Components/IndexScene/ToolbarScene.tsx Simplified dropdown open-state handling; tightened rendering condition for the menu.
src/Components/IndexScene/IndexScene.tsx Removed now-unused isOpen state initialization for ToolbarScene.
src/Components/IndexScene/GiveFeedbackButton.tsx Removed old feedback link component.
src/Components/App/header/PluginInfo.tsx Added the new dropdown menu and associated click handlers/analytics/navigation.
src/Components/App/header/PluginHeaderToolbar.tsx Added a styled toolbar wrapper used by the new header layout.
src/Components/App/header/LokiLogo.tsx Added small Loki logo component used in the menu header.
pnpm-workspace.yaml Added pnpm override for webpack version.
package.json Added webpack-merge dependency.
.gitignore Ignored .pnpm-store/.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/Components/IndexScene/VariableLayoutScene.tsx Outdated
Comment thread src/Components/App/header/PluginHeaderToolbar.tsx Outdated
Comment thread package.json
"webpack-bundle-analyzer": "4.10.2",
"webpack-cli": "6.0.1",
"webpack-livereload-plugin": "3.0.2",
"webpack-merge": "6.0.1",

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need webpack-merge I don't see it used in this PR?

await restoredLine.scrollIntoViewIfNeeded();
await expect(restoredLine).toBeInViewport();
await expect(restoredLine).toHaveAttribute('data-scrolled', 'true', { timeout: 30_000 });
await expect(restoredLine).toBeVisible();

@L2D2Grafana L2D2Grafana Jul 7, 2026

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah yes this does seem to be failing on main or flaky. This fix works, but think we can remove the timeout, since there is already a global timeout.

subTitle: css`
color: ${theme.colors.text.secondary};
font-size: ${theme.typography.bodySmall.fontSize};
`,

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We've been using Object syntax for css

css({
  color: theme.colors.text.secondary,
  ...(disabled && { opacity: 0.5 }),
});

@@ -0,0 +1,26 @@
import React from 'react';

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm fine with this just being Header instead of App/header

})}
<PluginInfo variant="canvas" />
</PluginHeaderToolbar>
)}

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Logs also shows a gear icon for exploreLogsAggregatedMetrics. I think they look pretty good together Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants