Navigation: move connections + integrations to be a top level item (#58902)

* move connections + integrations to be a top level item

* add a test to check we can move apps to the root

* split out movePlugin logic into a separate function

* fix linting

* rename movePlugin -> addPluginToSection
This commit is contained in:
Ashley Harrison 2022-11-18 09:05:45 +00:00 committed by GitHub
parent 48c34d310c
commit d46e3916a1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 37 additions and 8 deletions

View File

@ -36,6 +36,7 @@ const (
)
const (
NavIDRoot = "root"
NavIDDashboards = "dashboards"
NavIDDashboardsBrowse = "dashboards/browse"
NavIDCfg = "cfg" // NavIDCfg is the id for org configuration navigation node

View File

@ -170,6 +170,12 @@ func (s *ServiceImpl) processAppPlugin(plugin plugins.PluginDTO, c *models.ReqCo
}
appLink.Children = childrenWithoutDefault
s.addPluginToSection(c, treeRoot, plugin, appLink)
return nil
}
func (s *ServiceImpl) addPluginToSection(c *models.ReqContext, treeRoot *navtree.NavTreeRoot, plugin plugins.PluginDTO, appLink *navtree.NavLink) {
// Handle moving apps into specific navtree sections
alertingNode := treeRoot.FindById(navtree.NavIDAlerting)
sectionID := navtree.NavIDApps
@ -183,7 +189,9 @@ func (s *ServiceImpl) processAppPlugin(plugin plugins.PluginDTO, c *models.ReqCo
}
}
if navNode := treeRoot.FindById(sectionID); navNode != nil {
if sectionID == navtree.NavIDRoot {
treeRoot.AddSection(appLink)
} else if navNode := treeRoot.FindById(sectionID); navNode != nil {
navNode.Children = append(navNode.Children, appLink)
} else {
switch sectionID {
@ -227,8 +235,6 @@ func (s *ServiceImpl) processAppPlugin(plugin plugins.PluginDTO, c *models.ReqCo
s.log.Error("Plugin app nav id not found", "pluginId", plugin.ID, "navId", sectionID)
}
}
return nil
}
func (s *ServiceImpl) hasAccessToInclude(c *models.ReqContext, pluginID string) func(include *plugins.Includes) bool {
@ -256,6 +262,7 @@ func (s *ServiceImpl) readNavigationSettings() {
"grafana-incident-app": {SectionID: navtree.NavIDAlertsAndIncidents, SortWeight: 2, Text: "Incident"},
"grafana-ml-app": {SectionID: navtree.NavIDAlertsAndIncidents, SortWeight: 3, Text: "Machine Learning"},
"grafana-cloud-link-app": {SectionID: navtree.NavIDCfg},
"grafana-easystart-app": {SectionID: navtree.NavIDRoot, SortWeight: navtree.WeightSavedItems + 1, Text: "Connections"},
}
s.navigationAppPathConfig = map[string]NavigationAppConfig{

View File

@ -147,6 +147,30 @@ func TestAddAppLinks(t *testing.T) {
require.Equal(t, "Page2", app1Node.Children[0].Text)
})
// This can be done by using `[navigation.app_sections]` in the INI config
t.Run("Should move apps that have root nav id configured to the root", func(t *testing.T) {
service.features = featuremgmt.WithFeatures(featuremgmt.FlagTopnav)
service.navigationAppConfig = map[string]NavigationAppConfig{
"test-app1": {SectionID: navtree.NavIDRoot},
}
treeRoot := navtree.NavTreeRoot{}
err := service.addAppLinks(&treeRoot, reqCtx)
require.NoError(t, err)
// Check if the plugin gets moved to the root
require.Len(t, treeRoot.Children, 2)
require.Equal(t, "plugin-page-test-app1", treeRoot.Children[0].Id)
// Check if it is not under the "Apps" section anymore
appsNode := treeRoot.FindById(navtree.NavIDApps)
require.NotNil(t, appsNode)
require.Len(t, appsNode.Children, 2)
require.Equal(t, "plugin-page-test-app2", appsNode.Children[0].Id)
require.Equal(t, "plugin-page-test-app3", appsNode.Children[1].Id)
})
// This can be done by using `[navigation.app_sections]` in the INI config
t.Run("Should move apps that have specific nav id configured to correct section", func(t *testing.T) {
service.features = featuremgmt.WithFeatures(featuremgmt.FlagTopnav)

View File

@ -25,17 +25,14 @@ export const MegaMenu = React.memo<Props>(({ onClose, searchBarHidden }) => {
const navTree = cloneDeep(navBarTree);
const coreItems = navTree
.filter((item) => item.section === NavSection.Core)
.map((item) => enrichWithInteractionTracking(item, true));
const pluginItems = navTree
.filter((item) => item.section === NavSection.Plugin)
.filter((item) => item.section === NavSection.Core || item.section === NavSection.Plugin)
.map((item) => enrichWithInteractionTracking(item, true));
const configItems = enrichConfigItems(
navTree.filter((item) => item.section === NavSection.Config && item && item.id !== 'help' && item.id !== 'profile'),
location
).map((item) => enrichWithInteractionTracking(item, true));
const navItems = [...coreItems, ...pluginItems, ...configItems];
const navItems = [...coreItems, ...configItems];
const activeItem = getActiveItem(navItems, location.pathname);