chuckdries/Personal-Website
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

key gatsbyImage by image base to hopefully help with refresh stickiness?

Browse Source
This commit is contained in:
Chuck Dries 2021-06-16 19:19:23 -07:00
parent bb198b54fe
commit 6a787f6c08
No known key found for this signature in database
GPG Key ID: 4E6B9B2DCEC64BA9
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
gatsby/src/pages/index.js
View File

@ -9,7 +9,7 @@ const IndexPage = ({ data }) => {
const images = data.allFile.edges.map((edge) => edge.node); const images = data.allFile.edges.map((edge) => edge.node);
const image = React.useRef(images[Math.floor(Math.random() * images.length)]).current; const image = React.useRef(images[Math.floor(Math.random() * images.length)]).current;
const vibrant = getVibrant(image); const vibrant = getVibrant(image);
console.log('vibrant', getVibrant(image)); console.log('image', image);
return (<> return (<>
<Helmet> <Helmet>
<body <body
@ -24,6 +24,7 @@ const IndexPage = ({ data }) => {
alt="" alt=""
className="sm:h-auto lg:h-screen hero-img" className="sm:h-auto lg:h-screen hero-img"
image={getImage(image)} image={getImage(image)}
key={image.base}
loading="eager" loading="eager"
style={{ style={{
gridArea: '1/1', gridArea: '1/1',
@ -62,7 +63,7 @@ export const query = graphql`
allFile( allFile(
filter: { filter: {
sourceInstanceName: {eq: "gallery"}, sourceInstanceName: {eq: "gallery"},
# base: {in: ["DSC00201.jpg", "DSC05851.jpg", "DSC4180.jpg", "DSC08521.jpg", "DSC06245.jpg", "_DSC4949.jpg"]} base: {nin: ["DSC01699.jpg", "DSC02981.jpg", "_DSC4155.jpg"]}
} }
) { ) {
edges { edges {
@ -76,7 +77,7 @@ export const query = graphql`
placeholder: TRACED_SVG placeholder: TRACED_SVG
# placeholder: NONE # placeholder: NONE
# blurredOptions: {width: 50} # blurredOptions: {width: 50}
breakpoints: [750, 1080, 1366, 1920, 2560, 3840] breakpoints: [750, 1080, 1366, 1920, 2560]
) )
fields { fields {
imageMeta { imageMeta {