cloudcommerce 0.0.125 → 0.0.127

package/ecomplus-stores/tia-sonia/functions/ssr/src/components/header/HeaderButtons.vue

@@ -0,0 +1,46 @@
+<script lang="ts" setup>
+import {
+  i19myAccountAndOrders,
+  i19openCart,
+} from '@@i18n';
+import LoginDrawer, { Props as LoginDrawerProps } from '@@components/LoginDrawer.vue';
+import HeaderButtonLink from '@@components/header/HeaderButtonLink.vue';
+
+export interface Props {
+  accountUrl?: string;
+  cartUrl?: string;
+  loginDrawerAdditionalLinks?: LoginDrawerProps['additionalLinks'];
+}
+
+withDefaults(defineProps<Props>(), {
+  accountUrl: '/app/account',
+  cartUrl: '/app/#/cart',
+});
+</script>
+
+<template>
+  <slot name="account">
+    <LoginDrawer
+      :account-url="accountUrl"
+      :additional-links="loginDrawerAdditionalLinks"
+    >
+      <template #toggle>
+        <HeaderButtonLink
+          :href="accountUrl"
+          :title="i19myAccountAndOrders"
+        >
+          <div class="i-user-circle"></div>
+        </HeaderButtonLink>
+      </template>
+    </LoginDrawer>
+  </slot>
+  <slot />
+  <slot name="cart">
+    <HeaderButtonLink
+      :href="cartUrl"
+      :title="i19openCart"
+    >
+      <div class="i-shopping-cart"></div>
+    </HeaderButtonLink>
+  </slot>
+</template>

package/ecomplus-stores/tia-sonia/functions/ssr/src/components/header/HeaderNav.vue

@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import HeaderNavLink from '@@components/header/HeaderNavLink.vue';
+</script>
+
+<template>
+  <nav class="font-semibold px-3">
+    <HeaderNavLink>nav</HeaderNavLink>
+  </nav>
+</template>

package/ecomplus-stores/tia-sonia/functions/ssr/src/components/header/HeaderNavLink.vue

@@ -0,0 +1,5 @@
+<template>
+  <a class="text-gray-accent hover:text-primary no-underline">
+    <slot />
+  </a>
+</template>

package/ecomplus-stores/tia-sonia/functions/ssr/src/env.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="astro/client" />
+/// <reference types="vite-plugin-pwa/client" />
+/// <reference types="@cloudcommerce/storefront/client" />

package/ecomplus-stores/tia-sonia/functions/ssr/src/layouts/Base.astro

@@ -0,0 +1,34 @@
+---
+import type { PageContext } from '@@storefront/ssr-context';
+import Base from '@@storefront/layouts/Base.astro';
+import InlineScripts from '~/scripts/InlineScripts.astro';
+
+export interface Props {
+  pageContext: PageContext;
+  title?: string;
+}
+
+const { pageContext, title } = Astro.props as Props;
+---
+
+<Base pageContext={pageContext} title={title}>
+  <InlineScripts slot="before-head-end" />
+  <slot />
+</Base>
+
+<style is:global>
+@media only screen and (prefers-color-scheme: dark) {
+  :root:not([data-theme=light]) a:not([role=button]) {
+    --color: var(--primary-100);
+  }
+  :root:not([data-theme=light]) a:not([role=button]):is([aria-current], :hover, :active, :focus) {
+    --color: var(--primary-300);
+  }
+}
+html {
+  scroll-behavior: smooth;
+}
+body {
+  overflow-x: hidden;
+}
+</style>

package/ecomplus-stores/tia-sonia/functions/ssr/src/layouts/Pages.astro

@@ -0,0 +1,19 @@
+---
+import type { PageContext } from '@@storefront/ssr-context';
+import Base from '~/layouts/Base.astro';
+import Header from '~/layouts/PagesHeader.astro';
+
+export interface Props {
+  pageContext: PageContext;
+  title?: string;
+}
+
+const { pageContext, title } = Astro.props as Props;
+---
+
+<Base pageContext={pageContext} title={title}>
+  <slot name="header">
+    <Header pageContext={pageContext} />
+  </slot>
+  <slot />
+</Base>

package/ecomplus-stores/tia-sonia/functions/ssr/src/layouts/PagesHeader.astro

