66 Commits

Author SHA1 Message Date
119d5897ea i18n: imports use @grafana/i18n (#105177)
* i18n: everything should target @grafana/i18n

* wip

* chore: updates after PR feedback

* Trigger build

* Trigger build

* Trigger build

* chore: skip flaky tests

* chore: skip flaky tests

* chore: skip flaky tests

* chore: skip flaky tests

* chore: skip flaky tests

* chore: skip flaky tests

* chore: revert all flaky tests

* chore: some incorrect usages of useTranslate
2025-05-15 09:17:14 +02:00
3732ec74e7 Scopes: Highlight current active item/dashboard (#104403)
* Highlight current active item

* Add error boundary for scopes selector

* Expand containing folder of active item

* Add tests
2025-04-30 12:25:12 +02:00
c4a0eb396b Extension Sidebar: Make sidebar's width resizeable (#103526)
* Extension Sidebar: Make sidebar's width resizeable

* Extension Sidebar: Fix css

* Extension Sidebar: Remove `!important`

* Extension Sidebar: Add new drag handle classes without drag-pill

* Extension Sidebar: Use `top`/`bottom` and move scrollbar
2025-04-10 13:46:13 +02:00
24474dcb9c AppChrome: Improved responsive use of vertical space (#103488)
* Progress

* Progress

* Update

* Update

* Update

* Update

* Responsive improvements

* Update

* Update

* Update

* Revert height change

* Update

* add missing testid

* update

* Fixes

* update

* Refactoring

* fix bug in app chrome service

* Fixed e2e tests

* fix

* fix

* Update

* Update

* fix bookmarks e2e

* Update

* improve responsiveness on small screens for breadcrumbs

* Always use two levels when menu is docked

* Adding kiosk toggle button to dashboards only

* update

* Update

* Update

* when menu is docked and no actions use 1 level

* removed formatting change that caused unnessary diff in PR

* remove extra separator line after merge with main

* Fix double separators

* Update

* remove temp change

* Update
2025-04-09 14:51:22 +02:00
b9bc069fb9 AppChrome/MegaMenu: Fixes issue with default state being initialised to undocked (#103507)
* AppChrome/MegaMenu: Fixes default mega menu docked state

* AppChrome/MegaMenu: Fixes default mega menu docked state

* Update thresholds

* Update

* pa11y fix

* remove unnessary css

* fixed pa11y config

* try fix pa11y config + unit tests

* just increase thresholds again...

---------

Co-authored-by: Ashley Harrison <ashley.harrison@grafana.com>
2025-04-07 16:00:05 +01:00
f277902682 Sidebar: Create a sidebar that can render an extension (#102626)
* Extension Sidebar: Add missing `web-section` icon

* Extension Sidebar: Add core extension sidebar components

* Extension Sidebar: Integrate extension sidebar into Grafana

* Extension Sidebar: Change extension point to alpha

* Extension Sidebar: Fix saved state of docked extensions

* Extension Sidebar: Delete from local storage if undocked

* Extension Sidebar: Move main scrollbar from body to pane

* Extension Sidebar: Expose `ExtensionInfo`

* Extension Sidebar: Move `useComponents` into ExtensionSidebar

* Extension Sidebar: Store selection in `localStorage`

* Extension Sidebar: Simplify return of extension point meta

* Extension Sidebar: Ensure `body` is scrollable when sidebar is closed

* Extension Sidebar: Add missing `GlobalStyles` change

* Extension Sidebar: Don't render `ExtensionSidebar` unless it should be open

* Extension Sidebar: Better toggle handling

* Extension Sidebar: Fix wrong header height

* Extension Sidebar: Change `getExtensionPointPluginMeta` to use `addedComponents` and add documentation

* Extension Sidebar: Add tests for `getExtensionPointPluginMeta`

* Extension Sidebar: Add tests for `ExtensionSidebarProvider`

* Extension Sidebar: Fix tests `ExtensionSidebarProvider`

* Extension Sidebar: Add tests `ExtensionToolbarItem`

* Extension Sidebar: Add `extensionSidebar` feature toggle

* Extension Sidebar: Put implementation behind `extensionSidebar` feature toggle

* update feature toggles

* fix lint

* Extension Sidebar: Only toggle if clicking the same button

* Extension Sidebar: Hide sidebar if chromeless

* Update feature toggles doc

* Sidebar: Add `isEnabled` to ExtensionSidebarProvider

* Extension Sidebar: Use conditional CSS classes

* Extension Sidebar: Move header height to GrafanaContext

* Sidebar: Adapt to feature toggle change

* Sidebar: Remove unused import

* Sidebar: Keep featuretoggles in ExtensionSidebar tests

* ProviderConfig: Keep `config` import in tests

* FeatureToggles: adapt to docs review

* fix typo
2025-04-03 12:16:35 +02:00
312d80e0e1 Scopes: Refactor scopes to plain React and move it to runtime (#97176)
* Scopes: Refactor scopes

* Scopes: Refactor scopes

* Scopes: Refactor scopes

* Revert data changes

* Refactorings

* Refactorings

* Refactorings

* Remove unused

* Refactorings

* Refactors

* Fixes

* Update scenes

* Rebase

* Update .betterer.results

* Fix tests

* Move scopes selector to appchrome

* More fixes

* Fix tests

* Remove ScopesFacade

* use latest canary scenes version to pass tests

* Make fields private

* Update scenes version

---------

Co-authored-by: Tobias Skarhed <tobias.skarhed@gmail.com>
Co-authored-by: Victor Marin <victor.marin@grafana.com>
Co-authored-by: Andrej Ocenas <mr.ocenas@gmail.com>
2025-03-11 11:34:33 +01:00
687e207b48 SingleTopNav: Clean up and remove code + toggle (#97937)
* clean up almost all of the toggle

* betterer

* clean up searchBarHidden and extract translations

* fix remaining unit tests

* remove redundant topPosition
2024-12-17 13:32:38 +00:00
c2e1a405b9 Chore: Mark up some content for translations (#96716)
* translate some of core

* more

* translate admin

* fix count translations

* update unit tests
2024-11-21 12:59:14 +00:00
567a3803c5 SingleTopNav: Fix losing focus when moving between menu states (#95069)
* handle button focus between states

* fix focus when closing the overlay menu from the close button

* move into a separate hook

* properly feature toggle the hook

* use constants
2024-10-23 10:52:42 +01:00
4d08f44667 SingleTopNav: Revert to using AppChromeUpdate so banners are correct (#94540)
* revert to using AppChromeUpdate

* fix dashboard settings in old arch

* remove empty interface

* fix AlertRuleForm
2024-10-11 15:07:01 +01:00
4600bd2e77 Scopes: Open dashboard list when a scope is selected (#94464)
* Open dashboard list when a scope is selected

* refactor

* test

* remove localstorage key

* add checks on open/close methods

* remove redundant statement

* improve dashboards listing
2024-10-10 19:12:26 +03:00
d04dcb3da0 SingleTopNav: Fix tab order for docked menu (#94306)
fix tab order for docked menu when singleTopNav is enabled
2024-10-07 11:16:30 +01:00
95b998d77f SingleTopNav: MegaMenu full page height (#93729) 2024-09-25 17:56:47 +02:00
8e5459791b SingleTopNav: Initial changes (#93694)
initial changes for single top nav
2024-09-25 14:27:30 +03:00
a54308138f Navigation: Remove bodyScrolling toggle and make it default (#93652)
* remove bodyScrolling toggle and make it default

* fix e2e tests
2024-09-24 13:23:18 +01:00
5ce9324801 fix nav border when bodyscrolling with sticky variables (#92087)
* fix nav border when bodyscrolling with sticky variables

* better fix
2024-08-19 18:59:46 +03:00
2ac247be88 Navigation: Fix scope dashboards selector with bodyScrolling (#91892)
* almost working

* add hook to get scopesDashboardsScene state

* check whether it's enabled when considering opened state

* add height to container
2024-08-15 09:58:26 +01:00
3303900c09 Scopes: Lift scopes at global level (#90136) 2024-08-12 14:11:50 +03:00
7a9a34629b tidy up styles + fix docked menu overlaying popovers (#91380) 2024-08-01 13:16:45 +01:00
334657e1cb Navigation: Move scroll behaviour to body (#89921)
* initial attempt at body scrolling

* fix login layout

* minor fixes

* "fix" some fixed position stuff

* remember scroll position in dashboard page

* fix unit tests

* expose chrome header height in runtime and fix connections sticky header

* fix panel edit in scenes

* fix unit tests

* make useChromeHeaderHeight backwards compatible, fix plugin details double scrollbar

* fix sticky behaviour in explore metrics

* handle when undefined

* deprecate scrollRef/scrollTop

* fix extra overflow on firefox
2024-07-17 13:48:47 +01:00
47f8717149 React: Use new JSX transform (#88802)
* update eslint, tsconfig + esbuild to handle new jsx transform

* remove thing that breaks the new jsx transform

* remove react imports

* adjust grafana-icons build

* is this the correct syntax?

* try this

* well this was much easier than expected...

* change grafana-plugin-configs webpack config

* fixes

* fix lockfile

* fix 2 more violations

* use path.resolve instead of require.resolve

* remove react import

* fix react imports

* more fixes

* remove React import

* remove import React from docs

* remove another react import
2024-06-25 12:43:47 +01:00
c2dd44bc5a AppChrome: Add display flex to prevent multiple scrollbars (#88512) 2024-06-06 15:34:28 +01:00
6d98f53e8b Chore: Remove returnToPrevious feature toggle (#88332) 2024-05-27 17:47:57 +02:00
4fc4a1c4a8 Playlists: Fix kiosk mode not activating when starting a playlist (#84262)
* Playlists: Fix Kiosk mode not activating when starting a playlist

* oops remove debugger
2024-03-12 11:48:18 +00:00
940d20e115 Accessibility: Improve landmark markup (#83576)
* Landmark: main

* Landmark: add header

* Submenu: Move conditional display up

* NewsPanel: use h3 as the article label

* Use title for article id

* Update test showing a false positive

* DashboardPage: Expect submenu to not be shown
2024-03-11 11:43:22 +01:00
732f9cacb4 ReturnToPrevious: Add interaction reporting (#81948)
* Add analytics for return to previous

* fix typos lol
2024-02-08 15:44:22 +00:00
28e66b4ad8 Rendering: Adds PDF support behind feature toggle (#81811)
* start pdf refactor

* Update AppChrome.tsx

* Update AppChrome.tsx

* add encoding param to rendering grpc service

* fix plugin mode

* clean up

* fix backend tests

* fix lint errors

* Support pdf encoding in render http api

---------

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
2024-02-08 13:09:34 +01:00
28b336ac80 DockedMegaMenu: Clean up toggle and old code (#81878)
* remove toggle

* remove code not behind toggle

* remove old MegaMenu

* rename DockedMegaMenu -> MegaMenu and clean up go code

* fix backend test

* run yarn i18n:extract

* fix some unit tests

* fix remaining unit tests

* fix remaining e2e/unit tests
2024-02-06 13:43:11 +00:00
42cd4266b4 ReturnToPrevious: make href optional (#81691) 2024-02-02 13:14:58 +01:00
8ee7b1e00c ReturnToPrevious : Add logic to show the new component in AppChrome behind the new toggle (#81035) 2024-01-30 13:34:59 +01:00
083605c17f DockedMenu: only set the menu state to be docked if the window size is big enough (#80379)
* only set the menu docked in state if the window size is big enough

* adjust sizes

* remove top border on dockedMegaMenu

* another css tweak

* use xxl consistently

* CONSISTENTLY

* ok maybe not
2024-01-15 10:12:41 +00:00
2fd26e2773 AppChrome: Fixes topnav height (#80342)
* AppChrome: Fixes top padding

* better fix
2024-01-11 10:33:38 +01:00
bb4aa16b13 Navigation: Fix showing command palette when menu is docked (#79335)
* fix showing command palette when menu is docked

* separate out command palette
2023-12-11 18:54:56 +02:00
05dcc7a441 Navigation: Independent docked state (#78954)
* initial start

* more progress

* behaviour working?

* only use media query when docked local storage state is true

* close menu when undocking

* remove unneeded animation code and fix focus when toggling between docked/undocked

* better feature toggle handling (can go back and forth)

* remove restoreFocus (for now)
2023-12-11 11:41:14 +00:00
4247696402 DockedMegaMenu: Keep undock button (#78461)
* dock undock smoothly

* handle keyboard focus

* use ref instead of state

* run i18n:extract

* undo this change

* make dock/undock first button to focus

* only focus when going to docked, add comment

* minor tweaks
2023-11-22 15:56:36 +00:00
e8f0f6b7c8 Page: Remove Canvas background from primary background pages (#77008)
* Remove canvas background for primary background pages

* refactor styles
2023-11-01 12:58:18 +00:00
78df641b38 Navigation: Make page container automatically scroll when overflowing (#77489)
add overflow: auto to page container
2023-11-01 12:41:30 +02:00
85468d2a67 DockedMegaMenu: Adjust docked threshold (#77139)
* adjust docked threshold to be xl instead of md and make sure it's open by default on 1440 res

* don't show dock menu button
2023-10-25 14:41:07 +01:00
abd2c9c287 Navigation: Hide docked menu and dock button on mobile (#76334)
* hide docked menu and dock button on mobile

* add logic to handle hamburger menu button on mobile
2023-10-11 11:33:15 +01:00
930c753340 Navigation: Implement logic for docking nav menu (#76188)
* Create a state for dockedMegaMenu and the function to manage it

* Add the dockedMenu icon and handle the status when clicking it

* Add Megamenu to section nav area when it is docked

* get logic working

* fix mobile

* refactor state + persist in localStorage

* adjust icon and don't use position absolute

* restore old rudderstack tracking

* use Flex instead

* adjust feature toggle to be experimental

* extract out localStorage handling into utils

* don't need separate file

* use store.set/get instead

---------

Co-authored-by: eledobleefe <laura.fernandez@grafana.com>
2023-10-10 14:55:52 +01:00
efaa779c2e Navigation: Refactor MegaMenu to separate out overlay/animation logic (#75365)
* user essentials mob! 🔱

lastFile:public/app/core/components/AppChrome/DockedMegaMenu/DockedMegaMenu.tsx

* mob start [ci-skip] [ci skip] [skip ci]

* user essentials mob! 🔱

lastFile:public/app/core/components/AppChrome/DockedMegaMenu/DockedMegaMenu.tsx

* user essentials mob! 🔱

lastFile:public/app/core/components/AppChrome/AppChrome.tsx

* fix border css + scroll

* import width from DockedMegaMenu

* extract logic out into AppChromeMenu

* fix bug with hamburger icon

* rename some styles

* one more rename

* remove janky state logic

* prevent react-aria closing the overlay when interacting with the toggle button

* don't need boolean

---------

Co-authored-by: eledobleefe <laura.fernandez@grafana.com>
2023-09-27 17:05:40 +01:00
efeff6bbb1 Navigation: create the DockedMegaMenu component and use the toggle to switch between it and MegaMenu (#75084) 2023-09-19 17:47:03 +02:00
0c08163357 Navigation: hide sectionNav when the dockedMegaMenu feature toggle is enabled (#75026) 2023-09-19 12:34:53 +02:00
1f49d480a8 Drawer: Clicking a Select arrow within a Drawer no longer causes it to close (#73557)
ensure drawer doesn't close when clicking dropdown arrow
2023-08-22 16:11:18 +01:00
10adebd7b3 Page: Add inline rename functionality (#68828)
* initial attempt at inline rename

* handle version correctly

* refactor

* minor tweaks

* add unit tests

* prettier...

* add to other tabs, remove settings tab when feature toggle is enabled

* fix truncation

* allow title to span full width of page

* fix h1 styling when no renderTitle/onEditTitle is present

* better layout

* use input from grafana/ui, fix imports

* fix unit test

* better error handling

* don't use autosavefield

* undo changes to AutoSaveField

* remove timeout

* remove maxWidth now we're not using AutoSaveField

* rename isEditInProgress to isLoading

* sync localValue with value

* better responsive css
2023-05-31 17:03:54 +01:00
5f84dad7e4 TopNav: Tone down shadow a bit in light theme (#68282)
* TopNav: Tone down shadow a bit in light theme

* softer shadow
2023-05-17 14:18:28 +02:00
a7cbb72664 Accessibility: Add Skip to content link (#68065)
* user essentials mob! 🔱

lastFile:public/app/core/components/AppChrome/AppChrome.tsx

* user essentials mob! 🔱

lastFile:public/app/core/components/AppChrome/AppChrome.test.tsx

* only show skiplink when page has app chrome

---------

Co-authored-by: Joao Silva <joao.silva@grafana.com>
2023-05-09 15:22:23 +01:00
ae1a85b5ad Drawer: Position under nav & minor redesign (#67824)
* Drawer: Redesign WIP

* Fix double margin

* Teak pos

* align paddings

* Hide toolbar actions when drawer is open

* deprecate expandable

* Updated test

* remove expandable var

* Added clickaway
2023-05-05 17:00:33 +02:00
af9bf81102 AppChrome: Fix scrollbar issue for small (mobile) breakpoint (#67058) 2023-04-24 10:52:12 +02:00