fix: deno task check

components/header/Preheader.tsx

@@ -35,30 +35,30 @@ export default ({
         "https://deco-sites-assets.s3.sa-east-1.amazonaws.com/journeys/f5044d94-348f-4a63-aa15-76949855d78d/us-flag.webp",
       label: "EN",
       value: "en",
-      salesChannel: "1"
+      salesChannel: "1",
     },
     {
       alt: "Canada",
       flag:
         "https://deco-sites-assets.s3.sa-east-1.amazonaws.com/journeys/d83429c1-3a7a-4751-8056-e26c7f33bd0a/ca-flag.webp",
       label: "EN",
       value: "en-ca",
-      salesChannel: "2"
+      salesChannel: "2",
     },
     {
       flag:
         "https://deco-sites-assets.s3.sa-east-1.amazonaws.com/journeys/d83429c1-3a7a-4751-8056-e26c7f33bd0a/ca-flag.webp",
       alt: "Canada - French",
       label: "FR",
       value: "fr-ca",
-      salesChannel: "3"
+      salesChannel: "3",
     },
   ],
   url,
   ...props
 }: PreheaderProps) => {
   const [currentLang, ...otherLanguages] = langs;
-  const isKidzHome = url.pathname === "/kidz";
+  const isKidzHome = url?.pathname === "/kidz";
   const isDesktop = useDevice() === "desktop";
 
   if (!isDesktop) {
@@ -112,7 +112,7 @@ export default ({
         </a>
       </div>
 
-      <Alerts alerts={props.alerts} />
+      <Alerts alerts={props?.alerts ?? []} />
 
       <div class="justify-end items-center hidden lg:flex">
         <div className="dropdown">

components/product/ProductCard.tsx

@@ -34,7 +34,7 @@ function ProductCard({
   index,
   class: _class,
   currencyCode,
-  locale
+  locale,
 }: Props) {
   const { url, image: images, offers, isVariantOf } = product;
   const title = isVariantOf?.name ?? product.name;
@@ -58,10 +58,10 @@ function ProductCard({
     },
   });
 
-  const USDollar = new Intl.NumberFormat("en-US", {
-    style: "currency",
-    currency: "USD",
-  });
+  // const USDollar = new Intl.NumberFormat("en-US", {
+  //   style: "currency",
+  //   currency: "USD",
+  // });
 
   return (
     <div
@@ -109,7 +109,7 @@ function ProductCard({
 
         <div class="flex gap-2">
           <span class="font-primary font-bold text-gray-100 text-sm">
-           {formatPrice(price, currencyCode, locale)}
+            {formatPrice(price, currencyCode, locale)}
           </span>
         </div>
       </a>

components/product/ProductSlider.tsx

@@ -14,7 +14,9 @@ interface Props {
   locale: string;
 }
 
-function ProductSlider({ products, itemListName, currencyCode, locale }: Props) {
+function ProductSlider(
+  { products, itemListName, currencyCode, locale }: Props,
+) {
   const id = useId();
   const device = useDevice();
 

components/search/SearchResult.tsx

@@ -13,7 +13,7 @@ import Sort from "./Sort.tsx";
 import { useDevice, useScript, useSection } from "@deco/deco/hooks";
 import { type SectionProps } from "@deco/deco";
 import { getCookies } from "std/http/cookie.ts";
-import { CurrencyCode } from "apps/shopify/utils/enums.ts";
+// import { CurrencyCode } from "apps/shopify/utils/enums.ts";
 export interface Layout {
   /**
    * @title Pagination
@@ -301,7 +301,6 @@ function SearchResult({ page, ...props }: SectionProps<typeof loader>) {
     return <NotFound />;
   }
   return <Result {...props} page={page} />;
-
 }
 
 export const loader = (props: Props, req: Request) => {
@@ -312,6 +311,6 @@ export const loader = (props: Props, req: Request) => {
     currencyCode: vtexSegment.currencyCode,
     locale: vtexSegment.cultureInfo,
     url: req.url,
-  }
-}
+  };
+};
 export default SearchResult;

components/search/Searchbar/Suggestions.tsx

@@ -7,12 +7,21 @@ import Icon from "../../ui/Icon.tsx";
 import Slider from "../../ui/Slider.tsx";
 import { ACTION, NAME } from "./Form.tsx";
 import { type Resolved } from "@deco/deco";
+import { getCookies } from "std/http/cookie.ts";
 export interface Props {
   /**
    * @title Suggestions Integration
    * @todo: improve this typings ({query: string, count: number}) => Suggestions
    */
   loader: Resolved<Suggestion | null>;
+  /**
+   * @ignore
+   */
+  currencyCode?: string;
+  /**
+   * @ignore
+   */
+  locale?: string;
 }
 export const action = async (props: Props, req: Request, ctx: AppContext) => {
   const {
@@ -25,7 +34,7 @@ export const action = async (props: Props, req: Request, ctx: AppContext) => {
     ...loaderProps,
     query,
   })) as Suggestion | null;
-  return { suggestion };
+  return { suggestion, ...props };
 };
 export const loader = async (props: Props, req: Request, ctx: AppContext) => {
   const {
@@ -37,11 +46,20 @@ export const loader = async (props: Props, req: Request, ctx: AppContext) => {
     ...loaderProps,
     query,
   })) as Suggestion | null;
-  return { suggestion };
+
+  const cookies = getCookies(req.headers);
+  const vtexSegment = JSON.parse(atob(cookies["vtex_segment"]));
+  return {
+    suggestion,
+    currencyCode: vtexSegment.currencyCode,
+    locale: vtexSegment.cultureInfo,
+  };
 };
-function Suggestions(
-  { suggestion }: ComponentProps<typeof loader, typeof action>,
-) {
+function Suggestions({
+  suggestion,
+  currencyCode,
+  locale,
+}: ComponentProps<typeof loader, typeof action>) {
   let { products = [], searches = [] } = suggestion ?? {};
   products ??= [];
 
@@ -87,6 +105,8 @@ function Suggestions(
                   product={product}
                   index={index}
                   itemListName="Suggeestions"
+                  currencyCode={currencyCode}
+                  locale={locale}
                 />
               </Slider.Item>
             ))}

components/shipping/Results.tsx

@@ -66,8 +66,8 @@ export default function Results({ result }: ComponentProps<typeof action>) {
         </li>
       ))}
       <span class="text-xs font-thin">
-        Delivery times start counting from confirmation of the order payment and may vary according to the quantity of products in the
-        bag.
+        Delivery times start counting from confirmation of the order payment and
+        may vary according to the quantity of products in the bag.
       </span>
     </ul>
   );

components/wishlist/WishlistGallery.tsx

@@ -1,3 +1,4 @@
+import { getCookies } from "std/http/cookie.ts";
 import SearchResult, {
   Props as SearchResultProps,
 } from "../search/SearchResult.tsx";
@@ -18,12 +19,23 @@ function WishlistGallery(props: SectionProps<typeof loader>) {
       </div>
     );
   }
-  return <SearchResult {...props} />;
+  return (
+    <SearchResult
+      {...props}
+      currencyCode={props.currencyCode}
+      locale={props.locale}
+    />
+  );
 }
 export const loader = (props: Props, req: Request) => {
+  const cookies = getCookies(req.headers);
+  const vtexSegment = JSON.parse(atob(cookies["vtex_segment"]));
+
   return {
     ...props,
     url: req.url,
+    currencyCode: vtexSegment.currencyCode,
+    locale: vtexSegment.cultureInfo,
   };
 };
 export default WishlistGallery;

sections/Component.tsx

@@ -20,8 +20,8 @@ export class ErrorBoundary extends Component<{
 }, {
   error: Error | null;
 }> {
-  state = { error: null };
-  static getDerivedStateFromError(error: Error) {
+  override state = { error: null };
+  static override getDerivedStateFromError(error: Error) {
     return { error };
   }
   render() {

sections/Header/Header.tsx

@@ -1,4 +1,4 @@
-import type { LoadingFallbackProps } from "@deco/deco";
+import type { LoadingFallbackProps, SectionProps } from "@deco/deco";
 import { useDevice, useScript } from "@deco/deco/hooks";
 import type { ImageWidget } from "apps/admin/widgets.ts";
 import Image from "apps/website/components/Image.tsx";
@@ -47,11 +47,11 @@ export interface PreheaderProps {
    * @ignore
    */
   currentLang?: Lang;
-  alerts: Alert[];
+  alerts?: Alert[];
   /**
    * @ignore
    */
-  url: URL;
+  url?: URL;
 }
 
 /**
@@ -84,6 +84,10 @@ export interface Props {
    * @description Usefull for lazy loading hidden elements, like hamburguer menus etc
    * @hide true */
   loading?: "eager" | "lazy";
+  /**
+   * @ignore
+   */
+  url?: string;
 }
 
 export function Alerts({ alerts }: { alerts: Alert[] }) {
@@ -146,9 +150,7 @@ export function Alerts({ alerts }: { alerts: Alert[] }) {
   );
 }
 
-const Desktop = (
-  { navItems, logo, searchbar, loading }: ReturnType<typeof loader>,
-) => (
+const Desktop = ({ navItems, logo, searchbar, loading }: Props) => (
   <>
     <Modal id={SEARCHBAR_POPUP_ID}>
       <div
@@ -203,11 +205,14 @@ const Desktop = (
   </>
 );
 
-const Mobile = (
-  { logo, searchbar, navItems, loading, url, preheader }: ReturnType<
-    typeof loader
-  >,
-) => (
+const Mobile = ({
+  logo,
+  searchbar,
+  navItems,
+  loading,
+  url,
+  preheader,
+}: Props) => (
   <>
     <Drawer
       id={SEARCHBAR_DRAWER_ID}
@@ -233,8 +238,8 @@ const Mobile = (
           header={url && (
             <Preheader
               url={new URL(url)}
-              alerts={preheader.alerts ?? []}
-              langs={preheader.langs}
+              alerts={preheader?.alerts ?? []}
+              langs={preheader?.langs}
             />
           )}
           drawer={SIDEMENU_DRAWER_ID}
@@ -313,13 +318,12 @@ export const loader = async (props: Props, req: Request, ctx: AppContext) => {
   }
 
   const currentCookieLang = langParamValue ?? cookies?.language ?? "";
-  const langsOrderedWithSelectedFirst = props?.preheader?.langs?.sort(
-    (a) => (a?.value === currentCookieLang ? -1 : 1),
+  const langsOrderedWithSelectedFirst = props?.preheader?.langs?.sort((a) =>
+    a?.value === currentCookieLang ? -1 : 1
   );
 
-  const vtexCookie = cookies["vtex_segment"]
-  if(!vtexCookie){
-
+  const vtexCookie = cookies["vtex_segment"];
+  if (!vtexCookie) {
     return {
       ...props,
       preheader: { ...props.preheader, langs: langsOrderedWithSelectedFirst },
@@ -329,15 +333,18 @@ export const loader = async (props: Props, req: Request, ctx: AppContext) => {
   const vtexSegment = JSON.parse(atob(vtexCookie));
 
   const lang = langsOrderedWithSelectedFirst?.[0];
-  const salesChannelInfo = await ctx.invoke.vtex.loaders.logistics.getSalesChannelById({id: lang?.salesChannel});
+  const salesChannelInfo = await ctx.invoke.vtex.loaders.logistics
+    .getSalesChannelById({
+      id: lang?.salesChannel,
+    });
 
   const newVtexSegment = {
     ...vtexSegment,
     currencyCode: salesChannelInfo.CurrencyCode,
     currencySymbol: salesChannelInfo.CurrencySymbol,
     countryCode: salesChannelInfo.CountryCode,
     cultureInfo: salesChannelInfo.CultureInfo,
-  }
+  };
   const token = serialize(newVtexSegment);
 
   setCookie(ctx.response.headers, {
@@ -356,7 +363,6 @@ export const loader = async (props: Props, req: Request, ctx: AppContext) => {
     httpOnly: true,
   });
 
-
   return {
     ...props,
     preheader: { ...props.preheader, langs: langsOrderedWithSelectedFirst },
@@ -404,8 +410,7 @@ const serialize = ({
   return btoa(JSON.stringify(seg));
 };
 
-
-export default function Header(props: ReturnType<typeof loader>) {
+export default function Header(props: SectionProps<typeof loader>) {
   const isDesktop = useDevice() === "desktop";
 
   return (

sections/Product/ProductDetails.tsx

@@ -12,7 +12,9 @@ export interface Props {
   page: ProductDetailsPage | null;
 }
 
-export default function ProductDetails({ page, currencyCode, locale }: SectionProps<typeof loader>) {
+export default function ProductDetails(
+  { page, currencyCode, locale }: SectionProps<typeof loader>,
+) {
   /**
    * Rendered when a not found is returned by any of the loaders run on this page
    */
@@ -44,7 +46,11 @@ export default function ProductDetails({ page, currencyCode, locale }: SectionPr
           <ImageGallerySlider page={page} />
         </div>
         <div class="sm:col-span-2">
-          <ProductInfo page={page} currencyCode={currencyCode} locale={locale}/>
+          <ProductInfo
+            page={page}
+            currencyCode={currencyCode}
+            locale={locale}
+          />
         </div>
       </div>
     </div>
@@ -58,7 +64,7 @@ export const loader = (props: Props, req: Request) => {
     ...props,
     currencyCode: vtexSegment.currencyCode,
     locale: vtexSegment.cultureInfo,
-  }
-}
+  };
+};
 
 export const LoadingFallback = () => <Section.Placeholder height="635px" />;