Skip to content

Instantly share code, notes, and snippets.

View bmingles's full-sized avatar

Brian Ingles bmingles

View GitHub Profile
@bmingles
bmingles / useSetProp.hook.ts
Created November 20, 2020 16:00
Custom React hook for setting properties
import React from 'react'
/**
* Custom hook to set single properties on state objects.
*
* e.g.
* const [state, setState] = useState({ name: 'John Doe' })
* const setProp = useSetProp(setState)
*
* const setName = setProp('name')
@bmingles
bmingles / TypeScript Eslint Yarn Fixes
Last active October 12, 2020 20:20
package.json
"resolutions": {
"**/@typescript-eslint/eslint-plugin": "^4.2.0",
"**/@typescript-eslint/parser": "^4.2.0",
"**/eslint-plugin-react-hooks": "^4.1.2"
}
@bmingles
bmingles / ValidatedInput.tsx
Created July 24, 2020 16:46
React + TypeScript ValidatedInput component
import React from 'react'
import { isError, useDependentState } from '../util'
import Bulma from '../bulma'
export type ValidatedValue<
TValue,
TRequired extends boolean
> = TRequired extends true ? TValue : TValue | null
export interface ValidatedInputProps<TValue, TRequired extends boolean> {
@bmingles
bmingles / switchExp.ts
Last active May 25, 2020 04:14
Tagged Union Switch Expression
type Tagged<T extends string> = {
type: T
}
export function switchExp<
T extends Tagged<string>,
M extends { [P in T['type']]: T extends Tagged<P> ? (t: T) => any : never }
>(value: T, map: M): ReturnType<M[keyof M]> {
return map[value.type as keyof M](value)
}
@bmingles
bmingles / router.ts
Created May 21, 2020 01:25
Strong typed routing
export interface Spec<K extends string, T> {
ctr: (raw: string) => T,
key: K,
match: RegExp
}
type Data<T, D> = {
type: T
} & { [P in keyof D]: D[P] };
@bmingles
bmingles / useUpdate.fs
Created May 7, 2020 11:36
Fable MVU reducer
module Util.MVU
open Fable.Core
open Fable.React
type Dispatch<'msg> = 'msg -> unit
type Sub<'msg> = Dispatch<'msg> -> unit
type Cmd<'msg> = Sub<'msg> list
@bmingles
bmingles / tagged-union.ts
Last active April 20, 2020 15:31
TypeScript tagged union matching with exahaustive checking
/**
* Map discriminated union based on its tag value.
* Possible tag values are mapped to expressions
* that return a transformation of the original value.
* Each value is exhaustive checked such that a mapping
* has to be provided for each one.
*
* e.g.
*
* type Union =
@bmingles
bmingles / create-app.js
Last active February 17, 2020 00:43
NodeJS script to scaffold minimal React + TypeScript app using ParcelJS
#!/usr/bin/env node
/**
* Script for scafolding a React + TypeScript app using
* ParcelJS as a bundler.
*
* - TypeScript
* - React
* - ParcelJS
* - Sass
module 'draft-js-plugins-editor' {
import React from 'react';
import {
CompositeDecorator,
DraftEditorCommand,
Editor,
EditorProps,
EditorState
} from 'draft-js';
@bmingles
bmingles / gist:23b90a93ed7088feb73d4d4294555f8a
Created December 10, 2018 14:43
vscode - sample launch config + preLaunchTask with watch
// launch.json
{
"type": "node",
"request": "launch",
"name": "Server build and debug",
"useWSL": true,
"program": "${workspaceFolder}/server/js/src/app.ts",
"cwd": "${workspaceFolder}/server",
"preLaunchTask": "npm-buildserver",
"outFiles": [