chaance

// With template literal types this kind of thing is a breeze! 
type RootActionPrefix = 'auth';
type ActionType = 'LOGIN' | 'LOGOUT';
type RootActionTypes = `${RootActionPrefix}/${ActionType}`;


// Is there any sort of mapped-type magic that would let me
// turn this...
type AuthActions = 
  | { type: 'LOGIN'; user: UserNoPassword }

chaance

describe("when navigating between focused buttons", () => {
  let buttons: HTMLElement[];
  beforeAll(() => {
    let rendered = renderTestAccordion();
    buttons = rendered.buttons;
  });

  it("should move focus to the next focusable button on `ArrowDown` press", () => {
    // document.activeElement is the body here, cool
    buttons[0].focus();

chaance

Browser JavaScript and Node overlap:

• Browser JavaScript
  • window
  • document
  • localStorage
• Node
  • fs
  • path
  • http
• Both

chaance

const PLAID_KEYS = ["CLIENT_ID", "PUBLIC_KEY", "SECRET_KEY"] as const;

const PREFIX = 'PLAID_'
const POST_FIX =
  process.env.NODE_ENV === "development"
    ? "_DEV"
    : process.env.NODE_ENV === "production"
    ? ""
    : "_TEST";

chaance

Prerequisites

For taking our Core Workshop, attendees should:

• Carefully review the README in our workshop repository, particularly the section "What do I need to do before attending React Training" Checklist
  • Install and Setup outlines the software requirements for running the workshop lessons and exercises
  • We highly recommend enabling attendees to run software locally for the best experience
  • We highly recommend having attendees clone our repository, run all scripts outlined in the README, and working through potential issues before the workshop starts to reduce time spent on troubleshooting and eating into instruction time
• We will be running the core-v2 course, so run scripts relevant to that when prompted (See [*Running the Course and Lesson Mat

chaance

class Base {
  static booted() {
    console.log(false);
  }

  constructor() {
    // This is a valid way to call a static method
    // from a non-static method AFAICT.
    // Anyone know why TS can't infer more from
    // from the type of this.constructor?

chaance

const Nobr = React.forwardRef((props, ref) => (
  <span ref={ref} {...props} style={{ whiteSpace: 'nowrap', ...props.style }} />
));

chaance

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

chaance

const { state, send } = useStateMachine({
  id: 'presence',
  initial: present ? 'mounted' : 'unmounted',
  states: {
    mounted: {
      on: {
        UNMOUNT: 'unmounted',
        ANIMATION_OUT: 'unmountSuspended',
        TRANSITION_OUT: 'unmountSuspended',
      },

chaance

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions