From bc967d2c5906bfb1bffeecb22098a213f0982c45 Mon Sep 17 00:00:00 2001
From: jack5341 <nedim.akar53411@gmail.com>
Date: Wed, 22 Oct 2025 22:06:52 +0200
Subject: [PATCH 1/5] fix: liveSocket init and update navbar to use link
 component to solve span error problem.

---
 src/flagd-ui/assets/js/app.js                      |  3 ++-
 src/flagd-ui/lib/flagd_ui_web/components/navbar.ex | 12 ++++++------
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/flagd-ui/assets/js/app.js b/src/flagd-ui/assets/js/app.js
index f45314c34d..9e55ffbe92 100644
--- a/src/flagd-ui/assets/js/app.js
+++ b/src/flagd-ui/assets/js/app.js
@@ -10,7 +10,8 @@ import topbar from "../vendor/topbar"
 
 const csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
 const rootPath = document.querySelector("meta[name='root-path']").getAttribute("content")
-const liveSocket = new LiveSocket(rootPath === '/' ? '/live' : `${rootPath}live`, Socket, {
+const livePath = rootPath === '/' ? '/live' : `${rootPath}/live`
+const liveSocket = new LiveSocket(livePath, Socket, {
   longPollFallbackMs: 2500,
   params: {_csrf_token: csrfToken}
 })
diff --git a/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex b/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex
index b224f51572..ca588702b5 100644
--- a/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex
+++ b/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex
@@ -11,19 +11,19 @@ defmodule FlagdUiWeb.Components.Navbar do
     ~H"""
     <nav class="bg-gray-800 p-4 sm:p-6">
       <div class="container mx-auto flex items-center justify-between">
-        <a href="/feature" class="text-xl font-bold text-white">
+        <.link navigate={~p"/"} class="text-xl font-bold text-white">
           Flagd Configurator
-        </a>
+        </.link>
         <ul class="flex space-x-2 sm:space-x-4">
           <li>
-            <a href="/feature" class={classes("basic", @mode)}>
+            <.link navigate={~p"/"} class={classes("basic", @mode)}>
               Basic
-            </a>
+            </.link>
           </li>
           <li>
-            <a href="/feature/advanced" class={classes("advanced", @mode)}>
+            <.link navigate={~p"/advanced"} class={classes("advanced", @mode)}>
               Advanced
-            </a>
+            </.link>
           </li>
         </ul>
       </div>

From ffaa6e043512bbd250a3e27b48c4512ce2c48db8 Mon Sep 17 00:00:00 2001
From: jack5341 <nedim.akar53411@gmail.com>
Date: Wed, 22 Oct 2025 22:14:20 +0200
Subject: [PATCH 2/5] update document

---
 CHANGELOG.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 66d0603ccc..ca18965ee9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -16,6 +16,8 @@ the release.
 * [chore] Upgrade OpenFeature and add fix deprecation warnings for dependency
   injection
   ([#2644](https://github.com/open-telemetry/opentelemetry-demo/pull/2644))
+* [chore] Fix flagd-ui span error
+  ([#2615](https://github.com/open-telemetry/opentelemetry-demo/pull/2677))
 
 ## 2.1.3
 

From 90693a9e5b7003a58f0fbe9a38bb592825db2c24 Mon Sep 17 00:00:00 2001
From: jack5341 <nedim.akar53411@gmail.com>
Date: Thu, 23 Oct 2025 17:21:50 +0200
Subject: [PATCH 3/5] feat(envoy): add timeout configuration for flagd-ui
 cluster

---
 src/frontend-proxy/envoy.tmpl.yaml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/frontend-proxy/envoy.tmpl.yaml b/src/frontend-proxy/envoy.tmpl.yaml
index 9e708a8816..68cdf90a50 100644
--- a/src/frontend-proxy/envoy.tmpl.yaml
+++ b/src/frontend-proxy/envoy.tmpl.yaml
@@ -197,6 +197,7 @@ static_resources:
     - name: flagd-ui
       type: STRICT_DNS
       lb_policy: ROUND_ROBIN
+      timeout: 0s
       load_assignment:
         cluster_name: flagd-ui
         endpoints:

From d778a0901ca9c0379f23adef34126e7b518a44cd Mon Sep 17 00:00:00 2001
From: jack5341 <nedim.akar53411@gmail.com>
Date: Fri, 24 Oct 2025 15:48:58 +0200
Subject: [PATCH 4/5] fix(envoy): remove timeout configuration for flagd-ui
 cluster; update otelcol-config.yml to set span status code for HTTP 101

---
 src/frontend-proxy/envoy.tmpl.yaml    | 1 -
 src/otel-collector/otelcol-config.yml | 1 +
 2 files changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/frontend-proxy/envoy.tmpl.yaml b/src/frontend-proxy/envoy.tmpl.yaml
index 68cdf90a50..9e708a8816 100644
--- a/src/frontend-proxy/envoy.tmpl.yaml
+++ b/src/frontend-proxy/envoy.tmpl.yaml
@@ -197,7 +197,6 @@ static_resources:
     - name: flagd-ui
       type: STRICT_DNS
       lb_policy: ROUND_ROBIN
-      timeout: 0s
       load_assignment:
         cluster_name: flagd-ui
         endpoints:
diff --git a/src/otel-collector/otelcol-config.yml b/src/otel-collector/otelcol-config.yml
index bb4a33f777..5e0f1a3f15 100644
--- a/src/otel-collector/otelcol-config.yml
+++ b/src/otel-collector/otelcol-config.yml
@@ -150,6 +150,7 @@ processors:
           # could be removed when https://github.com/vercel/next.js/pull/64852 is fixed upstream
           - replace_pattern(name, "\\?.*", "")
           - replace_match(name, "GET /api/products/*", "GET /api/products/{productId}")
+          - set(span.status.code, STATUS_CODE_UNSET) where span.attributes["http.status_code"] == 101
 
 connectors:
   spanmetrics:

From 1636aab949faf99bfaca0cba0bcb22f75e95bfee Mon Sep 17 00:00:00 2001
From: jack5341 <nedim.akar53411@gmail.com>
Date: Fri, 24 Oct 2025 15:58:29 +0200
Subject: [PATCH 5/5] revert: bringed back unnecessary changes.

---
 src/flagd-ui/assets/js/app.js                      |  4 +---
 src/flagd-ui/lib/flagd_ui_web/components/navbar.ex | 12 ++++++------
 2 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/src/flagd-ui/assets/js/app.js b/src/flagd-ui/assets/js/app.js
index 9e55ffbe92..fab5748f42 100644
--- a/src/flagd-ui/assets/js/app.js
+++ b/src/flagd-ui/assets/js/app.js
@@ -10,8 +10,7 @@ import topbar from "../vendor/topbar"
 
 const csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
 const rootPath = document.querySelector("meta[name='root-path']").getAttribute("content")
-const livePath = rootPath === '/' ? '/live' : `${rootPath}/live`
-const liveSocket = new LiveSocket(livePath, Socket, {
+const liveSocket = new LiveSocket(rootPath === '/' ? '/live' : `${rootPath}live`, Socket, {
   longPollFallbackMs: 2500,
   params: {_csrf_token: csrfToken}
 })
@@ -64,4 +63,3 @@ if (process.env.NODE_ENV === "development") {
     window.liveReloader = reloader
   })
 }
-
diff --git a/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex b/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex
index ca588702b5..b224f51572 100644
--- a/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex
+++ b/src/flagd-ui/lib/flagd_ui_web/components/navbar.ex
@@ -11,19 +11,19 @@ defmodule FlagdUiWeb.Components.Navbar do
     ~H"""
     <nav class="bg-gray-800 p-4 sm:p-6">
       <div class="container mx-auto flex items-center justify-between">
-        <.link navigate={~p"/"} class="text-xl font-bold text-white">
+        <a href="/feature" class="text-xl font-bold text-white">
           Flagd Configurator
-        </.link>
+        </a>
         <ul class="flex space-x-2 sm:space-x-4">
           <li>
-            <.link navigate={~p"/"} class={classes("basic", @mode)}>
+            <a href="/feature" class={classes("basic", @mode)}>
               Basic
-            </.link>
+            </a>
           </li>
           <li>
-            <.link navigate={~p"/advanced"} class={classes("advanced", @mode)}>
+            <a href="/feature/advanced" class={classes("advanced", @mode)}>
               Advanced
-            </.link>
+            </a>
           </li>
         </ul>
       </div>