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

[core] Create shared Next.js baseline config #34259

Merged

Conversation

oliviertassinari
Copy link
Member

@oliviertassinari oliviertassinari commented Sep 11, 2022

The current configuration leads to this bug:

Screenshot 2022-09-11 at 01 24 53

So instead, I have created a function to extend a Next.js configuration file. It's similar to https://github.com/martpie/next-transpile-modules/blob/master/src/next-transpile-modules.js. It was suggested in mui/toolpad#866 (comment). I have used the opportunity to normalize how we use env tokens based on mui/toolpad#809 (comment).

https://deploy-preview-34259--material-ui.netlify.app/

This change should unlock:

@oliviertassinari oliviertassinari added docs Improvements or additions to the documentation core Infrastructure work going on behind the scenes labels Sep 11, 2022
@oliviertassinari oliviertassinari requested a review from a team September 11, 2022 00:16
@mui-bot
Copy link

mui-bot commented Sep 11, 2022

No bundle size changes

Generated by 🚫 dangerJS against 2cbf834

@@ -9,7 +9,11 @@ import FormLabel from '@mui/material/FormLabel';
import FormHelperText from '@mui/material/FormHelperText';
import InputBase, { inputBaseClasses } from '@mui/material/InputBase';
import CheckCircleRoundedIcon from '@mui/icons-material/CheckCircleRounded';
import CONFIG from 'docs/src/config';

const NEWSLETTER_SUBSCRIBE_URL =
Copy link
Member

@Janpot Janpot Sep 12, 2022

Choose a reason for hiding this comment

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

Would it make sense to avoid passing DEPLOY_ENV to the application code entirely, and instead calculate these options centrally, in the next.js baseline config?

env: {
  NEWSLETTER_SUBSCRIBE_URL: isProduction ? '...' : '...',
  GA_ID: isProduction ? 'UA-106598593-2' : 'UA-106598593-3',
  GA_SAMPLING_RATE: isProduction ? 80 : 100,
  ENABLE_TOOLPAD: isProduction,
  // ...
}

Copy link
Member Author

@oliviertassinari oliviertassinari Sep 12, 2022

Choose a reason for hiding this comment

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

Would it make sense to avoid passing DEPLOY_ENV to the application code entirely

@Janpot What's the value of this change? I understand the value of this indirection for secrets and constants used multiple times, but I don't get it for the rest. My goal in removing docs/src/config was to centralize the logic as much as possible in the same files.


A side note. I would also be in favor of removing docs/src/route. The values feel no different from using the URLs directly.

Copy link
Member

@Janpot Janpot Sep 12, 2022

Choose a reason for hiding this comment

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

What's the value of this change?

It's not critical at all, it would mostly improve maintainability a bit and be more defensive code.

  • It creates a natural overview of which features are enabled for which environment. This is especially handy when a new environment has to be defined (e.g. new type of integration tests)

  • Injects the environment specific flags through the webpack define plugin. This prevents future maintainers from accidentally creating code that doesn't minify unused configuration away. e.g.

    // Minifies to `const NEWSLETTER_SUBSCRIBE_URL = 'url a'`
    const NEWSLETTER_SUBSCRIBE_URL = process.env.DEPLOY_ENV === 'production' ? 'url a' : 'url b'
    
    // Minifies to 
    //   const isProd = () => true
    //   const NEWSLETTER_SUBSCRIBE_URL = isProd() ? 'url a' : 'url b'
    const isProd = () => process.env.DEPLOY_ENV === 'production'
    const NEWSLETTER_SUBSCRIBE_URL = isProd() ? 'url a' : 'url b'
    
    // Injecting process.env.NEWSLETTER_SUBSCRIBE_URL directly prevents this from ever happening
  • Avoids duplicating logic in case a certain flag is used in multiple places in the application. Or when the same flag is used between build time and run time

I would also be in favor of removing docs/src/route. The values feel no different from using the URLs directly.

Yes, it's not critical neither. For me, the main advantage of such a file would be around static analyzability of where certain links are used. Especially when people start defining links like /section-${sections.slug} in one place and /section-intro in others. Such constructs are hard to search for. If you use something like a sectionLink('intro') everywhere that could be easily listed using "find references" in vscode

Copy link
Member

Choose a reason for hiding this comment

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

It's minor, I'm more than fine for this PR to be merged as is

docs/nextConfigBaseline.js Outdated Show resolved Hide resolved
@oliviertassinari
Copy link
Member Author

It has been a week, I'm merging.

@oliviertassinari oliviertassinari merged commit 174076b into mui:master Sep 17, 2022
@oliviertassinari oliviertassinari deleted the create-baseline-next-config branch September 17, 2022 12:11
daniel-rabe pushed a commit to daniel-rabe/material-ui that referenced this pull request Nov 29, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
core Infrastructure work going on behind the scenes docs Improvements or additions to the documentation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants