Skip to content

Instantly share code, notes, and snippets.

@yannamsellem
yannamsellem / whyDidYouUpdate.ts
Created April 20, 2022 08:41
An other why did you update function
import { dequal } from 'dequal';
export function whyDidYouUpdate<T extends object>(name: string, previous: T, current: T) {
const changes = new Map<string, { from: unknown; to: unknown }>();
const keys = Reflect.ownKeys({ ...previous, ...current });
for (const key of keys) {
if (previous[key] !== current[key]) {
changes.set(key, {
from: previous[key],

Generate TLS certificate with Let's Encrypt

Setup

in the following command replace

  • <domain> by your domain name (example: acme.com)
  • <email> by your email (example: [email protected])
/** @param {number} [ms] */
export default function formatTime(ms = 0) {
const d = new Date(ms)
const hour = `${d.getUTCHours()}`.padStart(2, '00').replace('00', '')
const min = `${d.getUTCMinutes()}`.padStart(2, '00')
const second = `${d.getUTCSeconds()}`.padStart(2, '00')
return [hour, min, second].filter(Boolean).join(':')
}
import Store from '@fromscratch/store'
import { useCallback, useMemo } from 'react'
import { useSubscription } from 'use-subscription'
const shared = new Store()
/**
* @param {string} key uniq key
* @param {T} [initialState] default state
* @template T
@yannamsellem
yannamsellem / use-animation-frame.js
Created June 22, 2021 13:26
Handle requestAnimationFrame with react hook
import { useCallback, useEffect, useRef, useState } from 'react'
/** @param {() => unknown} callback */
export default function useAnimationFrame(callback, initial = false) {
const handlerRef = useRef(callback)
const [started, setStarted] = useState(initial)
useEffect(() => {
handlerRef.current = callback
}, [callback])
@yannamsellem
yannamsellem / update-pods.sh
Last active April 2, 2021 10:39
Mini bash script to update docker image in pods
#! /bin/bash
if ! command -v kubectl &> /dev/null
then
echo "kubectl is not installed"
exit 1
fi
function usage () {
echo "Usage: restart-pods -n <namespace> -s <service>"
import { useEffect, useState } from 'react'
import { createOperationDescriptor, getRequest } from 'relay-runtime'
import { environment } from './relay'
import { GraphQLTaggedNode, Variables, Snapshot } from 'react-relay'
function getSnapshot(query: GraphQLTaggedNode, variables: Variables): Snapshot {
const request = getRequest(query)
const { fragment } = createOperationDescriptor(request, variables)
return environment.lookup(fragment)
import { useEffect, useRef } from 'react'
type Callback = () => unknown
export default function useTimeout(handler: Callback, ms = 1000) {
const handlerRef = useRef(handler)
const handleRef = useRef<NodeJS.Timeout>(null)
useEffect(() => {
handleRef.current = setTimeout(() => handlerRef.current?.(), ms)
@yannamsellem
yannamsellem / valid-iban.js
Last active August 17, 2020 12:20
check iban validity
/** @param {string} iban */
function isValidIban(iban) {
const correspond = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
const withoutSpace = iban.replace(/ /g, '').toUpperCase()
const rearranged = withoutSpace.slice(4) + withoutSpace.slice(0, 4)
const computedRemainder = rearranged
.replace(/[a-z]/gi, m => correspond.indexOf(m) + 10)
.match(/([0-9]{9})([0-9]{7})([0-9]{7})([0-9]{5})/)
.slice(1)
.reduce((acc, k) => String(parseInt(acc + k, 10) % 97), '')
import { useRef, useState, useEffect } from 'react'
import ResizeObserver from 'resize-observer-polyfill'
interface Bounds {
left: number
top: number
width: number
height: number
}