[Flow] Declare types for application

In Flow, you can make global declarion about types.

Run:

flow init

 

It will generate .flowconfig file, open it and add few lines of configration.

[libs]
decls/

[ignore]
.*/node_modules/.*

So it says that go to find 'decls' folders and use what has been defined as global type checking.

 

Declear a variable:

declare type PetAction = 'adopt' | 'foster';

 

Declear a function:

declare type PetShelterDispatch = (x: PetShelterActions) => void;

 

Declear an interface:

declare type Pet = {
    name: string;
    id: number;
    from: string;
    type: PetType;
    locationId: number;
    action?: PetAction;
};

All those will be global available for React components.

 

So you can use those, for example:

// @flow
module.exports = ([
    {
        type: 'dog',
        name: 'Snoopy',
        from: 'Charlie',
        locationId: 0,
        id: 0
    },
    {
        type: 'cat',
        name: 'Garfield',
        from: 'John',
        locationId: 0,
        id: 1
    }
]: Array<Pet>);

 

It is also good to declear type for "state", 'props':

// @flow

const React = require('react');

type ModalProps = {
    dispatch: PetShelterDispatch;
    pet: Pet;
};
type ModalState = {
    inquiry: ?PetInquiry;
};

class PetModal extends React.Component {

    props: ModalProps;
    state: ModalState;
    onSubmitClick: () => void;

    ....