Skip to content

Instantly share code, notes, and snippets.

View fnky's full-sized avatar
⚠️
TypeError: Cannot read property 'status' of undefined.

Christian Petersen fnky

⚠️
TypeError: Cannot read property 'status' of undefined.
View GitHub Profile
@fnky
fnky / stripe-keys-and-ids.tsv
Last active March 29, 2024 22:52
Stripe keys and IDs
Prefix Description Notes
ac_ Platform Client ID Identifier for an auth code/client id.
acct_ Account ID Identifier for an Account object.
aliacc_ Alipay Account ID Identifier for an Alipay account.
ba_ Bank Account ID Identifier for a Bank Account object.
btok_ Bank Token ID Identifier for a Bank Token object.
card_ Card ID Identifier for a Card object.
cbtxn_ Customer Balance Transaction ID Identifier for a Customer Balance Transaction object.
ch_ Charge ID Identifier for a Charge object.
cn_ Credit Note ID Identifier for a Credit Note object.
@fnky
fnky / query-order.graphql
Created October 10, 2019 21:14
GraphQL Patterns
# Query order pattern from GitHub GraphQL API
# Can be used in conjunction with Relay pagination.
"""
Possible directions in which to order a list of items when provided an `orderBy` argument.
"""
enum OrderDirection {
"""
Specifies an ascending order for a given `orderBy` argument.
"""
@fnky
fnky / mark-closed-as-read.js
Created August 26, 2019 07:30
GitHub Snippets
/**
* Marks all closed issues and pull reuqest notifications as read.
*/
(() => {
const closedIssueNodes = document.querySelectorAll('.js-notification .type-icon-state-closed, .js-notification .type-icon-state-merged');
closedIssueNodes.forEach(node => {
node.offsetParent.querySelector('button.delete-note').click();
});
@fnky
fnky / Example.tsx
Last active January 31, 2019 10:27
A React Hook to set persisted state, similar to useState
import React from 'react';
import ReactDOM from 'react-dom';
import usePersistedState from './usePersistedState';
function App() {
const [count, setCount, unsetCount] = usePersistedState(
0,
'count',
sessionStorage
);
@fnky
fnky / ANSI.md
Last active April 24, 2024 03:46
ANSI Escape Codes

ANSI Escape Sequences

Standard escape codes are prefixed with Escape:

  • Ctrl-Key: ^[
  • Octal: \033
  • Unicode: \u001b
  • Hexadecimal: \x1B
  • Decimal: 27
@fnky
fnky / hooks.js
Last active January 7, 2024 12:32
React Hooks: useReducer with actions and selectors (Redux-like)
function useSelectors(reducer, mapStateToSelectors) {
const [state] = reducer;
const selectors = useMemo(() => mapStateToSelectors(state), [state]);
return selectors;
}
function useActions(reducer, mapDispatchToActions) {
const [, dispatch] = reducer;
const actions = useMemo(() => mapDispatchToActions(dispatch), [dispatch]);
return actions;
@fnky
fnky / emotion.d.ts
Last active September 27, 2019 18:37
Rebass Emotion with Theming support
declare module 'rebass/emotion' {
import * as Rebass from 'rebass';
import { ComponentClass } from 'react';
import { ThemeProviderProps } from 'emotion-theming';
// Styled System Types
export type NumberOrString = Rebass.NumberOrString;
export type Responsive = Rebass.Responsive;
export interface Space extends Rebass.Space {}
@fnky
fnky / color-table.sh
Created October 1, 2018 08:19
Display terminal color table
#!/bin/bash
#
# This file echoes a bunch of color codes to the
# terminal to demonstrate what's available. Each
# line is the color code of one forground color,
# out of 17 (default + 16 escapes), followed by a
# test use of that color on all nine background
# colors (default + 8 escapes).
#
@fnky
fnky / github-markdown.css
Last active September 30, 2018 22:45
Github Markdown for VSCode
/* Generated from 'node_modules/github-markdown-css/github-markdown.css' */
@font-face {
font-family: octicons-link;
src: url(data:font/woff;charset=utf-8;base64,d09GRgABAAAAAAZwABAAAAAACFQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABEU0lHAAAGaAAAAAgAAAAIAAAAAUdTVUIAAAZcAAAACgAAAAoAAQAAT1MvMgAAAyQAAABJAAAAYFYEU3RjbWFwAAADcAAAAEUAAACAAJThvmN2dCAAAATkAAAABAAAAAQAAAAAZnBnbQAAA7gAAACyAAABCUM+8IhnYXNwAAAGTAAAABAAAAAQABoAI2dseWYAAAFsAAABPAAAAZwcEq9taGVhZAAAAsgAAAA0AAAANgh4a91oaGVhAAADCAAAABoAAAAkCA8DRGhtdHgAAAL8AAAADAAAAAwGAACfbG9jYQAAAsAAAAAIAAAACABiATBtYXhwAAACqAAAABgAAAAgAA8ASm5hbWUAAAToAAABQgAAAlXu73sOcG9zdAAABiwAAAAeAAAAME3QpOBwcmVwAAAEbAAAAHYAAAB/aFGpk3jaTY6xa8JAGMW/O62BDi0tJLYQincXEypYIiGJjSgHniQ6umTsUEyLm5BV6NDBP8Tpts6F0v+k/0an2i+itHDw3v2+9+DBKTzsJNnWJNTgHEy4BgG3EMI9DCEDOGEXzDADU5hBKMIgNPZqoD3SilVaXZCER3/I7AtxEJLtzzuZfI+VVkprxTlXShWKb3TBecG11rwoNlmmn1P2WYcJczl32etSpKnziC7lQyWe1smVPy/Lt7Kc+0vWY/gAgIIEqAN9we0pwKXreiMasxvabDQMM4riO+qxM2ogwDGOZTXxwxDiycQIcoYFBLj5K3EIaSctAq2kTYiw+ymhce7vwM9jSqO8JyVd5RH9gyTt2+J/yUmYlIR0s0
@fnky
fnky / flexbox.css
Created April 5, 2018 13:10
Dynamic Vertical Alignment in CSS
/*
Flexbox method
Supported in most browsers, including legacy ones like IE8 and IE9
https://caniuse.com/#feat=flexbox
*/
html, body {
height: 100%;
height: auto;
}