Skip to content

Commit

Permalink
fixed regex replacement
Browse files Browse the repository at this point in the history
  • Loading branch information
pookmish committed Dec 6, 2023
1 parent af74826 commit 0589697
Showing 1 changed file with 3 additions and 1 deletion.
4 changes: 3 additions & 1 deletion components/patterns/elements/image-loader.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,14 @@ const ImageLoader = ({ src, width }) => {
const imageStyles = [
{w: 128, s: 'breakpoint_sm_2x'},
{w: 384, s: 'breakpoint_md_2x'},
{w: 400, s: 'breakpoint_md_2x'},
{w: 750, s: 'breakpoint_lg_2x'},
{w: 1200, s: 'breakpoint_xl_2x'},
{w: 3840, s: 'breakpoint_2xl_2x'},
];
const style = imageStyles.find(s => s.w === width)?.s || 'breakpoint_xl_2x';
// Switch the image style for the desired width. Add the width parameter just to prevent console logs.
return src.toString().replace(/styles\/+w\//, `styles/${style}/`) + `&w=${width}`;
// https://nextjs.org/docs/messages/next-image-missing-loader-width
return src.toString().replace(/styles\/\w+\//, `styles/${style}/`) + `&w=${width}`;
}
export default ImageLoader;

0 comments on commit 0589697

Please sign in to comment.