l-portet’s gists

l-portet / useScrollParent.ts

Created October 23, 2024 13:56

	import { RefObject, useEffect, useRef } from 'react';

	function getScrollParent(node: HTMLElement \| null): HTMLElement \| null {
	const isElement = node instanceof HTMLElement;
	const overflowY = isElement && window.getComputedStyle(node).overflowY;
	const isScrollable = overflowY !== 'visible' && overflowY !== 'hidden';

	if (!node) {
	return null;
	} else if (isScrollable && node.scrollHeight >= node.clientHeight) {

l-portet / vanta-skipper.js

Created September 23, 2024 11:39

	// paste this in your console
	document.querySelectorAll('.vjs-tech').forEach(element => element.playbackRate = 15)

l-portet / use-effect-when.ts

Created February 2, 2024 15:39

	import { DependencyList, EffectCallback, useEffect, useRef } from 'react';

	export const useEffectWhen = (callback: EffectCallback, whatDeps: DependencyList, whenDeps: DependencyList) => {
	const prevWhenValuesRef = useRef<DependencyList>([]);

	useEffect(() => {
	const prevWhenDeps = prevWhenValuesRef.current;
	prevWhenValuesRef.current = whenDeps;

	for (let i = 0; i < whenDeps.length; i++) {

l-portet / slack_old_layout.md

Last active December 15, 2023 15:08

Restore old Slack layout in the Electron app

Open the Slack app on dev mode

export SLACK_DEVELOPER_MENU=true && open /Applications/Slack.app/

Inject this in the localStorage

localStorage.setItem("localConfig_v2", localStorage.getItem("localConfig_v2").replace(/\"is_unified_user_client_enabled\":true/g, '\"is_unified_user_client_enabled\":false'))

l-portet / useEventBus.ts

Last active April 4, 2024 17:55

utility hook for event communication in React components

	import { useEffect, useState } from 'react';

	type Callback = (data?: any) => void;

	class EventBus<E extends string = string> {
	events: Partial<Record<E, Callback[]>>;

	constructor() {
	this.events = {};
	}

l-portet / useTraceUpdate.ts

Created September 12, 2023 15:39

Trace what triggers a React component re-render

	// extracted from https://github.com/damiangreen/use-trace-update

	import { useEffect, useRef } from 'react';

	export default function useTraceUpdate(props) {
	const prev = useRef(props);
	useEffect(() => {
	const changedProps = Object.entries(props).reduce((ps, [k, v]) => {
	if (prev.current[k] !== v) {
	ps[k] = [prev.current[k], v];

l-portet / tailwind-flex-plugin.ts

Last active August 28, 2023 11:30

	// in tailwind.config.ts
	// import flexPlugin from 'path/to/plugin.ts'
	// export default {
	// plugins: [flexPlugin]
	// }

	// usage: flex-<justify> or flex-<justify>-<align>
	// ex: flex-between or flex-around-stretch

	import plugin from 'tailwindcss/plugin';

l-portet / export-files-chatgpt.sh

Created June 20, 2023 06:42

Export files for ChatGPT

	#!/bin/bash

	# this script recursively exports all files in a directory
	# the output will be copied your clipboard using a format
	# that's easy to be interpreted by LLMs like chatgpt

	function print_files {
	for entry in "$1"/*
	do
	if [ -d "$entry" ]; then

l-portet / bypass-shopify-store-password.html

Created May 15, 2023 15:42

Automatically bypass a Shopify store public password page

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width" />
	<title>Redirecting...</title>
	</head>
	<body>
	<form
	method="post"

l-portet / fly-deploy-last-commit.sh

Last active August 28, 2023 08:59

fly deploy last commit instead of all files

	#!/usr/bin/env bash

	last_commit=$(git log --format="%h %s" -n 1)

	echo "this will deploy your last local commit"
	echo $last_commit

	while true; do
	read -p "Do you want to continue? (y/n) " yn
	case $yn in

Lucas Portet l-portet

Open the Slack app on dev mode

Inject this in the localStorage