Dev: Style

We use Google Style Guide and eslint for automatic enforcement during checkin.

See the Bldrs .eslintrc.js config for details.

File layout

• Default export should be first statement after import, 2 spaces between
• Classes and most important functions should be sorted to top of file
• Inside React component sort: useStore, useState, useHook, local var, useEffect, return <>

Imports

Import sort algorithm is:

1. By source

• import Thing from 'sort-by-this'

2. Alphabetical, capital letters before lowercase
3. Far to near

• Node
• Namespaced node, i.e. '@org/pkg'
• (../../, then ../) to most local (./)

4. Code before resources

• JS/TS
• JSON
• CSS
• Icons

For example:

import NpmLib from 'NpmLib'
import {item} from 'OtherNpmLib'
import LowerPriority from '@mui' // self-hosted 
import OursOtherPackage from '../../up/here.jsx'
import OursThisPackage from './relative/path' // no .js or .jsx
import {ours2} from './foo'
import ShareCss from '../assets/Share.css' // CSS, then SVG, last
import ShareIcon from '../assets/2D_Icons/Share.svg'