Visa Checker

The visa checker is a front end that is used to display data from the visas endpoint.

How to build and edit locally

First grab a fresh copy of this repository by cloning into it and then installing the npm packages.

Currently, you can only install it as a package. You can reference it using

npm link /path/to/visa-checker

Then you can install it using

// it uses redux, so you'll need to configure the redux store
reducers = combineReducers({
    ...otherReducers,
    visachecker: visaCheckReducer
})
createStore(reducers)

// install it whenever you find a DOM node
const VisaCheckerDOM = document.getElementById('visa-checker')
if(VisaCheckerDOM){
    const countryCodes = VisaCheckerDOM.getAttribute('data-destinations')
    const nationality = getCookie('cnt')
    ReactDOM.render(
        <Provider store={store}>
            <VisaChecker destinations={countryCodes} nationality={nationality}/>
        </Provider>,
        VisaCheckerDOM
    )
}

How to Use

Once you've included the JS file on your page, create a new div tag that with the class visa-checker. Here are the other required and optional attributes.

| Attribute | Description | Required | |-------------------|:-------------------------:|----------:| | class | must be visa-checker | Yes | | data-destinations | two digit country code(s)| Yes | | data-nationality | two digit country code | No |

If you do not provide a data-nationality, the Visa checker will be loaded without a nationality, and the user will be required to enter one to get it to display anything.

However, you can enter multiple destinations and the Visa checker will show the results of multiple destinations.

<div
    id="visa-checker"
    data-destinations="US, DE, IN"
    data-nationality="CA"
></div>

The keys are installed via the webpack.DefinePlugin

webpack.DefinePlugin({
    'process.env': JSON.stringify({
        GAPI_PUBLIC_KEY: '',
        GAPI_BASE_URL: '',
    })
})

TODO

• Tests
• Make installable as standalone package (with preconfigured redux store).