@@ -0,0 +1,117 @@
+---
+import type { Categories } from '@cloudcommerce/api/types';
+import type CmsHeader from '@@storefront/types/cms-header';
+import type CmsContacts from '@@storefront/types/cms-contacts';
+import type { PageContext } from '@@storefront/ssr-context';
+import { i19buyOnWhatsApp } from '@@i18n';
+import { getImage } from '@@storefront/ssr/image';
+import TopBar, { Props as TopBarProps } from '@@components/TopBar.vue';
+import TheHeader, { Props as TheHeaderProps } from '@@components/TheHeader.vue';
+import HeaderNav from '@@components/header/HeaderNav.vue';
+import HeaderButtons, { Props as HeaderButtonsProps } from '@@components/header/HeaderButtons.vue';
+
+export interface Props {
+  pageContext: PageContext;
+  logoTransformOptions?: Parameters<typeof getImage>[0];
+  topBarProps?: Partial<TopBarProps>;
+  theHeaderProps?: Partial<TheHeaderProps>;
+  headerButtonsProps?: Partial<HeaderButtonsProps>;
+}
+
+const {
+  pageContext: {
+    apiState,
+    settings,
+    cms,
+  },
+  logoTransformOptions,
+  topBarProps,
+  theHeaderProps,
+  headerButtonsProps,
+} = Astro.props as Props;
+const header = cms('header') as CmsHeader;
+const contacts = cms('contacts') as CmsContacts;
+let headerCategories: Array<{ slug: string, name: string }> = [];
+let isCategoriesNavFull: boolean | undefined;
+if (header.categories_list) {
+  if (header.categories_list.featured.length) {
+    // Selected categories/collections/brands
+    headerCategories = header.categories_list.featured.map((pathAndName) => {
+      const [path, name] = pathAndName.split('?');
+      return { slug: path.slice(1), name };
+    });
+  }
+  if (header.categories_list.random) {
+    const mainCategories: Partial<Categories>[] | undefined = apiState
+      .categories?.filter(({ parent }) => (!parent || !parent.slug));
+    if (mainCategories) {
+      for (let i = 0; i < header.categories_list.random && i < mainCategories.length; i++) {
+        if (!headerCategories.find(({ slug }) => mainCategories[i].slug === slug)) {
+          headerCategories.push({
+            slug: mainCategories[i].slug,
+            name: mainCategories[i].name,
+          });
+        }
+      }
+    }
+  }
+  isCategoriesNavFull = header.categories_list.full_width;
+}
+const loginDrawerAdditionalLinks: HeaderButtonsProps['loginDrawerAdditionalLinks']
+  = header.drawer_links?.map(({ title, link }) => ({ href: link, innerHTML: title })) || [];
+if (contacts.whatsapp) {
+  loginDrawerAdditionalLinks.unshift({
+    href: `https://wa.me/55${contacts.whatsapp.replace(/\D/g, '')}`,
+    innerHTML: `<i class="i-whatsapp text-lg"></i> ${i19buyOnWhatsApp}`,
+    isBlank: true,
+  });
+}
+
+declare global {
+  var TopBarProps: TopBarProps;
+  var TheHeaderProps: TheHeaderProps;
+  var HeaderButtonsProps: HeaderButtonsProps;
+}
+globalThis.TopBarProps = {
+  marketingStripe: header.marketing_stripe,
+  pageLinks: header.contacts_stripe.pages,
+  hasPhoneLinks: header.contacts_stripe.phone_wpp,
+  hasNetworkLinks: header.contacts_stripe.socials,
+  contacts,
+  ...topBarProps,
+};
+globalThis.TheHeaderProps = {
+  logo: {
+    ...await getImage({
+      src: settings.logo,
+      width: 150,
+      format: 'webp',
+      quality: 90,
+      ...logoTransformOptions,
+    }) as any,
+    alt: settings.name,
+  },
+  logoAltHeading: Astro.url.pathname === '/' ? 'h1' : 'h2',
+  ...theHeaderProps,
+};
+globalThis.HeaderButtonsProps = {
+  loginDrawerAdditionalLinks,
+  ...headerButtonsProps,
+};
+---
+
+<Fragment>
+  <slot name="top-bar">
+    <TopBar {...globalThis.TopBarProps} />
+  </slot>
+  <slot name="header">
+    <TheHeader {...globalThis.TheHeaderProps}>
+      <Fragment slot="nav">
+        <HeaderNav />
+      </Fragment>
+      <Fragment slot="buttons">
+        <HeaderButtons client:idle {...globalThis.HeaderButtonsProps} />
+      </Fragment>
+    </TheHeader>
+  </slot>
+</Fragment>

