Skip to content

Instantly share code, notes, and snippets.

View srph's full-sized avatar
🛠️
Building @Stride-Labs Frontend

Kier Borromeo srph

🛠️
Building @Stride-Labs Frontend
View GitHub Profile
@srph
srph / Helper.php
Created May 15, 2019 21:13
PHP: Generate invitation codes/licenses strings
<?php
namespace App\Support;
use Str;
class Helper {
/**
* e.g., X4345-ZXCA4-S3XYB-3AST1
*/
@srph
srph / index.tsx
Last active May 15, 2019 20:08
react-gateway: Support fallbacks for GatewayDest (alternative for https://github.com/cloudflare/react-gateway/pull/39)
/**
* Supercharges GatewayDest so that it allows default children, because this does not work:
* <GatewayDest><div>Default content if nobody has passed anything to me yet.</GatewayDest>
* @see https://github.com/cloudflare/react-gateway/pull/39
*
* @usage <GatewayDestWithFallback name={constants.gateway.backUrl} fallback={<UiNavigation.Action />} />
*/
import * as React from 'react'
import { GatewayDest } from 'react-gateway'
@srph
srph / getStreak.ts
Created April 18, 2019 02:50
JS: Example code to get number of consecutive dates
import { parse, subDays } from 'date-fns';
import getEntryTodayDateString from './getEntryTodayDateString'
import getEntryDateString from './getEntryDateString'
/**
* Get the streak between today and the last date.
* Assumes that there is an entry for today.
*/
export default function getStreak(tracker: AppDataTracker): number {
@srph
srph / Helper.php
Created April 1, 2019 13:03
Converts an array of objects into an object, keys based on its key
<?php
namespace App\Support;
class Helper {
/**
* Converts an array of objects into an object, keys based on its key
* [{ "entry_date": "" }, { "entry_date": "" }] -> { "2019-08-20": {}, ... }
*/
static public function toPropertyKeys($array, $property) {
@srph
srph / isNumericKeyCode.ts
Created March 28, 2019 11:20
JS: Check if the pressed key (evt.keyCode) is a numeric key
const NUMERIC_0 = 48
const NUMERIC_9 = 57
/**
* Check if the pressed key (evt.keyCode) is a numeric key
*/
export default function isNumericKeyCode(key: number): boolean {
return key >= NUMERIC_0 && key <= NUMERIC_9
}
@srph
srph / index.ts
Last active March 26, 2019 18:45
React Router 4: Allow nested routes
import * as React from 'react'
import { Route } from 'react-router-dom'
import { RouteProps } from 'react-router'
class RouterRoute extends React.Component<RouteProps> {
render() {
const { component, children, ...rest } = this.props
const Component = this.props.component
return (
@srph
srph / index.js
Created March 6, 2019 06:38
JS: Check if an element is under an anchor element
/**
* Check if an element is under an anchor element
*/
function isDescendantOfAnchor(element) {
do {
if (element.tagName === 'A') {
return true
}
} while(element = element.parentNode)
@srph
srph / index.html
Last active February 7, 2019 06:13
JS/CSS: Animate node on scroll
<h5 class="text-fade-in js-animatable" data-animatable-offset="256" data-animatable-delay="200">Staging</h5>
<h5 class="text-fade-in js-animatable" data-animatable-offset="324" data-animatable-delay="300">Deep-cleaning</h5>
<h5 class="text-fade-in js-animatable" data-animatable-offset="324" data-animatable-delay="400">Cosmetic renovations</h5>
<h5 class="text-fade-in js-animatable" data-animatable-offset="358" data-animatable-delay="500">Decluttering</h5>
<h5 class="text-fade-in js-animatable" data-animatable-offset="392" data-animatable-delay="600">Landscaping</h5>
<h5 class="text-fade-in js-animatable" data-animatable-offset="460" data-animatable-delay="700">Painting</h5>
<h5 class="text-fade-in js-animatable" data-animatable-offset="460" data-animatable-delay="800">Pest control</h5>
<h5 class="text-fade-in js-animatable" data-animatable-offset="494" data-animatable-delay="900">Custom closets</h5>
<div class="photo-cover js-animatable">
@srph
srph / types.ts
Last active January 22, 2019 15:34
qhistory & react-router types
import { Location, LocationState } from 'history';
import { RouteComponentProps as ReactRouteComponentProps } from 'react-router-dom'
export interface RouteComponentProps<Q = { [key: string]: string }> extends ReactRouteComponentProps {
location: Location<LocationState> & {
query: Q
};
}
@srph
srph / index.js
Last active January 22, 2019 02:39
React Router: Nested error 404
// Error404Context.js
export default {Provider, Consumer} = React.createContext()
// Error404Provider.js
class Error404Provider extends React.Component {
state = {
isError: false
}
render() {