From 91d2df59fc6e7aec7dcb14b682220dbe74d00b9b Mon Sep 17 00:00:00 2001 From: Josh Hunt Date: Fri, 24 Feb 2023 13:14:53 +0100 Subject: [PATCH] CommandPalette: Remove topnav command palette feature flag (#63620) * CommandPalette: Remove topnav command palette feature flag * Restore search shortcuts if topnav isnt enabled * fix unused imports --- .../feature-toggles/index.md | 1 - .../src/types/featureToggles.gen.ts | 1 - pkg/services/featuremgmt/registry.go | 6 --- pkg/services/featuremgmt/toggles_gen.go | 4 -- .../core/components/AppChrome/AppChrome.tsx | 2 - .../components/AppChrome/TopSearchBar.tsx | 12 ++--- .../AppChrome/TopSearchBarInput.tsx | 47 ------------------- public/app/core/services/keybindingSrv.ts | 2 +- .../commandPalette/CommandPalette.tsx | 6 +-- .../commandPalette/actions/staticActions.ts | 12 ----- 10 files changed, 6 insertions(+), 87 deletions(-) delete mode 100644 public/app/core/components/AppChrome/TopSearchBarInput.tsx diff --git a/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md b/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md index 071e6b4e18f..05c47ceca3a 100644 --- a/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md +++ b/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md @@ -46,7 +46,6 @@ Some stable features are enabled by default. You can disable a stable feature by | `topnav` | Displays new top nav and page layouts | | `accessControlOnCall` | Access control primitives for OnCall | | `alertingNoNormalState` | Stop maintaining state of alerts that are not firing | -| `topNavCommandPalette` | Launch the Command Palette from the top navigation search box | ## Alpha feature toggles diff --git a/packages/grafana-data/src/types/featureToggles.gen.ts b/packages/grafana-data/src/types/featureToggles.gen.ts index 91b48daf0bd..8864262c8c8 100644 --- a/packages/grafana-data/src/types/featureToggles.gen.ts +++ b/packages/grafana-data/src/types/featureToggles.gen.ts @@ -77,7 +77,6 @@ export interface FeatureToggles { alertingBacktesting?: boolean; editPanelCSVDragAndDrop?: boolean; alertingNoNormalState?: boolean; - topNavCommandPalette?: boolean; logsSampleInExplore?: boolean; logsContextDatasourceUi?: boolean; lokiQuerySplitting?: boolean; diff --git a/pkg/services/featuremgmt/registry.go b/pkg/services/featuremgmt/registry.go index 21686f269fb..8a4a2bc59e6 100644 --- a/pkg/services/featuremgmt/registry.go +++ b/pkg/services/featuremgmt/registry.go @@ -341,12 +341,6 @@ var ( State: FeatureStateBeta, RequiresRestart: false, }, - { - Name: "topNavCommandPalette", - Description: "Launch the Command Palette from the top navigation search box", - State: FeatureStateBeta, - FrontendOnly: true, - }, { Name: "logsSampleInExplore", diff --git a/pkg/services/featuremgmt/toggles_gen.go b/pkg/services/featuremgmt/toggles_gen.go index 8275d36c5b9..05a93d8fc11 100644 --- a/pkg/services/featuremgmt/toggles_gen.go +++ b/pkg/services/featuremgmt/toggles_gen.go @@ -251,10 +251,6 @@ const ( // Stop maintaining state of alerts that are not firing FlagAlertingNoNormalState = "alertingNoNormalState" - // FlagTopNavCommandPalette - // Launch the Command Palette from the top navigation search box - FlagTopNavCommandPalette = "topNavCommandPalette" - // FlagLogsSampleInExplore // Enables access to the logs sample feature in Explore FlagLogsSampleInExplore = "logsSampleInExplore" diff --git a/public/app/core/components/AppChrome/AppChrome.tsx b/public/app/core/components/AppChrome/AppChrome.tsx index 81a48005100..ef63d3f0fc6 100644 --- a/public/app/core/components/AppChrome/AppChrome.tsx +++ b/public/app/core/components/AppChrome/AppChrome.tsx @@ -22,7 +22,6 @@ export function AppChrome({ children }: Props) { const styles = useStyles2(getStyles); const { chrome } = useGrafana(); const state = chrome.useState(); - const featureToggles = config.featureToggles; if (!config.featureToggles.topnav) { return ( @@ -73,7 +72,6 @@ export function AppChrome({ children }: Props) {
{children}
chrome.setMegaMenu(false)} /> - {!featureToggles.topNavCommandPalette && } ); } diff --git a/public/app/core/components/AppChrome/TopSearchBar.tsx b/public/app/core/components/AppChrome/TopSearchBar.tsx index 8c21831f2ba..068199fae71 100644 --- a/public/app/core/components/AppChrome/TopSearchBar.tsx +++ b/public/app/core/components/AppChrome/TopSearchBar.tsx @@ -3,7 +3,6 @@ import React from 'react'; import { GrafanaTheme2 } from '@grafana/data'; import { Dropdown, ToolbarButton, useStyles2 } from '@grafana/ui'; -import { config } from 'app/core/config'; import { contextSrv } from 'app/core/core'; import { useSelector } from 'app/types'; @@ -16,7 +15,6 @@ import { SignInLink } from './TopBar/SignInLink'; import { TopNavBarMenu } from './TopBar/TopNavBarMenu'; import { TopSearchBarSection } from './TopBar/TopSearchBarSection'; import { TopSearchBarCommandPaletteTrigger } from './TopSearchBarCommandPaletteTrigger'; -import { TopSearchBarInput } from './TopSearchBarInput'; import { TOP_BAR_LEVEL_HEIGHT } from './types'; export function TopSearchBar() { @@ -26,12 +24,6 @@ export function TopSearchBar() { const helpNode = navIndex['help']; const profileNode = navIndex['profile']; - const search = config.featureToggles.topNavCommandPalette ? ( - - ) : ( - - ); - return (
@@ -41,7 +33,9 @@ export function TopSearchBar() { - {search} + + + diff --git a/public/app/core/components/AppChrome/TopSearchBarInput.tsx b/public/app/core/components/AppChrome/TopSearchBarInput.tsx deleted file mode 100644 index 059a736dc90..00000000000 --- a/public/app/core/components/AppChrome/TopSearchBarInput.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import React, { useState } from 'react'; - -import { locationService } from '@grafana/runtime'; -import { FilterInput, ToolbarButton, useTheme2 } from '@grafana/ui'; -import { useMediaQueryChange } from 'app/core/hooks/useMediaQueryChange'; -import { t } from 'app/core/internationalization'; -import { getSearchStateManager } from 'app/features/search/state/SearchStateManager'; - -export function TopSearchBarInput() { - const theme = useTheme2(); - const stateManager = getSearchStateManager(); - const state = stateManager.useState(); - const breakpoint = theme.breakpoints.values.sm; - - const [isSmallScreen, setIsSmallScreen] = useState(window.matchMedia(`(max-width: ${breakpoint}px)`).matches); - - useMediaQueryChange({ - breakpoint, - onChange: (e) => { - setIsSmallScreen(e.matches); - }, - }); - - const onOpenSearch = () => { - locationService.partial({ search: 'open' }); - }; - - const onSearchChange = (value: string) => { - stateManager.onQueryChange(value); - if (value) { - onOpenSearch(); - } - }; - - if (isSmallScreen) { - return ; - } - - return ( - - ); -} diff --git a/public/app/core/services/keybindingSrv.ts b/public/app/core/services/keybindingSrv.ts index 4ed2a9e5fcb..b88e4126c0f 100644 --- a/public/app/core/services/keybindingSrv.ts +++ b/public/app/core/services/keybindingSrv.ts @@ -41,7 +41,7 @@ export class KeybindingSrv { this.bind('g a', this.openAlerting); this.bind('g p', this.goToProfile); this.bind('g e', this.goToExplore); - if (!config.featureToggles.topNavCommandPalette) { + if (!config.featureToggles.topnav) { this.bind('s o', this.openSearch); this.bind('f', this.openSearch); } diff --git a/public/app/features/commandPalette/CommandPalette.tsx b/public/app/features/commandPalette/CommandPalette.tsx index 82036481739..8c1b91f8a42 100644 --- a/public/app/features/commandPalette/CommandPalette.tsx +++ b/public/app/features/commandPalette/CommandPalette.tsx @@ -15,7 +15,7 @@ import { import React, { useEffect, useMemo, useRef } from 'react'; import { GrafanaTheme2 } from '@grafana/data'; -import { config, reportInteraction } from '@grafana/runtime'; +import { reportInteraction } from '@grafana/runtime'; import { Icon, Spinner, useStyles2 } from '@grafana/ui'; import { t } from 'app/core/internationalization'; @@ -135,13 +135,11 @@ const RenderResults = ({ searchResults }: RenderResultsProps) => { }; const getSearchStyles = (theme: GrafanaTheme2) => { - const topNavCommandPalette = Boolean(config.featureToggles.topNavCommandPalette); - return { positioner: css({ zIndex: theme.zIndex.portal, marginTop: '0px', - paddingTop: topNavCommandPalette ? '4px !important' : undefined, + paddingTop: '4px !important', '&::before': { content: '""', position: 'fixed', diff --git a/public/app/features/commandPalette/actions/staticActions.ts b/public/app/features/commandPalette/actions/staticActions.ts index a973e239111..7ab513ae6c6 100644 --- a/public/app/features/commandPalette/actions/staticActions.ts +++ b/public/app/features/commandPalette/actions/staticActions.ts @@ -1,5 +1,4 @@ import { locationUtil, NavModelItem } from '@grafana/data'; -import { config, locationService } from '@grafana/runtime'; import { t } from 'app/core/internationalization'; import { changeTheme } from 'app/core/services/theme'; @@ -75,17 +74,6 @@ export default (navBarTree: NavModelItem[]): CommandPaletteAction[] => { }, ]; - if (!config.featureToggles.topNavCommandPalette) { - globalActions.unshift({ - id: 'go/search', - name: t('command-palette.action.search', 'Search'), - keywords: 'navigate', - perform: () => locationService.push('?search=open'), - section: t('command-palette.section.pages', 'Pages'), - priority: DEFAULT_PRIORITY, - }); - } - const navBarActions = navTreeToActions(navBarTree); return [...globalActions, ...navBarActions];