Bug fixes

.github/workflows/build-landing-page.yml

@@ -10,7 +10,7 @@ jobs:
     runs-on: ubuntu-latest
 
     env:
-      NEXT_PUBLIC_ANALYTICS_WRITE_KEY: HZudPLHdFLbeHIrhYuTXS84S1XDmDv1W
+      NEXT_PUBLIC_ANALYTICS_WRITE_KEY: xhG5jr3JpuaKCcA82vF4thKumqLh3XtZ
       NEXT_PUBLIC_DOCSEARCH_APP_ID: FCRPEMIKYK
       NEXT_PUBLIC_DOCSEARCH_API_KEY: 3f20b782c93da03c6626d6cacae0ceb5
       NEXT_PUBLIC_DOCSEARCH_INDEX_NAME: devfile

.github/workflows/ci.yml

@@ -26,3 +26,4 @@ jobs:
           yarn nx affected --target=lint --parallel=3
           yarn nx affected --target=test --parallel=3 --ci --code-coverage
           yarn nx affected --target=build --parallel=3
+          yarn nx affected --target=e2e --parallel=3

OWNERS

@@ -1,11 +1,13 @@
 # See the OWNERS docs: https://git.k8s.io/community/contributors/guide/owners.md
 
 approvers:
-- maysunfaisal
-- schultzp2020
-- johnmcollier
+  - maysunfaisal
+  - schultzp2020
+  - johnmcollier
+  - mike-hoang
 
 reviewers:
-- maysunfaisal
-- schultzp2020
-- johnmcollier
+  - maysunfaisal
+  - schultzp2020
+  - johnmcollier
+  - mike-hoang

apps/landing-page-e2e/project.json

