only render direct children on the landing page routes (#56720)

pkg/services/navtree/models.go

@@ -115,8 +115,7 @@ func (root *NavTreeRoot) RemoveEmptySectionsAndApplyNewInformationArchitecture(t
 		}
 
 		if serverAdminNode := root.FindById(NavIDAdmin); serverAdminNode != nil {
-			serverAdminNode.Url = "/admin/settings"
-			serverAdminNode.Text = "Server admin"
+			serverAdminNode.Url = "/admin/server"
 			serverAdminNode.SortWeight = 0
 
 			if orgAdminNode != nil {

pkg/services/navtree/navtreeimpl/admin.go

@@ -171,7 +171,11 @@ func (s *ServiceImpl) getServerAdminNode(c *models.ReqContext) *navtree.NavLink
 	}
 
 	if len(adminNavLinks) > 0 {
-		adminNode.Url = adminNavLinks[0].Url
+		if s.cfg.IsFeatureToggleEnabled(featuremgmt.FlagTopnav) {
+			adminNode.Url = s.cfg.AppSubURL + "/admin/server"
+		} else {
+			adminNode.Url = adminNavLinks[0].Url
+		}
 	}
 
 	return adminNode

public/app/core/components/AppChrome/NavLandingPage.test.tsx

@@ -80,24 +80,4 @@ describe('NavLandingPage', () => {
     expect(screen.getByText(mockChild1.subTitle)).toBeInTheDocument();
     expect(screen.getByText(mockChild2.subTitle)).toBeInTheDocument();
   });
-
-  it('renders the heading for nested sections', () => {
-    setup();
-    expect(screen.getByRole('heading', { name: mockChild3.text })).toBeInTheDocument();
-  });
-
-  it('renders the subTitle for a nested section', () => {
-    setup();
-    expect(screen.getByText(mockChild3.subTitle)).toBeInTheDocument();
-  });
-
-  it('renders a link for a nested child', () => {
-    setup();
-    expect(screen.getByRole('link', { name: mockChild3.children[0].text })).toBeInTheDocument();
-  });
-
-  it('renders the subTitle for a nested child', () => {
-    setup();
-    expect(screen.getByText(mockChild3.children[0].subTitle)).toBeInTheDocument();
-  });
 });

public/app/core/components/AppChrome/NavLandingPage.tsx

@@ -17,16 +17,15 @@ interface Props {
 export function NavLandingPage({ navId }: Props) {
   const { node } = useNavModel(navId);
   const styles = useStyles2(getStyles);
-  const directChildren = node.children?.filter((child) => !child.hideFromTabs && !child.children);
-  const nestedChildren = node.children?.filter((child) => child.children && child.children.length);
+  const children = node.children?.filter((child) => !child.hideFromTabs);
 
   return (
     <Page navId={node.id}>
       <Page.Contents>
         <div className={styles.content}>
-          {directChildren && directChildren.length > 0 && (
+          {children && children.length > 0 && (
             <section className={styles.grid}>
-              {directChildren?.map((child) => (
+              {children?.map((child) => (
                 <NavLandingPageCard
                   key={child.id}
                   description={getNavSubTitle(child.id) ?? child.subTitle}
@@ -36,22 +35,6 @@ export function NavLandingPage({ navId }: Props) {
               ))}
             </section>
           )}
-          {nestedChildren?.map((child) => (
-            <section key={child.id}>
-              <h2 className={styles.nestedTitle}>{getNavTitle(child.id) ?? child.text}</h2>
-              <div className={styles.nestedDescription}>{getNavSubTitle(child.id) ?? child.subTitle}</div>
-              <div className={styles.grid}>
-                {child.children?.map((child) => (
-                  <NavLandingPageCard
-                    key={child.id}
-                    description={getNavSubTitle(child.id) ?? child.subTitle}
-                    text={getNavTitle(child.id) ?? child.text}
-                    url={child.url ?? ''}
-                  />
-                ))}
-              </div>
-            </section>
-          ))}
         </div>
       </Page.Contents>
     </Page>
@@ -71,10 +54,4 @@ const getStyles = (theme: GrafanaTheme2) => ({
     gridAutoRows: '130px',
     padding: theme.spacing(2, 0),
   }),
-  nestedTitle: css({
-    margin: theme.spacing(2, 0),
-  }),
-  nestedDescription: css({
-    color: theme.colors.text.secondary,
-  }),
 });

public/app/features/plugins/components/AppRootPage.tsx

@@ -60,7 +60,7 @@ export function AppRootPage({ match, queryParams, location }: Props) {
   if (!plugin.root) {
     return (
       <Page navModel={sectionNav ?? getWarningNav('Plugin load error')}>
-        <div>No root app page component found</div>;
+        <div>No root app page component found</div>
       </Page>
     );
   }