package/ecomplus-stores/tia-sonia/functions/ssr/src/main/Fallback.astro

@@ -0,0 +1,15 @@
+---
+import type { PageContext } from '@@storefront/ssr-context';
+
+export interface Props {
+  pageContext?: PageContext;
+}
+---
+
+<main>
+  <h1>Error :/</h1>
+  <p class="instructions">
+    Check out the <code>src/pages</code> directory to get started.<br/>
+    <strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message above.
+  </p>
+</main>

package/ecomplus-stores/tia-sonia/functions/ssr/src/main/Home.astro

@@ -0,0 +1,19 @@
+---
+import type { PageContext } from '@@storefront/ssr-context';
+import api from '@cloudcommerce/api';
+
+export interface Props {
+  pageContext: PageContext;
+}
+
+const products = (await api.get('products')).data.result;
+---
+
+<main>
+  <h1>Welcome to <span class="text-primary">Astro</span></h1>
+  <ul role="list" class="mt-3 fs-20">
+    {products.map((product) => <li>
+      <a href={`/${product.slug}`}>{product.sku}</a>
+    </li>)}
+  </ul>
+</main>

package/ecomplus-stores/tia-sonia/functions/ssr/src/main/Wildcard.astro

@@ -0,0 +1,21 @@
+---
+import type { PageContext } from '@@storefront/ssr-context';
+
+export interface Props {
+  pageContext: PageContext;
+}
+
+const {
+  pageContext: { apiResource, apiDoc },
+} = Astro.props as Props;
+---
+
+<main>
+  <h1>Hello <span class="text-gradient">{apiDoc.name}</span></h1>
+  <hr>
+  <div class="mt-3">
+    <mark>{apiDoc._id}</mark> from <i>{apiResource}</i>
+    <p>{Math.random()}</p>
+    <em>Lorem ipsum dolor sit amet</em>
+  </div>
+</main>

package/ecomplus-stores/tia-sonia/functions/ssr/src/pages/[...slug].astro

@@ -0,0 +1,36 @@
+---
+import api from '@cloudcommerce/api';
+import loadPageContext, { PageContext } from '@@storefront/ssr-context';
+import PagesLayout from '~/layouts/Pages.astro';
+import WildcardMain from '~/main/Wildcard.astro';
+
+if (String(Astro.params.slug).endsWith('.css.map')) {
+  return new Response(null, { status: 404 });
+}
+
+let pageContext: PageContext;
+let loadError: any;
+try {
+  pageContext = await loadPageContext(Astro);
+} catch (err) {
+  if (err.astroResponse) {
+    return err.astroResponse;
+  }
+  loadError = err;
+}
+
+export async function getStaticPaths() {
+  return (await api.get('products?sort=-sales&limit=4&fields=slug'))
+    .data.result.map(({ slug }) => ({ params: { slug } }));
+}
+---
+
+<!DOCTYPE html>
+<html lang={pageContext?.lang.replace('_', '-')}>
+{pageContext &&
+  <PagesLayout pageContext={pageContext}>
+    <WildcardMain pageContext={pageContext} />
+  </PagesLayout>
+}
+{loadError && <Fragment set:html={loadError.responseHTML} />}
+</html>

package/ecomplus-stores/tia-sonia/functions/ssr/src/pages/fallback.astro

@@ -0,0 +1,19 @@
+---
+import loadPageContext, { PageContext } from '@@storefront/ssr-context';
+import PagesLayout from '~/layouts/Pages.astro';
+import FallbackMain from '~/main/Fallback.astro';
+
+let pageContext: PageContext;
+try {
+  pageContext = await loadPageContext(Astro);
+} catch (err) {
+  return err.astroResponse;
+}
+---
+
+<!DOCTYPE html>
+<html lang={pageContext?.lang.replace('_', '-')}>
+<PagesLayout pageContext={pageContext}>
+  <FallbackMain pageContext={pageContext} />
+</PagesLayout>
+</html>

package/ecomplus-stores/tia-sonia/functions/ssr/src/pages/index.astro

