import { h, Component } from 'preact';
import { Router } from 'preact-router';

import React from 'react'
import ReactDOM from 'react-dom'

import Header from './header';

// Code-splitting is automated for routes
import Home from '../routes/home';
import Profile from '../routes/profile';


if (process.env.NODE_ENV === "development") {
    console.log('node_env:', process.env.NODE_ENV)
    const a11y = require("react-a11y").default;
    a11y(React, ReactDOM, {
        rules: {
            "img-uses-alt": "error",
        }
    });
}

export default class App extends Component {

    /** Gets fired when the route changes.
     *  @param {Object} event       "change" event from [preact-router](http://git.io/preact-router)
     *  @param {string} event.url   The newly routed URL
     */
    handleRoute = e => {
        this.currentUrl = e.url;
    };



    render() {
        return (
            <div id="app">
                <img src='foo' />
                <Header />
                <Router onChange={this.handleRoute}>
                    <Home path="/" />
                    <Profile path="/profile/" user="me" />
                    <Profile path="/profile/:user" />
                </Router>
            </div>
        );
    }
}