chore: merge v2-develop into v2

update docs
vuestorefront · Nov 26, 2024 · 5f70b82 · 5f70b82
2 parents 5b82b3e + 6eeda6b
commit 5f70b82
Show file tree

Hide file tree

Showing 18 changed files with 72 additions and 32 deletions.
diff --git a/.github/workflows/deploy-docs-vue-storefront-cloud.yml b/.github/workflows/deploy-docs-vue-storefront-cloud.yml
@@ -21,6 +21,7 @@ jobs:
       ARTIFACT_TYPE: 'sfui2-docs'
       DOCKERFILE_PATH: './.vuestorefrontcloud/docs/Dockerfile'
       ENVIRONMENT: ${{ needs.configure-enviroment.outputs.environment }}
+      TARGET_DOMAIN: ${{ needs.configure-enviroment.outputs.target-domain }}
 
   sync-assets:
     needs: [build, configure-enviroment]

diff --git a/.github/workflows/deploy-router-vue-storefront-cloud.yml b/.github/workflows/deploy-router-vue-storefront-cloud.yml
@@ -21,6 +21,7 @@ jobs:
       ARTIFACT_TYPE: "vue-storefront"
       DOCKERFILE_PATH: ".vuestorefrontcloud/router/docker/Dockerfile"
       ENVIRONMENT: ${{ needs.configure-enviroment.outputs.environment }}
+      TARGET_DOMAIN: ${{ needs.configure-enviroment.outputs.target-domain }}
 
   deploy:
     runs-on: ubuntu-latest

diff --git a/.github/workflows/deploy-test-next-storefront-cloud.yml b/.github/workflows/deploy-test-next-storefront-cloud.yml
@@ -21,6 +21,7 @@ jobs:
       ARTIFACT_TYPE: "sfui2-docs-react"
       DOCKERFILE_PATH: ".vuestorefrontcloud/test-next/docker/Dockerfile"
       ENVIRONMENT: ${{ needs.configure-enviroment.outputs.environment }}
+      TARGET_DOMAIN: ${{ needs.configure-enviroment.outputs.target-domain }}
 
   deploy:
     needs: [ build, configure-enviroment ]

diff --git a/.github/workflows/deploy-test-nuxt-storefront-cloud.yml b/.github/workflows/deploy-test-nuxt-storefront-cloud.yml
@@ -20,6 +20,7 @@ jobs:
       ARTIFACT_TYPE: "sfui2-docs-vue"
       DOCKERFILE_PATH: ".vuestorefrontcloud/test-nuxt/docker/Dockerfile"
       ENVIRONMENT: ${{ needs.configure-enviroment.outputs.environment }}
+      TARGET_DOMAIN: ${{ needs.configure-enviroment.outputs.target-domain }}
 
   deploy:
     needs: [ build, configure-enviroment ]

diff --git a/.github/workflows/image-build-vue-storefront-cloud.yml b/.github/workflows/image-build-vue-storefront-cloud.yml
@@ -14,6 +14,9 @@ on:
       ENVIRONMENT:
         required: true
         type: string
+      TARGET_DOMAIN:
+        required: true
+        type: string
 
 jobs:
   build:
@@ -29,11 +32,12 @@ jobs:
         uses: elgohr/Publish-Docker-Github-Action@v5
         env:
           ENVIRONMENT: ${{ inputs.ENVIRONMENT }}
+          TARGET_DOMAIN: ${{ inputs.TARGET_DOMAIN }}
         with:
           name: ${{ inputs.DOCKER_NAMESPACE }}/${{ inputs.ARTIFACT_TYPE }}:${{ github.sha }}
           registry: registry.storefrontcloud.io
           username: ${{ secrets.CLOUD_USERNAME }}
           password: ${{ secrets.CLOUD_PASSWORD }}
           dockerfile: ${{ inputs.DOCKERFILE_PATH }}
           buildoptions: '--compress'
-          buildargs: VITE_DOCS_BASEPATH,VITE_DOCS_EXAMPLES_REACT_PATH,VITE_DOCS_EXAMPLES_VUE_PATH,ENVIRONMENT
+          buildargs: VITE_DOCS_BASEPATH,VITE_DOCS_EXAMPLES_REACT_PATH,VITE_DOCS_EXAMPLES_VUE_PATH,ENVIRONMENT,TARGET_DOMAIN
diff --git a/.vuestorefrontcloud/docs/Dockerfile b/.vuestorefrontcloud/docs/Dockerfile
@@ -2,17 +2,19 @@ FROM node:20-alpine AS build
 
 WORKDIR /var/www
 
