[Issue #3434] React USWDS, React, Next.JS upgrade #3515
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
acouch
commented
Jan 14, 2025
| @@ -2,4 +2,4 @@ | |||
| /// <reference types="next/image-types/global" /> | |||
|
|
|||
| // NOTE: This file should not be edited | |||
| // see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information. | |||
| // see https://nextjs.org/docs/app/api-reference/config/typescript for more information. | |||
acouch
commented
Jan 14, 2025
| import { useTranslations } from "next-intl"; | ||
| import Link from "next/link"; | ||
| import Image from "next/image"; |
There was a problem hiding this comment.
Updated this to use the same image strategy as the Footer component because this one doesn't work in React 19/Next 15 (not sure specifically why).
acouch
commented
Jan 14, 2025
There was a problem hiding this comment.
This is no longer used, should have been removed in #507
acouch
commented
Jan 14, 2025
| @@ -22,7 +21,7 @@ export type ValidationErrors = { | |||
| export default function SubscriptionForm() { | |||
| const t = useTranslations("Subscribe"); | |||
|
|
|||
| const [state, formAction] = useFormState(subscribeEmail, { | |||
| const [state, formAction] = useActionState(subscribeEmail, { | |||
acouch
commented
Jan 14, 2025
| @@ -61,7 +61,8 @@ export const createSession = async (token: string) => { | |||
| } | |||
| const expiresAt = newExpirationDate(); | |||
| const session = await encrypt(token, expiresAt, clientJwtKey); | |||
| cookies().set("session", session, { | |||
| const cookie = await cookies(); | |||
There was a problem hiding this comment.
Dynamic APIs are:
- The params and searchParams props that get provided to pages, layouts, metadata APIs, and route handlers.
- cookies(), draftMode(), and headers() from next/headers
In Next 15, these APIs have been made asynchronous. You can read more about this in the Next.js 15 Upgrade Guide.
acouch
commented
Jan 14, 2025
There was a problem hiding this comment.
Removed as no longer using.
acouch
commented
Jan 14, 2025
| @@ -1,5 +0,0 @@ | |||
| import { environment } from "src/constants/environments"; | |||
There was a problem hiding this comment.
This no longer worked, haven't researched why it was necessary. import logoPath from "public/image/logo.png" does work for static images.
acouch
force-pushed
the
acouch/issue-3434-uswds-react-upgrade
branch
from
37824de to
899b198
Compare
acouch
force-pushed
the
acouch/issue-3434-uswds-react-upgrade
branch
from
27d030f to
ae3527a
Compare
|
I've got tests working for upgrading to React 19 and Next.JS 15. Currently working on: 1. Couple of unexpected CSS changes
2. Errors in the console compiling SCSS⚠ ./src/styles/styles.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[11].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[11].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[11].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[11].use[5]!./src/styles/styles.scss
Deprecation Warning on line 13, column 6 of file:///Users/partisan/workshop/grants/simpler-grants-gov2/frontend/node_modules/@uswds/uswds/packages/uswds-core/src/styles/functions/units/rem-to-user-em.scss:13:6:
Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use math.unit instead.
More info and automated migrator: https://sass-lang.com/d/import
13 | @if unit($grid-in-rem) != "rem" {
node_modules/@uswds/uswds/packages/uswds-core/src/styles/functions/units/rem-to-user-em.scss 14:7 rem-to-user-em()
node_modules/@uswds/uswds/packages/uswds-core/src/styles/mixins/helpers/at-media.scss 17:12 at-media()
node_modules/@uswds/uswds/packages/usa-display/src/styles/_usa-display.scss 7:3 @forward
node_modules/@uswds/uswds/packages/usa-display/src/styles/_index.scss 4:1 @forward
node_modules/@uswds/uswds/packages/usa-display/_index.scss 5:1 @forward
node_modules/@uswds/uswds/packages/uswds-typography/_index.scss 5:1 @forward
node_modules/@uswds/uswds/packages/uswds/_index.scss 13:1 @forward
src/styles/styles.scss 2:1 root stylesheet3. Better documenting PR / changes4. Storybook works but could possibly get it working with the pages
|
1 task
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Fixes #3434
Time to review: x mins
Changes proposed
Context for reviewers
Additional information