Skip to content

Instantly share code, notes, and snippets.

Roman Pominov rpominov

Block or report user

Report or block rpominov

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
rpominov /
Last active Sep 19, 2018
Compound Components

My relationship with Compound Components

What are these?

Compound Component is a pattern in React when a component doesn't work by itself and needs other specific components to be its children or parents in order to operate.

Here is an introduction video

How do I feel about it?

rpominov /
Last active Nov 5, 2016
Example of use of the new approach for fantasy-land
View Task.js
type Result<L,R> =
| {T: 'Right', value: R}
| {T: 'Left', value: L}
| {T: 'Thrown', error: any}
| {T: 'Cancel'}
type Cancel = () => void
type RunHandler<L,R> =
| (result: Result<L,R>) => void
rpominov / Type.js
Last active May 15, 2016
An idea of Algebraic data types helper in JS
View Type.js
const Maybe = Type({Just: ['value'], Nothing: []}, {
map(fn, maybe) {
Just: ({value}) => Maybe.Just(fn(value)),
// Should x => x be the default handler in case() so we could omit Nothing here?
Nothing: m => m,


  1. S.equals(a, a) = true (reflexivity)
  2. S.equals(a, b) = S.equals(b, a) (symmetry)
  3. If S.equals(a, b) and S.equals(b, c), then S.equals(a, c) (transitivity)


  1. S.concat(S.concat(a, b), c) is equivalent to S.concat(a, S.concat(b, c)) (associativity)
View React-subscribe-component.js
function loadSomeStuff(id) {
// We return basic-stream
return _sink => {
let sink = _sink
const onSuccess = data => sink({type: 'success', data})
const onError = error => sink({type: 'error', error})
stuffLoadingService.load(id).done(onSuccess, onError)
return () => {
// We can't unsubscribe from a Promise, so we simply make sink() a noop
sink = () => {}
View streams.js
/* @flow */
type Sink<T> = (payload: T) => void
type Disposer = () => void
type Stream<T> = (s: Sink<T>) => Disposer
type F<A, B> = (x: A) => B
type LiftedF<A, B> = (s: Stream<A>) => Stream<B>
/* Lifts function `A => B` to a funcion that operates
// trnsitionRequests -> BrowserAPI -> [ resolveRoute -> loadData -> render -> restoreScroll ]

// poor man's strem.flatMapLatest()
router.pipe((payload, next) => {
  return () => {
    // cleanup
rpominov /
Last active Nov 23, 2015
About containers VS pure views in React (an untested idea)
  1. If it works for you just use single container on top of each route, othervise see 2
  2. Wrap a view into container whenever necessary, but always pass wrapped component via props:
// pure component's render
rpominov /
Last active Nov 1, 2015
React testing ideas

Stateles components

// mark relevant parts of result tree with __tetsId & __testClass
const TestTarget = props => 
    <Foo foo={} __tetsId="foo" />
      <li num={1} __testClass="baz" />
      <li num={2} __testClass="baz" />
You can’t perform that action at this time.