diff --git a/modules-js/config-babel/browser.js b/modules-js/config-babel/browser.js index 377b3b501..a85df9aea 100644 --- a/modules-js/config-babel/browser.js +++ b/modules-js/config-babel/browser.js @@ -17,6 +17,7 @@ module.exports = api => ({ require('@babel/preset-env'), { useBuiltIns: 'usage', + corejs: 2, modules: api.env('esm') ? false : undefined, }, ], diff --git a/modules-js/config-babel/next.js b/modules-js/config-babel/next.js index 237ac8026..2bc31f41d 100644 --- a/modules-js/config-babel/next.js +++ b/modules-js/config-babel/next.js @@ -14,6 +14,7 @@ module.exports = () => ({ { 'preset-env': { useBuiltIns: 'usage', + corejs: 2, }, }, ], diff --git a/modules-js/config-babel/package.json b/modules-js/config-babel/package.json index f02dc07cc..400416dc0 100644 --- a/modules-js/config-babel/package.json +++ b/modules-js/config-babel/package.json @@ -5,15 +5,15 @@ "license": "CC0-1.0", "private": true, "dependencies": { - "@babel/core": "7.1.2", - "@babel/plugin-proposal-class-properties": "7.1.0", - "@babel/plugin-proposal-decorators": "7.0.0", - "@babel/plugin-transform-runtime": "7.0.0", - "@babel/preset-env": "7.1.0", - "@babel/preset-react": "7.0.0", - "@babel/preset-typescript": "^7.3.2", + "@babel/core": "^7.6.0", + "@babel/plugin-proposal-class-properties": "^7.5.5", + "@babel/plugin-proposal-decorators": "^7.6.0", + "@babel/plugin-transform-runtime": "^7.6.0", + "@babel/preset-env": "^7.6.0", + "@babel/preset-react": "^7.0.0", + "@babel/preset-typescript": "^7.6.0", "babel-plugin-require-context-hook": "^1.0.0", - "next": "8.0.3" + "next": "^9.0.6" }, "devDependencies": { "core-js": "^2.6.4" diff --git a/modules-js/form-common/package.json b/modules-js/form-common/package.json index 46d4dc5e8..dd86b4101 100644 --- a/modules-js/form-common/package.json +++ b/modules-js/form-common/package.json @@ -27,13 +27,13 @@ "core-js": "^2.6.4" }, "peerDependencies": { - "@babel/runtime": "7.1.2", + "@babel/runtime": "^7.6.0", "react": "16.8.5" }, "devDependencies": { - "@babel/cli": "7.1.5", - "@babel/core": "7.1.2", - "@babel/runtime": "7.1.2", + "@babel/cli": "^7.6.0", + "@babel/core": "^7.6.0", + "@babel/runtime": "^7.6.0", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@types/jest": "24.x.x", diff --git a/modules-js/graphql-typescript/package.json b/modules-js/graphql-typescript/package.json index 5dacd6c6d..c6438fa5c 100644 --- a/modules-js/graphql-typescript/package.json +++ b/modules-js/graphql-typescript/package.json @@ -23,8 +23,8 @@ "core-js": "^2.6.4" }, "devDependencies": { - "@babel/cli": "7.1.5", - "@babel/core": "7.1.2", + "@babel/cli": "^7.6.0", + "@babel/core": "^7.6.0", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@types/jest": "24.x.x", @@ -37,4 +37,4 @@ "peerDependencies": { "core-js": "^2.6.4" } -} \ No newline at end of file +} diff --git a/modules-js/hapi-common/package.json b/modules-js/hapi-common/package.json index 4b61e6c1f..9349304e4 100644 --- a/modules-js/hapi-common/package.json +++ b/modules-js/hapi-common/package.json @@ -31,7 +31,7 @@ "inert": "5.x.x" }, "devDependencies": { - "@babel/core": "7.1.2", + "@babel/core": "^7.6.0", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@types/hoek": "^4.1.3", diff --git a/modules-js/hapi-next/package.json b/modules-js/hapi-next/package.json index 6340b506c..ae1ad2e5c 100644 --- a/modules-js/hapi-next/package.json +++ b/modules-js/hapi-next/package.json @@ -22,12 +22,12 @@ "dependencies": { "compression": "^1.6.2", "core-js": "^2.6.4", - "next": "8.0.3", + "next": "^9.0.6", "react": "16.8.5", "react-dom": "16.8.5" }, "devDependencies": { - "@babel/core": "7.1.2", + "@babel/core": "^7.6.0", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@types/hapi": "^17.0.19", diff --git a/modules-js/hapi-next/src/hapi-next.ts b/modules-js/hapi-next/src/hapi-next.ts index e4dfb0ce0..6442dad36 100644 --- a/modules-js/hapi-next/src/hapi-next.ts +++ b/modules-js/hapi-next/src/hapi-next.ts @@ -1,5 +1,4 @@ import querystring from 'querystring'; -import next from 'next'; import compression from 'compression'; import { @@ -34,7 +33,7 @@ import { promisify } from 'util'; * ); */ export function makeRoutesForNextApp( - app: next.Server, + app: any, // Next server object pathPrefix: string = '/', pageRouteOptions: RouteOptions | ((server: HapiServer) => RouteOptions) = {}, staticRouteOptions: @@ -121,7 +120,7 @@ export function makeRoutesForNextApp( * path. E.g.: /certificates/12345 should be handled by the "certificates" page. */ export function makeNextHandler( - app: next.Server, + app: any, // Next server object page: string | null = null ): Lifecycle.Method { return async (request: HapiRequest, h: ResponseToolkit) => { diff --git a/modules-js/mssql-common/package.json b/modules-js/mssql-common/package.json index 0e7681f54..e21bdecdc 100644 --- a/modules-js/mssql-common/package.json +++ b/modules-js/mssql-common/package.json @@ -24,7 +24,7 @@ "mssql": "^4.2.1" }, "devDependencies": { - "@babel/core": "7.1.2", + "@babel/core": "^7.6.0", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@types/jest": "24.x.x", diff --git a/modules-js/next-client-common/package.json b/modules-js/next-client-common/package.json index 16bd13e06..51faa7293 100644 --- a/modules-js/next-client-common/package.json +++ b/modules-js/next-client-common/package.json @@ -28,14 +28,14 @@ "isomorphic-fetch": "^2.2.1" }, "peerDependencies": { - "@babel/runtime": "7.1.2", - "next": "8.0.3", + "@babel/runtime": "^7.6.0", + "next": "^9.0.6", "nprogress": "^0.2.0" }, "devDependencies": { - "@babel/cli": "7.1.5", - "@babel/core": "7.1.2", - "@babel/runtime": "7.1.2", + "@babel/cli": "^7.6.0", + "@babel/core": "^7.6.0", + "@babel/runtime": "^7.6.0", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@types/google.analytics": "^0.0.39", @@ -47,7 +47,7 @@ "concurrently": "^3.5.1", "cross-env": "^5.2.0", "jest": "^24.8.0", - "next": "8.0.3", + "next": "^9.0.6", "nprogress": "^0.2.0", "rimraf": "^2.6.2", "rollup": "^0.60.1", diff --git a/modules-js/react-fleet/package.json b/modules-js/react-fleet/package.json index 38f4c42aa..5bae19964 100644 --- a/modules-js/react-fleet/package.json +++ b/modules-js/react-fleet/package.json @@ -33,7 +33,7 @@ }, "peerDependencies": { "@emotion/core": "^10.0.10", - "@babel/runtime": "7.1.2", + "@babel/runtime": "^7.6.0", "detect-browser": "^3.0.1", "prop-types": "^15.6.0", "react": "16.8.5", @@ -42,10 +42,9 @@ "string-hash": "^1.1.3" }, "devDependencies": { - "@babel/cli": "7.1.5", - "@babel/core": "7.1.2", - "@babel/preset-react": "7.0.0", - "@babel/runtime": "7.1.2", + "@babel/cli": "^7.6.0", + "@babel/core": "^7.6.0", + "@babel/runtime": "^7.1.2", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@cityofboston/percy-common": "^0.0.0", diff --git a/package.json b/package.json index 62c432ed8..84bf8ed0d 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,9 @@ "templates/js-*/build/*" ], "nohoist": [ - "**/@cityofboston/config-typescript" + "**/@cityofboston/config-typescript", + "**/acorn", + "**/acorn-dynamic-import" ] }, "scripts": { diff --git a/services-js/311-indexer/package.json b/services-js/311-indexer/package.json index f00b792b6..8ae61bbea 100644 --- a/services-js/311-indexer/package.json +++ b/services-js/311-indexer/package.json @@ -23,7 +23,7 @@ ] }, "dependencies": { - "@babel/runtime": "7.1.2", + "@babel/runtime": "^7.6.0", "@cityofboston/srv-decrypt-env": "^0.0.0", "aws-sdk": "^2.100.0", "cometd": "^4.0.3", @@ -43,9 +43,9 @@ "url-search-params": "^0.10.0" }, "devDependencies": { - "@babel/cli": "7.1.5", - "@babel/core": "7.1.2", - "@babel/node": "7.0.0", + "@babel/cli": "^7.6.0", + "@babel/core": "^7.6.0", + "@babel/node": "^7.6.1", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@types/cometd": "^4.0.4", diff --git a/services-js/311/README.md b/services-js/311/README.md index bd2a71ccb..c9aab13a1 100644 --- a/services-js/311/README.md +++ b/services-js/311/README.md @@ -4,28 +4,40 @@ The source code for the future [311.boston.gov](https://311.boston.gov). [![Build Status](https://travis-ci.org/CityOfBoston/311.svg?branch=develop)](https://travis-ci.org/CityOfBoston/311) +### todo note: 9/23/19 + +All apps have been upgraded from Next.js 8.x.x => 9.x.x **except** for this one! + +After upgrading (along with Babel from 7.1.x to 7.6.x), running Jest throws + +``` +[mobx] Encountered an uncaught exception that was thrown by a reaction or observer component, in: 'Reaction[RecentRequestRow#3350.render()] { Invariant Violation: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops. +``` + +Since this application is not in production and it is unknown whether it ever will be, it was decided to leave it as-is for the time being. + ## Developers This is a Node project using the [Next.js](https://github.com/zeit/next.js/) framework for server-side rendering. - * **Development Server**: `npm run dev` - * **React Storybook**: `npm run storybook` - * **Tests**: `npm test` or `npm test -- --watch` - * **Lint**: `npm run lint` (uses [ESLint](http://eslint.org/) `--fix` to fix common style errors) +- **Development Server**: `npm run dev` +- **React Storybook**: `npm run storybook` +- **Tests**: `npm test` or `npm test -- --watch` +- **Lint**: `npm run lint` (uses [ESLint](http://eslint.org/) `--fix` to fix common style errors) ### Getting started -__Make sure you have at least Node 8.2 installed, preferrably with `nvm` or +**Make sure you have at least Node 8.2 installed, preferrably with `nvm` or equivalent so you automatically pick up our `.nvmrc` file. Also, `npm` >= 5.3 -(installed by default with Node 8.2 and up) and `gulp-cli`.__ +(installed by default with Node 8.2 and up) and `gulp-cli`.** - 1. Get the Open311 api_key and URL from a friend - 1. Copy `.env.sample` to `.env` and fill in the endpoint and keys - 1. Get other API keys: Mapbox, Searchly, &c. and put them in .env - 1. `yarn install` - 1. `yarn dev` - 1. Visit in your browser +1. Get the Open311 api_key and URL from a friend +1. Copy `.env.sample` to `.env` and fill in the endpoint and keys +1. Get other API keys: Mapbox, Searchly, &c. and put them in .env +1. `yarn install` +1. `yarn dev` +1. Visit in your browser ### JavaScript @@ -37,9 +49,9 @@ preset. Please make full use of: - * [Object rest spread](https://babeljs.io/docs/plugins/transform-object-rest-spread/): `{ foo: 1, ...bar }` - * [Async functions](https://babeljs.io/docs/plugins/transform-async-to-generator/): `async (promisedNum) => (3 + await promisedNum)` - * [Class properties](https://babeljs.io/docs/plugins/transform-class-properties/): `class MyComponent { onClick = () => { this.setState({ clicked: true })} }` +- [Object rest spread](https://babeljs.io/docs/plugins/transform-object-rest-spread/): `{ foo: 1, ...bar }` +- [Async functions](https://babeljs.io/docs/plugins/transform-async-to-generator/): `async (promisedNum) => (3 + await promisedNum)` +- [Class properties](https://babeljs.io/docs/plugins/transform-class-properties/): `class MyComponent { onClick = () => { this.setState({ clicked: true })} }` Code style is enforced by ESLint, which can be run (in `--fix` mode) with `npm run lint`. Committed code must contain no errors or warnings. On a per-file @@ -78,8 +90,7 @@ Components and containers are organized under `/components` by page. For UI-focused development, use [React Storybook](https://getstorybook.io/) by running `npm run storybook` and visiting -**Local use of patterns library:** After running `gulp` and `npx fractal -start -- --watch` in the patterns directory, change `stylesheets.json` to +**Local use of patterns library:** After running `gulp` and `npx fractal start -- --watch` in the patterns directory, change `stylesheets.json` to reference `https://localhost:3001` instead of `cob-patterns-staging`. ## Public domain @@ -94,6 +105,6 @@ This project is in the worldwide [public domain](LICENSE.md). As stated in [LICE If you're interested in helping this project, there are three ways to help. Be sure to checkout our [Guide to Contributing](https://github.com/CityOfBoston/boston.gov/blob/develop/guides/03-contributing-to-boston.gov.md). -* [Report issues on Boston.gov](https://github.com/CityOfBoston/boston.gov/blob/develop/guides/03-contributing-to-boston.gov.md#reporting-bugs) -* [Suggest new features](https://github.com/CityOfBoston/boston.gov/blob/develop/guides/03-contributing-to-boston.gov.md#suggest-new-features) -* [Contributing to development](https://github.com/CityOfBoston/boston.gov/blob/develop/guides/03-contributing-to-boston.gov.md#contributing-to-development) +- [Report issues on Boston.gov](https://github.com/CityOfBoston/boston.gov/blob/develop/guides/03-contributing-to-boston.gov.md#reporting-bugs) +- [Suggest new features](https://github.com/CityOfBoston/boston.gov/blob/develop/guides/03-contributing-to-boston.gov.md#suggest-new-features) +- [Contributing to development](https://github.com/CityOfBoston/boston.gov/blob/develop/guides/03-contributing-to-boston.gov.md#contributing-to-development) diff --git a/services-js/311/components/request/home/HomeDialog.test.tsx b/services-js/311/components/request/home/HomeDialog.test.tsx index b1828434d..d2498ec03 100644 --- a/services-js/311/components/request/home/HomeDialog.test.tsx +++ b/services-js/311/components/request/home/HomeDialog.test.tsx @@ -115,7 +115,8 @@ describe('choose page', () => { }); }); -describe('integration', () => { +// disabled as per Reilly 9/23 jm +xdescribe('integration', () => { let wrapper; let resolveSuggestions; diff --git a/services-js/311/data/store/AddressSearch.test.ts b/services-js/311/data/store/AddressSearch.test.ts index 31cf4e2f3..cf1a8bcab 100644 --- a/services-js/311/data/store/AddressSearch.test.ts +++ b/services-js/311/data/store/AddressSearch.test.ts @@ -65,7 +65,8 @@ describe('searching', () => { addressSearch.stop(); }); - it('updates address and location on success', async () => { + // disabled as per Reilly 9/23 jm + xit('updates address and location on success', async () => { addressSearch.query = '1 City Hall Plaza'; addressSearch.search(false); @@ -85,7 +86,8 @@ describe('searching', () => { expect(addressSearch.intent).toEqual('ADDRESS'); }); - it('searches for an intersection and uses LATLNG intent', async () => { + // disabled as per Reilly 9/23 jm + xit('searches for an intersection and uses LATLNG intent', async () => { addressSearch.query = 'Milk and Washington'; addressSearch.search(false); @@ -115,7 +117,7 @@ describe('searching', () => { expect(addressSearch.addressId).toEqual(null); }); - it('has no selection when search returns multilpe things', async () => { + it('has no selection when search returns multiple things', async () => { addressSearch.query = '1 City Hall Plaza'; addressSearch.search(false); diff --git a/services-js/311/package.json b/services-js/311/package.json index 0c300efea..7ddc94e81 100644 --- a/services-js/311/package.json +++ b/services-js/311/package.json @@ -125,6 +125,7 @@ "@types/storybook__addon-actions": "^3.4.2", "@types/storybook__addon-storyshots": "^3.4.8", "@types/storybook__react": "^4.0.1", + "@zeit/next-typescript": "1.1.1", "babel-core": "^7.0.0-0", "babel-plugin-inline-import": "^2.0.6", "cheerio": "^1.0.0-rc.2", diff --git a/services-js/311/pages/_app.tsx b/services-js/311/pages/_app.tsx index 045ae24f1..b4f082174 100644 --- a/services-js/311/pages/_app.tsx +++ b/services-js/311/pages/_app.tsx @@ -157,16 +157,16 @@ function getInitialPageDependencies( * - GetInitialPropsDependencies are passed as a second argument to getInitialProps * - PageDependencies are spread as props for the page */ -export default class Three11App extends App { +export default class Three11App extends App { // TypeScript doesn't know that App already has a props member. - protected props: Props; + props: Props | any; private pageDependencies: PageDependencies; static async getInitialProps({ Component, ctx, - }: AppGetInitialPropsContext): Promise { + }: AppGetInitialPropsContext | any): Promise { const deps = getInitialPageDependencies(ctx.req); const pageProps = Component.getInitialProps @@ -182,7 +182,7 @@ export default class Three11App extends App { }; } - constructor(props: Props) { + constructor(props: Props | any) { super(props); // We're a little hacky here because TypeScript doesn't have type diff --git a/services-js/311/pages/_document.tsx b/services-js/311/pages/_document.tsx index f5db60990..9f601eadc 100644 --- a/services-js/311/pages/_document.tsx +++ b/services-js/311/pages/_document.tsx @@ -22,8 +22,8 @@ type Props = { rollbarEnvironment: string | undefined; }; -export default class extends Document { - props: Props; +export default class extends Document { + props: Props | any; static async getInitialProps({ renderPage }) { const page = renderPage(); @@ -44,7 +44,7 @@ export default class extends Document { }; } - constructor(props: Props) { + constructor(props: Props | any) { super(props); this.props = props; @@ -68,7 +68,7 @@ export default class extends Document { } = getConfig(); return ( - + diff --git a/services-js/access-boston/next.config.js b/services-js/access-boston/next.config.js index 0ac2adaa6..8aa7f1b57 100644 --- a/services-js/access-boston/next.config.js +++ b/services-js/access-boston/next.config.js @@ -1,9 +1,6 @@ const path = require('path'); -const withTypescript = require('@zeit/next-typescript'); const withPolyfill = require('@cityofboston/next-client-common/with-polyfill')(); -module.exports = withTypescript( - withPolyfill({ - distDir: path.join('..', 'build', '.next'), - }) -); +module.exports = withPolyfill({ + distDir: path.join('..', 'build', '.next'), +}); diff --git a/services-js/access-boston/package.json b/services-js/access-boston/package.json index a75d82653..af0beb987 100644 --- a/services-js/access-boston/package.json +++ b/services-js/access-boston/package.json @@ -35,7 +35,7 @@ "graphql": "0.13.2" }, "dependencies": { - "@babel/runtime": "7.1.2", + "@babel/runtime": "^7.6.0", "@cityofboston/deploy-tools": "^0.0.0", "@cityofboston/form-common": "^0.0.0", "@cityofboston/hapi-common": "^0.0.0", @@ -63,7 +63,7 @@ "js-yaml": "^3.12.0", "jws": "^3.1.5", "moment-timezone": "^0.5.14", - "next": "8.0.3", + "next": "^9.0.6", "next-cookies": "^1.0.2", "node-cleanup": "^2.1.2", "node-fetch": "^2.2.0", @@ -78,8 +78,8 @@ "yup": "0.27.0" }, "devDependencies": { - "@babel/cli": "7.1.5", - "@babel/core": "7.1.2", + "@babel/cli": "^7.6.0", + "@babel/core": "^7.6.0", "@cityofboston/config-babel": "^0.0.0", "@cityofboston/config-typescript": "^0.0.0", "@cityofboston/graphql-typescript": "^0.0.0", @@ -104,7 +104,6 @@ "@types/storybook__react": "^4.0.1", "@types/yar": "^9.0.4", "@types/yup": "^0.26.0", - "@zeit/next-typescript": "1.1.1", "babel-core": "^7.0.0-0", "babel-plugin-inline-import": "^2.0.6", "concurrently": "^3.5.1", diff --git a/services-js/access-boston/src/next-env.d.ts b/services-js/access-boston/src/next-env.d.ts new file mode 100644 index 000000000..7b7aa2c77 --- /dev/null +++ b/services-js/access-boston/src/next-env.d.ts @@ -0,0 +1,2 @@ +/// +/// diff --git a/services-js/access-boston/src/pages/_app.tsx b/services-js/access-boston/src/pages/_app.tsx index 5a90c2acb..355941a41 100644 --- a/services-js/access-boston/src/pages/_app.tsx +++ b/services-js/access-boston/src/pages/_app.tsx @@ -1,5 +1,7 @@ import React from 'react'; -import App, { Container } from 'next/app'; +import App, { AppContext, AppInitialProps, AppProps } from 'next/app'; +import { NextPageContext } from 'next'; + import Router from 'next/router'; import getConfig from 'next/config'; import cookies from 'next-cookies'; @@ -10,7 +12,6 @@ import { FetchGraphql, makeFetchGraphql, RouterListener, - NextContext, GtagSiteAnalytics, ScreenReaderSupport, } from '@cityofboston/next-client-common'; @@ -33,7 +34,7 @@ export interface GetInitialPropsDependencies { } export type GetInitialProps = ( - cxt: NextContext, + cxt: NextPageContext, deps: GetInitialPropsDependencies ) => T | Promise; @@ -67,43 +68,30 @@ export interface PageDependencies { screenReaderSupport: ScreenReaderSupport; } -interface AppInitialProps { - ctx: NextContext; - Component: any; -} - -interface InitialProps { - pageProps: any; +interface Props { serverCrumb: string; } -interface Props extends InitialProps { - Component: any; -} - -interface State { - /** We have to keep the crumb in state because after the initial server-side - * render, getInitialProps is unable to read it off of the cookies. */ - crumb: string; -} - /** * Custom app wrapper for setting up global dependencies: * * - GetInitialPropsDependencies are passed as a second argument to getInitialProps * - PageDependencies are spread as props for the page */ -export default class AccessBostonApp extends App { - // TypeScript doesn't know that App already has a props member. - protected props: Props; - protected state: State; - +export default class AccessBostonApp extends App { private pageDependencies: PageDependencies; + /** + * We have to keep the crumb on the instance because after the initial + * server-side render, getInitialProps is unable to read it off of the + * cookies. + */ + private crumb: string; + static async getInitialProps({ Component, ctx, - }: AppInitialProps): Promise { + }: AppContext): Promise { const initialPageDependencies: GetInitialPropsDependencies = { fetchGraphql: makeFetchGraphql(getConfig(), ctx.req), }; @@ -114,7 +102,7 @@ export default class AccessBostonApp extends App { try { const pageProps = Component.getInitialProps - ? await Component.getInitialProps(ctx, initialPageDependencies) + ? await (Component.getInitialProps as any)(ctx, initialPageDependencies) : {}; return { @@ -122,7 +110,7 @@ export default class AccessBostonApp extends App { serverCrumb: crumb || '', }; } catch (e) { - let redirectUrl; + let redirectUrl: string | null; if (e instanceof RedirectError) { redirectUrl = e.url; @@ -156,17 +144,10 @@ export default class AccessBostonApp extends App { } } - constructor(props: Props) { + constructor(props: Props & AppProps) { super(props); - // We're a little hacky here because TypeScript doesn't have type - // information about App and doesn't know it's a component and that the - // super call above actually does this. - this.props = props; - - this.state = { - crumb: this.props.serverCrumb, - }; + this.crumb = this.props.serverCrumb; this.pageDependencies = { routerListener: new RouterListener(), @@ -199,14 +180,11 @@ export default class AccessBostonApp extends App { render() { const { Component, pageProps } = this.props; - const { crumb } = this.state; return ( - + - - - + ); diff --git a/services-js/access-boston/src/pages/_document.tsx b/services-js/access-boston/src/pages/_document.tsx index 8a5a704fe..1c0ad006e 100644 --- a/services-js/access-boston/src/pages/_document.tsx +++ b/services-js/access-boston/src/pages/_document.tsx @@ -1,4 +1,11 @@ -import Document, { Head, Main, NextScript } from 'next/document'; +import Document, { + Head, + Main, + NextScript, + DocumentInitialProps, + DocumentContext, + DocumentProps, +} from 'next/document'; import { extractCritical } from 'emotion-server'; import { @@ -10,13 +17,25 @@ import { CompatibilityWarning, StatusModal } from '@cityofboston/react-fleet'; import { HEADER_HEIGHT } from '../client/styles'; -export default class MyDocument extends Document { +type Props = { + userAgent: string; + rollbarAccessToken: string | undefined; + rollbarEnvironment: string | undefined; + + css: string; + ids: string[]; +}; + +export default class MyDocument extends Document { props: any; - static getInitialProps({ renderPage, req }) { - const page = renderPage(); + static async getInitialProps({ + renderPage, + req, + }: DocumentContext): Promise { + const page = await renderPage(); const styles = extractCritical(page.html); - const userAgent = req.headers['user-agent']; + const userAgent = req!.headers['user-agent'] || ''; return { ...page, ...styles, @@ -27,12 +46,12 @@ export default class MyDocument extends Document { }; } - constructor(props) { + constructor(props: Props & DocumentProps) { super(props); const { __NEXT_DATA__, ids } = props; if (ids) { - __NEXT_DATA__.ids = ids; + (__NEXT_DATA__ as any).ids = ids; } } @@ -40,7 +59,7 @@ export default class MyDocument extends Document { const { userAgent, rollbarAccessToken, rollbarEnvironment } = this.props; return ( - + diff --git a/services-js/access-boston/src/pages/index.tsx b/services-js/access-boston/src/pages/index.tsx index 8db811e9a..0ddb031cc 100644 --- a/services-js/access-boston/src/pages/index.tsx +++ b/services-js/access-boston/src/pages/index.tsx @@ -2,6 +2,8 @@ import React from 'react'; import Head from 'next/head'; import Link from 'next/link'; +import { css } from 'emotion'; + import { differenceInCalendarDays } from 'date-fns'; import { @@ -10,7 +12,6 @@ import { CHARLES_BLUE, MEDIA_LARGE_MAX, } from '@cityofboston/react-fleet'; -import { css } from 'emotion'; import AccessBostonHeader from '../client/AccessBostonHeader'; import fetchAccountAndApps, { @@ -72,15 +73,6 @@ export default class IndexPage extends React.Component { }; }; - sendEvent2GA = labelVal => { - (window as any).dataLayer.push({ - event: 'access_boston', - eventCategory: 'Access Boston', - eventAction: 'Landing Page App Clicks', - eventLabel: labelVal, - }); - }; - render() { const { account, @@ -191,17 +183,17 @@ export default class IndexPage extends React.Component { @@ -212,24 +204,22 @@ export default class IndexPage extends React.Component { return ( ); diff --git a/services-js/access-boston/src/server/access-boston.ts b/services-js/access-boston/src/server/access-boston.ts index 10e36e3e3..50a1149d7 100644 --- a/services-js/access-boston/src/server/access-boston.ts +++ b/services-js/access-boston/src/server/access-boston.ts @@ -11,7 +11,7 @@ import yar from 'yar'; import cleanup from 'node-cleanup'; import acceptLanguagePlugin from 'hapi-accept-language2'; import hapiDevErrors from 'hapi-dev-errors'; -import next from 'next'; +const next = require('next'); import { ApolloServer } from 'apollo-server-hapi'; import { parse, Compile } from 'velocityjs'; diff --git a/services-js/access-boston/src/server/start.ts b/services-js/access-boston/src/server/start.ts index 62c9f86f6..66c790b79 100644 --- a/services-js/access-boston/src/server/start.ts +++ b/services-js/access-boston/src/server/start.ts @@ -6,7 +6,10 @@ */ // We don't want any local configurations to affect the test runs -if (process.env.NODE_ENV !== 'test' && process.env.NODE_ENV !== 'testcafe') { +if ( + process.env.NODE_ENV !== 'test' && + process.env.NODE_ENV !== ('testcafe' as any) +) { require('dotenv').config(); } @@ -27,3 +30,5 @@ startServer(rollbar).catch((err: Error) => { console.error('Error starting server', err); process.exit(1); }); + +export {}; diff --git a/services-js/access-boston/src/stories/__snapshots__/Storyshots.test.ts.snap b/services-js/access-boston/src/stories/__snapshots__/Storyshots.test.ts.snap index 958508d2f..2451cd5d5 100644 --- a/services-js/access-boston/src/stories/__snapshots__/Storyshots.test.ts.snap +++ b/services-js/access-boston/src/stories/__snapshots__/Storyshots.test.ts.snap @@ -50,6 +50,7 @@ exports[`Storyshots AccessBostonHeader default 1`] = ` Cancel and go back to Access Boston @@ -480,6 +483,7 @@ Array [ Cancel and go back to Access Boston @@ -1682,6 +1689,7 @@ Array [ Cancel and go back to Access Boston @@ -2093,6 +2102,7 @@ Array [ Cancel and go back to Access Boston @@ -2493,6 +2504,7 @@ Array [