web: migrate to web platform- packages (#10908)

website/.eslintrc.js

@@ -1,4 +1,4 @@
 module.exports = {
-  ...require('@hashicorp/nextjs-scripts/.eslintrc.js'),
+  ...require('@hashicorp/platform-cli/config/.eslintrc'),
   ignorePatterns: ['public/']
 }

website/.stylelintrc.js

@@ -1,5 +1,5 @@
 module.exports = {
-  ...require('@hashicorp/nextjs-scripts/.stylelintrc.js'),
+  ...require('@hashicorp/platform-cli/config/stylelint.config'),
   rules: {
     'selector-pseudo-class-no-unknown': [
       true,

website/components/subnav/index.jsx

@@ -18,6 +18,7 @@ export default function NomadSubnav() {
       menuItemsAlign="right"
       menuItems={subnavItems}
       constrainWidth
+      matchOnBasePath
     />
   )
 }

website/next-env.d.ts

@@ -1,2 +1,3 @@
 /// <reference types="next" />
 /// <reference types="next/types/global" />
+/// <reference types="@hashicorp/platform-types" />

website/next.config.js

@@ -1,4 +1,4 @@
-const withHashicorp = require('@hashicorp/nextjs-scripts')
+const withHashicorp = require('@hashicorp/platform-nextjs-plugin')
 const path = require('path')
 const redirects = require('./redirects')
 const rewrites = require('./rewrites')

website/package.json

@@ -7,31 +7,34 @@
     "node": "12.x - 14.x"
   },
   "dependencies": {
-    "@hashicorp/mktg-global-styles": "3.0.1",
-    "@hashicorp/mktg-logos": "^1.1.0",
-    "@hashicorp/nextjs-scripts": "19.0.2",
-    "@hashicorp/react-alert-banner": "6.1.1",
-    "@hashicorp/react-button": "5.0.1",
-    "@hashicorp/react-call-to-action": "3.0.1",
-    "@hashicorp/react-code-block": "4.1.2",
-    "@hashicorp/react-content": "7.0.1",
-    "@hashicorp/react-docs-page": "13.2.0",
-    "@hashicorp/react-featured-slider": "4.0.2",
-    "@hashicorp/react-hashi-stack-menu": "2.0.5",
-    "@hashicorp/react-head": "3.1.0",
-    "@hashicorp/react-hero": "7.1.2",
-    "@hashicorp/react-image": "4.0.1",
-    "@hashicorp/react-inline-svg": "6.0.1",
-    "@hashicorp/react-learn-callout": "1.0.2",
-    "@hashicorp/react-product-downloads-page": "2.0.2",
-    "@hashicorp/react-section-header": "5.0.2",
-    "@hashicorp/react-subnav": "8.1.0",
-    "@hashicorp/react-text-split": "3.1.1",
-    "@hashicorp/react-text-split-with-code": "3.3.2",
-    "@hashicorp/react-text-split-with-image": "4.1.1",
-    "@hashicorp/react-text-split-with-logo-grid": "5.0.0",
-    "@hashicorp/react-use-cases": "3.0.2",
-    "@hashicorp/react-vertical-text-block-list": "6.0.2",
+    "@hashicorp/mktg-global-styles": "^3.1.0",
+    "@hashicorp/mktg-logos": "^1.2.0",
+    "@hashicorp/platform-code-highlighting": "^0.1.1",
+    "@hashicorp/platform-runtime-error-monitoring": "^0.1.0",
+    "@hashicorp/platform-util": "^0.1.0",
+    "@hashicorp/react-alert-banner": "^6.1.2",
+    "@hashicorp/react-button": "^5.2.1",
+    "@hashicorp/react-call-to-action": "^3.1.2",
+    "@hashicorp/react-code-block": "^4.1.4",
+    "@hashicorp/react-consent-manager": "^5.3.2",
+    "@hashicorp/react-content": "^7.0.2",
+    "@hashicorp/react-docs-page": "^13.5.1",
+    "@hashicorp/react-featured-slider": "^4.1.2",
+    "@hashicorp/react-hashi-stack-menu": "^2.0.6",
+    "@hashicorp/react-head": "^3.1.1",
+    "@hashicorp/react-hero": "^7.3.2",
+    "@hashicorp/react-image": "^4.0.2",
+    "@hashicorp/react-inline-svg": "^6.0.2",
+    "@hashicorp/react-learn-callout": "^1.1.2",
+    "@hashicorp/react-product-downloads-page": "^2.3.1",
+    "@hashicorp/react-section-header": "^5.0.3",
+    "@hashicorp/react-subnav": "^8.4.0",
+    "@hashicorp/react-text-split": "^3.2.2",
+    "@hashicorp/react-text-split-with-code": "^3.3.5",
+    "@hashicorp/react-text-split-with-image": "^4.2.2",
+    "@hashicorp/react-text-split-with-logo-grid": "^5.1.2",
+    "@hashicorp/react-use-cases": "^4.0.1",
+    "@hashicorp/react-vertical-text-block-list": "^6.0.3",
     "marked": "0.7.0",
     "next": "10.1.3",
     "next-mdx-remote": "3.0.1",
@@ -42,10 +45,14 @@
     "react-dom": "16.14.0"
   },
   "devDependencies": {
+    "@hashicorp/platform-cli": "^0.2.0",
+    "@hashicorp/platform-nextjs-plugin": "^0.1.0",
+    "@hashicorp/platform-types": "^0.1.0",
     "@types/react": "^17.0.3",
     "dart-linkcheck": "2.0.15",
     "husky": "^6.0.0",
-    "prettier": "2.2.1"
+    "prettier": "2.2.1",
+    "typescript": "^4.3.5"
   },
   "husky": {
     "hooks": {

website/pages/_app.js

@@ -1,12 +1,12 @@
 import './style.css'
-import '@hashicorp/nextjs-scripts/lib/nprogress/style.css'
+import '@hashicorp/platform-util/nprogress/style.css'
 
 import Router from 'next/router'
 import Head from 'next/head'
-import NProgress from '@hashicorp/nextjs-scripts/lib/nprogress'
-import { ErrorBoundary } from '@hashicorp/nextjs-scripts/lib/bugsnag'
-import createConsentManager from '@hashicorp/nextjs-scripts/lib/consent-manager'
-import useAnchorLinkAnalytics from '@hashicorp/nextjs-scripts/lib/anchor-link-analytics'
+import NProgress from '@hashicorp/platform-util/nprogress'
+import { ErrorBoundary } from '@hashicorp/platform-runtime-error-monitoring'
+import createConsentManager from '@hashicorp/react-consent-manager/loader'
+import useAnchorLinkAnalytics from '@hashicorp/platform-util/anchor-link-analytics'
 import HashiStackMenu from '@hashicorp/react-hashi-stack-menu'
 import AlertBanner from '@hashicorp/react-alert-banner'
 import HashiHead from '@hashicorp/react-head'

website/pages/_error.jsx

@@ -1,5 +1,5 @@
 import NotFound from './404'
-import Bugsnag from '@hashicorp/nextjs-scripts/lib/bugsnag'
+import Bugsnag from '@hashicorp/platform-runtime-error-monitoring'
 
 function Error({ statusCode }) {
   return <NotFound statusCode={statusCode} />

website/pages/style.css

@@ -8,21 +8,18 @@
 }
 
 /* Global Transpiled Components */
-@import '~@hashicorp/react-alert/dist/style.css';
 @import '~@hashicorp/react-alert-banner/style.css';
 @import '~@hashicorp/react-button/styles/index.css';
 @import '~@hashicorp/react-call-to-action/style.css';
 @import '~@hashicorp/react-consent-manager/style.css';
 @import '~@hashicorp/react-toggle/style.css';
 @import '~@hashicorp/react-content/style.css';
 @import '~@hashicorp/react-docs-page/style.css';
-@import '~@hashicorp/react-enterprise-alert/style.css';
 @import '~@hashicorp/react-featured-slider/style.css';
 @import '~@hashicorp/react-hero/style.css';
 @import '~@hashicorp/react-learn-callout/style.css';
 @import '~@hashicorp/react-search/style.css';
 @import '~@hashicorp/react-subnav/style.css';
-@import '~@hashicorp/react-tabs/style.css';
 @import '~@hashicorp/react-text-split/style.css';
 @import '~@hashicorp/react-use-cases/style.css';
 @import '~@hashicorp/react-vertical-text-block-list/style.css';

website/pages/use-cases/simple-container-orchestration.jsx

@@ -3,7 +3,7 @@ import TextSplitWithCode from '@hashicorp/react-text-split-with-code'
 import TextSplitWithImage from '@hashicorp/react-text-split-with-image'
 import FeaturedSlider from '@hashicorp/react-featured-slider'
 // Imports below are used in getStaticProps only
-import highlightData from '@hashicorp/nextjs-scripts/prism/highlight-data'
+import highlightData from '@hashicorp/platform-code-highlighting/highlight-data'
 
 export async function getStaticProps() {
   const codeBlocksRaw = {

website/prettier.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  ...require('@hashicorp/nextjs-scripts/prettier.config.js'),
+  ...require('@hashicorp/platform-cli/config/prettier.config'),
 }