import React from "react"; import Root from "Root"; import { NavItem, NavLink } from "reactstrap"; import { Query } from "react-apollo"; import * as Viewer from "Queries/viewer"; import { Link } from "react-router-dom"; import { Layout } from "@nebulario/tunnel-layout"; export const HomeLink = ({ viewer }) => ( <NavItem> <Link className="nav-link" to="/"> <i className="fa fa-home" /> Home </Link> </NavItem> ); const App = () => { return ( <Query query={Viewer.Get}> {({ loading, error, data }) => { if (loading) return <p>Loading...</p>; if (error) return <p>Error: {error}</p>; const { viewer } = data; return ( <Layout brand={ <span> <i className="fa fa-compress" /> Tunnels </span> } viewer={viewer} left={[<HomeLink key={"home"} viewer={viewer} />]} right={[]} > <Root viewer={viewer} /> </Layout> ); }} </Query> ); }; export default App;