KonradSzwarc’s gists

KonradSzwarc / button.styles.ts

Created August 12, 2022 10:17

Tailwind CSS variants

	import type { ButtonProps } from './button';

	type Props = Required<ButtonProps>;

	export const baseClasses =
	'inline-flex items-center border font-medium rounded-md enabled:shadow-sm active:enabled:translate-y-px focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500';

	export const sizeClasses: Record<Props['size'], string> = {
	xs: 'px-3 h-6 text-xs',
	sm: 'px-4 h-8 text-sm',

KonradSzwarc / opaque.ts

Created March 24, 2022 15:00

Opaque types that can be nested in each other.

	declare const t: unique symbol;
	declare const t1: unique symbol;
	declare const t2: unique symbol;

	interface Extend0<Token> {
	readonly [t]: Token;
	}

	interface Extend1<Token> {
	readonly [t1]: Token;

KonradSzwarc / map-builder.ts

Created December 28, 2021 17:15

Creates object with specyfied value types that can be extended by new key-value pairs.

	const mapBuilder = <ValueType = never>() => {
	const addFactory = <Values extends Record<string, ValueType>>(values: Values) => ({
	add: <Key extends string>(key: Key, data: ValueType) =>
	addFactory({ ...values, [key]: data } as Record<keyof Values \| Key, ValueType>),
	build: () => values,
	});

	return addFactory({});
	};

KonradSzwarc / prepare-commit-msg

Created July 26, 2021 10:10

Script that suffixes commit message with the issue ID taken from a branch name.

	#!/bin/sh
	. "$(dirname "$0")/_/husky.sh"

	COMMIT_MSG_FILE=$1
	COMMIT_SOURCE=$2

	BRANCH_NAME=$(git rev-parse --abbrev-ref HEAD 2>/dev/null)
	CHORE_BRANCH_REGEX='^chore-.+$'
	VALID_BRANCH_REGEX='^issue-[0-9]+-.+$'
	COMMIT_MESSAGE=$(<$COMMIT_MSG_FILE)

KonradSzwarc / withHook.tsx

Created May 26, 2021 12:07

HOC that allows to use React hooks with class components.

	import React, { ReactElement, ComponentType } from 'react';

	function withHook<HookReturn extends Record<string, unknown>>(use: () => HookReturn) {
	return <Props extends Record<string, unknown>>(
	Component: ComponentType<Props & HookReturn>,
	): ComponentType<Props> => {
	const WrappedComponent = (props: Props): ReactElement<Props & HookReturn> => {
	const hookProps = use();

	return <Component {...props} {...hookProps} />;

KonradSzwarc / createAction.ts

Created December 26, 2020 18:02

Function that generates redux action creator

	type ResolveType<T> = T extends (...args: any[]) => Record<string, unknown>
	? T
	: { [K in keyof T]: T[K] };

	export function createAction<
	Type extends string,
	Args extends any[] = [],
	Return extends Record<string, unknown> = Record<string, unknown>
	>(
	type: Type,

KonradSzwarc / omit.ts

Created August 1, 2020 08:54

Type-safe omit function.

	export const omit = <T extends Record<string, unknown>, K extends [...(keyof T)[]]>(
	originalObject: T,
	keysToOmit: K,
	): {
	[K2 in Exclude<keyof T, K[number]>]: T[K2];
	} => {
	const clonedObject = { ...originalObject };

	for (const path of keysToOmit) {
	delete clonedObject[path];

KonradSzwarc / createAsyncState.ts

Created June 12, 2020 23:01

Redux utility function that creates a state slice for asynchronous data.

	export type AsyncState<T> = {
	status: 'idle' \| 'loading' \| 'success' \| 'failure';
	data: T;
	error: string \| null;
	};

	export const createAsyncState = <T>(initialData: T): AsyncState<T> => ({
	status: 'idle',
	data: initialData,
	error: null,

KonradSzwarc / makeStyles.ts

Created June 12, 2020 22:59

Custom implementation of the Material UI makeStyles function that uses a custom Theme type.

	import makeMuiStyles from '@material-ui/styles/makeStyles';
	import { ClassNameMap, Styles, WithStylesOptions } from '@material-ui/styles/withStyles';

	import { Theme } from './types';

	export const makeStyles = <Props extends {} \| undefined = undefined, ClassKey extends string = string>(
	styles: Styles<Theme, Props extends undefined ? {} : Props, ClassKey>,
	options?: Omit<WithStylesOptions<Theme>, 'withTheme'>,
	) => {
	return makeMuiStyles(styles, options) as Props extends undefined

Konrad Szwarc KonradSzwarc