import React from 'react'
import { StaticQuery, graphql } from 'gatsby'
import Navigation from '../components/navigation'

export default ({ children }) => (
  <StaticQuery
    query={graphql`
      query NavigationQuery {
        allMongodbPlacardDevSportsAndCountries {
          edges {
            node {
              name
              countries {
                name
              }
            }
          }
        }
      }
    `}
    render={data => (
      <div>
        <Navigation
          sports={data.allMongodbPlacardDevSportsAndCountries.edges}
        />
        {children}
      </div>
    )}
  />
)

@@ -464,19 +464,16 @@
 %0A      %3C
-div
 %3E%0A      
@@ -597,11 +597,8 @@
   %3C/
-div
 %3E%0A  

Use short syntax version for the Fragment.