Bc4710 Integrate tldraw board in the column

.github/workflows/clean.yml

@@ -7,9 +7,9 @@ jobs:
   clean:
     permissions:
       contents: read
-    uses: hpi-schul-cloud/dof_app_deploy/.github/workflows/clean_workflow.yml@main
+    uses: hpi-schul-cloud/dof_app_deploy/.github/workflows/clean_workflow.yml@BC-4710-new-tldraw-manage
     with:
       branch: ${{ github.event.ref }}
     secrets:
       token: ${{ secrets.GITHUB_TOKEN }}
-      DEV_KUBE_CONFIG: ${{ secrets.DEV_KUBE_CONFIG }}
+      DEV_KUBE_CONFIG: ${{ secrets.DEV_KUBE_CONFIG }}

.github/workflows/push.yml

@@ -45,7 +45,7 @@ jobs:
 
       - name: Build and push ${{ github.repository }}
         if: ${{ env.IMAGE_EXISTS == 0 }}
-        uses: docker/build-push-action@v4
+        uses: docker/build-push-action@v4.1.1
         with:
           context: .
           file: ./Dockerfile
@@ -54,6 +54,24 @@ jobs:
           tags: ghcr.io/${{ github.repository }}:${{ github.sha }}
           labels: ${{ steps.docker_meta_img.outputs.labels }}
 
+  branch_meta:
+    runs-on: ubuntu-latest
+    outputs:
+      branch: ${{ steps.extract_branch_meta.outputs.branch }}
+      sha: ${{ steps.extract_branch_meta.outputs.sha }}
+    steps:
+      - name: Extract branch meta
+        shell: bash
+        id: extract_branch_meta
+        run: |
+          if [ "${{ github.event_name }}" == 'pull_request' ]; then
+            echo "branch=${{ github.event.pull_request.head.ref }}" >> $GITHUB_OUTPUT
+            echo "sha=${{ github.event.pull_request.head.sha }}" >> $GITHUB_OUTPUT
+          else
+            echo "branch=${GITHUB_REF#refs/heads/}" >> $GITHUB_OUTPUT
+            echo "sha=${{ github.sha }}" >> $GITHUB_OUTPUT
+          fi
+
   branch_name:
     runs-on: ubuntu-latest
     outputs:
@@ -68,13 +86,14 @@ jobs:
     needs:
       - build_and_push
       - branch_name
-    uses: hpi-schul-cloud/dof_app_deploy/.github/workflows/deploy.yml@main
+    uses: hpi-schul-cloud/dof_app_deploy/.github/workflows/deploy.yml@BC-4710-new-tldraw-manage
     with:
       branch: ${{ needs.branch_name.outputs.branch }}
     secrets:
       token: ${{ secrets.GITHUB_TOKEN }}
       DEV_VAULT: ${{ secrets.DEV_VAULT }}
       DEV_KUBE_CONFIG: ${{ secrets.DEV_KUBE_CONFIG }}
+      BINGO_REPO_TOKEN: ${{ secrets.BINGO_REPO_TOKEN }}
 
   deploy-successful:
     needs:

.github/workflows/tag.yml

@@ -16,16 +16,24 @@ jobs:
         id: docker_meta_img_hub
         uses: docker/metadata-action@v3
         with:
-          images: schulcloud/tldraw-client
+          images: docker.io/schulcloud/tldraw-client, quay.io/schulcloud/tldraw-client
           tags: |
             type=semver,pattern={{version}}
             type=semver,pattern={{major}}.{{minor}}
+
       - name: Log into registry
         uses: docker/login-action@v1
         with:
           username: ${{ secrets.DOCKER_USERNAME }}
           password: ${{ secrets.DOCKER_TOKEN }}
 
+      - name: Log into quay registry
+        uses: docker/login-action@v2
+        with:
+          registry: quay.io
+          username: ${{ secrets.QUAY_USERNAME }}
+          password: ${{ secrets.QUAY_TOKEN }}
+
       - name: Build and push ${{ github.repository }}
         uses: docker/build-push-action@v2
         with:

Dockerfile

@@ -1,17 +1,26 @@
+# build stage
 FROM docker.io/node:18-bullseye as build-stage
 
 RUN mkdir /app && chown -R node:node /app
+
 WORKDIR /app
 
-COPY package.json .
-COPY package-lock.json .
+COPY package.json package-lock.json ./
 RUN npm ci
-COPY . ./
-RUN npm run build
 
-# production environment
+COPY babel.config.js .eslintrc.js LICENSE.md tsconfig.json .prettierrc.js ./
+COPY public ./public
+COPY src ./src
+RUN NODE_ENV=production npm run build
+
+# runtime image stage
 FROM docker.io/nginx:1.25
-COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+RUN mkdir /etc/nginx/templates
+
+COPY nginx.conf.template /etc/nginx/templates/default.conf.template
 COPY --from=build-stage /app/build /usr/share/nginx/html
-EXPOSE 83
+
+EXPOSE 3046
+
 CMD ["nginx", "-g", "daemon off;"]

ansible/group_vars/all/tldraw-client.yml

@@ -0,0 +1,2 @@
+---
+TLDRAW_CLIENT_IMAGE: quay.io/schulcloudverbund/tldraw-client

ansible/group_vars/develop/tldraw-client.yml

@@ -0,0 +1,2 @@
+---
+TLDRAW_CLIENT_IMAGE: ghcr.io/hpi-schul-cloud/tldraw-client

ansible/roles/tldraw-client-core/meta/main.yml

@@ -0,0 +1,9 @@
+galaxy_info:
+  role_name: tldraw-client-core
+  author: Schul-Cloud Verbund
+  description: core role for the tldraw-client
+  company: Schul-Cloud Verbund
+  license: license (AGPLv3)
+  min_ansible_version: 2.8
+  galaxy_tags: []
+dependencies: []

ansible/roles/tldraw-client-core/tasks/main.yml

@@ -0,0 +1,24 @@
+- name: TldrawClientService
+  kubernetes.core.k8s:
+    kubeconfig: ~/.kube/config
+    namespace: "{{ NAMESPACE }}"
+    template: tldraw-client-svc.yml.j2
+
+- name: TldrawClientConfigmap
+  kubernetes.core.k8s:
+    kubeconfig: ~/.kube/config
+    namespace: "{{ NAMESPACE }}"
+    template: tldraw-client-configmap.yml.j2
+    apply: yes
+
+- name: TldrawClientDeployment
+  kubernetes.core.k8s:
+    kubeconfig: ~/.kube/config
+    namespace: "{{ NAMESPACE }}"
+    template: tldraw-client-deployment.yml.j2
+
+- name: TldrawClientIngress
+  kubernetes.core.k8s:
+    kubeconfig: ~/.kube/config
+    namespace: "{{ NAMESPACE }}"
+    template: tldraw-client-ingress.yml.j2

ansible/roles/tldraw-client-core/templates/tldraw-client-configmap.yml.j2

@@ -0,0 +1,12 @@
+apiVersion: v1
+kind: ConfigMap
+metadata:
+  name: tldraw-client-configmap
+  namespace: {{ NAMESPACE }}
+  labels:
+    app: tldraw-client
+data:
+    NODE_ENV: "production"
+    TZ: "Europe/Berlin"
+    PORT: "3046"
+    TLDRAW_SERVER_URL: "wss://{{ DOMAIN }}/tldraw-server"

ansible/roles/tldraw-client-core/templates/tldraw-client-deployment.yml.j2

@@ -0,0 +1,77 @@
+apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: tldraw-client-deployment
+  namespace: {{ NAMESPACE }}
+  labels:
+    app: tldraw-client
+spec:
+  replicas: {{ TLDRAW_CLIENT_REPLICAS|default("1", true) }}
+  strategy:
+    type: RollingUpdate
+    rollingUpdate:
+      maxSurge: 1
+  revisionHistoryLimit: 4
+  paused: false
+  selector:
+    labels:
+      app: tldraw-client
+      app.kubernetes.io/part-of: schulcloud-verbund
+      app.kubernetes.io/version: {{ SCHULCLOUD_SERVER_IMAGE_TAG }}
+      app.kubernetes.io/name: tldraw-client
+      app.kubernetes.io/component: tldraw
+      app.kubernetes.io/managed-by: ansible
+      git.branch: {{ SCHULCLOUD_SERVER_BRANCH_NAME }}
+      git.repo: {{ SCHULCLOUD_SERVER_REPO_NAME }}
+  template:
+    metadata:
+      labels:
+        labels:
+        app: tldraw-client
+        app.kubernetes.io/part-of: schulcloud-verbund
+        app.kubernetes.io/version: {{ SCHULCLOUD_SERVER_IMAGE_TAG }}
+        app.kubernetes.io/name: tldraw-client
+        app.kubernetes.io/component: tldraw
+        app.kubernetes.io/managed-by: ansible
+        git.branch: {{ SCHULCLOUD_SERVER_BRANCH_NAME }}
+        git.repo: {{ SCHULCLOUD_SERVER_REPO_NAME }}
+      annotations:
+    spec:
+      securityContext:  
+        runAsUser: 1000
+        runAsGroup: 1000
+        fsGroup: 1000
+        runAsNonRoot: true
+      containers:
+      - name: tldraw-client
+        image: {{ TLDRAW_CLIENT_IMAGE }}:{{ TLDRAW_CLIENT_IMAGE_TAG }}
+        imagePullPolicy: IfNotPresent
+        ports:
+        - name: http
+          containerPort: 3046
+          protocol: TCP
+        envFrom:
+        - configMapRef:
+            name: tldraw-client-configmap
+        volumeMounts:
+        - mountPath: /var/run
+          name: pid-dir
+        - mountPath: /var/cache/nginx
+          name: cache-dir
+        - mountPath: /etc/nginx/conf.d
+          name: conf-dir
+        resources:
+          limits:
+            cpu: {{ TLDRAW_CLIENT_CPU_LIMITS|default("1000m", true) }}
+            memory: {{ TLDRAW_CLIENT_MEMORY_LIMITS|default("256Mi", true) }}
+          requests:
+            cpu: {{ TLDRAW_CLIENT_CPU_REQUESTS|default("100m", true) }}
+            memory: {{ TLDRAW_CLIENT_MEMORY_REQUESTS|default("32Mi", true) }}
+      volumes:
+      - name: pid-dir
+        emptyDir: {}
+      - name: cache-dir
+        emptyDir: {}
+      - name: conf-dir
+        emptyDir: {}
+

ansible/roles/tldraw-client-core/templates/tldraw-client-ingress.yml.j2

@@ -0,0 +1,49 @@
+apiVersion: networking.k8s.io/v1
+kind: Ingress
+metadata:
+  name: {{ NAMESPACE }}-tldraw-client-ingress
+  namespace: {{ NAMESPACE }}
+  annotations:
+    nginx.ingress.kubernetes.io/ssl-redirect: "{{ TLS_ENABELD|default("false") }}"
+    nginx.ingress.kubernetes.io/proxy-body-size: "{{ INGRESS_MAX_BODY_SIZE|default("2560") }}m"
+    nginx.org/client-max-body-size: "{{ INGRESS_MAX_BODY_SIZE|default("2560") }}m"
+    # The following properties added with BC-3606.
+    # The header size of the request is too big. For e.g. state and the permanent growing jwt.
+    # Nginx throws away the Location header, resulting in the 502 Bad Gateway.
+    nginx.ingress.kubernetes.io/client-header-buffer-size: 100k
+    nginx.ingress.kubernetes.io/http2-max-header-size: 96k
+    nginx.ingress.kubernetes.io/large-client-header-buffers: 4 100k
+    nginx.ingress.kubernetes.io/proxy-buffer-size: 96k
+{% if CLUSTER_ISSUER is defined %}
+    cert-manager.io/cluster-issuer: {{ CLUSTER_ISSUER }}
+{% endif %}
+
+spec:
+  ingressClassName: nginx
+{% if CLUSTER_ISSUER is defined or (TLS_ENABLED is defined and TLS_ENABLED | bool) %}
+  tls:
+  - hosts:
+      - {{ DOMAIN }}
+{% if CLUSTER_ISSUER is defined %}
+    secretName: {{ DOMAIN }}-tls
+{% endif %}
+{% endif %}
+  rules:
+  - host: {{ DOMAIN }}
+    http:
+      paths:
+      - path: /tldraw
+        pathType: Prefix
+        backend:
+          service:
+            name: tldraw-client-svc
+            port:
+              number: 3046
+      - path: /static
+        pathType: Prefix
+        backend:
+          service:
+            name: tldraw-client-svc
+            port:
+              number: 3046
+

ansible/roles/tldraw-client-core/templates/tldraw-client-svc.yml.j2

@@ -0,0 +1,16 @@
+apiVersion: v1
+kind: Service
+metadata:
+  name: tldraw-client-svc
+  namespace: {{ NAMESPACE }}
+  labels:
+    app: tldraw-client
+spec:
+  ports:
+    - port: 3046
+      targetPort: 3046
+      protocol: TCP
+      name: tldraw-client
+  selector:
+    app: tldraw-client
+  sessionAffinity: ClientIP

nginx.conf.template

@@ -0,0 +1,25 @@
+server {
+    listen 3046;
+    server_name localhost;
+
+    location /tldraw-client-runtime.config.json {
+        return 200 '{ "tldrawServerURL" : "${TLDRAW_SERVER_URL}" }';
+        add_header Content-Type application/json;
+    }
+
+    location /static {
+        alias /usr/share/nginx/html/static/;
+    }
+
+    location / {
+        root /usr/share/nginx/html;
+        index index.html index.htm;
+        try_files $uri /index.html;
+    }
+
+    error_page 500 502 503 504 /50x.html;
+
+    location = /50x.html {
+        root /usr/share/nginx/html;
+    }
+}