From f858dab0a45899b59031478522d592f37406f103 Mon Sep 17 00:00:00 2001
From: seonghobae <8172694+seonghobae@users.noreply.github.com>
Date: Thu, 11 Jun 2026 08:23:36 +0000
Subject: [PATCH] =?UTF-8?q?feat:=20=EC=9D=B4=EB=A9=94=EC=9D=BC=20=EC=83=81?=
 =?UTF-8?q?=EC=84=B8=EB=B7=B0=EC=97=90=EC=84=9C=20=EC=8B=A4=EC=A0=9C=20LLM?=
 =?UTF-8?q?=20Confidence=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=97=B0?=
 =?UTF-8?q?=EB=8F=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .jules/bolt.md                          | 4 ++++
 frontend/src/components/EmailDetail.tsx | 5 +++--
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/.jules/bolt.md b/.jules/bolt.md
index 33a2536a4..6f6d29b19 100644
--- a/.jules/bolt.md
+++ b/.jules/bolt.md
@@ -43,3 +43,7 @@
 ## 2026-06-10 - Optimize redundant dictionary lookups in tight loops
  **Learning:** Using `dict.setdefault` and multiple `dict.get` or `key in dict` checks inside tight loops significantly impacts performance due to repeated dictionary lookups and unnecessary list allocations. Caching dictionary lookups (e.g., using a single `dict.get(key)`) and conditionally handling the logic based on the result is much more performant.
  **Action:** When aggregating or grouping items in a loop, avoid `setdefault`. Instead, check if the key exists using a single `.get()`, and perform initialization/updates conditionally. Additionally, hoist loop-invariant checks (e.g., `folder == "sent"`) outside the loop to avoid redundant evaluations.
+
+## 2025-02-12 - Handle UI Rendering with Optional Number Values
+**Learning:** When displaying numerical data in React where `0` is a valid number, using truthiness checks like `{value && (<div>{value}%</div>)}` will skip rendering when `value === 0` because `0` is falsy in JavaScript.
+**Action:** When handling optional numerical data (e.g., confidence scores, indices, percentages), always explicitly check for `!== undefined` or `!== null` (e.g., `{confidence !== undefined && (...)}`) instead of relying on generic truthiness to ensure valid `0` values render properly and safely.
diff --git a/frontend/src/components/EmailDetail.tsx b/frontend/src/components/EmailDetail.tsx
index 53970d93d..bd7da779a 100644
--- a/frontend/src/components/EmailDetail.tsx
+++ b/frontend/src/components/EmailDetail.tsx
@@ -26,6 +26,7 @@ type EmailData = ThreadEmailData & {
 interface LlmData {
   summary: string;
   todos: string[];
+  confidence?: number;
 }
 
 interface CreateTasksFromEmailResponse {
@@ -356,7 +357,7 @@ export function EmailDetail({ emailId, actionCommand = null }: { emailId: number
             loading={!llmData && !llmError}
             error={llmError}
             provenance="AI 생성"
-            // TODO: API 연동 시 실제 llmData.confidence 값으로 대체
+            confidence={llmData?.confidence !== undefined ? Math.round(llmData.confidence * 100) : undefined}
           >
             {llmData ? (
               <div className="flex flex-col gap-2">
@@ -378,7 +379,7 @@ export function EmailDetail({ emailId, actionCommand = null }: { emailId: number
             empty={Boolean(llmData && llmData.todos.length === 0)}
             emptyMessage="실행 항목이 없습니다."
             provenance={`${llmData?.todos.length || 0}개 실행 항목`}
-            // TODO: API 연동 시 실제 llmData.confidence 값으로 대체
+            confidence={llmData?.confidence !== undefined ? Math.round(llmData.confidence * 100) : undefined}
             footerActions={llmData && (llmData.todos.length > 0 || syncStatus || taskStatus) ? (
               <>
                 {llmData.todos.length > 0 && (