Instantly share code, notes, and snippets.

View App.js
import React, { Suspense, useState } from "react";
import { unstable_createResource as createResource } from "react-cache";
import {
Combobox,
ComboboxInput,
ComboboxList,
ComboboxOption
} from "./Combobox2.js";
function App({ tabIndex, navigate }) {
View auth-with-reach-router.jsx
let UserContext = React.createContext();
class App extends React.Component {
state = {
user: null,
setUser: user => {
this.setState({ user });
}
};
View App.Combobox.jsx
import React, { Suspense, useState } from "react";
import { unstable_createResource as createResource } from "react-cache";
import {
Autocomplete as Combobox,
Input as ComboboxInput,
List as ComboboxList,
Option as ComboboxOption
} from "./Combobox";
function App({ tabIndex, navigate }) {
View useGeoposition.js
import {
useState,
useEffect
} from "react";
import { createResource } from "react-cache";
let GeopositionResource = createResource(() =>
new Promise((res, rej) =>
navigator.geolocation.getCurrentPosition(
position => res(position),
View App.Router.js
import React from "react";
import {
useRouter,
Link
} from "@reach/router/unstable-hooks";
function Accounts() {
let route = useRouter({
".": () => <div>boring Accounts</div>,
dope: () => <div>Dope Accounts</div>
View foo.jsx
import React from 'react'
import Component from "@reach/component-component"
const Fetch = ({ url, props }) => (
<Component
url={url}
initialState={{ data: null }}
didMount={({ setState }) => {
fetch(url)
.then(res => res.json())
View app.jsx
/////////////////////////////////
import React from "react"
import ReactDOM from 'react-dom'
let reducer = (state={count: 0}, action) => {
if (action.type === 'up') {
return {
...state,
count: state.count + 1
}
View foo.js
// Adds a lovely fade in of the modal
// and a gentle slide-down of the modal content
class Demo extends React.Component {
state = { showDialog: false };
render() {
return (
<div>
<button onClick={() => this.setState({ showDialog: true })}>
Show Dialog
</button>
View ManageScroll.js
import React from "react";
import { Location } from "@reach/router";
let scrollPositions = {};
class ManageScrollImpl extends React.Component {
componentDidMount() {
try {
// session storage will throw for a few reasons
// - user settings
View foo.js
const Auth = React.createContext()
class App extends React.Component {
state = {
auth: null
}
render() {
return this.state.auth ? (
<Auth.Provider value={this.state.auth}>