Snippets

Little bits of code that I find useful and you might too! Mostly written in TypeScript & JavaScript and often for React, Vue and SolidJS.

createTypedContext (React)
Easily make a typed context provider and helper hook in React
08/09/24
16/07/26
Eslint errors for bad imports
Raise Eslint errors when importing from bad modules.
03/09/24
Simpler Pact consumer tests with MSW
Simplify your Pact consumer tests with MSW and this helper
02/09/24
Use Touch ID for sudo commands
Use your finger instead of your password for sudo!
10/08/24
Overlay an image on your page
CSS-only method to overlay an image on an html page.
21/02/24
24/02/24
toComputed
Vue 3 composable that simplifies using a value that's a MaybeRefOrGetter
20/02/24
29/02/24
Mocking classes from mocked modules in Vitest tests
How to mock and expect on class methods from mocked modules.
13/02/24
02/06/24
Drizzle ORM Type Helpers
A couple type helpers to get a table's document type (when you SELECT) and the table's insert type (when you INSERT).
03/01/24
19/08/24
Include<T, U>
A more inclusive complement to TypeScript's Exclude helper type - only include the parts of a union type that are assignable to another type
07/09/23
useFullscreen (React)
Get access to the current fullscreen element, and controls to enter, exit, and toggle fullscreen.
14/08/23
safeViewTransition
A tiny wrapper around document.startViewTransition that respects users' prefers-reduced-motion preferences
11/07/23
13/09/23
createManualPromise
Create a promise that you manually resolve or reject at any time!
20/06/23
23/07/23
useTemporaryState (React)
State that resets after a timeout.
19/06/23
13/09/23
createPreviousMemo (SolidJS)
Get the previous value of a SolidJS signal
01/01/23
20/06/23
Cypress Stuff
Miscellaneous snippets for doing things in Cypress
30/11/22
09/03/24
PartiallyOptional
A TypeScript generic type to make part of another type optional
10/10/22
Inspect
A useful function to print out the value of something with an optional message
06/10/22
12/01/23
Tailwind CSS Hocus Plugin
A plugin for lazy people like me who use the same styles for hover and focus states
19/09/22
30/11/22
Stop Vercel GitHub Comments
Stop Vercel's bot from commenting on PRs and commits (and the associated emails)
27/08/22
20/06/23
useIsMouseInactive (SolidJS)
Know when the mouse hasn't moved for a period of time
27/08/22
07/08/23
useSyncedLocalStorage (React)
Save state to localStorage and sync it between hook instances, tabs and windows!
07/07/22
30/08/23
useCssVar (React)
Control a css variable from the comfort of React.
04/05/22
07/08/23
useCopy (React)
Copy to clipboard with a 'copied' timeout
02/05/22
19/06/23
useCopy (SolidJS)
Copy to clipboard with a 'copied' timeout
02/05/22
27/08/22
File Downloads
Download a file with or without JavaScript
26/04/22
13/10/22
Enzyme Stuff
Miscellaneous snippets for working if you have to do tests with Enzyme
20/02/22
30/11/22
PartiallyRequired
A TypeScript generic type to make part of another type required
28/10/21
10/10/22
cx
A tiny helper function to conditionally join classnames.
09/05/21
18/03/23
useBoolean (React)
Toggle and set a boolean piece of state with a slightly better interface than straight useState
02/05/21
18/03/23
Next.js <Redirect />
A <Redirect /> component like the one for react-router.
02/04/21
18/03/23
useMounted (React)
Know when the current component is mounted.
02/04/21
18/03/23
debounce
Run a function at most once every N seconds, at the end of the N seconds.
28/03/21
throttle
Run a function at most once every N seconds, at the start of the N seconds.
28/03/21
useLocalStorage (React)
Save state to localStorage with an interface almost identical to useState
26/03/21
30/08/23
Hello World
Show "Hello, World!" to your screen.
24/03/21
02/10/23