Prettier Config

prettier-config.md

trailingComma: es5 (default)

https://prettier.io/docs/en/options.html#trailing-commas

When set to none...

• Often forgetting to add a comma when adding entries to an Object.
• Commenting a property in an object currently removes the comma from the property above it.
• Moving the last property of an object up requires an extra step to add a comma at the end.
• Messes up Git diff and sometimes creates conflicts.

jsxBracketSameLine: false (default)

https://prettier.io/docs/en/options.html#jsx-brackets

When set to true...
Given the following code:

    return (
      <Box
        className={classnames(classes.root, className)}
        isElevated={this.state.isElevated}
        onMouseEnter={() => this.setState({ isElevated: true })}
        onMouseLeave={() => this.setState({ isElevated: false })}>
        <Grid container>
          <Grid item xs={12}>

I wanted to comment out onMouseEnter and onMouseLeave, resulted in broken code:

    return (
      <Box
        className={classnames(classes.root, className)}
        isElevated={this.state.isElevated}
        // onMouseEnter={() => this.setState({ isElevated: true })}
        // onMouseLeave={() => this.setState({ isElevated: false })}>
        <Grid container>
          <Grid item xs={12}>

This is a non-issue with the default false setting:

    return (
      <Box
        className={classnames(classes.root, className)}
        isElevated={this.state.isElevated}
        // onMouseEnter={() => this.setState({ isElevated: true })}
        // onMouseLeave={() => this.setState({ isElevated: false })}
      >
        <Grid container>
          <Grid item xs={12}>