@@ -0,0 +1,31 @@
+---
+import loadPageContext, { PageContext } from '@@storefront/ssr-context';
+import PagesLayout from '~/layouts/Pages.astro';
+import HomeMain from '~/main/Home.astro';
+
+let pageContext: PageContext;
+let loadError: any;
+try {
+  pageContext = await loadPageContext(Astro);
+  /* Faster SSR without store categories (default) prefetch:
+  pageContext = await loadPageContext(Astro, {
+    apiPrefetchEndpoints: [],
+  });
+  */
+} catch (err) {
+  if (err.astroResponse) {
+    return err.astroResponse;
+  }
+  loadError = err;
+}
+---
+
+<!DOCTYPE html>
+<html lang={pageContext?.lang.replace('_', '-')}>
+{pageContext &&
+  <PagesLayout pageContext={pageContext}>
+    <HomeMain pageContext={pageContext} />
+  </PagesLayout>
+}
+{loadError && <Fragment set:html={loadError.responseHTML} />}
+</html>

package/ecomplus-stores/tia-sonia/functions/ssr/src/scripts/InlineScripts.astro

@@ -0,0 +1,11 @@
+<script is:inline>
+  window.firebaseConfig = {
+    apiKey: 'AIzaSyCrVzemDgpyp9i6ni7Yc5ZuEVfXYwl-4J0',
+    authDomain: 'ecom2-002.firebaseapp.com',
+    projectId: 'ecom2-002',
+    storageBucket: 'ecom2-002.appspot.com',
+    messagingSenderId: '402807248219',
+    appId: '1:402807248219:web:cf7d57759751e74776367e',
+    measurementId: 'G-SC592CE0GB',
+  };
+</script>

package/ecomplus-stores/tia-sonia/functions/ssr/tailwind.config.cjs

@@ -0,0 +1,2 @@
+// eslint-disable-next-line import/no-extraneous-dependencies
+module.exports = require('@cloudcommerce/storefront/tailwind.config.cjs');

package/ecomplus-stores/tia-sonia/functions/ssr/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "extends": "@cloudcommerce/storefront/tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@@i18n": ["./node_modules/@cloudcommerce/i18n/src/pt_br.ts"],
+      "@@storefront/*": ["./node_modules/@cloudcommerce/storefront/src/lib/*"],
+      "@@components/*": [
+        "./src/components/*",
+        "./node_modules/@cloudcommerce/storefront/src/lib/components/*",
+      ],
+      "~/*": ["./src/*"],
+      "content/*": ["./content/*"],
+    }
+  }
+}

package/ecomplus-stores/tia-sonia/functions/ssr/uno.config.cjs

@@ -0,0 +1,4 @@
+// eslint-disable-next-line import/no-extraneous-dependencies
+const { genUnoCSSConfig } = require('@cloudcommerce/storefront/uno.config');
+
+export default genUnoCSSConfig();

package/ecomplus-stores/tia-sonia/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "@ecomplus/store",
+  "private": true,
+  "type": "module",
+  "description": "E-Com Plus Cloud Commerce starter store",
+  "scripts": {
+    "dev": "cloudcommerce",
+    "logs": "cloudcommerce logs",
+    "serve": "cloudcommerce serve",
+    "shell": "cloudcommerce shell",
+    "start": "cloudcommerce start",
+    "build": "cloudcommerce build",
+    "predeploy": "cloudcommerce predeploy",
+    "deploy": "cloudcommerce deploy",
+    "login": "cloudcommerce login",
+    "setup": "bash scripts/install.sh && cloudcommerce setup",
+    "setup:quiet": "cloudcommerce setup --no-deploy --no-commit"
+  },
+  "main": "functions/index.js",
+  "author": "E-Com Club Softwares para E-commerce <ti@e-com.club>",
+  "license": "Apache 2.0 with Commons Clause",
+  "bugs": {
+    "url": "https://github.com/ecomplus/cloud-commerce/issues"
+  },
+  "dependencies": {
+    "@cloudcommerce/cli": "^0.0.126"
+  }
+}

package/ecomplus-stores/tia-sonia/scripts/install.sh

@@ -0,0 +1,9 @@
+#!/bin/bash
+
+echo '> Install functions dependencies:'
+cd functions
+for d in */ ; do
+  cd $d
+  npm ci
+  cd ..
+done

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "cloudcommerce",
   "type": "module",
-  "version": "0.0.125",
+  "version": "0.0.127",
   "description": "Open fair-code headless commerce platform: API-first, microservices based, event driven and cloud native",
   "main": "packages/api/lib/index.js",
   "author": "E-Com Club Softwares para E-commerce <ti@e-com.club>",
@@ -16,26 +16,26 @@
     }
   },
   "devDependencies": {
-    "@commitlint/cli": "^17.1.2",
-    "@commitlint/config-conventional": "^17.1.0",
-    "@commitlint/rules": "^17.0.0",
-    "@types/node": "18.8.0",
-    "@typescript-eslint/eslint-plugin": "^5.40.0",
-    "@typescript-eslint/parser": "^5.40.0",
-    "esbuild": "^0.15.11",
-    "eslint": "^8.25.0",
+    "@commitlint/cli": "^17.3.0",
+    "@commitlint/config-conventional": "^17.3.0",
+    "@commitlint/rules": "^17.3.0",
+    "@types/node": "^18.11.9",
+    "@typescript-eslint/eslint-plugin": "^5.44.0",
+    "@typescript-eslint/parser": "^5.44.0",
+    "esbuild": "^0.15.16",
+    "eslint": "^8.28.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-vue": "^9.6.0",
-    "husky": "^8.0.1",
-    "node-fetch": "^3.2.10",
+    "eslint-plugin-vue": "^9.8.0",
+    "husky": "^8.0.2",
+    "node-fetch": "^3.3.0",
     "standard-version": "^9.5.0",
     "ts-node": "^10.9.1",
-    "turbo": "^1.5.6",
-    "typescript": "^4.8.4",
-    "uglify-js": "^3.17.3",
-    "vite": "^3.1.8",
-    "vitest": "^0.24.3",
+    "turbo": "^1.6.3",
+    "typescript": "^4.9.3",
+    "uglify-js": "^3.17.4",
+    "vite": "^3.2.4",
+    "vitest": "^0.25.3",
     "zx": "^7.1.1"
   },
   "scripts": {

package/packages/api/lib/api.d.ts

@@ -70,7 +70,7 @@ declare const api: {
         data: null;
     }>;
 };
-declare type AbstractedConfig = Omit<Config, 'endpoint' | 'method'>;
+type AbstractedConfig = Omit<Config, 'endpoint' | 'method'>;
 declare const get: <E extends Endpoint, C extends AbstractedConfig>(endpoint: E, config?: C | undefined) => Promise<Response & {
     config: Config;
     data: E extends `${string}/${string}/${string}` ? any : E extends `products/${string}` ? import("./types").Products : E extends `categories/${string}` ? import("./types").Categories : E extends `brands/${string}` ? import("./types").Brands : E extends `collections/${string}` ? import("./types").Collections : E extends `grids/${string}` ? import("./types").Grids : E extends `carts/${string}` ? import("./types").Carts : E extends `orders/${string}` ? import("./types").Orders : E extends `customers/${string}` ? import("./types").Customers : E extends `stores/${string}` ? import("./types").Stores : E extends `applications/${string}` ? import("./types").Applications : E extends `authentications/${string}` ? import("./types").Authentications : E extends ResourceOpQuery ? import("./types").ResourceListResult<E> : E extends "events/products" | "events/categories" | "events/brands" | "events/collections" | "events/grids" | "events/carts" | "events/orders" | "events/customers" | "events/stores" | "events/applications" | "events/authentications" | `events/products/${string}` | `events/categories/${string}` | `events/brands/${string}` | `events/collections/${string}` | `events/grids/${string}` | `events/carts/${string}` | `events/orders/${string}` | `events/customers/${string}` | `events/stores/${string}` | `events/applications/${string}` | `events/authentications/${string}` | "events/me" ? import("./types").EventsResult<E> : any;
@@ -103,6 +103,6 @@ declare const del: (endpoint: Endpoint, config?: AbstractedConfig) => Promise<Re
 }>;
 export default api;
 export { setMiddleware, get, post, put, patch, del, ApiError, };
-export declare type ApiEndpoint = Endpoint;
-export declare type ApiConfig = Config;
-export declare type ApiErrorBody = ErrorBody;
+export type ApiEndpoint = Endpoint;
+export type ApiConfig = Config;
+export type ApiErrorBody = ErrorBody;