Skip to content

Instantly share code, notes, and snippets.

@hypervillain
hypervillain / [uid].js
Last active June 25, 2020 09:19
Setup Next.js project with SliceMachine + essential slices
import { Client } from '../prismic'
import SliceZone from 'next-slicezone'
import { useGetStaticProps, useGetStaticPaths } from 'next-slicezone/hooks'
import resolver from '../sm-resolver.js'
const Page = (props) => <SliceZone {...props} resolver={resolver} />
export const getStaticProps = useGetStaticProps({
client: Client(),

Keybase proof

I hereby claim:

  • I am hypervillain on github.
  • I am hypervillain (https://keybase.io/hypervillain) on keybase.
  • I have a public key ASBVQkB2fqw_HUupzN58OW_VduzJ7sVCoHSlVfpKUntzkgo

To claim this, I am signing this object:

@hypervillain
hypervillain / delete-repositories.js
Created March 25, 2020 13:18
Delete a list of Github repositories
const { Octokit } = require('@octokit/rest')
const octo = new Octokit({
auth: 'an-access-token-with-delete-repo-scope'
})
/** try w/ one first 😛 */
const repos = ['travis-tests']
const owner = 'hypervillain'
@hypervillain
hypervillain / ForwardProximity.js
Last active November 16, 2018 01:31
A generic React component that calculates and forwards the distance between mouse position and element
import { Component } from 'react';
import { func } from 'prop-types';
// See related Gist
import MousePosListener from '../MousePosListener';
const distancePoints = (x1, y1, x2, y2) =>
Math.sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2));
class ForwardProximity extends Component {
@hypervillain
hypervillain / ForwardState.jsx
Last active October 24, 2018 15:19
A generic React component that renders its state and setState as props
import { Component } from 'react';
import PropTypes from 'prop-types';
class ForwardState extends Component {
static propTypes = {
children: PropTypes.func.isRequired,
ComponentWrapper: PropTypes.string || PropTypes.node,
init: PropTypes.object, // eslint-disable-line react/forbid-prop-types
setStatePropName: PropTypes.string,
statePropName: PropTypes.string,
@hypervillain
hypervillain / ForwardScroll.jsx
Created October 16, 2018 17:36
A generic React component that forwards document's scroll Y and X positions
// See it in action here: https://codesandbox.io/s/ovyk4qx8yy
import React, { Component } from 'react';
import PropTypes from 'prop-types';
class ForwardScroll extends Component {
static propTypes = {
children: PropTypes.func.isRequired,
ComponentWrapper: PropTypes.node || PropTypes.string,
}
@hypervillain
hypervillain / ForwardRef.jsx
Created October 16, 2018 17:26
A generic React component that forwards its ref
import { Component } from 'react';
import PropTypes from 'prop-types';
class ForwardRef extends Component {
static propTypes = {
children: PropTypes.func.isRequired,
ComponentWrapper: PropTypes.string || PropTypes.node,
refPropName: PropTypes.string,
}
static defaultProps = {
@hypervillain
hypervillain / KeyListener.js
Last active October 13, 2018 10:49
A generic React component that listens to keyboard events
import { Component } from 'react';
import PropTypes from 'prop-types';
/*
Example:
<KeyListener
actions={[
{
keyCode: 27,
method: (e) => {
@hypervillain
hypervillain / DrawerLayoutWithReactRouter.jsx
Created October 12, 2018 16:36
Generic React layout that renders routes inside a drawer
// See it in action here https://codesandbox.io/s/mkznro61j
import React, { Component } from 'react';
import { render } from 'react-dom';
import PropTypes from 'prop-types';
import {
BrowserRouter,
Link,
@hypervillain
hypervillain / Affix.jsx
Last active October 16, 2018 17:38
Generic React Affix component, using react-measure
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Measure from 'react-measure';
import classnames from 'classnames';
// replace this if you don't use CSS modules
import cls from './affix.module.scss';
class Affix extends Component {