Skip to content

Instantly share code, notes, and snippets.

@jquense
jquense / ts-workspaces-doctor.js
Created Nov 12, 2019
Configure a yarn workspaces to use project references and paths
View ts-workspaces-doctor.js
/* eslint-disable no-param-reassign */
const { promises: fs, readFileSync } = require('fs');
const path = require('path');
const prettier = require('prettier');
const { parse, stringify } = require('comment-json');
const getWorkspaces = require('get-workspaces').default;
const findWorkspacesRoot = require('find-workspaces-root').default;
const safeRequire = m => {
View useEventCallback.js
function useEventCallback(fn) {
const ref = useRef(fn)
useLayoutEffect(() => {
ref.current = fn;
}, [fn]);
return useCallback(() => {
const fn = ref.current;
return fn();
@jquense
jquense / createStore.js
Created Nov 1, 2018
redux react hooks
View createStore.js
import React, { useReducer, useContext, useMemo } from 'react'
import get from 'lodash/get'
import invariant from 'invariant'
const INIT = {
type: `INIT${Math.random()
.toString(36)
.substring(7)
.split('')
.join('.')}`,
View styled components api resolver.js
const { utils } = require('react-docgen');
const { default: resolveHOC } = require('react-docgen/dist/utils/resolveHOC');
const {
default: resolveToModule,
} = require('react-docgen/dist/utils/resolveToModule');
module.exports = ({ moduleName = 'styled-components' } = {}) => {
const isStyledExpression = (tagPath, t) =>
(t.CallExpression.check(tagPath.node) &&
tagPath.get('callee').node.name === 'styled') ||
@jquense
jquense / MainModulesPlugin.js
Created Feb 16, 2018
Main Module plugin webpack, concord
View MainModulesPlugin.js
const concord = require('enhanced-resolve/lib/concord');
const getInnerRequest = require('enhanced-resolve/lib/getInnerRequest');
const createInnerCallback = require('enhanced-resolve/lib//createInnerCallback');
const defaultConfig = {
'./lib/**': './src/**',
};
function normalizeCondition(condition) {
let normalized = [].concat(condition);
@jquense
jquense / FormExample.js
Last active Oct 5, 2016 — forked from insin/FormExample.js
React Form Example / Live version: http://react-form-example.surge.sh/
View FormExample.js
import React from 'react'
import Form from 'react-formal'
import {
Alert,
Button,
Col, ControlLabel,
Form as BsForm, FormControl, FormGroup as BsFormGroup,
HelpBlock,
} from 'react-bootstrap'
View form.js
class Form extends React.Component {
constructor() {
super()
this.state = {
name: null
}
}
@jquense
jquense / ScrollSpy.js
Created Mar 24, 2016
React ScrollSpy
View ScrollSpy.js
import React, { PropTypes } from 'react';
import { findDOMNode } from 'react-dom'
import getOffset from 'dom-helpers/query/offset';
let ScrollSpy = React.createClass({
childContextTypes: {
$scrollSpy: PropTypes.shape({
anchor: PropTypes.func,
activeTarget: PropTypes.string
})
View MenuPanel.js
import React from 'react';
import cn from 'classnames';
import RootCloseWrapper from 'react-overlays/lib/RootCloseWrapper';
let MenuPanel = React.createClass({
getDefaultProps(){
return {
bsRole: 'menu',
rootClose: true
@jquense
jquense / connect.js
Last active Mar 3, 2016
code splitting with redux
View connect.js
export function connect(...stores) {
let filter = s => s;
if (!stores[stores.length - 1].__reduxName)
filter = stores.pop();
let connector = reduxConnect(
filter.length > 1
? (state, props) => filter(storesState(state, stores), props)
: (state) => filter(storesState(state, stores))