+COPY . .
+
 ARG VITE_DOCS_BASEPATH
 ARG VITE_DOCS_EXAMPLES_REACT_PATH
 ARG VITE_DOCS_EXAMPLES_VUE_PATH
 ARG ENVIRONMENT
 
-ENV VITE_DOCS_BASEPATH=$VITE_DOCS_BASEPATH
-ENV VITE_DOCS_EXAMPLES_REACT_PATH=$VITE_DOCS_EXAMPLES_REACT_PATH
-ENV VITE_DOCS_EXAMPLES_VUE_PATH=$VITE_DOCS_EXAMPLES_VUE_PATH
+ENV NUXT_DOCS_BASEPATH=$VITE_DOCS_BASEPATH
+ENV NUXT_APP_BASE_URL=$VITE_DOCS_BASEPATH
+ENV NUXT_DOCS_EXAMPLES_REACT_PATH=$VITE_DOCS_EXAMPLES_REACT_PATH
+ENV NUXT_DOCS_EXAMPLES_VUE_PATH=$VITE_DOCS_EXAMPLES_VUE_PATH
 ENV ENVIRONMENT=$ENVIRONMENT
 
-COPY . .
 RUN yarn
 RUN ENV_NAME=$ENVIRONMENT yarn build:replace-assets-url-with
 RUN yarn build:vue

diff --git a/.vuestorefrontcloud/docs/README.md b/.vuestorefrontcloud/docs/README.md
@@ -4,8 +4,8 @@
 
 You can debug dockerized docs image by following steps below:
 
