Merge pull request #21 from zenzen-sol/sol/image-boost

chore: Image boost & lighthouse improvements

app/[locale]/product/[handle]/page.tsx

@@ -117,6 +117,7 @@ export default async function ProductPage({
               height={product.featuredImage.height}
               width={product.featuredImage.width}
               className="h-full w-full object-cover"
+              priority={true}
             />
           </div>
 

app/[locale]/stories/[handle]/page.tsx

@@ -80,6 +80,7 @@ export default async function BlogArticlePage({
                 height={article?.image.height}
                 width={article?.image.width}
                 className="h-full w-full object-cover"
+                priority={true}
               />
             </div>
           )}

components/grid/homepage-products.tsx

@@ -72,7 +72,7 @@ export async function HomepageProducts({ lang }: { lang?: SupportedLocale }) {
     >
       <HomepageProductsItem item={firstProduct} priority={true} />
       <HomepageProductsItem item={secondProduct} priority={true} />
-      <HomepageProductsItem item={thirdProduct} />
+      <HomepageProductsItem item={thirdProduct} priority={true} />
     </section>
   );
 }

components/layout/menu/modal.tsx

@@ -26,6 +26,7 @@ export function MenuModal({ scrolled }: { scrolled: boolean }) {
         type="button"
         onClick={() => setIsOpen(true)}
         className="transition-all ease-in-out hover:scale-110"
+        aria-label="Open menu"
       >
         <MenuIcon />
       </button>

components/layout/stories-detail.tsx

@@ -48,6 +48,7 @@ export default async function StoriesDetail({
                         'h-full w-full object-cover',
                         'transition duration-300 ease-in-out hover:scale-105'
                       )}
+                      priority={true}
                     />
                   )}
                 </div>

components/product/tasting-notes.tsx

@@ -27,6 +27,7 @@ export function ProductTastingNotes({ product }: { product: Product }) {
             width={imageWidth}
             height={imageHeight}
             alt={imageAlt || imageUrl}
+            priority={true}
           />
         </div>
       )}