deco-sites · mcandeia · Jul 26, 2024 · Jul 26, 2024 · Jul 26, 2024 · Aug 1, 2024
diff --git a/.deco/blocks/Header.json b/.deco/blocks/Header.json
@@ -65,5 +65,6 @@
       "children": []
     }
   ],
-  "loading": "eager"
+  "loading": "eager",
+  "name": "Marcos"
 }
diff --git a/.deco/blocks/Preview%20site%2Fsections%2FHeader%2FHeader.tsx.json b/.deco/blocks/Preview%20site%2Fsections%2FHeader%2FHeader.tsx.json
@@ -0,0 +1,17 @@
+{
+  "__resolveType": "site/sections/Header/Header.tsx",
+  "alerts": [],
+  "navItems": [],
+  "searchbar": {
+    "placeholder": "What are you looking for?",
+    "loader": {
+      "data": {
+        "searches": [],
+        "products": []
+      },
+      "__resolveType": "resolved"
+    }
+  },
+  "logo": {},
+  "loading": "eager"
+}
diff --git a/.deco/blocks/Preview%20site%2Fsections%2FImages%2FCarousel.tsx.json b/.deco/blocks/Preview%20site%2Fsections%2FImages%2FCarousel.tsx.json
@@ -0,0 +1,4 @@
+{
+  "__resolveType": "site/sections/Images/Carousel.tsx",
+  "images": []
+}
diff --git a/.deco/blocks/site.json b/.deco/blocks/site.json
@@ -24,9 +24,7 @@
     },
     {
       "__resolveType": "analytics/sections/Analytics/DecoAnalytics.tsx"
-    }
-  ],
-  "pageSections": [
+    },
     {
       "__resolveType": "site/sections/Session.tsx",
       "minicart": null,

diff --git a/_app.tsx b/_app.tsx
@@ -0,0 +1,51 @@
+import { asset } from "$fresh/runtime.ts";
+import { useScript } from "@deco/deco/hooks";
+import { Head } from "@deco/deco/htmx";
+import { ComponentChildren } from "preact";
+
+const serviceWorkerScript = () =>
+  addEventListener("load", () =>
+    navigator && navigator.serviceWorker &&
+    navigator.serviceWorker.register("/sw.js?__frsh_c"));
+
+export const Layout = (
+  { children, revision, hmrUniqueId }: {
+    children: ComponentChildren;
+    revision: string;
+    hmrUniqueId: string;
+  },
+) => {
+  return (
+    <>
+      {/* Include Icons and manifest */}
+      {/** @ts-ignore: ignore error */}
+      <Head>
+        {/* Enable View Transitions API */}
+        <style
+          dangerouslySetInnerHTML={{
+            __html: `@view-transition { navigation: auto; }`,
+          }}
+        />
+
+        {/* Tailwind v3 CSS file */}
+        <link
+          href={`/styles.css?revision=${revision}${hmrUniqueId}`}
+          rel="stylesheet"
+        />
+
+        {/* Web Manifest */}
+        <link rel="manifest" href={asset("/site.webmanifest")} />
+      </Head>
+
+      {/* Rest of Preact tree */}
+      {children}
+
+      <script
+        type="module"
+        dangerouslySetInnerHTML={{
+          __html: useScript(serviceWorkerScript),
+        }}
+      />
+    </>
+  );
+};
diff --git a/apps/site.ts b/apps/site.ts
@@ -1,3 +1,6 @@
+import type { App as A, AppContext as AC } from "@deco/deco";
+import { Section } from "@deco/deco/blocks";
+import { rgb24 } from "@std/fmt/colors";
 import commerce from "apps/commerce/mod.ts";
 import { color as linx } from "apps/linx/mod.ts";
 import { color as nuvemshop } from "apps/nuvemshop/mod.ts";
@@ -6,9 +9,6 @@ import { color as vnda } from "apps/vnda/mod.ts";
 import { color as vtex } from "apps/vtex/mod.ts";
 import { color as wake } from "apps/wake/mod.ts";
 import { Props as WebsiteProps } from "apps/website/mod.ts";
-import { Section } from "deco/blocks/section.ts";
-import type { App as A, AppContext as AC } from "deco/mod.ts";
-import { rgb24 } from "std/fmt/colors.ts";
 import manifest, { Manifest } from "../manifest.gen.ts";
 
 export interface Props extends WebsiteProps {

diff --git a/components/Session.tsx b/components/Session.tsx
@@ -1,6 +1,6 @@
 import { Head } from "$fresh/runtime.ts";
+import { useScript } from "@deco/deco/hooks";
 import { type Person } from "apps/commerce/types.ts";
-import { useScript } from "deco/hooks/useScript.ts";
 import { type AppContext } from "../apps/site.ts";
 import { MINICART_DRAWER_ID } from "../constants.ts";
 import { useComponent } from "../sections/Component.tsx";

diff --git a/components/header/Bag.tsx b/components/header/Bag.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import { MINICART_DRAWER_ID } from "../../constants.ts";
 import { useId } from "../../sdk/useId.ts";
 import Icon from "../ui/Icon.tsx";

diff --git a/components/header/SignIn.tsx b/components/header/SignIn.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import { clx } from "../../sdk/clx.ts";
 import { useId } from "../../sdk/useId.ts";
 import Icon from "../ui/Icon.tsx";

diff --git a/components/minicart/Coupon.tsx b/components/minicart/Coupon.tsx
@@ -1,5 +1,5 @@
+import { useScript } from "@deco/deco/hooks";
 import { MINICART_FORM_ID } from "../../constants.ts";
-import { useScript } from "deco/hooks/useScript.ts";
 
 export interface Props {
   coupon?: string;

diff --git a/components/minicart/Item.tsx b/components/minicart/Item.tsx
@@ -1,8 +1,8 @@
+import { useScript } from "@deco/deco/hooks";
 import { AnalyticsItem } from "apps/commerce/types.ts";
 import Image from "apps/website/components/Image.tsx";
 import { clx } from "../../sdk/clx.ts";
 import { formatPrice } from "../../sdk/format.ts";
-import { useScript } from "deco/hooks/useScript.ts";
 import Icon from "../ui/Icon.tsx";
 import QuantitySelector from "../ui/QuantitySelector.tsx";
 

diff --git a/components/minicart/Minicart.tsx b/components/minicart/Minicart.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import { AppContext } from "../../apps/site.ts";
 import { MINICART_DRAWER_ID, MINICART_FORM_ID } from "../../constants.ts";
 import { clx } from "../../sdk/clx.ts";

diff --git a/components/product/AddToCartButton.tsx b/components/product/AddToCartButton.tsx
@@ -1,5 +1,5 @@
+import { useScript } from "@deco/deco/hooks";
 import { AnalyticsItem, Product } from "apps/commerce/types.ts";
-import { useScript } from "deco/hooks/useScript.ts";
 import { JSX } from "preact";
 import { clx } from "../../sdk/clx.ts";
 import { useId } from "../../sdk/useId.ts";

diff --git a/components/product/ProductVariantSelector.tsx b/components/product/ProductVariantSelector.tsx
@@ -1,5 +1,5 @@
+import { useSection } from "@deco/deco/hooks";
 import type { Product } from "apps/commerce/types.ts";
-import { useSection } from "deco/hooks/useSection.ts";
 import { clx } from "../../sdk/clx.ts";
 import { relative } from "../../sdk/url.ts";
 import { useId } from "../../sdk/useId.ts";

diff --git a/components/search/SearchResult.tsx b/components/search/SearchResult.tsx
@@ -1,8 +1,7 @@
+import { SectionProps } from "@deco/deco";
+import { useDevice, useScript, useSection } from "@deco/deco/hooks";
 import type { ProductListingPage } from "apps/commerce/types.ts";
 import { mapProductToAnalyticsItem } from "apps/commerce/utils/productToAnalyticsItem.ts";
-import { useScript } from "deco/hooks/useScript.ts";
-import { useSection } from "deco/hooks/useSection.ts";
-import { SectionProps } from "deco/mod.ts";
 import ProductCard from "../../components/product/ProductCard.tsx";
 import Filters from "../../components/search/Filters.tsx";
 import Icon from "../../components/ui/Icon.tsx";
@@ -13,7 +12,6 @@ import { useSendEvent } from "../../sdk/useSendEvent.ts";
 import Breadcrumb from "../ui/Breadcrumb.tsx";
 import Drawer from "../ui/Drawer.tsx";
 import Sort from "./Sort.tsx";
-import { useDevice } from "deco/hooks/useDevice.ts";
 
 export interface Layout {
   /**

diff --git a/components/search/Searchbar/Form.tsx b/components/search/Searchbar/Form.tsx
@@ -9,12 +9,12 @@
  * no JavaScript is shipped to the browser!
  */
 
+import { asResolved, Resolved } from "@deco/deco";
+import { useScript } from "@deco/deco/hooks";
 import { Suggestion } from "apps/commerce/types.ts";
-import { useScript } from "deco/hooks/useScript.ts";
-import { asResolved, Resolved } from "deco/mod.ts";
 import {
-  SEARCHBAR_INPUT_FORM_ID,
-  SEARCHBAR_POPUP_ID,
+    SEARCHBAR_INPUT_FORM_ID,
+    SEARCHBAR_POPUP_ID,
 } from "../../../constants.ts";
 import { useId } from "../../../sdk/useId.ts";
 import { useComponent } from "../../../sections/Component.tsx";

diff --git a/components/search/Searchbar/Suggestions.tsx b/components/search/Searchbar/Suggestions.tsx
@@ -1,5 +1,5 @@
+import { Resolved } from "@deco/deco";
 import { Suggestion } from "apps/commerce/types.ts";
-import { Resolved } from "deco/mod.ts";
 import type { AppContext } from "../../../apps/site.ts";
 import { clx } from "../../../sdk/clx.ts";
 import { ComponentProps } from "../../../sections/Component.tsx";

diff --git a/components/search/Sort.tsx b/components/search/Sort.tsx
@@ -1,5 +1,5 @@
+import { useScript } from "@deco/deco/hooks";
 import { ProductListingPage } from "apps/commerce/types.ts";
-import { useScript } from "deco/hooks/useScript.ts";
 
 const SORT_QUERY_PARAM = "sort";
 const PAGE_QUERY_PARAM = "page";

diff --git a/components/ui/CategoryBanner.tsx b/components/ui/CategoryBanner.tsx
@@ -1,6 +1,6 @@
+import type { SectionProps } from "@deco/deco";
 import type { ImageWidget } from "apps/admin/widgets.ts";
 import { Picture, Source } from "apps/website/components/Picture.tsx";
-import type { SectionProps } from "deco/types.ts";
 
 /**
  * @titleBy matcher

diff --git a/components/ui/Drawer.tsx b/components/ui/Drawer.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import { type ComponentChildren } from "preact";
 import { clx } from "../../sdk/clx.ts";
 import { useId } from "../../sdk/useId.ts";

diff --git a/components/ui/Modal.tsx b/components/ui/Modal.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import { ComponentChildren } from "preact";
 import { useId } from "../../sdk/useId.ts";
 

diff --git a/components/ui/QuantitySelector.tsx b/components/ui/QuantitySelector.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import { type JSX } from "preact";
 import { clx } from "../../sdk/clx.ts";
 import { useId } from "../../sdk/useId.ts";

diff --git a/components/ui/Slider.tsx b/components/ui/Slider.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import type { JSX } from "preact";
 import { clx } from "../../sdk/clx.ts";
 

diff --git a/components/user/Provider.tsx b/components/user/Provider.tsx
@@ -1,5 +1,5 @@
+import { useScript } from "@deco/deco/hooks";
 import { Person } from "apps/commerce/types.ts";
-import { useScript } from "deco/hooks/useScript.ts";
 import { USER_ID } from "../../constants.ts";
 
 const onLoad = (jsonID: string) => {

diff --git a/components/wishlist/Provider.tsx b/components/wishlist/Provider.tsx
@@ -1,4 +1,4 @@
-import { useScript } from "deco/hooks/useScript.ts";
+import { useScript } from "@deco/deco/hooks";
 import { AppContext } from "../../apps/site.ts";
 import { WISHLIST_FORM_ID } from "../../constants.ts";
 import { useComponent } from "../../sections/Component.tsx";

diff --git a/components/wishlist/WishlistButton.tsx b/components/wishlist/WishlistButton.tsx
@@ -1,5 +1,5 @@
+import { useScript } from "@deco/deco/hooks";
 import { AnalyticsItem } from "apps/commerce/types.ts";
-import { useScript } from "deco/hooks/useScript.ts";
 import { clx } from "../../sdk/clx.ts";
 import { useId } from "../../sdk/useId.ts";
 import { useSendEvent } from "../../sdk/useSendEvent.ts";

diff --git a/components/wishlist/WishlistGallery.tsx b/components/wishlist/WishlistGallery.tsx
@@ -1,6 +1,6 @@
-import { SectionProps } from "deco/mod.ts";
+import { SectionProps } from "@deco/deco";
 import SearchResult, {
-  Props as SearchResultProps,
+    Props as SearchResultProps,
 } from "../search/SearchResult.tsx";
 
 export type Props = SearchResultProps;

diff --git a/deno.json b/deno.json
@@ -1,28 +1,38 @@
 {
   "imports": {
-    "deco/": "https://cdn.jsdelivr.net/gh/deco-cx/[email protected]/",
-    "apps/": "https://cdn.jsdelivr.net/gh/deco-cx/[email protected]/",
     "$fresh/": "https://deno.land/x/[email protected]/",
-    "preact": "https://esm.sh/[email protected]",
-    "preact/": "https://esm.sh/[email protected]/",
-    "preact-render-to-string": "https://esm.sh/*[email protected]",
+    "@deco/deco": "jsr:@deco/[email protected]",
     "@preact/signals": "https://esm.sh/*@preact/[email protected]",
     "@preact/signals-core": "https://esm.sh/*@preact/[email protected]",
-    "std/": "https://deno.land/[email protected]/",
-    "daisyui": "npm:[email protected]"
+    "@deco/durable": "jsr:@deco/durable@^0.5.3",
+    "@std/assert": "jsr:@std/assert@^1.0.2",
+    "@std/async": "jsr:@std/async@^1.0.3",
+    "@std/crypto": "jsr:@std/crypto@^1.0.2",
+    "@std/encoding": "jsr:@std/encoding@^1.0.1",
+    "@std/fmt": "jsr:@std/fmt@^1.0.0",
+    "@std/http": "jsr:@std/http@^1.0.2",
+    "@std/media-types": "jsr:@std/media-types@^1.0.2",
+    "@std/path": "jsr:@std/path@^1.0.2",
+    "apps/": "https://denopkg.com/deco-cx/apps@2dfb5a43753691dc4bb6062945cb602b55a02482/",
+    "daisyui": "npm:[email protected]",
+    "partytown/": "https://deno.land/x/[email protected]/",
+    "preact": "npm:[email protected]",
+    "preact-render-to-string": "https://esm.sh/*[email protected]"
   },
   "tasks": {
-    "start": "deno task bundle && deno run -A --unstable-http --env --config=deno.json $(deno eval 'console.log(import.meta.resolve(\"deco/hypervisor/main.ts\"))') --build-cmd 'deno task build' -- deno task dev",
+    "start": "deno task bundle && deno run -A --unstable-http --env --config=deno.json https://deco.cx/run --build-cmd 'deno task build' -- deno task dev",
     "gen": "deno run -A dev.ts --gen-only",
     "play": "USE_LOCAL_STORAGE_ONLY=true deno task start",
     "component": "deno eval 'import \"deco/scripts/component.ts\"'",
     "release": "deno eval 'import \"deco/scripts/release.ts\"'",
-    "update": "deno run -Ar https://deco.cx/update",
     "check": "deno fmt && deno lint && deno check dev.ts main.ts",
     "install": "deno eval 'import \"deco/scripts/apps/install.ts\"'",
     "uninstall": "deno eval 'import \"deco/scripts/apps/uninstall.ts\"'",
-    "bundle": "deno eval 'import \"deco/scripts/apps/bundle.ts\"' site",
+    "update": "deno run -Ar jsr:@deco/scripts/update",
+    "bundle": "deno run -A jsr:@deco/deco/scripts/bundle site",
     "cache_clean": "rm deno.lock; deno cache -r main.ts",
+    "decodev": "deno run -A jsr:@deco/deco/scripts/dev",
+    "decoprod": "deno run -A jsr:@deco/deco/scripts/dev $ && deno add jsr:@deco/deco",
     "build": "deno run -A dev.ts build",
     "preview": "deno run -A main.ts",
     "generate-icons": "deno run -A --unstable static/generate-icons.ts",

diff --git a/dev.ts b/dev.ts
@@ -1,12 +1,4 @@
-import { setupGithooks } from "https://deno.land/x/[email protected]/githooks.ts";
-
-import dev from "$fresh/dev.ts";
-import config from "./fresh.config.ts";
-
-setupGithooks().catch(console.error);
-
-// Generate manifest and boot server
-await dev(import.meta.url, "./main.ts", config);
+import "./hono.ts";
 
 if (Deno.args.includes("build")) {
   Deno.exit(0);

diff --git a/fresh.config.ts b/fresh.config.ts
diff --git a/fresh.gen.ts b/fresh.gen.ts
diff --git a/hono.ts b/hono.ts
@@ -0,0 +1,20 @@
+import { Deco } from "@deco/deco";
+
+import { Head } from "$fresh/runtime.ts";
+import { bindings as HTMX } from "@deco/deco/htmx";
+import { type Manifest } from "./manifest.gen.ts";
+// compatibility code with Fresh
+import type { ComponentType } from "preact";
+import { Layout } from "./_app.tsx";
+
+(Head as ComponentType).displayName = "HTMLHead";
+// end compatibility code with fresh
+
+const deco = await Deco.init({
+  bindings: HTMX<Manifest>({
+    Layout,
+  }),
+});
+
+const envPort = Deno.env.get("PORT");
+Deno.serve({ handler: deco.fetch.bind(deco), port: envPort ? +envPort : 8000 });