@@ -3,15 +3,9 @@
   "sourceRoot": "apps/landing-page-e2e/src",
   "projectType": "application",
   "targets": {
-    "build": {
-      "executor": "nx:run-commands",
-      "options": {
-        "command": "yarn nx build landing-page --configuration=production"
-      }
-    },
     "e2e": {
       "executor": "@nrwl/cypress:cypress",
-      "dependsOn": ["build"],
+      "dependsOn": ["^build"],
       "options": {
         "cypressConfig": "apps/landing-page-e2e/cypress.config.js",
         "devServerTarget": "landing-page:serve:production"

apps/landing-page/markdoc/nodes.tsx

@@ -6,6 +6,14 @@ const nodes = {
   document: {
     render: undefined,
   },
+  table: {
+    ...defaultNodes.table,
+    render: (props): JSX.Element => (
+      <div className="overflow-x-auto">
+        <table {...props} />
+      </div>
+    ),
+  },
   th: {
     ...defaultNodes.th,
     attributes: {

apps/landing-page/next-sitemap.config.mjs

@@ -0,0 +1,9 @@
+/** @type {import('next-sitemap').IConfig} */
+const config = {
+  siteUrl: process.env.SITE_URL || 'https://devfile.io/',
+  generateRobotsTxt: true,
+  sourceDir: 'dist/apps/landing-page/.next',
+  outDir: 'dist/apps/landing-page/public',
+};
+
+export default config;

apps/landing-page/pages/_app.tsx

@@ -93,7 +93,7 @@ function LandingPage({ Component, pageProps }: AppProps): JSX.Element {
         footerNavigation={footerNavigation}
         docsNavigation={docsNavigation as DocsNavigation}
       >
-        <div className="flex h-screen flex-col justify-between">
+        <div className="flex h-screen min-w-[300px] flex-col justify-between">
           <LandingPageMeta title={pageTitle} description={description} />
           <div className="grow">
             <Header />

apps/landing-page/project.json

@@ -3,17 +3,18 @@
   "sourceRoot": "apps/landing-page",
   "projectType": "application",
   "targets": {
-    "build-docs": {
+    "prebuild": {
       "executor": "nx:run-commands",
       "options": {
-        "command": "yarn docs"
+        "command": "yarn docs",
+        "outputPath": ["libs/docs/src/scripts/build-directory/dist", "libs/docs/src/scripts/build-navigation/dist", "libs/docs/src/scripts/copy-devfile-schemas/dist"]
       }
     },
     "build": {
       "executor": "@nrwl/next:build",
       "outputs": ["{options.outputPath}"],
       "defaultConfiguration": "production",
-      "dependsOn": ["build-docs"],
+      "dependsOn": ["prebuild"],
       "options": {
         "root": "apps/landing-page",
         "outputPath": "dist/apps/landing-page"
@@ -26,7 +27,7 @@
     "serve": {
       "executor": "@nrwl/next:server",
       "defaultConfiguration": "development",
-      "dependsOn": ["build-docs"],
+      "dependsOn": ["prebuild"],
       "options": {
         "buildTarget": "landing-page:build",
         "dev": true
@@ -42,8 +43,15 @@
         }
       }
     },
+    "preexport": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "next-sitemap --config ./apps/landing-page/next-sitemap.config.mjs"
+      }
+    },
     "export": {
       "executor": "@nrwl/next:export",
+      "dependsOn": ["preexport"],
       "options": {
         "buildTarget": "landing-page:build:production"
       }
@@ -64,5 +72,6 @@
       }
     }
   },
-  "tags": []
+  "tags": [],
+  "implicitDependencies": ["docs"]
 }

libs/core/src/components/fence/fence.tsx

@@ -72,7 +72,7 @@ export function Fence(props: FenceProps): JSX.Element {
               </div>
             )}
 
-            <pre className={clsx(className, 'overflow-x-auto px-4 py-3')} style={style}>
+            <pre className={clsx(className, 'flex overflow-x-auto px-4 py-3')} style={style}>
               <code>
                 {tokens.map((line, lineIndex) => (
                   // eslint-disable-next-line react/no-array-index-key

libs/core/src/components/footer/footer.tsx

@@ -62,7 +62,7 @@ export function Footer(): JSX.Element {
                 ))}
               </ul>
             </div>
-            <div className="mt-12 md:mt-0">
+            <div>
               <h3 className="text-sm font-semibold uppercase tracking-wider text-slate-700 dark:text-sky-100">
                 Links
               </h3>

libs/core/src/components/header/header.tsx

@@ -58,15 +58,16 @@ export function Header(): JSX.Element {
             <Search />
           </div>
           <VersionSelector className="relative z-10" />
-          <ThemeSelector className="relative z-10" />
+          <ThemeSelector className="relative z-10 hidden sm:block" />
           {headerNavigation.map((item) => (
             <Link
               key={item.name}
               href={item.href}
               aria-label={item.name}
               className={clsx(
-                !item.image &&
-                  'hidden whitespace-nowrap text-base font-medium text-slate-500 hover:text-slate-800 dark:text-slate-400 dark:hover:text-slate-300 lg:block',
+                item.image
+                  ? 'hidden [@media(min-width:450px)]:block'
+                  : 'hidden whitespace-nowrap text-base font-medium text-slate-500 hover:text-slate-800 dark:text-slate-400 dark:hover:text-slate-300 lg:block',
               )}
             >
               {item.image ? (

libs/core/src/layouts/landing-page-layout/landing-page-layout.tsx

@@ -2,6 +2,7 @@ import Link from 'next/link';
 import { useRouter } from 'next/router';
 import clsx from 'clsx';
 import { PencilIcon } from '@heroicons/react/solid';
+import { githubDocsUrl } from '@devfile-web/docs';
 import { Navigation, Prose, LandingPageSearch as Search, Hero, Fence } from '../../components';
 import { useTableOfContents, useNavigation, useCodeblock, CodeblockProvider } from '../../hooks';
 import type { TableOfContents, TableOfContentsChild } from '../../hooks';
@@ -15,15 +16,15 @@ export interface LandingPageLayoutProps {
 export function LandingPageLayout(props: LandingPageLayoutProps): JSX.Element {
   const { children, title, tableOfContents } = props;
 
-  const { versionedDocsNavigation: docsNavigation } = useNavigation();
+  const { versionedDocsNavigation } = useNavigation();
   const router = useRouter();
   const isDocsPage = router.pathname.includes('docs');
   const isDevfileSchema = router.pathname.includes('/devfile-schema');
-  const allLinks = docsNavigation.flatMap((section) => section.links);
+  const allLinks = versionedDocsNavigation.flatMap((section) => section.links);
   const linkIndex = allLinks.findIndex((link) => link.href === router.pathname);
   const previousPage = allLinks[linkIndex - 1];
   const nextPage = allLinks[linkIndex + 1];
-  const section = docsNavigation.find((section_) =>
+  const section = versionedDocsNavigation.find((section_) =>
     section_.links.find((link) => link.href === router.pathname),
   );
   const { currentSection } = useTableOfContents(tableOfContents);
@@ -48,8 +49,8 @@ export function LandingPageLayout(props: LandingPageLayoutProps): JSX.Element {
     <CodeblockProvider>
       <>
         {router.asPath === '/docs' && <Hero />}
-        <div className="flex sm:px-6 lg:px-8">
-          <div className="relative mx-auto flex max-w-screen-2xl grow justify-center">
+        <div className="block sm:flex sm:px-6 lg:px-8">
+          <div className="relative mx-auto block max-w-screen-2xl grow justify-center sm:flex">
             <div className="hidden lg:relative lg:block lg:flex-none">
               <div className="absolute inset-y-0 right-0 w-[50vw] bg-slate-50 dark:hidden" />
               <div className="sticky top-[4.5rem] -ml-0.5 h-[calc(100vh-4.5rem)] overflow-y-auto py-16 pl-0.5">
@@ -67,7 +68,7 @@ export function LandingPageLayout(props: LandingPageLayoutProps): JSX.Element {
               ) : (
                 <article>
                   {(title || section) && (
-                    <header className="mb-9 space-y-1">
+                    <div className="mb-9 space-y-1">
                       {section && (
                         <p className="font-display text-devfile text-sm font-medium">
                           {section.title}
@@ -78,14 +79,18 @@ export function LandingPageLayout(props: LandingPageLayoutProps): JSX.Element {
                           {title}
                         </h1>
                       )}
-                    </header>
+                    </div>
                   )}
                   <Prose>{children}</Prose>
                 </article>
               )}
               {!isDevfileSchema && (
                 <Prose className="my-8">
-                  <Link data-testid="edit-link" href={allLinks[linkIndex].githubHref} passHref>
+                  <Link
+                    data-testid="edit-link"
+                    href={allLinks[linkIndex]?.githubHref ?? githubDocsUrl}
+                    passHref
+                  >
                     <PencilIcon className="mb-1 inline h-4 w-auto" /> Edit this page
                   </Link>
                 </Prose>

libs/docs/src/types/index.ts

@@ -11,7 +11,7 @@ export interface Section {
   links: {
     title: string;
     href: string;
-    githubHref: string;
+    githubHref?: string;
   }[];
 }
 

package.json

@@ -39,6 +39,7 @@
     "js-yaml": "^4.1.0",
     "next": "^12.2.0",
     "next-compose-plugins": "^2.2.1",
+    "next-sitemap": "^3.1.17",
     "prismjs": "^1.28.0",
     "react": "18.0.0",
     "react-dom": "18.0.0",

yarn.lock

@@ -1316,6 +1316,11 @@
   resolved "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz"
   integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==
 
+"@corex/deepmerge@^4.0.29":
+  version "4.0.29"
+  resolved "https://registry.yarnpkg.com/@corex/deepmerge/-/deepmerge-4.0.29.tgz#af9debf07d7f6b0d2a9d04a266abf2c1418ed2f6"
+  integrity sha512-q/yVUnqckA8Do+EvAfpy7RLdumnBy9ZsducMUtZTvpdbJC7azEf1hGtnYYxm0QfphYxjwggv6XtH64prvS1W+A==
+
 "@cspotcode/source-map-support@^0.8.0":
   version "0.8.1"
   resolved "https://registry.yarnpkg.com/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz#00629c35a688e05a88b1cda684fb9d5e73f000a1"
@@ -12696,6 +12701,14 @@ next-compose-plugins@^2.2.1:
   resolved "https://registry.yarnpkg.com/next-compose-plugins/-/next-compose-plugins-2.2.1.tgz#020fc53f275a7e719d62521bef4300fbb6fde5ab"
   integrity sha512-OjJ+fV15FXO2uQXQagLD4C0abYErBjyjE0I0FHpOEIB8upw0hg1ldFP6cqHTJBH1cZqy96OeR3u1dJ+Ez2D4Bg==
 
+next-sitemap@^3.1.17:
+  version "3.1.17"
+  resolved "https://registry.yarnpkg.com/next-sitemap/-/next-sitemap-3.1.17.tgz#2ba30cd63d89d0d4ffa52557af8f90f2d84a4be8"
+  integrity sha512-xop7KgEbWsqOe4Fr50g9RQ1UGb1bAEJoKYVVynbUqietpSltAnCIzvq/StL2gZcNyFW9K+9tZV7EpcD+72gRrA==
+  dependencies:
+    "@corex/deepmerge" "^4.0.29"
+    minimist "^1.2.6"
+
 next@^12.2.0:
   version "12.2.0"
   resolved "https://registry.yarnpkg.com/next/-/next-12.2.0.tgz#aef47cd96b602bc1307d1dcf9a1ee3e753845544"