89 deploy observability stack to k8s

.github/workflows/client-linters.yml

@@ -34,6 +34,3 @@ jobs:
       - name: Run Type Check
         run: npx --package=typescript@latest -- tsc --build .
         working-directory: client
-
-
-

.github/workflows/deploy-to-k8s.yml

@@ -217,7 +217,6 @@ jobs:
           build-args: API_URL=${{ needs.setup.outputs.api_url }}
           platforms: linux/amd64
 
-
   deploy:
     needs:
       - build-client
@@ -248,6 +247,7 @@ jobs:
             AUTH_URL=auth.whiteboard.student.k8s.aet.cit.tum.de
             GENAI_URL=genai.whiteboard.student.k8s.aet.cit.tum.de
             REALTIME_URL=realtime.whiteboard.student.k8s.aet.cit.tum.de
+            METRICS_URL=metrics.whiteboard.student.k8s.aet.cit.tum.de
             echo "NAMESPACE=production" >> $GITHUB_ENV
             echo "IMAGE_TAG=latest" >> $GITHUB_ENV
             echo "VALUES_FILE=./infrastructure/whiteboard-app/production.values.yaml" >> $GITHUB_ENV
@@ -261,6 +261,7 @@ jobs:
             AUTH_URL=staging.auth.whiteboard.student.k8s.aet.cit.tum.de
             GENAI_URL=staging.genai.whiteboard.student.k8s.aet.cit.tum.de
             REALTIME_URL=staging.realtime.whiteboard.student.k8s.aet.cit.tum.de
+            METRICS_URL=staging.metrics.whiteboard.student.k8s.aet.cit.tum.de
             echo "NAMESPACE=staging" >> $GITHUB_ENV
             echo "IMAGE_TAG=develop" >> $GITHUB_ENV
             echo "VALUES_FILE=./infrastructure/whiteboard-app/staging.values.yaml" >> $GITHUB_ENV
@@ -275,6 +276,7 @@ jobs:
             AUTH_URL=$BRANCH_SAFE.auth.whiteboard.student.k8s.aet.cit.tum.de
             GENAI_URL=$BRANCH_SAFE.genai.whiteboard.student.k8s.aet.cit.tum.de
             REALTIME_URL=$BRANCH_SAFE.realtime.whiteboard.student.k8s.aet.cit.tum.de
+            METRICS_URL=$BRANCH_SAFE.metrics.whiteboard.student.k8s.aet.cit.tum.de
             echo "NAMESPACE=$BRANCH_SAFE" >> $GITHUB_ENV
             echo "IMAGE_TAG=$BRANCH_SAFE" >> $GITHUB_ENV
             echo "VALUES_FILE=./infrastructure/whiteboard-app/pullrequest.values.yaml" >> $GITHUB_ENV
@@ -290,6 +292,7 @@ jobs:
           echo "GENAI_URL=$GENAI_URL" >> $GITHUB_ENV
           echo "OPEN_WEB_UI_API_KEY=${{ secrets.OPEN_WEB_UI_API_KEY }}" >> $GITHUB_ENV
           echo "REALTIME_URL=$REALTIME_URL" >> $GITHUB_ENV
+          echo "METRICS_URL=$METRICS_URL" >> $GITHUB_ENV
           echo "KEYCLOAK_CLIENT_SECRET=$KEYCLOAK_CLIENT_SECRET" >> $GITHUB_ENV
           echo "NEXTAUTH_SECRET=$NEXTAUTH_SECRET" >> $GITHUB_ENV
           echo "POSTGRESQL_SECRET=$POSTGRESQL_SECRET" >> $GITHUB_ENV
@@ -313,15 +316,17 @@ jobs:
 
           if [[ "$BRANCH" == "main" ]]; then
             RELEASE_NAME="whiteboard-production"
+            OBSERVABILITY_RELEASE_NAME="whiteboard-observability-production"
           elif [[ "$BRANCH" == "develop" ]]; then
             RELEASE_NAME="whiteboard-staging"
+            OBSERVABILITY_RELEASE_NAME="whiteboard-observability-staging"
           else
             PR_NUMBER=${{ github.event.pull_request.number }}
             RELEASE_NAME="whiteboard-pr-${PR_NUMBER}"
           fi
 
           echo "RELEASE_NAME=${RELEASE_NAME}" >> $GITHUB_ENV
-          echo "release-name=${RELEASE_NAME}" >> $GITHUB_OUTPUT
+          echo "OBSERVABILITY_RELEASE_NAME=${OBSERVABILITY_RELEASE_NAME}" >> $GITHUB_ENV
 
       - name: Install Helm
         uses: azure/setup-helm@v3
@@ -352,6 +357,23 @@ jobs:
             --set keycloak.externalDatabase.password="${{ env.POSTGRESQL_SECRET }}" \
             --set keycloak.auth.adminPassword="${{ env.KEYCLOAK_SECRET }}" \
 
