theory-of-soul

export type KeysMatchingType<T, V> = { [K in keyof T]-?: T[K] extends V ? K : never }[keyof T];

theory-of-soul

type PropsType<T> = {
    prop: T
};

type memoWithGeneric = <T>(props: PropsType<T>) => JSX.Element;

const Component = <T,>(props: PropsType<T>) => { ... }

export const MyComponent = React.memo(Component) as memoWithGeneric;

theory-of-soul

if (firebase && firebase.messaging.isSupported()) {
  const messaging = firebase.messaging();

  /* eslint-disable */
  messaging.onBackgroundMessage(function (payload) {
    const clickUrl = payload.data["gcm.notification.url"];

    const notificationTitle = payload.notification.title;
    const notificationOptions = {
      body: payload.notification.body,

theory-of-soul

// install separate:
// yarn add sifter
// yarn add microplugin

// and add this in config => 

module.export = {
  ...

  plugins: [

theory-of-soul

           // For keeping optins need to use inner function handleInputChange

           <AsyncSelect
                ref={selectRef}
                onInputChange={(value: string, {action}: InputActionMeta) => {
                    if (action === 'input-change') setInputValue(value);
                }}
                inputValue={inputValue}
                onFocus={() => {
                    if (selectRef.current) {

theory-of-soul

Helpful links

CSS

1. Flexbox playground

Typescript

1. TypeScript: Built-in generic types
2. TypeScript + React: Typing custom hooks with tuple types

Graphics

theory-of-soul

import { AnyAction } from "redux";
export type Wizard = {
  name: string;
  parentsAlive: boolean;
  spells: string[];
};
export const enum WizardActionTypes {
  LearnSpell = "WIZARD/LEARN_SPELL",
  KillParents = "WIZARD/KILL_PARENTS"

theory-of-soul

npx create-react-app any-name

if the command has en error:

Error: EACCES: permission denied, mkdir '/Users/user/.npm/_npx'
TypeError: Cannot read property 'get' of undefined

Fix for it:

theory-of-soul

// Assume the country_code is a ISO 3166-1 alpha-2 string (eg: "US")
function country2emoji(country_code) {
    var OFFSET = 127397;
    var cc = country_code.toUpperCase();
    function _toConsumableArray(arr) {
        if (Array.isArray(arr)) {
            for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) {
                arr2[i] = arr[i];
            }
            return arr2;

theory-of-soul

type StateType = {
    router: RouterState;
    someReducer: Immutable.Map<keyof SomeReducerType, SomeReducerType[keyof SomeReducerType]>;
}

export interface AppStateInterface extends Immutable.Map<string, any> {
    toJS(): StateType;
    get<K extends keyof StateType>(key: K, notSetValue?: StateType[K]): StateType[K];
    set<K extends keyof StateType>(key: K, value: StateType[K]): this;
    has(key: string): key is keyof StateType;