import * as React from "react";
import { graphql, Link } from "gatsby";
import { navigate } from "gatsby";
import { Helmet } from "react-helmet";
import MasonryGallery from "../components/MasonryGallery";
const GalleryPage = ({ data }) => {
const images = React.useMemo(
() => data.allFile.edges.map((edge) => edge.node, [data]),
[data]
);
return (
<>
Photo Gallery | Chuck Dries
);
};
export const query = graphql`
query GalleryPageQuery {
allFile(
filter: { sourceInstanceName: { eq: "gallery" } }
sort: { fields: fields___imageMeta___dominantHue, order: DESC }
) {
edges {
node {
relativePath
base
childImageSharp {
fluid {
aspectRatio
}
gatsbyImageData(
layout: CONSTRAINED
height: 550
placeholder: DOMINANT_COLOR
)
}
fields {
imageMeta {
dominantHue
dateTaken
meta {
ObjectName
}
}
}
}
}
}
}
`;
export default GalleryPage;