fix: eliminate complex nesting of NavResponse model

Fixes #4205

Author: myan9

packages/core/src/models/NavResponse.ts

@@ -15,7 +15,7 @@
  */
 
 import { Entity } from './entity'
-import { MultiModalResponse } from './mmr/types'
+import { Mode } from './mmr/types'
 
 export interface Breadcrumb {
   label: string
@@ -34,7 +34,8 @@ export type NavResponse = {
   breadcrumbs?: Breadcrumb[]
 }
 
-export type Menu = Record<string, MultiModalResponse>
+export type Menu = Label & MenuItems
+type MenuItems = { items: Mode[] }
 
 type Label = { label: string }
 type Command = { command: string }

plugins/plugin-client-common/src/components/Sidecar/LeftNavSidecar.tsx

@@ -25,7 +25,6 @@ import {
   NavResponse,
   MultiModalMode,
   ParsedOptions,
-  Menu,
   Link,
   isLinkWithCommand
 } from '@kui-shell/core'
@@ -119,10 +118,8 @@ export default class LeftNavSidecar extends BaseSidecar<NavResponse, HistoryEntr
     const navigations = []
     // get state from each of the left navigation
     response.menus.forEach(menu => {
-      Object.entries(menu).forEach(([title, mmr]) => {
-        const state = getStateFromMMR(tab, mmr, argvNoOptions, parsedOptions)
-        navigations.push(Object.assign({ title }, state))
-      })
+      const state = getStateFromMMR(tab, { modes: menu.items }, argvNoOptions, parsedOptions)
+      navigations.push(Object.assign({ title: menu.label }, state))
     })
 
     return {
@@ -220,10 +217,6 @@ export default class LeftNavSidecar extends BaseSidecar<NavResponse, HistoryEntr
     return {}
   }
 
-  private getMMRFromMenu(menu: Menu) {
-    return Object.values(menu)[0]
-  }
-
   protected bodyContent(tabIdx: number, menuIdx = 0) {
     return (
       <React.Suspense fallback={<div />}>
@@ -232,7 +225,7 @@ export default class LeftNavSidecar extends BaseSidecar<NavResponse, HistoryEntr
           tab={this.state.tab}
           mode={this.current.allNavs[menuIdx].tabs[tabIdx]}
           args={{ argvNoOptions: this.state.current.argvNoOptions, parsedOptions: this.state.current.parsedOptions }}
-          response={this.getMMRFromMenu(this.current.response.menus[menuIdx])}
+          response={{ modes: this.current.response.menus[menuIdx].items }}
         />
       </React.Suspense>
     )

plugins/plugin-client-default/config.d/about.json

@@ -1,16 +1,15 @@
 {
   "menus": [
     {
-      "Kui": {
-        "modes": [
-          {
-            "mode": "about",
-            "content": "about:content",
-            "contentType": "text/markdown"
-          },
-          { "mode": "version", "contentFrom": "version --full" }
-        ]
-      }
+      "label": "Kui",
+      "items": [
+        {
+          "mode": "about",
+          "content": "about:content",
+          "contentType": "text/markdown"
+        },
+        { "mode": "version", "contentFrom": "version --full" }
+      ]
     }
   ],
   "links": [

plugins/plugin-client-test/src/lib/cmds/NavResponse.ts

@@ -32,15 +32,7 @@ interface Options extends ParsedOptions {
 const navResponseWithoutLinks = (): NavResponse => ({
   apiVersion: 'kui-shell/v1',
   kind: 'NavResponse',
-  menus: [
-    {
-      'Test Nav Without Links': {
-        kind: 'MultiModelResponse',
-        metadata: { name: 'test nav 2' },
-        modes: tableMode
-      }
-    }
-  ]
+  menus: [{ label: 'Test Nav Without Links', items: tableMode }]
 })
 
 function navResponseWithBreadcrumbs(): NavResponse {
@@ -62,15 +54,7 @@ const doNav = () => (args: Arguments<Options>): NavResponse => {
     return {
       apiVersion: 'kui-shell/v1',
       kind: 'NavResponse',
-      menus: [
-        {
-          'Test Nav 2': {
-            kind: 'MultiModelResponse',
-            metadata: { name: 'test nav 2' },
-            modes: tableMode
-          }
-        }
-      ],
+      menus: [{ label: 'Test Nav 2', items: tableMode }],
       links: [
         { label: 'Home Page', href: 'http://kui.tools' },
         { label: 'switch', command: 'test nav' }
@@ -80,15 +64,7 @@ const doNav = () => (args: Arguments<Options>): NavResponse => {
     return {
       apiVersion: 'kui-shell/v1',
       kind: 'NavResponse',
-      menus: [
-        {
-          'Test Nav': {
-            kind: 'MultiModelResponse',
-            metadata: { name: 'test nav' },
-            modes: tableMode
-          }
-        }
-      ],
+      menus: [{ label: 'Test Nav', items: tableMode }],
       links: [
         { label: 'Home Page', href: 'http://kui.tools' },
         { label: 'switch', command: 'test nav --switch' }

plugins/plugin-core-support/about/src/about.ts

@@ -24,9 +24,6 @@ import {
   NavResponse,
   isNavResponse,
   isLink,
-  Menu,
-  isMultiModalResponse,
-  MultiModalResponse,
   Table,
   isStringWithOptionalContentType
 } from '@kui-shell/core'
@@ -98,22 +95,16 @@ const getAbout = async (): Promise<NavResponse> => {
     }
 
     // inject Configure Menu
-    const fullMenus = (_.menus as Menu[]).slice(0)
-    fullMenus.push({
-      [strings('Configure')]: {
-        modes: [
-          {
-            mode: 'theme',
-            contentFrom: 'themes'
-          }
-        ]
-      }
-    })
+    const fullMenus = _.menus.slice(0)
+    const configureMenu = {
+      label: strings('Configure'),
+      items: [{ mode: 'theme', contentFrom: 'themes' }]
+    }
 
     return {
       apiVersion: _apiVersion || 'kui-shell/v1',
       kind: _kind || 'NavResponse',
-      menus: fullMenus,
+      menus: fullMenus.concat([configureMenu]),
       links: _['links'] || []
     }
   })
@@ -140,44 +131,19 @@ const translateModesLabel = (modesFromAbout: Mode[]) => {
   )
 }
 
-// finish the MMR from modes
-const createMMRFromAbout = (modes: Mode[], name: string): MultiModalResponse => {
-  const mmr = {
-    kind: 'about',
-    modes,
-    metadata: { name }
-  }
-
-  if (!isMultiModalResponse(mmr)) {
-    throw new Error('Error in modes of about.json')
-  }
-
-  return mmr
-}
-
 const aboutWindow = async (): Promise<NavResponse> => {
-  const name = await getName()
   const { apiVersion, kind, menus, links } = await getAbout()
 
-  // translated labels and fulfilled MMR details for users
-  const translatedMenusWithMMR = menus.map(menu => {
-    const menuTitle = Object.keys(menu)[0]
-    const mmr = Object.values(menu)[0]
-
-    try {
-      const modesFromAbout = mmr.modes
-      const modes = translateModesLabel(modesFromAbout)
-      const fullMMR = createMMRFromAbout(modes, name)
-      return { [clientStrings(menuTitle)]: fullMMR }
-    } catch (err) {
-      console.error(err)
-      throw new Error('Error in menus of about.json')
-    }
+  // translate the label of sidecar modes under each menu
+  menus.forEach(menu => {
+    menu.label = clientStrings(menu.label)
+    menu.items = translateModesLabel(menu.items)
   })
 
-  const translatedLinks = links.map(link => {
+  // translate the label of each navlink
+  links.forEach(link => {
     if (isLink(link)) {
-      return Object.assign(link, { label: clientStrings(link.label) })
+      link.label = clientStrings(link.label)
     } else {
       console.error('error in about.json', link)
       throw new Error('links in about.json is not supported')
@@ -187,8 +153,8 @@ const aboutWindow = async (): Promise<NavResponse> => {
   return {
     apiVersion,
     kind,
-    menus: translatedMenusWithMMR,
-    links: translatedLinks
+    menus,
+    links
   }
 }
 

plugins/plugin-kubectl/helm/src/controller/helm/status.ts

@@ -15,7 +15,7 @@
  */
 
 import Debug from 'debug'
-import { Arguments, ExecOptions, Menu, Registrar, i18n } from '@kui-shell/core'
+import { Arguments, ExecOptions, Registrar, NavResponse, i18n } from '@kui-shell/core'
 import { isUsage, doHelp, preprocessTable, formatTable, KubeOptions } from '@kui-shell/plugin-kubectl'
 
 import doExecWithStdout from './exec'
@@ -124,62 +124,58 @@ ${notesMatch[3]}`
 
     const notes = notesMatch && notesMatch[4]
 
-    const overviewMenu: Menu[] = [
-      {
-        Overview: {
-          modes: [
-            {
-              mode: 'status',
-              label: strings('status'),
-              content: status,
-              contentType: 'text/markdown'
-            }
-          ]
-            .concat(
-              !summary
-                ? []
-                : [
-                    {
-                      mode: 'summary',
-                      label: strings('summary'),
-                      content: summary,
-                      contentType: 'text/markdown'
-                    }
-                  ]
-            )
-            .concat(
-              !notes
-                ? []
-                : [
-                    {
-                      mode: 'notes',
-                      label: strings2('Notes'),
-                      content: notes,
-                      contentType: 'text/markdown'
-                    }
-                  ]
-            )
+    const overviewMenu = {
+      label: 'Overview',
+      items: [
+        {
+          mode: 'status',
+          label: strings('status'),
+          content: status,
+          contentType: 'text/markdown'
         }
-      }
-    ]
-
-    const resourcesMenu: Menu[] = [
-      {
-        Resources: {
-          modes: resources.map(_ => ({
-            mode: _.kind,
-            content: _.table
-          }))
-        }
-      }
-    ]
+      ]
+        .concat(
+          !summary
+            ? []
+            : [
+                {
+                  mode: 'summary',
+                  label: strings('summary'),
+                  content: summary,
+                  contentType: 'text/markdown'
+                }
+              ]
+        )
+        .concat(
+          !notes
+            ? []
+            : [
+                {
+                  mode: 'notes',
+                  label: strings2('Notes'),
+                  content: notes,
+                  contentType: 'text/markdown'
+                }
+              ]
+        )
+    }
+
+    const resourcesMenu = {
+      label: 'Resources',
+      items: resources.map(_ => ({
+        mode: _.kind,
+        content: _.table
+      }))
+    }
 
-    return {
+    const response: NavResponse = {
       apiVersion: 'kui-shell/v1',
       kind: 'NavResponse',
       breadcrumbs: [{ label: 'helm' }, { label: 'release', command: `helm ls` }, { label: name }],
-      menus: overviewMenu.concat(resourcesMenu)
+      menus: [overviewMenu, resourcesMenu]
     }
+
+    return response
   }
 }