So many options in life…

hardships.ts

// X)
it('JUST works', () => {
  let result = appendQueryParams('rat.com', { a: 1, b: 'cool' })
  expect(result).toEqual('rat.com?a=1&b=cool')
])

// Y)
it('JUST works', () => { 
  expect(
    appendQueryParams('rat.com', { a: 1, b: 'cool' })
  ).toEqual('rat.com?a=1&b=cool')
])


// Mike sez: X is slightly more akward w/ multiple results in a block (only 1st one has let), but is preffered.

pangea.tsx

// (Z)

export function SubmitButton({ onClick, branding, disabled }: {
  branding: Branding,
  disabled: boolean;
  onClick: () => void,
}) {
  return <button />
}

// (ZZ)

interface Props {
  branding: Branding;
  disabled: boolean;
  onClick: () => void;
}

export function SubmitButton({ onClick, branding, disabled }: Props) {
  return <button />
}
  
  
// Mike sez: pref the readability of the second, but hovering over the type in vscode doesn't show the prop types, just
// `function SubmitButton({ onClick, branding, disabled }: Props): JSX.Element`.
// Need to cmd+click in to it, or start typing and let it tell you what you're missing.

rat-claws.tsx

A)
        <Header
          branding={branding}
          title={title}
          timer={timer}
        />

B)                  
        <Header {...{ branding, title, timer }} />


// Not a strong pref here, B is a lil odd but maybe prefered