jossmac

const CATEGORIES = [
  { id: 'animals', parent: null },
  { id: 'mammals', parent: 'animals' },
  { id: 'cats', parent: 'mammals' },
  { id: 'dogs', parent: 'mammals' },
  { id: 'labrador', parent: 'dogs' },
  { id: 'cocker spaniel', parent: 'dogs' },
  { id: 'rag doll', parent: 'cats' },
  { id: 'burmese', parent: 'cats' },
];

jossmac

/**
 * This function shuffles an array of items.
 * @param arr {Array} array of items
 * @param clone {Boolean} immutable or not
 * @returns {Array} the array of items in random order.
 */
function shuffle(arr, clone) {
  var array = clone ? arr.slice(0) : arr;
  var m = array.length, t, i;

jossmac

function not(predicate) {
  return function negate(...args) {
    return !predicate(...args);
  }
}

// Usage
// ==============================

function longEnough(str) {

jossmac

// probably unnecessary but...
const merge = (...args) => args.reduce((obj, val) => ({ ...obj, ...val }), {});

const combined = merge(
  { background: 'red', padding: 20 },
  { color: 'blue' },
  { color: 'white' },
);

console.log(combined); // { background: 'red', padding: 20, color: 'white' }

jossmac

export default class Store {
  listeners = []
  store = []

  add = (data) => {
    const id = uniqueId()
    const item = { id, data }
    this.store.push(item)
    this.publish()
  }

jossmac

import React from 'react';
import Renderer from './Renderer';

export const ToastContext = React.createContext();

export class ToastProvider extends React.Component {
  state = { toasts: [] }

  add = (content) => {
    this.setState(...);

jossmac

import React from 'react';
import { ToastContext } from './Provider';

export const ToastConsumer = ({ children }) => (
  <ToastContext.Consumer>
    {context => children(context)}
  </ToastContext.Consumer>
);

jossmac

import React from 'react';
import { ToastContext } from './Provider';

export const ToastConsumer = ({ children }) => (
  <ToastContext.Consumer>
    {context => children(context)}
  </ToastContext.Consumer>
);

// Higher-Order Component

jossmac

const partialApply = (fn, ...fixedArgs) => {
  return (...remainingArgs) => fn(...fixedArgs.concat(...remainingArgs));
};


const add = (a, b) => a + b;

const add10 = partialApply(add, 10);

console.log(add10(5)) // 15

jossmac

const DRAW_DIRECTION = ["clockwise", "anti-clockwise"] as const;

/**
 * Generate a complex path string, using familiar SVG shape (`<circle>`,
 * `<rect>`, etc.) syntax.
 *
 * @param data An array of shape objects.
 * @param evenodd Alternate drawing direction for each path. When multiple paths are combined into a single string of path data, this will influence whether the paths are additive or subtractive.
 * @returns A string of SVG path data representing all shapes.
 *