negamaxi

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  // ^ Prettier will format files on save.
  "editor.codeActionsOnSave": {
    "source.fixAll": true
  },
  // ^ ESLint will fix possible issues on save.
  
  // "javascript.validate.enable": false

negamaxi

export const i18nContext = React.createContext(null);

negamaxi

// Assuming you have a group of modules described within individual files:

// - group/module1.js
// - group/module2.js
// - group/module3.js

// ...where each module*.js file has a corresponding named export:

// - group/module1.js

negamaxi

[options]
module.name_mapper.extension='module.css' -> 'CSSModule'
module.name_mapper.extension='svg' -> 'SVGModule'
module.system=haste

negamaxi

// Outside props goes here first to be transformed according to Component's logic

export const useComponentState = props => {
  const { disabled } = props;

  const [loggedIn, setLoggedIn] = React.useState(initialLoggedIn);

  const onLogInButtonClick = () => {
    if (!disabled) {
      setLoggedIn(true);

negamaxi

// External state example (Redux e.g)

class SimplerReactForm extends React.Component {
 
  handleInputChange = (e) => {
    const { name, value } = e.target
    this.props.onChange({
      ...this.props.values,
      [name]: value
    })

negamaxi

const asyncTimeout = (timeout) => new Promise(
  resolve => setTimeout(resolve, timeout)
)

export default asyncTimeout

negamaxi

const value = 'text'

// - without else statement

// single-line
return (
  <div>
    {
      value && <span>{value}</span>
    }