feat(frontend): add message history/editing to frontend

.gitignore

@@ -1,6 +1,8 @@
 *.zuliprc
 .env
+.task
 clients.json
+zuliprc.json
 node_modules
 src/zulip_write_only_proxy/_version.py
 src/zulip_write_only_proxy/frontend/static

Dockerfile

@@ -16,11 +16,11 @@ COPY ./src/zulip_write_only_proxy/frontend/templates/ \
 
 RUN pnpm build
 
-ADD --link https://unpkg.com/browse/htmx.org@1.9.10/dist/htmx.js \
-  https://unpkg.com/browse/htmx.org@1.9.10/dist/htmx.min.js \
+ADD --link https://unpkg.com/htmx.org@1.9.10/dist/htmx.js \
+  https://unpkg.com/htmx.org@1.9.10/dist/htmx.min.js \
   ./src/zulip_write_only_proxy/frontend/static/
 
-FROM python:3.11-alpine
+FROM python:3.11-alpine AS prod
 
 ENV PYTHONDONTWRITEBYTECODE 1
 ENV PYTHONUNBUFFERED 1
@@ -46,7 +46,18 @@ COPY --link --from=frontend /app/src/zulip_write_only_proxy/frontend/static \
 
 EXPOSE 8000
 
-CMD ["poe", "prod"]
+ENV ZWOP_ADDRESS=http://0.0.0.0:8000
+
+CMD ["poe", "up"]
 
 HEALTHCHECK --start-interval=1s --start-period=30s --interval=60s \
   CMD wget --spider http://localhost:8000/api/health || exit 1
+
+FROM prod AS dev
+
+RUN --mount=type=cache,target=/root/.cache \
+  python3 -m pip install debugpy
+
+EXPOSE 5678
+
+CMD ["python3", "-Xfrozen_modules=off", "-m", "debugpy", "--listen", "0.0.0.0:5678", "-m", "zulip_write_only_proxy.main"]

Taskfile.yml

@@ -0,0 +1,45 @@
+---
+version: 3
+
+tasks:
+  css:
+    cmds:
+      - |
+        pnpm exec tailwindcss \
+          -o src/zulip_write_only_proxy/frontend/static/main.css
+    sources:
+      - src/**/*.html
+      - ./tailwind.config.js
+    generates:
+      - src/zulip_write_only_proxy/frontend/static/main.css
+
+  css-watch: |
+    pnpm exec tailwindcss \
+      -o src/zulip_write_only_proxy/frontend/static/main.css \
+      --watch
+
+  htmx: |
+    cd ./src/zulip_write_only_proxy/frontend/static && \
+      wget -N https://unpkg.com/htmx.org@1.9.10/dist/htmx.js
+
+  poe-up: poe up
+
+  dev:
+    deps: [css-watch, htmx, poe-up]
+
+  docker:
+    cmds:
+      - defer: docker compose -p zwop-dev -f ./compose.yml down
+      - docker compose -p zwop-dev -f ./compose.yml watch
+      - sleep 10 && docker compose -p zwop-dev -f ./compose.yml logs -f
+    interactive: true
+
+  staging: |
+    docker compose -f ./compose.staging.yml config | \
+      sed '/published:/ s/"//g' | sed "/name:/d" | \
+      docker stack deploy -c - zwop-staging
+
+  prod: |
+    docker compose -f ./compose.prod.yml config | \
+      sed '/published:/ s/"//g' | sed "/name:/d" | \
+      docker stack deploy -c - zwop-prod

docker-compose.prod.yml → compose.prod.yml

@@ -7,16 +7,22 @@ networks:
 services:
   zwop:
     image: ${IMAGE:-ghcr.io/european-xfel/zulip-write-only-proxy}:${TAG:?error}
+    volumes:
+      - ./config:/app/config
+    env_file:
+      - .env
     environment:
-      ZWOP_PROXY_ROOT: /zwop
+      - ZWOP_PROXY_ROOT=/zwop
     networks:
       - proxy
     labels:
-      traefik.http.routers.zwop.entryPoints: https
+      traefik.enable: true
+      traefik.http.middlewares.zwop.stripprefix.forceSlash: false
+      traefik.http.middlewares.zwop.stripprefix.prefixes: /zwop
+      traefik.http.routers.zwop.middlewares: zwop
       traefik.http.routers.zwop.rule: PathPrefix(`/zwop`)
-      traefik.http.middlewares.zwop-strip-prefix.stripprefix.prefixes: /zwop
-      traefik.docker.network: proxy
-    command: !reset null
+      traefik.http.services.zwop.loadbalancer.server.port: 8000
+    command: ["poe", "prod"]
     deploy:
       update_config:
         parallelism: 1
@@ -25,5 +31,3 @@ services:
         order: start-first
         monitor: 10s
         max_failure_ratio: 0
-
-  traefik: !reset null

compose.staging.yml

@@ -0,0 +1,25 @@
+version: "3.8"
+
+networks:
+  proxy:
+    external: true
+
+services:
+  zwop-staging:
+    build: .
+    volumes:
+      - ./config:/app/config
+    env_file:
+      - .env
+    environment:
+      - ZWOP_PROXY_ROOT=/zwop-staging
+    networks:
+      - proxy
+    labels:
+      traefik.enable: true
+      traefik.http.middlewares.zwop-staging.stripprefix.forceSlash: false
+      traefik.http.middlewares.zwop-staging.stripprefix.prefixes: /zwop-staging
+      traefik.http.routers.zwop-staging.middlewares: zwop-staging
+      traefik.http.routers.zwop-staging.rule: PathPrefix(`/zwop-staging`)
+      traefik.http.services.zwop-staging.loadbalancer.server.port: 8000
+    command: ["poe", "staging"]

docker-compose.yml → compose.yml

@@ -1,15 +1,14 @@
 version: "3.8"
 
 services:
-  zwop:
+  zwop-dev:
     build: .
     volumes:
       - ./config:/app/config
-    environment:
-      ZWOP_ADDRESS: http://0.0.0.0:8000
-      ZWOP_PROXY: /zwop
     env_file:
       - .env
+    environment:
+      - ZWOP_PROXY_ROOT=/zwop
     labels:
       traefik.enable: true
       traefik.http.middlewares.zwop-dev.stripprefix.forceSlash: false
@@ -29,17 +28,9 @@ services:
           target: /app/docker-compose.yml
     ports:
       - 5678:5678
-    command: [
-        "sh",
-        "-c",
-        "python3 -m pip install debugpy &&
-        python3 -Xfrozen_modules=off -m debugpy --listen 0.0.0.0:5678
-        -m zulip_write_only_proxy.main",
-      ]
 
   traefik:
     image: "traefik:v2.10"
-    container_name: "traefik"
     command:
       - "--api.insecure=true"
       - "--providers.docker=true"

package.json

@@ -7,5 +7,10 @@
     "htmx": "cd  src/zulip_write_only_proxy/frontend/static/; wget -N https://unpkg.com/browse/htmx.org@1.9.10/dist/htmx.js; wget -N https://unpkg.com/browse/htmx.org@1.9.10/dist/htmx.min.js",
     "build": "tailwindcss -o src/zulip_write_only_proxy/frontend/static/main.css",
     "watch": "tailwindcss -o src/zulip_write_only_proxy/frontend/static/main.css --watch"
+  },
+  "devDependencies": {
+    "prettier": "^3.2.5",
+    "prettier-plugin-jinja-template": "^1.3.2",
+    "prettier-plugin-tailwindcss": "^0.5.11"
   }
 }