+      - name: Deploy Observability Stack with Helm
+        if: github.ref == 'refs/heads/develop' || github.ref == 'refs/heads/main'
+        run: |
+          helm upgrade ${{ env.OBSERVABILITY_RELEASE_NAME }} ./infrastructure/whiteboard-observability/ \
+            -f ${{ env.VALUES_FILE }} \
+            -n tsd-${{ env.NAMESPACE }} \
+            --create-namespace \
+            --install \
+            --atomic \
+            --kubeconfig ${{ env.KUBECONFIG }} \
+            --set namespace="${{ env.NAMESPACE }}" \
+            --set client.url="${{ env.CLIENT_URL }}" \
+            --set server.url="${{ env.SERVER_URL }}" \
+            --set genai.url="${{ env.GENAI_URL }}" \
+            --set realtime.url="${{ env.REALTIME_URL }}" \
+            --set metrics.url="${{ env.METRICS_URL }}"
+
   comment-pr:
     needs: deploy
     runs-on: ubuntu-latest

.github/workflows/genai-linters.yml

@@ -29,7 +29,7 @@ jobs:
         run: |
           cd genai
           ruff check .
-      
+
       - name: GenAI format (auto-fix)
         run: |
           cd genai

.github/workflows/genai-tests.yml

@@ -26,7 +26,7 @@ jobs:
           uv pip install -r ./genai/requirements.txt --system
 
       - name: GenAI tests
-        env: 
+        env:
          OPEN_WEB_UI_API_KEY: ${{ secrets.OPEN_WEB_UI_API_KEY }}
          API_URL: ${{ vars.API_URL }}
         run: |

client/src/components/style-bar/StyleBar.tsx

@@ -100,11 +100,11 @@ const StyleBar = ({
       let data;
 
       if (action === "rephrase") {
-        data = await rephraseText({ user_text: [selectedNodeLabel] });
+        data = await rephraseText({ user_text: selectedNodeLabel });
       } else if (action === "complete") {
-        data = await completeText({ user_text: [selectedNodeLabel] });
+        data = await completeText({ user_text: selectedNodeLabel });
       } else {
-        data = await summarizedText({ user_text: [selectedNodeLabel] });
+        data = await summarizedText({ user_text: selectedNodeLabel });
       }
 
       const llmResponse = data.llm_response;

client/src/components/text-node/TextNode.tsx

@@ -7,15 +7,16 @@ import {
   Position,
   useReactFlow,
 } from "@xyflow/react";
-import { Eye, EyeOff } from "lucide-react";
-import { Button } from "@/components/ui/button";
 import {
   getFontStyle,
   handleStyle,
   NodeProperties,
 } from "@/types/NodeProperties";
 import StyleBar from "@/components/style-bar/StyleBar";
 import { updateNode } from "@/util/updateNode";
+import { useAmIOwner } from "@/hooks/api/whiteboard.api";
+import { useGetMe } from "@/hooks/api/account.api";
+import { useParams } from "next/navigation";
 
 interface TextNodeProps extends NodeProps {
   id: string;
@@ -40,9 +41,14 @@ function hexToRgb(hex: string) {
 export default function TextNode({ id, data, selected }: TextNodeProps) {
   const [isEditing, setIsEditing] = useState(false);
   const [text, setText] = useState<string>(data.label as string);
-  const [showStyleBar, setShowStyleBar] = useState(true);
   const { setNodes } = useReactFlow();
 
+  const params = useParams();
+  const whiteboardId = Number(params.id);
+
+  const { data: user } = useGetMe();
+  const { data: isOwner } = useAmIOwner(whiteboardId, user?.id);
+
   const { nodeProperties, label } = data;
   const bgRgb = hexToRgb(nodeProperties.color);
   const borderRgb = hexToRgb(nodeProperties.borderColor);
@@ -68,7 +74,7 @@ export default function TextNode({ id, data, selected }: TextNodeProps) {
 
   return (
     <>
-      {showStyleBar && (
+      {isOwner && (
         <NodeToolbar isVisible={selected} position={Position.Top}>
           <StyleBar
             nodeProperties={nodeProperties}
@@ -83,29 +89,13 @@ export default function TextNode({ id, data, selected }: TextNodeProps) {
         </NodeToolbar>
       )}
 
-      <NodeToolbar position={Position.Right}>
-        <div className="mt-2">
-          <Button
-            variant="ghost"
-            size="sm"
-            onClick={() => setShowStyleBar(!showStyleBar)}
-            className="h-7 w-7 p-1"
-          >
-            {showStyleBar ? (
-              <Eye className="h-4 w-4" />
-            ) : (
-              <EyeOff className="h-4 w-4" />
-            )}
-          </Button>
-        </div>
-      </NodeToolbar>
-
       <NodeResizer
         color="#3859ff"
         isVisible={selected}
         minWidth={100}
         minHeight={50}
       />
+
       <div className="h-full w-full">
         <div
           className="flex h-full w-full items-center justify-center p-4"