Skip to content

Instantly share code, notes, and snippets.

View tuxsudo's full-sized avatar
💭
mostly working in private codebases

Jared Anderson tuxsudo

💭
mostly working in private codebases
View GitHub Profile
@tuxsudo
tuxsudo / IntersectionObserver.js
Created January 30, 2018 00:27
React Intersection Observer
import React from "react";
export default class IntersectionObserver extends React.Component {
static defaultProps = {
root: null,
rootMargin: undefined,
threshold: 0,
onChange: () => null,
render: () => null
};
@tuxsudo
tuxsudo / App.js
Last active August 13, 2017 02:25
Theme Example
import * as theme from "./theme.js";
import { ThemeProvider } from 'styled-components';
export const App = (props) =>
<ThemeProvider {...props} theme={theme} />
const myPuzzle = [
1, null, 9, null, null, null, null, 6, null,
5, 3, null, null, 7, null, null, null, null,
null, null, 4, null, 2, 6, null, null, null,
null, 5, null, null, null, null, null, null, 4,
null, 7, null, 6, 3, 4, null, 2, null,
@tuxsudo
tuxsudo / DrawerFaC.js
Created February 10, 2017 21:48
DrawerFaC.js
import React, {Component} from 'react';
import join from 'join-classnames';
import styles from './DrawerFaC.css';
export default class DrawerFaC extends Component {
static defaultProps = {
open: false
};
@tuxsudo
tuxsudo / Confirm.css
Created December 9, 2016 21:57
Confirm React Component
.wrapper {
padding: 1em;
text-align: center;
}
.title {
font-family: var(--serif, Serif);
font-weight: normal;
text-transform: capitalize;
}
@tuxsudo
tuxsudo / component-that-accepts-all-props.js
Created October 24, 2016 17:57
An example of a component that will just pass along all props
const Component = ({title, subtitle, className, ...props}) => (
<a className={`myClass ${className}`} {...props}>
<h1>{title}</h1>
<h2>{subtitle}</h2>
</a>
);
import {Component} from 'react';
export default class extends Component {
state = {
open: false
};
toggle = () => {
this.setState(({open}) => ({open: !open}))
};
@tuxsudo
tuxsudo / route-component.js
Last active October 1, 2016 15:09
HoC Composition
import compose from '@tuxsudo/compose';
import {connect} from 'react-redux';
import appendLifeCycle from '../hocs/append-life-cycle.js';
import appendServerAction from '../hocs/append-server-action.js';
import appendMetaDatas from '../hocs/append-meta-data.js'
import LandingTemplate from '../templates/Landing.js';
export const finalComponent = compose(
export const pauseAndPass = (time) => (data) => new Promise( (resolve) => {
setTimeout( () => resolve(data) , time)
});
export default pauseAndPass;
@tuxsudo
tuxsudo / button.spec.js
Created August 23, 2016 15:24
Unit Testing with React & Enzyme
import Button from './Button.js';
import styles from './Button.css';
import test from 'tape';
import {spy} from 'sinon';
import { shallow } from 'enzyme';
test('<Button />', t => {