Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[MPDX-8445] NextJS v13 upgrade #1204

Merged
merged 16 commits into from
Nov 21, 2024
Merged

[MPDX-8445] NextJS v13 upgrade #1204

merged 16 commits into from
Nov 21, 2024

Conversation

canac
Copy link
Contributor

@canac canac commented Nov 19, 2024

Description

Upgrade to NextJS v13. The main change was changing all of our next/link components (migration guide). Links now create an a element instead of needing to have a single child that is an a element. In the future we no longer have to use passHref or legacyBehavior (and we should not use either of those props in the future).

Other changes

Amplify config changes

  • I migrated our Amplify app to the Web Compute SSR provider (https://docs.aws.amazon.com/amplify/latest/userguide/update-app-nextjs-version.html).
  • I migrated our Amplify app to use the Amazon Linus 2023 build image.
  • I removed the NODE_ENV environment variable. Setting it to development caused build errors, and the Next.js docs advise against this. It is automatically set to production by Next.js when running yarn build, so we don't need to manually set it.
  • I removed the version overrides for Node.js and Next.js because we are manually setting the Node.js version with nvm and setting the Next.js version with package.json.

MPDX-8445

Checklist:

  • I have given my PR a title with the format "MPDX-(JIRA#) (summary sentence max 80 chars)"
  • I have applied the appropriate labels. (Add the label "On Staging" to get the branch automatically merged into staging.)
  • I have requested a review from another person on the project

* @mui/material, @mui/icons-material, and lodash are optimized by default
  https://nextjs.org/docs/13/app/api-reference/next-config-js/optimizePackageImports
* Fix webpack rule matcher
@canac canac added the Preview Environment Add this label to create an Amplify Preview label Nov 19, 2024
@canac canac requested a review from dr-bizz November 19, 2024 19:46
@canac canac self-assigned this Nov 19, 2024
Copy link
Contributor

Preview branch generated at https://8445-nextjs-13-upgrade.d3dytjb8adxkk5.amplifyapp.com

Copy link
Contributor

github-actions bot commented Nov 19, 2024

Bundle sizes [mpdx-react]

Compared against e5e950c

Route Size (gzipped) Diff
/ 82.26 KB +1.69 KB
/404 82.83 KB +1.69 KB
/500 82.79 KB +1.69 KB
/_app 390.87 KB +8.61 KB
/_error 82 KB +1.64 KB
/accountLists 122.26 KB +2.83 KB
/accountLists/[accountListId] 273.42 KB +6.51 KB
/accountLists/[accountListId]/coaching/[coachingId] 253.79 KB +5.69 KB
/accountLists/[accountListId]/contacts/[[...contactId]] 107.08 KB -3.09 KB
/accountLists/[accountListId]/contacts/flows/setup 168.93 KB -6.55 KB
/accountLists/[accountListId]/reports/coaching 253.75 KB +5.69 KB
/accountLists/[accountListId]/reports/designationAccounts 248.21 KB +5 KB
/accountLists/[accountListId]/reports/donations/[[...contactId]] 350.4 KB +1.57 KB
/accountLists/[accountListId]/reports/expectedMonthlyTotal/[[...contactId]] 124.97 KB -4.32 KB
/accountLists/[accountListId]/reports/financialAccounts 256.37 KB +1.72 KB
/accountLists/[accountListId]/reports/financialAccounts/[financialAccountId] 118.29 KB -2.88 KB
/accountLists/[accountListId]/reports/financialAccounts/[financialAccountId]/entries 289.08 KB -5.91 KB
/accountLists/[accountListId]/reports/partnerCurrency/[[...contactId]] 132.35 KB -5.5 KB
/accountLists/[accountListId]/reports/partnerGivingAnalysis/[[...contactId]] 132 KB -4.42 KB
/accountLists/[accountListId]/reports/salaryCurrency/[[...contactId]] 132.35 KB -5.5 KB
/accountLists/[accountListId]/settings/admin 133.61 KB -1.28 KB
/accountLists/[accountListId]/settings/integrations 157.65 KB -4.33 KB
/accountLists/[accountListId]/settings/manageAccounts 139.68 KB -2.91 KB
/accountLists/[accountListId]/settings/manageCoaches 136.26 KB -2.79 KB
/accountLists/[accountListId]/settings/organizations 135.13 KB -1.48 KB
/accountLists/[accountListId]/settings/organizations/accountLists 138.18 KB -1.95 KB
/accountLists/[accountListId]/settings/organizations/contacts 135.29 KB -1.63 KB
/accountLists/[accountListId]/settings/preferences 206.66 KB -5.2 KB
/accountLists/[accountListId]/tasks/[[...contactId]] 139.27 KB -7.06 KB
/accountLists/[accountListId]/tools 144.35 KB -2.22 KB
/accountLists/[accountListId]/tools/appeals 187.15 KB -3.44 KB
/accountLists/[accountListId]/tools/appeals/appeal/[[...appealId]] 211.76 KB -6.41 KB
/accountLists/[accountListId]/tools/fix/commitmentInfo/[[...contactId]] 239.92 KB -12.51 KB
/accountLists/[accountListId]/tools/fix/emailAddresses/[[...contactId]] 161.77 KB -4.16 KB
/accountLists/[accountListId]/tools/fix/mailingAddresses/[[...contactId]] 119.91 KB -4.87 KB
/accountLists/[accountListId]/tools/fix/phoneNumbers/[[...contactId]] 142.83 KB -4.36 KB
/accountLists/[accountListId]/tools/fix/sendNewsletter/[[...contactId]] 118 KB -4.37 KB
/accountLists/[accountListId]/tools/import/csv 108.29 KB -3.14 KB
/accountLists/[accountListId]/tools/import/google 155.71 KB -3.78 KB
/accountLists/[accountListId]/tools/import/tnt 150.35 KB -3.35 KB
/accountLists/[accountListId]/tools/merge/contacts/[[...contactId]] 118.8 KB -4.56 KB
/accountLists/[accountListId]/tools/merge/people/[[...contactId]] 118.1 KB -4.56 KB
/account_lists/[accountListId]/accept_invite/[inviteId] 81.79 KB +1.65 KB
/login 122.72 KB +3.08 KB
/logout 82.59 KB +1.62 KB
/organizations/[orgId]/accept_invite/[inviteId] 81.79 KB +1.65 KB
/setup/connect 127.09 KB -1.42 KB
Dynamic import Size (gzipped) Diff
../src/components/Contacts/ContactDetails/ContactDetailsTab/DynamicContactDetailsTab.tsx -> ./ContactDetailsTab 71.57 KB -6.99 KB
../src/components/Contacts/ContactDetails/ContactDetailsTab/Mailing/AddAddressModal/DynamicAddAddressModal.tsx -> ./AddAddressModal 73.6 KB -1.03 KB
../src/components/Contacts/ContactDetails/ContactDonationsTab/DynamicContactDonationsTab.tsx -> ./ContactDonationsTab 196.95 KB +4.86 KB
../src/components/Contacts/ContactDetails/ContactNotesTab/DynamicContactNotesTab.tsx -> ./ContactNotesTab 1.04 KB -1.21 KB
../src/components/Contacts/ContactFlow/DynamicContactFlow.tsx -> ./ContactFlow 54.53 KB -6.1 KB
../src/components/Contacts/ContactsList/DynamicContactsList.tsx -> ./ContactsList 38.07 KB -3.78 KB
../src/components/Contacts/ContactsRightPanel/DynamicContactsRightPanel.tsx -> ./ContactsRightPanel 126.89 KB -8.09 KB
../src/components/Contacts/MassActions/AddTags/DynamicMassActionsAddTagsModal.tsx -> ./MassActionsAddTagsModal 37.52 KB -1 KB
../src/components/Contacts/MassActions/AddToAppeal/DynamicMassActionsAddToAppealModal.tsx -> ./MassActionsAddToAppealModal 36.71 KB -1002 B
../src/components/Contacts/MassActions/AddToAppeal/DynamicMassActionsCreateAppealModal.tsx -> ./MassActionsCreateAppealModal 25.19 KB -1.03 KB
../src/components/Contacts/MassActions/Merge/DynamicMassActionsMergeModal.tsx -> ./MassActionsMergeModal 5.9 KB -2.83 KB
../src/components/Contacts/MassActions/RemoveTags/DynamicMassActionsRemoveTagsModal.tsx -> ./MassActionsRemoveTagsModal 25.92 KB -1.1 KB
../src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportPhysical/DynamicExportPhysical.tsx -> ./ExportPhysical 2.31 KB -1.23 KB
../src/components/Dashboard/ThisWeek/WeeklyActivity/WeeklyReportModal/DynamicWeeklyReportModal.tsx -> ./WeeklyReportModal 31.64 KB -1.05 KB
../src/components/Layouts/Primary/TopBar/Items/AddMenu/Items/CreateContact/DynamicCreateContact.tsx -> ./CreateContact 26.33 KB -1.2 KB
../src/components/Layouts/Primary/TopBar/Items/SearchMenu/DynamicSearchDialog.tsx -> ./SearchDialog 14.93 KB -1.16 KB
../src/components/Shared/Filters/DynamicFilterPanel.tsx -> ./FilterPanel 104.03 KB -2.98 KB
../src/components/Task/MassActions/RemoveTags/DynamicMassActionsTasksRemoveTagsModal.tsx -> ./MassActionsTasksRemoveTagsModal 26.38 KB -1.04 KB
../src/components/Task/Modal/Form/Complete/DynamicTaskModalCompleteForm.tsx -> ./TaskModalCompleteForm 106.58 KB -1.94 KB
../src/components/Task/Modal/Form/DynamicTaskModalForm.tsx -> ./TaskModalForm 114.15 KB -2.48 KB
../src/components/Tool/Appeal/Flow/DynamicContactFlow.tsx -> ./ContactFlow 54.53 KB -6.1 KB
../src/components/Tool/Appeal/List/ContactsList/DynamicContactsList.tsx -> ./ContactsList 38.07 KB -3.78 KB
../src/components/Tool/Appeal/Modals/AddAppealModal/DynamicAddAppealModal.tsx -> ./AddAppealModal 39.73 KB -1.86 KB
../src/components/Tool/Appeal/Modals/AddContactToAppealModal/DynamicAddContactToAppealModal.tsx -> ./AddContactToAppealModal 37.53 KB -1 KB
../src/components/Tool/Appeal/Modals/AddExcludedContactModal/DynamicAddExcludedContactModal.tsx -> ./AddExcludedContactModal 10.8 KB -4.43 KB
../src/components/Tool/Appeal/Modals/DeleteAppealContact/DynamicDeleteAppealContactModal.tsx -> ./DeleteAppealContactModal 2.39 KB -1.53 KB
../src/components/Tool/Appeal/Modals/DeleteAppealModal/DynamicDeleteAppealModal.tsx -> ./DeleteAppealModal 1.05 KB -1.24 KB
../src/components/Tool/Appeal/Modals/DeletePledgeModal/DynamicDeletePledgeModal.tsx -> ./DeletePledgeModal 1.95 KB -1.43 KB
../src/components/Tool/Appeal/Modals/EditAppealHeaderInfoModal/DynamicEditAppealHeaderInfoModal.tsx -> ./EditAppealHeaderInfoModal 25.87 KB -1.12 KB
../src/components/Tool/Import/Csv/DynamicCsvHeaders.tsx -> ./CsvHeaders 38.94 KB -3.08 KB
../src/components/Tool/Import/Csv/DynamicCsvPreview.tsx -> ./CsvPreview 52.2 KB -1.79 KB
../src/components/Tool/Import/Csv/DynamicCsvUpload.tsx -> ./CsvUpload 3.91 KB -1.24 KB
../src/components/Tool/Import/Csv/DynamicCsvValues.tsx -> ./CsvValues 37.06 KB -1.85 KB

Copy link
Contributor

@dr-bizz dr-bizz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code looks great! Thank you for doing this. I have reviewed all the code apart from the changes about 45 mins ago. I have also reviewed it on the Amplify preview URL.

It looks good. I had some comments, and I still need to review your new changes.

@dr-bizz dr-bizz self-requested a review November 21, 2024 14:46
Copy link
Contributor

@dr-bizz dr-bizz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is looking good. I have a few comments, but no big changes. I will approve so you are not blocked.

Do you also want to change pages/accountLists/[accountListId]/contacts/[[...contactId]].page.tsx title to match how you have done the titles on other pages? I'm not too fussed about it

 <title>
          {appName} |{' '}
          {viewMode === TableViewModeEnum.Flows
            ? t('Contact Flows')
            : viewMode === TableViewModeEnum.Map
            ? t('Contacts Map')
            : t('Contacts')}
        </title>
        ```

@canac canac force-pushed the 8445-nextjs-13-upgrade branch from 4c97ea1 to 6087e61 Compare November 21, 2024 17:21
@canac canac merged commit ce5fe5b into main Nov 21, 2024
17 of 18 checks passed
@canac canac deleted the 8445-nextjs-13-upgrade branch November 21, 2024 17:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Preview Environment Add this label to create an Amplify Preview
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants