feat: Update sales agent deployment doc

.gitbook.yaml

@@ -90,3 +90,4 @@ redirects:
     products/extensions/migration-assistant/concept.html: products/extensions/migration-assistant/concept/index.html
     products/extensions/migration-assistant/guides.html: products/extensions/migration-assistant/guides/index.html
     products/cli/project-commands/project-config-sync.html: resources/tooling/fixture-bundle/index.html
+    products/sales-agent/deployment.html: products/sales-agent/best-practices/app-deployment/hosted-with-ubuntu-server.html

products/sales-agent/best-practices/app-deployment/aws.md

@@ -0,0 +1,27 @@
+---
+nav:
+  title: AWS
+  position: 20
+---
+
+# Deploy with AWS Amplify
+
+In this chapter, you will learn how to deploy the frontend source code to [AWS Amplify](https://aws.amazon.com/amplify/).
+
+## Prerequisites
+
+- Register an AWS account.
+- Clone the frontend source code and push it to your Git repository (for example, GitHub).
+
+## Deploy
+
+- Login to the AWS Amplify Hosting Console.
+- Create a new app in AWS Amplify.
+- Select and authorize access to your Git repository provider and select the main branch (it will auto-deploy when there are some changes in the main branch).
+- Choose a name for your app and make sure build settings are auto-detected.
+- Set Environment variables which are declared in `.env.template` under the Advanced Settings section.
+- Confirm the configuration and click on "Save and Deploy".
+
+## Custom domain
+
+After deploying your code to AWS Amplify, you may wish to point custom domains (or subdomains) to your site. AWS has an [instruction](https://docs.aws.amazon.com/amplify/latest/userguide/custom-domains.html).

products/sales-agent/best-practices/app-deployment/cloudflare.md

@@ -0,0 +1,126 @@
+---
+nav:
+  title: Cloudflare
+  position: 30
+---
+
+# Deploy with Cloudflare
+
+In this chapter you will learn how to deploy the frontend source code to [Cloudflare Pages](https://pages.cloudflare.com/).
+
+## Prerequisites
+
+- Register a Cloudflare account.
+- Clone the frontend source code and push to your GitHub repository.
+
+## Deploy from a local machine
+
+- Due to this [issue](https://github.com/nuxt/nuxt/issues/28248), just make sure your `.npmrc` file has the following content:
+
+```bash
+shamefully-hoist=true
+strict-peer-dependencies=false
+```
+
+- Install Wrangler
+
+```bash
+pnpm install wrangler --save-dev
+```
+
+- Make sure the Frontend app has already [generated an .env file](../../installation.md#create-a-env-file)
+- Build your project for Cloudflare Pages:
+
+```bash
+npx nuxi build --preset=cloudflare_pages
+```
+
+- Then deploy. However, for the first time, it will ask you to create a project:
+
+```bash
+wrangler pages deploy dist/
+```
+
+## Automation with GitHub Actions
+
+### Setup GitHub Secrets & variables
+
+- In GitHub Secrets, add `CLOUDFLARE_API_TOKEN` with API token value.
+  - [Create an API token](https://developers.cloudflare.com/fundamentals/api/get-started/create-token/) in the Cloudflare dashboard with the "Cloudflare Pages — Edit" permission.
+- In GitHub environment variables, create new environment named `production` and fill it with all environment variables in `.env.template`.
+  - Besides `production`, we can add new values for the same variable names in multiple environments such as `development`, `staging`.
+
+### Setup pipeline
+
+To trigger the deployment automatically, we can attach the GitHub Actions.
+
+- Create a `.github/workflows/publish.yml` file in your repository with the below sample content.
+
+::: warning
+Please note that this pipeline is just a sample. There are some points need to update for a specific purpose
+:::
+
+```yml
+on:
+  push:
+    # Specify the pipeline trigger
+    branches:
+      - main
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      deployments: write
+    name: Cloudflare Pages Deployment
+    # Specify the environment name
+    environment: production
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - uses: pnpm/action-setup@v4
+        name: Install pnpm
+        with:
+          version: 8
+          run_install: false
+
+      - name: Install dependencies
+        run: |
+          pnpm install
+
+      - name: Build env file
+        run: |
+          touch .env
+          echo COMPANY_NAME=${{ vars.COMPANY_NAME }} >> .env
+          echo ORIGIN=${{ vars.ORIGIN }} >> .env
+          echo REDIS_CACHE=${{ vars.REDIS_CACHE }} >> .env
+          echo REDIS_HOST=${{ vars.REDIS_HOST }} >> .env
+          echo REDIS_PORT=${{ vars.REDIS_PORT }} >> .env
+          echo REDIS_PASSWORD=${{ vars.REDIS_PASSWORD }} >> .env
+          echo REDIS_TLS=${{ vars.REDIS_TLS }} >> .env
+          echo APP_NAME=${{ vars.APP_NAME }} >> .env
+          echo APP_SECRET=${{ vars.APP_SECRET }} >> .env
+          echo DATABASE_URL=${{ vars.DATABASE_URL }} >> .env
+
+      - name: Build code
+        run: |
+          npx nuxi build --preset=cloudflare_pages
+
+      - name: Publish to Cloudflare Pages
+        uses: cloudflare/pages-action@v1.5.0
+        with:
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          accountId: YOUR_ACCOUNT_ID
+          projectName: YOUR_PROJECT_NAME
+          directory: dist
+          wranglerVersion: "3"
+```
+
+- Replace `YOUR_ACCOUNT_ID` with your account ID. Get it from the dashboard URL. E.g: `https://dash.cloudflare.com/<ACCOUNT_ID>/pages`.
+- Replace `YOUR_PROJECT_NAME` with the appropriate value.
+
+## Custom domain
+
+When deploying your Pages project, you may wish to point custom domains (or subdomains) to your site. Cloudflare has an [instruction](https://developers.cloudflare.com/pages/configuration/custom-domains/).

products/sales-agent/best-practices/app-deployment/hosted-with-ubuntu-server.md

@@ -0,0 +1,55 @@
+---
+nav:
+  title: Ubuntu Server with PM2
+  position: 10
+---
+
+# Deploy with Ubuntu Server with PM2
+
+This guide will walk you through the steps to deploy Sales Agent frontend web application to an Ubuntu server using [PM2](https://nuxt.com/docs/getting-started/deployment#pm2), a process manager for Node.js applications. PM2 will help you keep your app running in the background, restart it automatically when it crashes, and manage logs for easier troubleshooting.
+
+## Prerequisites
+
+- **Ubuntu Server**: This guide assumes you have an Ubuntu server running, and you can access it via SSH.
+- **Node.js & npm**: Make sure Node.js and npm (Node package manager) are installed on your server.
+- **PM2**: PM2 should be installed globally.
+
+```bash
+npm install -g pm2
+```
+
+- **pnpm**
+
+```bash
+npm install -g pnpm
+```
+
+- **Frontend Application**: Clone the frontend source code and push to your GitHub repository.
+
+## Build code
+
+- Please follow instructions here to [set up all necessary things and build the code](../../installation.md#setup-app-server)
+
+## Start the Application with PM2
+
+Now that your app is built, create a file named `ecosystem.config.cjs` in the root of your project with the following content. Ensure that the script path points to your app's build output directory (e.g., `.output/server/index.mjs` for Nuxt 3)
+
+```js
+module.exports = {
+  apps: [
+    {
+      name: "SalesAgentApp",
+      port: "3000",
+      exec_mode: "cluster",
+      instances: "max",
+      script: "./.output/server/index.mjs",
+    },
+  ],
+};
+```
+
+Once saved, you can start the app with:
+
+```bash
+pm2 start ecosystem.config.cjs
+```

products/sales-agent/best-practices/app-deployment/index.md

@@ -0,0 +1,13 @@
+---
+nav:
+  title: Frontend App Deployment
+  position: 10
+---
+
+# Frontend App Deployment
+
+According to [Shopware Frontends deployment document](https://frontends.shopware.com/best-practices/deployment.html), all the templates which were generated by Shopware Frontends can be deployed in multiple ways, depending on the setup you are using. Most likely you will be using either a static hosting service or a server with a Node.js runtime.
+
+You may find the different approaches as described in [Nuxt instruction](https://nuxt.com/deploy).
+
+Alternatively, we will show some best practices of _Sales Agent_ frontend app deployment.

products/sales-agent/best-practices/index.md

@@ -0,0 +1,5 @@
+---
+nav:
+  title: Best practices
+  position: 40
+---

products/sales-agent/installation.md

@@ -1,8 +1,7 @@
 ---
 nav:
-   title: Local installation
-   position: 20
-
+  title: Local installation
+  position: 20
 ---
 
 # Local installation
@@ -11,9 +10,9 @@ nav:
 
 Obtain all the credentials to connect to the following services:
 
-* Database (MySQL).
+- Database (MySQL).
 
-* Cache layer (Redis).
+- Cache layer (Redis).
 
 ## Setup App Server
 
@@ -26,7 +25,7 @@ cd swagsalesagent
 
 ### Create a `.env` File
 
-* Use the provided `.env.template` file as an example.
+- Use the provided `.env.template` file as an example.
 
 ```shell
 cp .env.template .env
@@ -44,13 +43,13 @@ pnpm install --frozen-lockfile --prefer-offline
 
 Choose one of the following commands based on your needs:
 
-* Execute existing migrations without creating new files:
+- Execute existing migrations without creating new files:
 
 ```bash
   pnpm db:migration:deploy
 ```
 
-* Execute & create new migration files if there are schema changes:
+- Execute & create new migration files if there are schema changes:
 
 ```bash
   pnpm db:migration:dev
@@ -62,16 +61,22 @@ Choose one of the following commands based on your needs:
 pnpm dev
 ```
 
+### Build code for Production
+
+```shell
+pnpm build
+```
+
 ## Connect App to Shopware Instance
 
-* Build zip
+- Build zip
 
 ```bash
 pnpm app:build
 ```
 
-* Upload zip from `bundle/swagsalesagent.zip` into Shopware Extensions.
+- Upload zip from `bundle/swagsalesagent.zip` into Shopware Extensions.
 
-* Verify the Installed App: after installation, you should see the Sales Agent menu item appear in the Settings.
+- Verify the Installed App: after installation, you should see the Sales Agent menu item appear in the Settings.
 
 ![ ](../../assets/sales-agent-item.png)