Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Initialise Next.js app using create-next-app Command run: npx create-next-app@latest * Also tell VSCode to format TS and TSX files * WIP: Sign in with next-auth * Add Fluent Unfortunately, since the ReactLocalization object contains functions, it can't be shared between client and server (because functions can't be serialized), so in effect every page that uses localisation has to be a client component. But at least we can set the correct `lang` attribute on <html> on the server, so there's that :) * Copy-paste public breach scan into Next.js * Halfway migrate public breach list Did not do: breach icons and getLocale() (for list and date formatting). * Enable SSR for localised strings This allows our pages to be Server Components now. * Download breach logos in Next.js server * Tell search engines not to index non-prod envs * Port existing security headers from Helmet to Next * Add a 404 page * Relax CSP in local development * Set up Next-Auth for server components It still doesn't work at the moment because the correct redirect URL hasn't yet been set up on FxA. * Apply Prettier to Next.js files on commit * Enable Sass * feat: Port existing landing page * fix: Set hibp footer as html * Wire up Next.js to FxA using iron-session * feat: Port main layout for authenticated pages * chore: Get session in layout * Set up Prettier for VSCode users * fix: Provide fxa user menu with data * chore: Format Create Next App template * Make Next-Auth work with FxA To test, add the following two variables to your .env: NEXTAUTH_URL=http://localhost:6060 NEXTAUTH_SECRET=<generate using `openssl rand -base64 32`> You can then add <SignInButton/> to e.g. the landing page to kick off authentication. * Port breach-detail page to Next.js * Add pending translations * Access session data in React components * Use Prettier as the formatter in VSCode * Port Nebula & Protocol tokens into tokens file * merge: Resolve conflicts * fix: Move hr into li element * feat: Handle authenticated users * chore: Add todo note * chore: Don’t use default exports for SignInButton and UserMenu * chore: Move site navigation to client-side component * Make mozlog work with Next.js Unfortunately, this required patching the `intel` package. That said, since that package hasn't been updated in six years, this should be relatively safe. The problem is that `intel` was trying to dynamically determine which modules to load based on which files were present in its directory. However, since Next.js moves (and presumably bundles) Node modules into the `.next` folder, it was unable to find the modules that `mozlog` was expecting to use. The patch fixes this by simply explicitly importing those four modules. * Add back a couple of authentication logs * add woff files and metropolis css file * add right font path * format scss file to include camelcase * chore: Move components into (nextjs_migration) and remove redundant layout file * chore: Remove redirect landing page -> dashboard * chore: Redirect to dashboard upon signin * add title and body copy variables * use token variables in landing scss file instead of old variables from variables.css * feat: Add basic dashboard page elements * chore: Add circle chart web component * chore: Add custom select web component * breaches get and put calls * cleanup * get rid of debug logs * Add sentry to nextJS branch (#3075) MNTOR-1641 - enable Sentry for NextJS, for front- and back-end code * chore: Render user breaches * feat: Port breach resolution api * fix: Check breach resolution filter by default * chore: Add redirect /user/dashboard -> /user/breaches * feat: Add breach page types * chore: Remove breach resolution API call headers * fix: Rename changed API response data key * add template button component * remove assets * add button styling * chore: Trigger auto signIn for pages that require authentication * chore: Update breach types * chore: Repurpose HIBP BreachDataTypes * chore: Don’t capitalize first letter of chart label * chore: Remove duplicate font size * chore: Rename BreachResolutionApiBody -> BreachResolutionRequest * Add a redirect from /security-tips for Next.js This was already present in the Express-based website. * Add the app shell for the React-based website * chore: Re-enable gtag * use old font code and add status pill component * remove unnecessary package additions and style status pills * lint * test exposurecard data func * MNTOR-1765 - set title, favicon, and meta tag correctly for nextjs app (#3082) * Port unsubscribe-monthly page to Next.js * add toggle to exposurecard accordion * add icons to exposure type * Ease transition from `getMessage` This adds a `getStringLookup` API to ease the transition from old Fluent functions (which depend on the user's locale being stored in AsyncLocalStorage). It will behave the same as the old getMessage() when called as-is, but when passed an instance of ReactLocalization (which we have access to in Next.js routes), it will retrieve the localised string from that. * Add preliminary Subscriber table type definition * Process new user sign-in This does a couple of things: - It updates the code that sends the breach check email on first sign-in to pass an instance of ReactLocalization. - It splits session data and JWT properties to separate data provided to use by FxA from data we store in our own database. - It checks if the user that signs in is already known in our database, and if not, it adds them. It does so using mostly the same code as in /src/controllers/auth.js's `confirmed` function. * dockerflow endpoints * remove introduction.mdx for now, refine button states * apply some changes * Move new components out of migration dir * Delete .bash_profile * Delete storybook.log * Delete main.js * Delete preview.js * remove use of inter for now * feat: add email api * feat: remove email api * verify email * update comms options * light refactoring * take shared function out to util * send verification email * add another property to EmailRow * add some types * rename route * fix review comment * Fix MNTOR-1634: Stub /settings page (auth) * Remove commented code, add CSS, match HTML markup from previous iterations * Remove/comment out logic dependent on session info * Wire up settings page and new APIs * Work around radio button unchecking on page load * Adding a catch all 404 Not ideal but the best solution at the moment Co-authored-by: Vincent <Vinnl@users.noreply.github.com> * version route * remove log * Port admin pages to Next.js The Notification email doesn't work yet, because it's not clear yet how to trigger the Cloud Function. * Add Storybook build output folder to gitignore * Set up Netlify * Group Storybook ignores together * add node env Co-authored-by: Vincent <Vinnl@users.noreply.github.com> * fix test * fix npm test * fix css lint * fix lint js * exclude sentry.* * Set up the actual linting we'll use * Prettier-ignore appropriate files, format the rest * Fix/ignore ESLint and TypeScript errors * Make tests work with getStringLookup * Remove now-unused dependencies and build scripts * Update CI scripts for Next.js * Add missing Next.js dependencies to the lockfile These were added when running `next build`. * Tag Next.js migration TODOs * Make "add email" dialog work on dashboard * Load client-side scripts as modules This is the same the old website did, and avoids e.g. different `init` functions overriding each other. * Fix loading of FxA avatar * Use <BreachLogo> component * Allow Next.js's inline scripts/styles in prod For `style-src`, the current website already enables 'unsafe-inline'. For script-src, it looks like we currently cannot avoid that: vercel/next.js#51039 * Debug Playwright (#3118) --------- Co-authored-by: Florian Zia <zia.florian@gmail.com> Co-authored-by: Kaitlyn <kandres@mozilla.com> Co-authored-by: Joey Zhou <jozhou@mozilla.com> Co-authored-by: Robert Helmer <rhelmer@mozilla.com> Co-authored-by: maxxcrawford <maxx.crawford@gmail.com>
- Loading branch information
6 people
committed
Jun 12, 2023
1 parent
c1d81b8
commit b569933