SirMoustache’s gists

SirMoustache / useLocalStorageValue.ts

Created May 13, 2022 13:20

useLocalStorageValue react hook

	import { Dispatch, SetStateAction, useEffect, useState, useCallback } from 'react';

	type SetValue<T> = Dispatch<SetStateAction<T>>;
	type CleanValue = () => void;

	type CustomEventDetail = { key: string };

	const CUSTOM_STORAGE_EVENT = 'webshop:storage';

	declare global {

SirMoustache / createTypedWorker.ts

Created February 11, 2022 10:58 — forked from steida/createTypedWorker.ts

Typed Web Worker

	/**
	* Typed Web Worker.
	*
	* type InputData = { name: string };
	* type OutputData = { nameLength: number }
	*
	* // main.js
	* const worker = createTypedWorker<InputData, OutputData>(worker);
	*
	* // worker.js

SirMoustache / Posts.tsx

Created January 20, 2020 08:11 — forked from koss-lebedev/Posts.tsx

	import React from 'react'
	import fetch from 'isomorphic-fetch'
	import { NextFunctionComponent, NextContext } from 'next'

	type InitialProps = PromiseResult<ReturnType<typeof getInitialProps>>
	type Props = InitialProps
	type Context = NextContext<{ subreddit: string }>

	const Posts: NextFunctionComponent<Props, InitialProps, Context> = ({ posts, subreddit }) => (
	<div>

SirMoustache / transdusers.js

Created June 18, 2019 10:47

Transdusers

	// Test Array
	const testArr = [1, 2, 3, 4, 5, 6];

	// Utils
	const increment = val => val + 1;
	const greaterThan = min => val => val > min;
	const compose = (...fns) => (val) => fns.reduceRight((acc, fn) => fn(acc), val);
	const optCompose = (...fns) => fns.reduce((acc, fn) => x => acc(fn(x)));

	// Base Reducers

SirMoustache / fileUtils.js

Last active May 3, 2019 08:36

Utils functions

	import accepts from 'attr-accept';

	/**
	* @param {Number} maxSize Maximum File size (in bytes)
	* @param {Number} minSize Minimum File size (in bytes)
	* @param {File} file File Object
	*/
	export const fileMatchSize = (maxSize, minSize, file) =>
	file.size <= maxSize && file.size >= minSize;

SirMoustache / hooks.js

Last active February 22, 2019 14:18

React Hooks

	import {useRef, useEffect} from 'react';

	/**
	* Hook for running effect on componentDidUpdate but not on componentDidMount
	*/
	const useComponentDidUpdate = (cb, dependencies) => {
	const mounted = useRef(false)
	useEffect(() => {
	if (mounted.current) {
	return cb()

SirMoustache / FileField.js

Last active May 3, 2019 09:05

React File input using: redux-form, @material-ui and react-dropzone

	/**
	* Absolute imports
	*/
	import React, { PureComponent } from 'react';
	import PropTypes from 'prop-types';
	import Dropzone from 'react-dropzone';
	/**
	* Material UI
	*/
	import Button from '@material-ui/core/Button';

SirMoustache / Select.js

Last active January 29, 2019 17:21

React Material UI + react-select + styled-components

	/**
	* Absolute imports
	*/
	import React from 'react';
	import PropTypes from 'prop-types';
	import ReactSelect from 'react-select';
	import CreatableSelect from 'react-select/lib/Creatable';

	/**
	* Global Components

SirMoustache / reducer.js

Created July 12, 2018 15:44

redux-actions example

	import {
	getTodos,
	createTodo,
	updateTodo,
	destroyTodo
	} from './lib/todoServices'
	import { createActions, handleActions, combineActions } from 'redux-actions'

	const initState = {
	todos: [],

SirMoustache / Form.js

Last active July 11, 2018 13:11

Autocomplete Select with Redux Form, React Selec and Material-UI

	import FormAutocompleteSelect from './FormAutocompleteSelect';
	import { Field } from 'redux-form';

	const countries = [
	{value: 'AlbaniaCountry', label: 'Albania'},
	{value:'AlgeriaCountry', label: 'Algeria'},
	{value:'AndorraCountry', label: 'Andorra'},
	{value:'AngolaCountry', label: 'Angola'}
	];

Vitalii Hopaniuk SirMoustache