Skip to content

Instantly share code, notes, and snippets.

View jkohlin's full-sized avatar

Johan jkohlin

  • Sweden
  • 00:04 (UTC +02:00)
View GitHub Profile
@jkohlin
jkohlin / colorlog.ts
Last active November 16, 2023 17:29
Create colorized console logs easier.
interface ColorItem {
value: string | number | object
color?: string
}
type Input = (string | ColorItem)[]
/**
* Logs data to the console with customizable colors and formatting.
* @param {Input} data - An array of data to log. Each item can be a string, number, or object with a "value" property.
@jkohlin
jkohlin / stringifyUnknown.ts
Last active October 31, 2023 15:48
stringifyUnknown
// Useful when passing an error from try/catch to a logger
export function stringifyUnknown(obj: unknown): string {
const defaultErrorString = 'unknown error'
const notNullish = obj ?? defaultErrorString
if (typeof notNullish === 'string') {
return notNullish
}
if (typeof notNullish === 'object') {
return JSON.stringify(notNullish, ['message', 'arguments', 'type', 'name', 'stack'], 2)
}
@jkohlin
jkohlin / react-state-debugger.tsx
Created September 5, 2023 12:36
react state debugger
/* eslint-disable */
import { useEffect, useRef } from 'react'
import _ from 'lodash'
function getObjectDiff([obj1, obj2]: [{ [key: string]: any }, { [key: string]: any }]) {
const diff = Object.keys(obj1).reduce((result, key) => {
if (!obj2.hasOwnProperty(key)) {
result.push(key)
} else if (_.isEqual(obj1[key], obj2[key])) {
const resultKeyIndex = result.indexOf(key)
result.splice(resultKeyIndex, 1)
[
{
"id": 1,
"name": "Darla",
"url": "https://www.viralcats.net/media/thumbs/embedded/174.jpg"
},
{
"id": 2,
"name": "Fluffykins",
"url": "https://i.pinimg.com/originals/11/ae/2f/11ae2f50407d4be73cb3e561f2e65e5f.jpg"
@jkohlin
jkohlin / socialSecurityCheck.ts
Created April 21, 2023 15:55
validera personnummer
function validate(personnummer: string): boolean {
let isValid = false
const pnrRegex = new RegExp(/^(\d{6}|\d{8})(-?)(\d{4})/, 's')
const parts = pnrRegex.exec(personnummer)
personnummer = parts?.[1] || '' + parts?.[3] || ''
if (personnummer.length === 12) {
personnummer = personnummer.substring(2)
}
@jkohlin
jkohlin / shake.js
Last active April 20, 2023 11:52
harlem-shake-you-page
!function () { function e(e) { var t = { height: e.offsetHeight, width: e.offsetWidth }; return t.height > r && t.height < s && t.width > i && t.width < d; } function t() { for (var e = document.getElementsByClassName(m), t = RegExp("\\b" + m + "\\b"); 0 < e.length;)e[0].className = e[0].className.replace(t, ""); } for (var n, o, a, r = 30, i = 30, s = 350, d = 350, m = "mw-harlem_shake_me", l = ["im_drunk", "im_baked", "im_trippin", "im_blown"], u = "mw_added_css", c = (n = document.documentElement, window.innerWidth ? window.innerHeight : n && !isNaN(n.clientHeight) ? n.clientHeight : 0), h = window.pageYOffset ? window.pageYOffset : Math.max(document.documentElement.scrollTop, document.body.scrollTop), f = document.getElementsByTagName("*"), p = null, g = 0; g < f.length; g++) { var b = f[g]; if (e(b) && function (e) { var t = function (e) { for (var t = e, n = 0; t;)n += t.offsetTop, t = t.offsetParent; return n; }(e); return t >= h && t <= c + h; }(b)) { p = b; break; } } if (null === b) { console.warn("
@jkohlin
jkohlin / svgColorBoxes.js
Last active April 16, 2023 17:37
svgColorBoxes
function svgColorSwatches(colors, size = 64, vertical = false) {
let svg = vertical
? `<svg width="${size}" height="${colors.length * size}" viewBox="0 0 ${size} ${colors.length * size}" fill="none" xmlns="http://www.w3.org/2000/svg">`
: `<svg width="${colors.length * size}" height="${size}" viewBox="0 0 ${colors.length * size} ${size}" fill="none" xmlns="http://www.w3.org/2000/svg">`;
let x = 0, y = 0;
for (let shade of colors) {
svg += `
<rect width="${size}" height="${size}" fill="${shade}" x="${x}" y="${y}"/>`;
x += vertical ? 0 : size;
y += vertical ? size : 0;
@jkohlin
jkohlin / groupByMulti.ts
Created April 12, 2023 10:49
groupByMulti
type GroupByMulti = (list: any[], paths: { [key: string]: string }) => any
export const groupByMulti: GroupByMulti = (list, paths) => {
return (
list?.reduce((acc: { [key: string]: any }, row: any) => {
Object.keys(paths).forEach((key) => {
const path = paths[key]
if (getVal(row, path)) {
;(acc[key] = acc[key] || {})[getVal(row, path)] = (acc[key] = acc[key] || {})[getVal(row, path)] || []
acc[key][getVal(row, path)].push(row)
}
@jkohlin
jkohlin / eventPromise.ts
Last active March 1, 2023 14:52
a weird little promise wrapper around playwright event
export async function blockUntilEvent(page: Page, callback: (frame: Frame, resolve: any, reject: any) => Promise<void>) {
return await new Promise((resolve, reject) =>
page.on('framenavigated', async (frame) => {
try {
await callback(frame, resolve, reject);
} catch (err) {
reject(err);
}
})
);
@jkohlin
jkohlin / datesFromWeek.js
Created December 19, 2022 09:52
Get the start date and end date from a weekString ('2021-W01')
/**
* <input type=week genererar en sträng typ '2022-W12' som vi vill ha omvandlad till två datum
* @param {string} weekString:'2021-W01'
* @returns {object} {from: date, to: date}
*/
export const datesFromWeek = (weekString) => {
let [y, w] = weekString.split('-')
w = w.replace('W', '')
const offsetDate = new Date(y, 0, w * 7)
return {