fix: filter hidden pages from the currentProductTree (SidebarProduct) (github#20404)

* fix some async test things

* allow eslint to parse top-level awaits

* fix: filter out hidden pages closer to SidebarProduct usage

Author: mikesurowiec

.babelrc

@@ -1,4 +1,4 @@
 {
   "presets": ["next/babel"],
-  "plugins": [["styled-components", { "ssr": true }]]
+  "plugins": [["styled-components", { "ssr": true }], "@babel/plugin-syntax-top-level-await"]
 }

.eslintrc.js

@@ -11,6 +11,7 @@ module.exports = {
     ecmaVersion: 11,
     requireConfigFile: 'false',
     babelOptions: { configFile: './.babelrc' },
+    sourceType: 'module',
   },
   rules: {
     'import/no-extraneous-dependencies': ['error', { packageDir: '.' }],

components/context/MainContext.tsx

@@ -3,6 +3,7 @@ import pick from 'lodash/pick'
 
 import type { BreadcrumbT } from 'components/Breadcrumbs'
 import type { FeatureFlags } from 'components/hooks/useFeatureFlags'
+import { ExcludesNull } from 'components/lib/ExcludesNull'
 
 type ProductT = {
   external: boolean
@@ -186,7 +187,11 @@ export const getMainContextFromRequest = (req: any): MainContextT => {
 }
 
 // only pull things we need from the product tree, and make sure there are default values instead of `undefined`
-const getCurrentProductTree = (input: any): ProductTreeNode => {
+const getCurrentProductTree = (input: any): ProductTreeNode | null => {
+  if (input.page.hidden) {
+    return null
+  }
+
   return {
     href: input.href,
     renderedShortTitle: input.renderedShortTitle || '',
@@ -197,7 +202,7 @@ const getCurrentProductTree = (input: any): ProductTreeNode => {
       title: input.page.title,
       shortTitle: input.page.shortTitle || '',
     },
-    childPages: (input.childPages || []).map(getCurrentProductTree),
+    childPages: (input.childPages || []).map(getCurrentProductTree).filter(ExcludesNull),
   }
 }
 

lib/page-data.js

@@ -102,7 +102,7 @@ export async function versionPages(obj, version, langCode, site) {
 
   const versionedChildPages = await Promise.all(
     obj.childPages
-      // Drop child pages that do not apply to the current version.
+      // Drop child pages that do not apply to the current version
       .filter((childPage) => childPage.page.applicableVersions.includes(version))
       // Version the child pages recursively.
       .map((childPage) => versionPages(Object.assign({}, childPage), version, langCode, site))

middleware/next.js

@@ -3,9 +3,9 @@ import next from 'next'
 const { NODE_ENV } = process.env
 const isDevelopment = NODE_ENV === 'development'
 
-const nextApp = next({ dev: isDevelopment })
+export const nextApp = next({ dev: isDevelopment })
 export const nextHandleRequest = nextApp.getRequestHandler()
-nextApp.prepare()
+await nextApp.prepare()
 
 function renderPageWithNext(req, res, next) {
   if (req.path.startsWith('/_next') && !req.path.startsWith('/_next/data')) {

package-lock.json

@@ -95,6 +95,7 @@
     "@actions/github": "^5.0.0",
     "@babel/core": "^7.14.3",
     "@babel/eslint-parser": "^7.14.3",
+    "@babel/plugin-syntax-top-level-await": "^7.14.5",
     "@babel/plugin-transform-runtime": "^7.14.3",
     "@babel/preset-env": "^7.14.2",
     "@graphql-inspector/core": "^2.5.0",

package.json

@@ -47,5 +47,3 @@ export const getJSON = (helpers.getJSON = async function (route) {
   const res = await helpers.get(route, { followRedirects: true })
   return JSON.parse(res.text)
 })
-
-export default helpers

tests/helpers/supertest.js

@@ -1,25 +1,26 @@
 import { jest } from '@jest/globals'
-import xFs from 'fs'
+import { stat } from 'fs/promises'
 import path from 'path'
 import { testViaActionsOnly } from '../helpers/conditional-runs.js'
 import { getDOM } from '../helpers/supertest.js'
 import got from 'got'
-const fs = xFs.promises
+
+jest.useFakeTimers()
 
 describe('cloning early-access', () => {
   testViaActionsOnly('the content directory exists', async () => {
     const eaDir = path.join(process.cwd(), 'content/early-access')
-    expect(await fs.stat(eaDir)).toBeTruthy()
+    expect(await stat(eaDir)).toBeTruthy()
   })
 
   testViaActionsOnly('the data directory exists', async () => {
     const eaDir = path.join(process.cwd(), 'data/early-access')
-    expect(await fs.stat(eaDir)).toBeTruthy()
+    expect(await stat(eaDir)).toBeTruthy()
   })
 
   testViaActionsOnly('the assets/images directory exists', async () => {
     const eaDir = path.join(process.cwd(), 'assets/images/early-access')
-    expect(await fs.stat(eaDir)).toBeTruthy()
+    expect(await stat(eaDir)).toBeTruthy()
   })
 })