From 05f68c391c67790cbf8c81c4ac295b12c808d310 Mon Sep 17 00:00:00 2001 From: Ashley Harrison Date: Mon, 21 Feb 2022 12:50:53 +0000 Subject: [PATCH 01/48] Add babel plugin to workaround bug in @babel/preset-env (#45664) --- babel.config.json | 3 +++ package.json | 1 + yarn.lock | 25 +++++++++++++------------ 3 files changed, 17 insertions(+), 12 deletions(-) diff --git a/babel.config.json b/babel.config.json index 4de74eb504a..49d6564f0ea 100644 --- a/babel.config.json +++ b/babel.config.json @@ -26,6 +26,9 @@ ] ], "plugins": [ + // added to mitigate https://github.com/babel/babel/issues/14289 + // package (and following line) can be removed once the issue is fixed and released + "@babel/plugin-proposal-class-properties", [ "@babel/plugin-transform-typescript", { diff --git a/package.json b/package.json index 3a96b5bac55..769fe762dd7 100644 --- a/package.json +++ b/package.json @@ -70,6 +70,7 @@ }, "devDependencies": { "@babel/core": "7.17.0", + "@babel/plugin-proposal-class-properties": "7.16.7", "@babel/plugin-proposal-nullish-coalescing-operator": "7.16.7", "@babel/plugin-proposal-object-rest-spread": "7.17.3", "@babel/plugin-proposal-optional-chaining": "7.16.7", diff --git a/yarn.lock b/yarn.lock index c5dae528148..3e43fc1d1b6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1111,6 +1111,18 @@ __metadata: languageName: node linkType: hard +"@babel/plugin-proposal-class-properties@npm:7.16.7, @babel/plugin-proposal-class-properties@npm:^7.16.7": + version: 7.16.7 + resolution: "@babel/plugin-proposal-class-properties@npm:7.16.7" + dependencies: + "@babel/helper-create-class-features-plugin": ^7.16.7 + "@babel/helper-plugin-utils": ^7.16.7 + peerDependencies: + "@babel/core": ^7.0.0-0 + checksum: 3977e841e17b45b47be749b9a5b67b9e8b25ff0840f9fdad3f00cbcb35db4f5ff15f074939fe19b01207a29688c432cc2c682351959350834d62920b7881f803 + languageName: node + linkType: hard + "@babel/plugin-proposal-class-properties@npm:^7.12.1, @babel/plugin-proposal-class-properties@npm:^7.13.0, @babel/plugin-proposal-class-properties@npm:^7.14.5": version: 7.14.5 resolution: "@babel/plugin-proposal-class-properties@npm:7.14.5" @@ -1123,18 +1135,6 @@ __metadata: languageName: node linkType: hard -"@babel/plugin-proposal-class-properties@npm:^7.16.7": - version: 7.16.7 - resolution: "@babel/plugin-proposal-class-properties@npm:7.16.7" - dependencies: - "@babel/helper-create-class-features-plugin": ^7.16.7 - "@babel/helper-plugin-utils": ^7.16.7 - peerDependencies: - "@babel/core": ^7.0.0-0 - checksum: 3977e841e17b45b47be749b9a5b67b9e8b25ff0840f9fdad3f00cbcb35db4f5ff15f074939fe19b01207a29688c432cc2c682351959350834d62920b7881f803 - languageName: node - linkType: hard - "@babel/plugin-proposal-class-static-block@npm:^7.15.4": version: 7.15.4 resolution: "@babel/plugin-proposal-class-static-block@npm:7.15.4" @@ -20377,6 +20377,7 @@ __metadata: resolution: "grafana@workspace:." dependencies: "@babel/core": 7.17.0 + "@babel/plugin-proposal-class-properties": 7.16.7 "@babel/plugin-proposal-nullish-coalescing-operator": 7.16.7 "@babel/plugin-proposal-object-rest-spread": 7.17.3 "@babel/plugin-proposal-optional-chaining": 7.16.7 From 7c826cb43fe2dcbb9bf9579be4d43ae375f55d1e Mon Sep 17 00:00:00 2001 From: Timur Olzhabayev Date: Mon, 21 Feb 2022 14:39:31 +0100 Subject: [PATCH 02/48] feat(45145): add more links to developers page (#45585) --- docs/sources/developers/_index.md | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/docs/sources/developers/_index.md b/docs/sources/developers/_index.md index 2d27bc4e9fb..bd4e72187a8 100644 --- a/docs/sources/developers/_index.md +++ b/docs/sources/developers/_index.md @@ -6,4 +6,10 @@ weight = 190 # Developers -This section of the documentation contains pages with resources for Grafana developers. +This section of the documentation contains pages with resources for Grafana developers: + +- [Grafana Contribution Guide - learn how you can contribute your skills to make Grafana even better.]({{< relref "contribute.md" >}}) +- [How to build a plugin]({{< relref "plugins" >}}) +- [Grafana Tutorials - step-by-step guides that help you make the most of Grafana](https://grafana.com/tutorials/) +- [Grafana Community Forums - get technical support for open source Grafana, Loki, and Tempo.](https://community.grafana.com) +- [Grafana design system - library of reusable Grafana components and guidelines that help you with contribution and plugin development](https://developers.grafana.com) From b6682cdcb9127801af480b5500a17a225a3a9568 Mon Sep 17 00:00:00 2001 From: kay delaney <45561153+kaydelaney@users.noreply.github.com> Date: Mon, 21 Feb 2022 15:25:47 +0000 Subject: [PATCH 03/48] Navigation: Proof-of-concept for pinning navbar items (#44775) --- packages/grafana-data/src/types/navModel.ts | 1 + packages/grafana-ui/src/types/icon.ts | 1 + .../app/core/components/NavBar/NavBarItem.tsx | 4 +- .../components/NavBar/NavBarMenu.test.tsx | 2 +- .../app/core/components/NavBar/NavBarMenu.tsx | 20 +- .../core/components/NavBar/NavBarMenuItem.tsx | 96 +- .../app/core/components/NavBar/NavBarNext.tsx | 29 +- public/app/core/reducers/navBarTree.ts | 27 +- public/test/mocks/navModel.ts | 1423 +++++++++++++++++ public/test/redux-rtl.tsx | 35 + 10 files changed, 1596 insertions(+), 42 deletions(-) create mode 100644 public/test/mocks/navModel.ts create mode 100644 public/test/redux-rtl.tsx diff --git a/packages/grafana-data/src/types/navModel.ts b/packages/grafana-data/src/types/navModel.ts index 781a6610270..66b1fe81737 100644 --- a/packages/grafana-data/src/types/navModel.ts +++ b/packages/grafana-data/src/types/navModel.ts @@ -22,6 +22,7 @@ export interface NavModelItem { highlightText?: string; highlightId?: string; tabSuffix?: ComponentType<{ className?: string }>; + hideFromNavbar?: boolean; } export enum NavSection { diff --git a/packages/grafana-ui/src/types/icon.ts b/packages/grafana-ui/src/types/icon.ts index 3d55da853b3..0b7e64c937a 100644 --- a/packages/grafana-ui/src/types/icon.ts +++ b/packages/grafana-ui/src/types/icon.ts @@ -5,6 +5,7 @@ export type IconSize = ComponentSize | 'xl' | 'xxl' | 'xxxl'; export const getAvailableIcons = () => [ + 'anchor', 'angle-double-down', 'angle-double-right', 'angle-double-up', diff --git a/public/app/core/components/NavBar/NavBarItem.tsx b/public/app/core/components/NavBar/NavBarItem.tsx index 67efefbf768..cf91ade17a4 100644 --- a/public/app/core/components/NavBar/NavBarItem.tsx +++ b/public/app/core/components/NavBar/NavBarItem.tsx @@ -33,7 +33,9 @@ const NavBarItem = ({ const { i18n } = useLingui(); const theme = useTheme2(); const menuItems = link.children ?? []; - const menuItemsSorted = reverseMenuDirection ? menuItems.reverse() : menuItems; + + // Spreading `menuItems` here as otherwise we'd be mutating props + const menuItemsSorted = reverseMenuDirection ? [...menuItems].reverse() : menuItems; const filteredItems = menuItemsSorted .filter((item) => !item.hideFromMenu) .map((i) => ({ ...i, menuItemType: NavMenuItemType.Item })); diff --git a/public/app/core/components/NavBar/NavBarMenu.test.tsx b/public/app/core/components/NavBar/NavBarMenu.test.tsx index 08f1acd6c39..0c65010c21d 100644 --- a/public/app/core/components/NavBar/NavBarMenu.test.tsx +++ b/public/app/core/components/NavBar/NavBarMenu.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { NavModelItem } from '@grafana/data'; -import { render, screen } from '@testing-library/react'; +import { render, screen } from 'test/redux-rtl'; import userEvent from '@testing-library/user-event'; import { NavBarMenu } from './NavBarMenu'; diff --git a/public/app/core/components/NavBar/NavBarMenu.tsx b/public/app/core/components/NavBar/NavBarMenu.tsx index ae35bde4235..f4c6823f4c3 100644 --- a/public/app/core/components/NavBar/NavBarMenu.tsx +++ b/public/app/core/components/NavBar/NavBarMenu.tsx @@ -6,6 +6,9 @@ import { useDialog } from '@react-aria/dialog'; import { useOverlay } from '@react-aria/overlays'; import { css } from '@emotion/css'; import { NavBarMenuItem } from './NavBarMenuItem'; +import { useDispatch } from 'react-redux'; +import { togglePin } from 'app/core/reducers/navBarTree'; +import { getConfig } from 'app/core/config'; export interface Props { activeItem?: NavModelItem; @@ -14,6 +17,11 @@ export interface Props { } export function NavBarMenu({ activeItem, navItems, onClose }: Props) { + const dispatch = useDispatch(); + const toggleItemPin = (id: string) => { + dispatch(togglePin({ id })); + }; + const theme = useTheme2(); const styles = getStyles(theme); const ref = useRef(null); @@ -27,6 +35,7 @@ export function NavBarMenu({ activeItem, navItems, onClose }: Props) { ref ); + const newNavigationEnabled = getConfig().featureToggles.newNavigation; return (
@@ -37,8 +46,8 @@ export function NavBarMenu({ activeItem, navItems, onClose }: Props) {