Skip to content

Instantly share code, notes, and snippets.

Adam Terlson adamterlson

Block or report user

Report or block adamterlson

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
@adamterlson
adamterlson / flowbindings.js
Created Jan 22, 2019
Custom flowbindings for React-Redux
View flowbindings.js
/* @flow */
import * as React from 'react'
import type { ComponentType, ElementConfig } from 'react'
declare type Action = { type: string }
declare type Dispatch = (arg: Action | Array<Action>) => mixed
declare type MapStateToProps<S, OP, SP> = (state: S, ownProps: OP) => SP
declare type MapDispatchToProps<OP, DP> = (dispatch: Dispatch, ownProps: OP) => DP
declare type MergeProps<SP, DP, OP, MP> = (stateProps: SP, dispatchProps: DP, ownProps: OP) => MP
View connect-plus-map.js
const propMap = (mapper) => (WrappedComponent) => (props) => <WrappedComponent {...mapper(props) } />
const mapStateToProps = (state) => {
user: state.currentUser
}
// This component will display the firstName of the current user
const MyComponent = compose(
connect(mapStateToProps),
propMap(props => ({
@adamterlson
adamterlson / Usage.js
Created Oct 13, 2016
Bug: React will blur on every key press when this HOC is used. Due to the component returned not being the same?
View Usage.js
compose(
ownState(
set => ({
setValue: e => set(state => ({
...state,
value: e.target.value,
})),
clearValue: () => set(state => ({
...state,
value: '',
@adamterlson
adamterlson / Propsal.md
Last active Jan 11, 2018
Lightning talk proposal for the Reactive 2016 Conference: Reconceptualizing react applications as a function
View Propsal.md

Lightning talk proposal for the Reactive 2016 Conference. Here's a handy retweet link

If you want to hear this talk, or if you just want to support me, please star ⭐️ the Gist!

When I started writing React apps, I approached components as if they were “just the V in MVC!” Seriously, we’ve all heard it.

I have found this to be an inferior way of thinking about and building React applications. It makes people treat React as a drop-in replacement for something like a Backbone or Angular 1.x View. In other words, people treat it like a glorified template system with partials and don’t harness the power of its functional paradigms.

This talk is about a functional way to write and conceptualize entire React applications.

@adamterlson
adamterlson / app.jsx
Created Jun 8, 2016
Overriding default child styles in RN
View app.jsx
class MyChildComponent extends Component {
render() {
return (
<View style={[{ height: 100 }, this.props.style]}>
The height of this container will be **50**
</View>
);
}
}
@adamterlson
adamterlson / context-test.js
Last active Apr 5, 2016
Testing this context on class instance methods
View context-test.js
const c = (function () {
this.context = 'lexical context';
const bar1 = () => {
console.log('bar 1:', this.context);
};
const curry = (fn) => {
console.log('bar 3 curryer context:', this.context);
return () => {
View english.js
let user = {
teacherId: 1,
first: 'Bob',
last: 'Smith',
room: {
floor: 2,
number: 40
}
};
@adamterlson
adamterlson / fixingAlly.js
Created Oct 17, 2014
How Ally can fix their lack of quickly-pickable date ranges
View fixingAlly.js
function formatDate(date) {
return (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();
}
$('form[name=accountDetailForm]').on('submit', function (e) {
alert('Submitted!');
e.preventDefault();
});
$('#dateRange a[data-date-range]').click(function (e) {
@adamterlson
adamterlson / jsonPropertySort.js
Last active Aug 29, 2015
Ordering JSON document properties alphabetically
View jsonPropertySort.js
function sortProperties(objToSort) {
var properties = Object.keys(objToSort).sort();
var result = {};
properties.forEach(function (prop) {
if (!objToSort[prop]) {
result[prop] = objToSort[prop];
}
else if (Array.isArray(objToSort[prop])){
result[prop] = objToSort[prop].map(sortProperties);
}
@adamterlson
adamterlson / chromenotificationapi.js
Created Sep 11, 2013
Shim Notification API in chrome to expose permissions
View chromenotificationapi.js
function translateWebkitPermission(code) {
switch (code) {
case 0:
return 'granted';
case 1:
return 'default';
case 2:
return 'denied';
}
}
You can’t perform that action at this time.