Skip to content

Instantly share code, notes, and snippets.

@bultas
bultas / connect-as-child.js
Last active December 2, 2017 14:06
Redux Connect use like children-as-func instead of HOC
import React, { createElement } from 'react';
import { render } from 'react-dom';
import { Provider, connect } from 'react-redux';
import { store } from 'store';
const TypeConnector = connect(({ router: { type } }) => {
return {
type
};
@bultas
bultas / children-as-function.js
Created November 20, 2017 15:44 — forked from iammerrick/children-as-function.js
Which API do you prefer? Passing a function into the Ratio component or making a higher order component called Ratio you can use to configure a component.
<Ratio width={Ratio.OPTIONS.FLUID} x={3} y={4}>
{(width, height) => (
<Chart id={this.props.id} width={width} height={height} />
)}
</Ratio>
@bultas
bultas / validate.js
Created October 25, 2017 10:46
Validate data usage
import { validate, list, dict, required, optional } from 'validators';
pipe(
validate(
identity,
[
required('first', isString),
optional('second', list(isString), []),
// required(['third', 'subParam', 'deepParam'], isNumber)
@bultas
bultas / validator-middleware-example.js
Last active October 4, 2017 14:50
Redux-Validator-Middleware
import { validator } from 'validator'
import { VALIDATOR_SYMBOL } from 'validator-middleware';
const data = { x: 1, y: 2 };
const validator = validator(fn1, fn2); // curry, one data input left
const action = {
[VALIDATOR_SYMBOL]: {
data,
@bultas
bultas / fetchAndConnect.js
Created October 3, 2017 08:10
Redux FetchAndConnect
import React from 'react';
import { connect } from 'react-redux';
class FetchComponent extends React.Component {
constructor() {
super();
this.state = {
dataFetched: false
};
}
@bultas
bultas / form.jsx
Last active August 4, 2017 18:53
Form in Redux
import { connect } from 'react-redux';
import { formsReducer, FormsActions, convertFormData, haveFormDataError } from 'forms';
const FORMS_REDUCER_ID = 'forms';
const store = createStore(formsReducer);
const dispach = store.dispach;
@bultas
bultas / template.js
Last active June 20, 2017 14:32
Simple ES6 Template
var article = {
title: 'Hello Template Literals',
teaser: 'String interpolation is awesome. Here are some features',
body: 'Lots and lots of sanitized HTML',
tags: ['es6', 'template-literals', 'es6-in-depth']
}
function html(template, ...expressions) {
return template.reduce((accumulator, part, i) => {
return accumulator + expressions[i - 1] + part
@bultas
bultas / check.sh
Created June 13, 2017 15:25
Git Hooks
#!/usr/bin/env bash
# MIT © Sindre Sorhus - sindresorhus.com
# git hook to run a command after `git pull` if a specified file was changed
# Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.
changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"
check_run() {
echo "$changed_files" | grep --quiet "$1" && eval "$2"
@bultas
bultas / anotherSources.html
Last active May 31, 2017 16:16
DraftJS - Text Alignment via block metadata
https://gist.github.com/joshdover/7c5e61ed68cc5552dc8a25463e357960
https://github.com/jpuri/react-draft-wysiwyg/blob/master/js/src/components/Controls/TextAlign/index.js
@bultas
bultas / Editor.jsx
Last active May 24, 2017 13:12
Draft JS - ability to "not continue" mutable entity (with property contiguous) (ex.: LINK)
function CustomEditor() {
...
return (
<Editor
editorState={editorState}
onChange={onChange}
blockStyleFn={myBlockStyleFn}
handleReturn={createHandleReturn(editorState, onChange)}