feat: add appflowy web to docker compose

doc/DEPLOYMENT.md

@@ -135,15 +135,27 @@ docker logs <NAME>
 - Then, run `docker compose up -d` to start the services.
 - Alternatively, you can use a specific image tag instead of `latest`, and checkout the corresponding tag for
   the repository.
+- Sometimes there might be additional steps required for upgrade. Refer to the [upgrade notes](https://appflowy.com/docs/self-hosters-upgrade-notes)
+  for more information.
 
 ### 7. AppFlowy Web
+- AppFlowy Web is provided as part of the docker compose setup, and should work out of the box. It is accessible via `/app` or `/`.
+- For existing self hosters who upgraded their setup to include AppFlowy Web in the docker compose, `/` might redirect them to `/web`
+  instead of `/app`. This is because the home page `/` used to be occupied by the admin console, and redirects to `/web` by default.
+  The browser cache might need to be cleared to see the new behavior. Alternatively, just access the AppFlowy Web directly via `/app`.
 
-- AppFlowy Web is a Single Page Application (SPA) that calls the endpoints in  `appflowy_cloud`, and is assumed
+- In order for login flow to succeed, we need to make sure that the necessary headers for redirect url can be passed
-  to be served on a different origin that the one used for AppFlowy Cloud (eg. if you are hosting `appflowy cloud`
+  to AppFlowy Cloud. If you are using only the Nginx service running within the official docker compose setup, then
-  on `appflowy.home.com`, `appflowy_web` may be hosted on `web.appflowy.home.com`). The source code and deployment
+  this is already taken care of and no further steps are required. Otherwise, if you have an external Nginx in front of
-  guide can be found in this [repository](https://github.com/AppFlowy-IO/AppFlowy-Web).
+  the service, then make sure that you have the following:
-- To prevent CORS issues, you will need to add your AppFlowy Web origin. By default, we allow requests from `localhost:3000`,
+  ```
-  using, the configuration below:
+  proxy_pass_request_headers on;
+  underscores_in_headers on;
+  ```
+- You can also deploy AppFlowy Web on another domain, using tools such as Vercel, instead of using the existing docker compose setup.
+  You can follow the guide [here](https://appflowy.com/docs/self-host-appflowy-web-install-vercel).
+- If AppFlowy Web is served on a separate domain, you will need to modify the nginx conf to prevent CORS issues.
+  By default, we allow requests from `localhost:3000`, using, the configuration below:
   ```
   map $http_origin $cors_origin {
     # AppFlowy Web origin
@@ -152,7 +164,11 @@ docker logs <NAME>
   }
   ```
   Replace `http://localhost:3000` with your AppFlowy Web origin.
-
+- If you wish to build you own AppFlowy Web docker image, then run the following commands from the root directory of this repository:
+  ```
+  docker build --build-arg VERSION=v<insert version here> docker/web -f docker/web/Dockerfile -t appflowy-web
+  ```
+  The available versions can be found on [AppFlowy Web repository](https://github.com/AppFlowy-IO/AppFlowy-Web).
 
 
 ## Ports
@@ -214,3 +230,6 @@ performed via the admin portal as opposed to links provided in emails.
   from the internet.
 - Update `proxy_pass` in `nginx/nginx.conf` to point to the above ports. Then adapt this configuration for your
   existing Nginx configuration.
+
+### AppFlowy Web keeps redirecting to the desktop application after login.
+- Refer to the AppFlowy Web section in the deployment steps. Make sure that the necessary headers are present.

doc/GUIDE.md

@@ -34,6 +34,7 @@ After executing `docker-compose up -d`, AppFlowy-Cloud is accessible at `http://
 - `/pgadmin`: Interface for Postgres database management.
 - `/minio`: User interface for Minio object storage.
 - `/portainer`: Tool for container management.
+- `/`, `/app`: AppFlowy Web.
 
 ![Deployment Architecture](../assets/images/deployment_arch.png)
 
@@ -43,6 +44,7 @@ After executing `docker-compose up -d`, AppFlowy-Cloud is accessible at `http://
 AppFlowy leverages Docker for efficient deployment and scaling. Docker images are available at:
 - `appflowy_cloud`: [Docker Hub](https://hub.docker.com/repository/docker/appflowyinc/appflowy_cloud/general)
 - `admin_frontend`: [Docker Hub](https://hub.docker.com/repository/docker/appflowyinc/admin_frontend/general)
+- `appflowy_web`: [Docker Hub](https://hub.docker.com/repository/docker/appflowyinc/appflowy_web/general)
 
 #### Automated Builds with GitHub Tags
 The Docker images are automatically built and updated through a GitHub Actions workflow:

docker-compose.yml

@@ -137,8 +137,8 @@ services:
       - AI_SERVER_PORT=${AI_SERVER_PORT}
       - AI_OPENAI_API_KEY=${AI_OPENAI_API_KEY}
       - APPFLOWY_ADMIN_FRONTEND_PATH_PREFIX=${ADMIN_FRONTEND_PATH_PREFIX}
-      # Uncomment this line if AppFlowy Web has been deployed
+      # If your AppFlowy Web is hosted on a different domain, update this variable to the correct domain
-      # - APPFLOWY_WEB_URL=${APPFLOWY_WEB_URL}
+      - APPFLOWY_WEB_URL=${FQDN}
     build:
       context: .
       dockerfile: Dockerfile
@@ -204,6 +204,15 @@ services:
     depends_on:
       postgres:
         condition: service_healthy
+
+  appflowy_web:
+    restart: on-failure
+    image: appflowyinc/appflowy_web:${APPFLOWY_WEB_VERSION:-latest}
+    depends_on:
+      - appflowy_cloud
+    environment:
+      - AF_BASE_URL=${FQDN}
+      - AF_GOTRUE_URL=${API_EXTERNAL_URL}
 volumes:
   postgres_data:
   minio_data:

nginx/nginx.conf

@@ -43,6 +43,7 @@ http {
         set $appflowy_cloud_backend "http://appflowy_cloud:8000";
         set $gotrue_backend "http://gotrue:9999";
         set $admin_frontend_backend "http://admin_frontend:3000";
+        set $appflowy_web_backend "http://appflowy_web:80";
         set $appflowy_ai_backend "http://ai:5001";
         set $minio_backend "http://minio:9001";
         set $portainer_backend "http://portainer:9000";
@@ -224,6 +225,13 @@ http {
             proxy_set_header X-Scheme $scheme;
             proxy_set_header Host $host;
         }
+
+        # AppFlowy Web
+        location / {
+            proxy_pass $appflowy_web_backend;
+            proxy_set_header X-Scheme $scheme;
+            proxy_set_header Host $host;
+        }
     }
 
 }