Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

View amsterdamharu's full-sized avatar

Harm Meijer amsterdamharu

  • Amsterdam Netherlands
View GitHub Profile
@amsterdamharu
amsterdamharu / useReducer with middleware.js
Last active March 17, 2021 19:12
useReducer with middleware
import React from 'react';
import ReactDOM from 'react-dom';
//for Stack overflow snippet that doesn't allow imports
const { useRef, useState } = React;
const compose = (...fns) =>
fns.reduce((result, fn) => (...args) =>
fn(result(...args))
);
const mw = () => (next) => (action) => next(action);
@amsterdamharu
amsterdamharu / partial application.js
Last active March 17, 2021 19:12
partial application
//using partially applied functions (closures) are used for sorting to
// demonstrate how to prevent duplicate implementation and writing
// imperative code. Most of your code should express "what it does"
// not "how it does it"
const data1 = [
{ id: 1, name: 'a', items: [1, 2, 3] },
{ id: 2, name: 'a', items: [1, 2] },
{ id: 3, name: 'b', items: [4, 5] },
{ id: 4, name: 'b', items: [4, 5, 6, 7] },
];
@amsterdamharu
amsterdamharu / group action function.js
Last active March 17, 2021 19:12
group action and function result
//group promise returning function
const createGroup = (cache) => (
fn,
getKey = (...x) => JSON.stringify(x)
) => (...args) => {
const key = getKey(args);
let result = cache.get(key);
if (result) {
return result;
}
@amsterdamharu
amsterdamharu / unnest react containers.js
Last active March 17, 2021 19:13
unnest react containers
import React from 'react';
import ReactDOM from 'react-dom';
const useContainer = (props, container) => {
return container(props);
};
const Counter = ({ counter, up }) => {
const r = React.useRef(0);
r.current++;
return (
@amsterdamharu
amsterdamharu / connect react context.js
Last active March 17, 2021 19:14
connect react context
import React from 'react';
import ReactDOM from 'react-dom';
import * as Reselect from 'reselect';
const {
useMemo,
useState,
useContext,
useRef,
useCallback,
import React from 'react';
export const NOT_REQUESTED = {
requested: false,
loading: false,
};
const AVAILABLE = {
requested: true,
loading: false,
};
const isResult = (value) =>
const state = {
people: {
1: { id: 1, name: 'one' },
2: { id: 2, name: 'two' },
3: { id: 3, name: 'three' },
},
likes: {
1: [2, 3],
2: [1],
3: [1],
const REMOVE = () => REMOVE;
const get = (object, path, defaultValue) => {
const recur = (current, path, defaultValue) => {
if (current === undefined) {
return defaultValue;
}
if (path.length === 0) {
return current;
}
return recur(
@amsterdamharu
amsterdamharu / stack overflow react redux snippet
Last active March 21, 2021 21:44
stack overflow react redux snippet
<!-- begin snippet: js hide: false console: true babel: true -->
<!-- language: lang-js -->
import * as React from 'react';
import ReactDOM from 'react-dom';
import * as Redux from 'redux';
import * as ReactRedux from 'react-redux';
import * as Reselect from 'reselect';
import * as immer from 'immer';
@amsterdamharu
amsterdamharu / resolveLastCreated
Created May 6, 2021 20:47
Resolve last created promise
const REPLACED = 'REPLACED';
const last = (fn) => {
const current = { value: {} };
return (...args) => {
const now = {};
current.value = now;
return Promise.resolve(args)
.then((args) => fn(...args))
.then((resolve) =>
current.value === now