-- build image using `DOCKER_BUILDKIT=1 docker build -t docs --build-arg VITE_DOCS_EXAMPLES_VUE_PATH=http://localhost:3001 --build-arg VITE_DOCS_EXAMPLES_REACT_PATH=http://localhost:3002 --build-arg VITE_DOCS_BASEPATH=/v2/ -f .vuestorefrontcloud/docs/Dockerfile .`,
-- run image using `docker run -t -i -p 3000:80 docs`, (flags `i` and `t` allows to run command and then kill it with `ctrl+c` https://github.com/moby/moby/issues/2838#issuecomment-29205965)
+- build image using `DOCKER_BUILDKIT=1 docker build -t docs --build-arg VITE_DOCS_EXAMPLES_VUE_PATH=http://localhost:3001/v2-vue --build-arg VITE_DOCS_EXAMPLES_REACT_PATH=http://localhost:3002/v2-react --build-arg VITE_DOCS_BASEPATH=/v2/ -f .vuestorefrontcloud/docs/Dockerfile .`,
+- run image using `docker run -t -i -p 3004:80 docs`, (flags `i` and `t` allows to run command and then kill it with `ctrl+c` https://github.com/moby/moby/issues/2838#issuecomment-29205965)
 - open browser and go to the address `http://localhost:3000/v2/` to see the docs page running.
 
-NOTE: docs will work but without `vue` and `react` showcases. For full docs experience you have to run `test-next` and `test-nuxt` docker as well.
+NOTE: docs will work but without `vue` and `react` showcases. For full docs experience you have to run `test-next` and `test-nuxt` docker as well. And to test root redirect to `/v2/` you need to run `router` docker image too.
diff --git a/.vuestorefrontcloud/router/README.md b/.vuestorefrontcloud/router/README.md
@@ -27,3 +27,13 @@ An alternative to robots.txt in this case could be using the built-in Farmer fea
 However, I went with creating the "nginx + robots.txt file" container here anyways. I'm forced to create a container for nginx so might as well put the robots.txt file here.
 
 That's a lot of work to do such a simple thing, but the situation is what it is.
+
+## Debugging
+
+You can debug dockerized docs image by following steps below:
+
+- run `docs` docker image,
+- run terminal in `root` directory,
+- build image using `DOCKER_BUILDKIT=1 docker build -t docs-router --build-arg TARGET_DOMAIN=http://localhost:3004 -f .vuestorefrontcloud/router/docker/Dockerfile .`,
+- run image using `docker run -t -i -p 3000:3000 docs-router nginx-debug -g 'daemon off;'`, (flags `i` and `t` allows to run command and then kill it with `ctrl+c` https://github.com/moby/moby/issues/2838#issuecomment-29205965)
+- open browser and go to the address `http://localhost:3004` to see the app page running.
diff --git a/.vuestorefrontcloud/router/docker/Dockerfile b/.vuestorefrontcloud/router/docker/Dockerfile
@@ -1,2 +1,9 @@
 FROM nginx
-COPY .vuestorefrontcloud/router/docker/default.conf /etc/nginx/conf.d/default.conf
+
+ARG TARGET_DOMAIN
+
+ENV TARGET_DOMAIN=$TARGET_DOMAIN
+
+COPY .vuestorefrontcloud/router/docker/default.conf.template /etc/nginx/conf.d/default.conf.template
+
+RUN envsubst '$TARGET_DOMAIN' < /etc/nginx/conf.d/default.conf.template > /etc/nginx/conf.d/default.conf
diff --git a/...torefrontcloud/router/docker/default.conf → ...cloud/router/docker/default.conf.template b/...torefrontcloud/router/docker/default.conf → ...cloud/router/docker/default.conf.template
@@ -8,6 +8,6 @@ server {
 
   # https://www.oliverdavies.uk/blog/nginx-redirects-query-string-arguments
   location / {
-    return 301 https://docs.storefrontui.io/v2$uri$is_args$args;
+    return 301 ${TARGET_DOMAIN}/v2$uri$is_args$args;
   }
 }
diff --git a/.vuestorefrontcloud/test-next/docker/Dockerfile b/.vuestorefrontcloud/test-next/docker/Dockerfile
@@ -8,8 +8,7 @@ ARG VITE_DOCS_BASEPATH
 ARG VITE_DOCS_EXAMPLES_REACT_PATH
 ARG ENVIRONMENT
 
-ENV VITE_DOCS_BASEPATH=$VITE_DOCS_BASEPATH
-ENV VITE_DOCS_EXAMPLES_REACT_PATH=$VITE_DOCS_EXAMPLES_REACT_PATH
+ENV NEXT_DOCS_EXAMPLES_REACT_PATH=$VITE_DOCS_EXAMPLES_REACT_PATH
 ENV ENVIRONMENT=$ENVIRONMENT
 
 RUN yarn

diff --git a/.vuestorefrontcloud/test-next/docker/README.md b/.vuestorefrontcloud/test-next/docker/README.md
@@ -5,6 +5,6 @@
 You can debug dockerized docs image by following steps below:
 
 - run terminal in `root` directory
-- build image using `DOCKER_BUILDKIT=1 docker build -t test-next -f .vuestorefrontcloud/test-next/docker/Dockerfile .`,
+- build image using `DOCKER_BUILDKIT=1 docker build -t test-next --build-arg VITE_DOCS_EXAMPLES_REACT_PATH=https://localhost:3002/v2-react -f .vuestorefrontcloud/test-next/docker/Dockerfile .`,
 - run image using `docker run -t -i -p 3002:3000 test-next`, (flags `i` and `t` allows to run command and then kill it with `ctrl+c` https://github.com/moby/moby/issues/2838#issuecomment-29205965)
 - open browser and go to the address `http://localhost:3002` to see the app page running.
diff --git a/.vuestorefrontcloud/test-nuxt/docker/Dockerfile b/.vuestorefrontcloud/test-nuxt/docker/Dockerfile
@@ -8,8 +8,7 @@ ARG VITE_DOCS_BASEPATH
 ARG VITE_DOCS_EXAMPLES_VUE_PATH
 ARG ENVIRONMENT
 
-ENV VITE_DOCS_BASEPATH=$VITE_DOCS_BASEPATH
-ENV VITE_DOCS_EXAMPLES_VUE_PATH=$VITE_DOCS_EXAMPLES_VUE_PATH
+ENV NUXT_DOCS_EXAMPLES_VUE_PATH=$VITE_DOCS_EXAMPLES_VUE_PATH
 ENV ENVIRONMENT=$ENVIRONMENT
 
 RUN yarn

diff --git a/.vuestorefrontcloud/test-nuxt/docker/README.md b/.vuestorefrontcloud/test-nuxt/docker/README.md
@@ -5,6 +5,6 @@
 You can debug dockerized docs image by following steps below:
 
 - run terminal in `root` directory
-- build image using `DOCKER_BUILDKIT=1 docker build -t test-nuxt -f .vuestorefrontcloud/test-nuxt/docker/Dockerfile .`,
+- build image using `DOCKER_BUILDKIT=1 docker build -t test-nuxt --build-arg VITE_DOCS_EXAMPLES_VUE_PATH=https://localhost:3002/v2-vue -f .vuestorefrontcloud/test-nuxt/docker/Dockerfile .`,
 - run image using `docker run -t -i -p 3001:3000 test-nuxt`, (flags `i` and `t` allows to run command and then kill it with `ctrl+c` https://github.com/moby/moby/issues/2838#issuecomment-29205965)
 - open browser and go to the address `http://localhost:3001` to see the app page running.
diff --git a/apps/docs/components/.env.example b/apps/docs/components/.env.example
@@ -1,3 +1,3 @@
-VITE_DOCS_EXAMPLES_VUE_PATH=http://localhost:3001
-VITE_DOCS_EXAMPLES_REACT_PATH=http://localhost:3002
-VITE_DOCS_BASEPATH=/v2
+NUXT_DOCS_EXAMPLES_VUE_PATH=http://localhost:3001
+NUXT_DOCS_EXAMPLES_REACT_PATH=http://localhost:3002
+NUXT_DOCS_BASEPATH=/v2
diff --git a/apps/docs/components/nuxt.config.ts b/apps/docs/components/nuxt.config.ts
@@ -3,8 +3,6 @@
 export default defineNuxtConfig({
   extends: ['sf-docs-base'],
   app: {
-    baseURL: process.env.VITE_DOCS_BASEPATH ?? '',
-
     head: {
       link: [
         {
@@ -15,10 +13,10 @@ export default defineNuxtConfig({
     },
   },
   robots: {
-    enabled: false
+    enabled: false,
   },
   sitemap: {
-    enabled: false
+    enabled: false,
   },
   // fix via https://github.com/nuxt/content/issues/2254
   alias: {
@@ -28,8 +26,8 @@ export default defineNuxtConfig({
   runtimeConfig: {
     public: {
       storefrontUi: true,
-      DOCS_EXAMPLES_VUE_PATH: process.env.VITE_DOCS_EXAMPLES_VUE_PATH,
-      DOCS_EXAMPLES_REACT_PATH: process.env.VITE_DOCS_EXAMPLES_REACT_PATH,
+      DOCS_EXAMPLES_VUE_PATH: process.env.NUXT_DOCS_EXAMPLES_VUE_PATH,
+      DOCS_EXAMPLES_REACT_PATH: process.env.NUXT_DOCS_EXAMPLES_REACT_PATH,
       siteUrl: process.env.NUXT_PUBLIC_SITE_URL || 'https://docs.storefrontui.io',
       siteName: 'Storefront UI',
       siteDescription: 'Fast, accessible, and fully customizable components built for e-commerce.',
@@ -43,6 +41,7 @@ export default defineNuxtConfig({
       },
     },
     prerender: {
+      routes: ['/'],
       crawlLinks: true,
       failOnError: false,
     },

diff --git a/apps/preview/next/next.config.mjs b/apps/preview/next/next.config.mjs
@@ -6,10 +6,10 @@ const isProd = process.env.PROD === 'true';
 /** @type {import('next').NextConfig} */
 export default {
   env: {
-    DOCS_EXAMPLES_REACT_PATH: process.env.VITE_DOCS_EXAMPLES_REACT_PATH || '',
+    DOCS_EXAMPLES_REACT_PATH: process.env.NEXT_DOCS_EXAMPLES_REACT_PATH || '',
   },
-  basePath: process.env.VITE_DOCS_EXAMPLES_REACT_PATH
-    ? new URL(process.env.VITE_DOCS_EXAMPLES_REACT_PATH).pathname
+  basePath: process.env.NEXT_DOCS_EXAMPLES_REACT_PATH
+    ? new URL(process.env.NEXT_DOCS_EXAMPLES_REACT_PATH).pathname
     : '',
   reactStrictMode: true,
   swcMinify: true,
@@ -49,14 +49,24 @@ export default {
         },
       });
 
-      const reactPackage = resolve(process.cwd(), '..', '..', '..', 'packages', 'sfui', 'frameworks', 'react', 'index.ts');
+      const reactPackage = resolve(
+        process.cwd(),
+        '..',
+        '..',
+        '..',
+        'packages',
+        'sfui',
+        'frameworks',
+        'react',
+        'index.ts',
+      );
       config.resolve.alias = {
         ...config.resolve.alias,
         '@storefront-ui/react': reactPackage,
         '@storefront-ui/vue': reactPackage,
-      }
+      };
     }
 
     return config;
-  }
+  },
 };
diff --git a/apps/preview/nuxt/nuxt.config.ts b/apps/preview/nuxt/nuxt.config.ts
@@ -6,7 +6,7 @@ const isProd = process.env.PROD === 'true';
 
 export default defineNuxtConfig({
   app: {
-    baseURL: process.env.VITE_DOCS_EXAMPLES_VUE_PATH ? new URL(process.env.VITE_DOCS_EXAMPLES_VUE_PATH).pathname : '',
+    baseURL: process.env.NUXT_DOCS_EXAMPLES_VUE_PATH ? new URL(process.env.NUXT_DOCS_EXAMPLES_VUE_PATH).pathname : '',
     head: {
       htmlAttrs: {
         lang: 'en',
@@ -42,6 +42,12 @@ export default defineNuxtConfig({
         }
       : {}),
   },
+  nitro: {
+    prerender: {
+      routes: ['/'],
+      crawlLinks: true,
+    },
+  },
   vite: {
     plugins: [
       {