Skip to content

Instantly share code, notes, and snippets.

View jossmac's full-sized avatar
Building Keystatic

Joss Mackison jossmac

Building Keystatic
View GitHub Profile
@jossmac
jossmac / partial-application.js
Created August 8, 2019 07:16
Fixing a number of arguments to a function, producing another function of smaller arity
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
jossmac / medium_article_context-toast_consumer_extended.jsx
Last active November 1, 2018 03:21
Pseudo code for a consumer component
import React from 'react';
import { ToastContext } from './Provider';
export const ToastConsumer = ({ children }) => (
<ToastContext.Consumer>
{context => children(context)}
</ToastContext.Consumer>
);
// Higher-Order Component
@jossmac
jossmac / medium_article_context-toast_consumer.jsx
Last active November 1, 2018 03:07
Pseudo code for a consumer component
import React from 'react';
import { ToastContext } from './Provider';
export const ToastConsumer = ({ children }) => (
<ToastContext.Consumer>
{context => children(context)}
</ToastContext.Consumer>
);
@jossmac
jossmac / medium_article_context-toast_provider.jsx
Last active November 1, 2018 03:02
Pseudo code for a provider component
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
jossmac / medium_article_context-toast_class.jsx
Last active November 5, 2018 00:59
Store class with subscribers
export default class Store {
listeners = []
store = []
add = (data) => {
const id = uniqueId()
const item = { id, data }
this.store.push(item)
this.publish()
}
@jossmac
jossmac / mergeObjects.js
Created October 26, 2018 03:06
Spreading objects for styles feels messy, handle it with this function instead...
// 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
jossmac / not.js
Created October 26, 2018 02:41
Negation function for less verbose code
function not(predicate) {
return function negate(...args) {
return !predicate(...args);
}
}
// Usage
// ==============================
function longEnough(str) {
@jossmac
jossmac / fisher-yates-shuffle.js
Created August 14, 2018 06:19
A function to shuffle an array of items
/**
* 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
jossmac / recursion.js
Last active August 20, 2018 06:20
Experiment: Recursion
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
jossmac / asyncQuerySelector.js
Created May 31, 2018 05:47
An async querySelector equivalent
import "babel-polyfill";
const asyncQuerySelector = async (node, query) => {
try {
return await (query ? node.querySelector(query) : node);
} catch (error) {
console.error(`Cannot find ${query ? `${query} in`: ''} ${node}.`, error);
return null;
}
};