@kimuson/claude-code-viewer 0.4.4 → 0.4.6

package/dist/main.js

@@ -6,7 +6,7 @@ import { resolve as resolve6 } from "node:path";
 import { NodeContext as NodeContext2 } from "@effect/platform-node";
 import { serve } from "@hono/node-server";
 import { serveStatic } from "@hono/node-server/serve-static";
-import { Effect as Effect38 } from "effect";
+import { Effect as Effect39 } from "effect";
 
 // src/server/core/claude-code/presentation/ClaudeCodeController.ts
 import { FileSystem as FileSystem4, Path as Path6 } from "@effect/platform";
@@ -382,40 +382,70 @@ var FileHistorySnapshotEntrySchema = z11.object({
 });
 
 // src/lib/conversation-schema/entry/QueueOperationEntrySchema.ts
+import { z as z13 } from "zod";
+
+// src/lib/conversation-schema/content/DocumentContentSchema.ts
 import { z as z12 } from "zod";
-var QueueOperationEntrySchema = z12.union([
-  z12.object({
-    type: z12.literal("queue-operation"),
-    operation: z12.literal("enqueue"),
-    content: z12.string(),
-    sessionId: z12.string(),
-    timestamp: z12.iso.datetime()
+var DocumentContentSchema = z12.object({
+  type: z12.literal("document"),
+  source: z12.union([
+    z12.object({
+      media_type: z12.literal("text/plain"),
+      type: z12.literal("text"),
+      data: z12.string()
+    }),
+    z12.object({
+      media_type: z12.enum(["application/pdf"]),
+      type: z12.literal("base64"),
+      data: z12.string()
+    })
+  ])
+});
+
+// src/lib/conversation-schema/entry/QueueOperationEntrySchema.ts
+var QueueOperationContentSchema = z13.union([
+  z13.string(),
+  TextContentSchema,
+  ToolResultContentSchema,
+  ImageContentSchema,
+  DocumentContentSchema
+]);
+var QueueOperationEntrySchema = z13.union([
+  z13.object({
+    type: z13.literal("queue-operation"),
+    operation: z13.literal("enqueue"),
+    content: z13.union([
+      z13.string(),
+      z13.array(z13.union([z13.string(), QueueOperationContentSchema]))
+    ]),
+    sessionId: z13.string(),
+    timestamp: z13.iso.datetime()
   }),
-  z12.object({
-    type: z12.literal("queue-operation"),
-    operation: z12.literal("dequeue"),
-    sessionId: z12.string(),
-    timestamp: z12.iso.datetime()
+  z13.object({
+    type: z13.literal("queue-operation"),
+    operation: z13.literal("dequeue"),
+    sessionId: z13.string(),
+    timestamp: z13.iso.datetime()
   })
 ]);
 
 // src/lib/conversation-schema/entry/SummaryEntrySchema.ts
-import { z as z13 } from "zod";
-var SummaryEntrySchema = z13.object({
-  type: z13.literal("summary"),
-  summary: z13.string(),
-  leafUuid: z13.string().uuid()
+import { z as z14 } from "zod";
+var SummaryEntrySchema = z14.object({
+  type: z14.literal("summary"),
+  summary: z14.string(),
+  leafUuid: z14.string().uuid()
 });
 
 // src/lib/conversation-schema/entry/SystemEntrySchema.ts
-import { z as z14 } from "zod";
+import { z as z15 } from "zod";
 var SystemEntrySchema = BaseEntrySchema.extend({
   // discriminator
-  type: z14.literal("system"),
+  type: z15.literal("system"),
   // required
-  content: z14.string(),
-  toolUseID: z14.string(),
-  level: z14.enum(["info"])
+  content: z15.string(),
+  toolUseID: z15.string(),
+  level: z15.enum(["info"])
 });
 
 // src/lib/conversation-schema/entry/UserEntrySchema.ts
@@ -423,26 +453,6 @@ import { z as z17 } from "zod";
 
 // src/lib/conversation-schema/message/UserMessageSchema.ts
 import { z as z16 } from "zod";
-
-// src/lib/conversation-schema/content/DocumentContentSchema.ts
-import { z as z15 } from "zod";
-var DocumentContentSchema = z15.object({
-  type: z15.literal("document"),
-  source: z15.union([
-    z15.object({
-      media_type: z15.literal("text/plain"),
-      type: z15.literal("text"),
-      data: z15.string()
-    }),
-    z15.object({
-      media_type: z15.enum(["application/pdf"]),
-      type: z15.literal("base64"),
-      data: z15.string()
-    })
-  ])
-});
-
-// src/lib/conversation-schema/message/UserMessageSchema.ts
 var UserMessageContentSchema = z16.union([
   z16.string(),
   TextContentSchema,
@@ -1181,13 +1191,64 @@ import { Context as Context17, Effect as Effect20, Layer as Layer18 } from "effe
 
 // src/server/core/platform/services/UserConfigService.ts
 import { Context as Context11, Effect as Effect13, Layer as Layer12, Ref as Ref5 } from "effect";
+
+// src/lib/i18n/localeDetection.ts
+var DEFAULT_LOCALE = "en";
+var normalizeTag = (tag) => {
+  if (!tag) {
+    return void 0;
+  }
+  const normalized = tag.trim().toLowerCase().replaceAll("_", "-");
+  if (normalized.length === 0 || normalized === "*") {
+    return void 0;
+  }
+  if (normalized.startsWith("zh")) {
+    return "zh_CN";
+  }
+  if (normalized.startsWith("ja") || normalized.startsWith("jp")) {
+    return "ja";
+  }
+  if (normalized.startsWith("en")) {
+    return "en";
+  }
+  return void 0;
+};
+var detectLocaleFromAcceptLanguage = (header) => {
+  if (!header) {
+    return void 0;
+  }
+  const preferences = header.split(",").map((part, index) => {
+    const [rawTag, ...params] = part.trim().split(";");
+    const qParam = params.map((param) => param.trim()).find((param) => param.startsWith("q="));
+    const quality = qParam ? Number.parseFloat(qParam.slice(2)) : 1;
+    return {
+      tag: rawTag,
+      quality: Number.isNaN(quality) ? 1 : quality,
+      index
+    };
+  }).filter((item) => Boolean(item.tag)).sort((a, b) => {
+    if (b.quality !== a.quality) {
+      return b.quality - a.quality;
+    }
+    return a.index - b.index;
+  });
+  for (const preference of preferences) {
+    const locale = normalizeTag(preference.tag);
+    if (locale) {
+      return locale;
+    }
+  }
+  return void 0;
+};
+
+// src/server/core/platform/services/UserConfigService.ts
 var LayerImpl10 = Effect13.gen(function* () {
   const configRef = yield* Ref5.make({
     hideNoUserMessageSession: true,
     unifySameTitleSession: false,
     enterKeyBehavior: "shift-enter-send",
     permissionMode: "default",
-    locale: "ja",
+    locale: DEFAULT_LOCALE,
     theme: "system"
   });
   const setUserConfig = (newConfig) => Effect13.gen(function* () {
@@ -1377,6 +1438,97 @@ var VirtualConversationDatabase = class extends Context12.Tag(
 import { FileSystem as FileSystem5 } from "@effect/platform";
 import { Context as Context13, Effect as Effect15, Layer as Layer14, Ref as Ref7 } from "effect";
 
+// src/server/core/session/constants/pricing.ts
+var MODEL_PRICING = {
+  "claude-3.5-sonnet": {
+    input: 3,
+    output: 15,
+    cache_creation: 3.75,
+    cache_read: 0.3
+  },
+  "claude-3-opus": {
+    input: 15,
+    output: 75,
+    cache_creation: 18.75,
+    cache_read: 1.5
+  },
+  "claude-3-haiku": {
+    input: 0.25,
+    output: 1.25,
+    cache_creation: 0.3,
+    cache_read: 0.03
+  },
+  "claude-instant-1.2": {
+    input: 1.63,
+    output: 5.51,
+    cache_creation: 2.0375,
+    // 1.63 * 1.25
+    cache_read: 0.163
+    // 1.63 * 0.1
+  },
+  "claude-2": {
+    input: 8,
+    output: 24,
+    cache_creation: 10,
+    // 8.0 * 1.25
+    cache_read: 0.8
+    // 8.0 * 0.1
+  }
+};
+var DEFAULT_MODEL_PRICING = MODEL_PRICING["claude-3.5-sonnet"];
+
+// src/server/core/session/functions/calculateSessionCost.ts
+function normalizeModelName(modelName) {
+  const normalized = modelName.toLowerCase();
+  if (normalized.includes("sonnet-4") || normalized.includes("3-5-sonnet") || normalized.includes("3.5-sonnet")) {
+    return "claude-3.5-sonnet";
+  }
+  if (normalized.includes("3-opus") || normalized.includes("opus-20")) {
+    return "claude-3-opus";
+  }
+  if (normalized.includes("3-haiku") || normalized.includes("haiku-20")) {
+    return "claude-3-haiku";
+  }
+  if (normalized.includes("instant-1.2") || normalized.includes("instant-1")) {
+    return "claude-instant-1.2";
+  }
+  if (normalized.startsWith("claude-2")) {
+    return "claude-2";
+  }
+  return "claude-3.5-sonnet";
+}
+function getModelPricing(modelName) {
+  const normalized = normalizeModelName(modelName);
+  return MODEL_PRICING[normalized] ?? DEFAULT_MODEL_PRICING;
+}
+function calculateTokenCost(usage, modelName) {
+  const pricing = getModelPricing(modelName);
+  const inputMTok = usage.input_tokens / 1e6;
+  const outputMTok = usage.output_tokens / 1e6;
+  const cacheCreationMTok = (usage.cache_creation_input_tokens ?? 0) / 1e6;
+  const cacheReadMTok = (usage.cache_read_input_tokens ?? 0) / 1e6;
+  const inputTokensUsd = inputMTok * pricing.input;
+  const outputTokensUsd = outputMTok * pricing.output;
+  const cacheCreationUsd = cacheCreationMTok * pricing.cache_creation;
+  const cacheReadUsd = cacheReadMTok * pricing.cache_read;
+  const totalUsd = inputTokensUsd + outputTokensUsd + cacheCreationUsd + cacheReadUsd;
+  return {
+    totalUsd,
+    breakdown: {
+      inputTokensUsd,
+      outputTokensUsd,
+      cacheCreationUsd,
+      cacheReadUsd
+    },
+    tokenUsage: {
+      inputTokens: usage.input_tokens,
+      outputTokens: usage.output_tokens,
+      cacheCreationTokens: usage.cache_creation_input_tokens ?? 0,
+      cacheReadTokens: usage.cache_read_input_tokens ?? 0
+    }
+  };
+}
+
 // src/server/core/session/functions/extractFirstUserText.ts
 var extractFirstUserText = (conversation) => {
   if (conversation.type !== "user") {
@@ -1463,6 +1615,68 @@ var SessionMetaService = class extends Context13.Tag("SessionMetaService")() {
           }
           return firstUserMessage;
         });
+        const aggregateTokenUsageAndCost = (content) => {
+          let totalInputTokens = 0;
+          let totalOutputTokens = 0;
+          let totalCacheCreationTokens = 0;
+          let totalCacheReadTokens = 0;
+          let totalInputTokensUsd = 0;
+          let totalOutputTokensUsd = 0;
+          let totalCacheCreationUsd = 0;
+          let totalCacheReadUsd = 0;
+          let lastModelName = "claude-3.5-sonnet";
+          const conversations = parseJsonl(content);
+          for (const conversation of conversations) {
+            if (conversation.type === "assistant") {
+              const usage = conversation.message.usage;
+              const modelName = conversation.message.model;
+              const messageCost = calculateTokenCost(
+                {
+                  input_tokens: usage.input_tokens,
+                  output_tokens: usage.output_tokens,
+                  cache_creation_input_tokens: usage.cache_creation_input_tokens ?? 0,
+                  cache_read_input_tokens: usage.cache_read_input_tokens ?? 0
+                },
+                modelName
+              );
+              totalInputTokens += usage.input_tokens;
+              totalOutputTokens += usage.output_tokens;
+              totalCacheCreationTokens += usage.cache_creation_input_tokens ?? 0;
+              totalCacheReadTokens += usage.cache_read_input_tokens ?? 0;
+              totalInputTokensUsd += messageCost.breakdown.inputTokensUsd;
+              totalOutputTokensUsd += messageCost.breakdown.outputTokensUsd;
+              totalCacheCreationUsd += messageCost.breakdown.cacheCreationUsd;
+              totalCacheReadUsd += messageCost.breakdown.cacheReadUsd;
+              lastModelName = modelName;
+            }
+          }
+          const totalCost = {
+            totalUsd: totalInputTokensUsd + totalOutputTokensUsd + totalCacheCreationUsd + totalCacheReadUsd,
+            breakdown: {
+              inputTokensUsd: totalInputTokensUsd,
+              outputTokensUsd: totalOutputTokensUsd,
+              cacheCreationUsd: totalCacheCreationUsd,
+              cacheReadUsd: totalCacheReadUsd
+            },
+            tokenUsage: {
+              inputTokens: totalInputTokens,
+              outputTokens: totalOutputTokens,
+              cacheCreationTokens: totalCacheCreationTokens,
+              cacheReadTokens: totalCacheReadTokens
+            }
+          };
+          const aggregatedUsage = {
+            input_tokens: totalInputTokens,
+            output_tokens: totalOutputTokens,
+            cache_creation_input_tokens: totalCacheCreationTokens,
+            cache_read_input_tokens: totalCacheReadTokens
+          };
+          return {
+            totalUsage: aggregatedUsage,
+            totalCost,
+            modelName: lastModelName
+          };
+        };
         const getSessionMeta = (projectId, sessionId) => Effect15.gen(function* () {
           const metaCache = yield* Ref7.get(sessionMetaCacheRef);
           const cached = metaCache.get(sessionId);
@@ -1476,9 +1690,15 @@ var SessionMetaService = class extends Context13.Tag("SessionMetaService")() {
             sessionPath,
             lines
           );
+          const { totalCost } = aggregateTokenUsageAndCost(content);
           const sessionMeta = {
             messageCount: lines.length,
-            firstUserMessage
+            firstUserMessage,
+            cost: {
+              totalUsd: totalCost.totalUsd,
+              breakdown: totalCost.breakdown,
+              tokenUsage: totalCost.tokenUsage
+            }
           };
           yield* Ref7.update(sessionMetaCacheRef, (cache) => {
             cache.set(sessionId, sessionMeta);
@@ -1569,7 +1789,22 @@ var LayerImpl11 = Effect16.gen(function* () {
         jsonlFilePath: `${decodeProjectId(projectId)}/${sessionId}.jsonl`,
         meta: {
           messageCount: 0,
-          firstUserMessage: null
+          firstUserMessage: null,
+          cost: {
+            totalUsd: 0,
+            breakdown: {
+              inputTokensUsd: 0,
+              outputTokensUsd: 0,
+              cacheCreationUsd: 0,
+              cacheReadUsd: 0
+            },
+            tokenUsage: {
+              inputTokens: 0,
+              outputTokens: 0,
+              cacheCreationTokens: 0,
+              cacheReadTokens: 0
+            }
+          }
         },
         conversations: virtualConversation.conversations,
         lastModifiedAt: lastConversation !== void 0 ? new Date(lastConversation.timestamp) : /* @__PURE__ */ new Date()
@@ -1670,7 +1905,22 @@ var LayerImpl11 = Effect16.gen(function* () {
         lastModifiedAt: last !== void 0 ? new Date(last.timestamp) : /* @__PURE__ */ new Date(),
         meta: {
           messageCount: conversations.length,
-          firstUserMessage: firstUserText ? parseUserMessage(firstUserText) : null
+          firstUserMessage: firstUserText ? parseUserMessage(firstUserText) : null,
+          cost: {
+            totalUsd: 0,
+            breakdown: {
+              inputTokensUsd: 0,
+              outputTokensUsd: 0,
+              cacheCreationUsd: 0,
+              cacheReadUsd: 0
+            },
+            tokenUsage: {
+              inputTokens: 0,
+              outputTokens: 0,
+              cacheCreationTokens: 0,
+              cacheReadTokens: 0
+            }
+          }
         }
       };
     }).sort((a, b) => {
@@ -4740,10 +4990,791 @@ var SchedulerController = class extends Context28.Tag("SchedulerController")() {
 };
 
 // src/server/core/session/presentation/SessionController.ts
-import { Context as Context29, Effect as Effect34, Layer as Layer30 } from "effect";
-var LayerImpl23 = Effect34.gen(function* () {
+import { Context as Context29, Effect as Effect35, Layer as Layer30 } from "effect";
+
+// src/server/core/session/services/ExportService.ts
+import { Effect as Effect34 } from "effect";
+var escapeHtml = (text) => {
+  const map = {
+    "&": "&",
+    "<": "&lt;",
+    ">": "&gt;",
+    '"': "&quot;",
+    "'": "&#039;"
+  };
+  return text.replace(/[&<>"']/g, (char) => map[char] ?? char);
+};
+var formatJsonWithNewlines = (obj) => {
+  const jsonString = JSON.stringify(obj, null, 2);
+  return jsonString.replace(/\\n/g, "\n").replace(/\\t/g, "	").replace(/\\r/g, "\r");
+};
+var formatTimestamp = (timestamp) => {
+  const date = new Date(timestamp);
+  return date.toLocaleString("en-US", {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit"
+  });
+};
+var renderMarkdown = (content) => {
+  let html = escapeHtml(content);
+  html = html.replace(
+    /```(\w+)?\n([\s\S]*?)```/g,
+    (_match, lang, code) => `
+    <div class="code-block">
+      ${lang ? `<div class="code-header"><span class="code-lang">${escapeHtml(lang.toUpperCase())}</span></div>` : ""}
+      <pre><code class="language-${escapeHtml(lang || "text")}">${code.trim()}</code></pre>
+    </div>
+  `
+  );
+  html = html.replace(/`([^`]+)`/g, '<code class="inline-code">$1</code>');
+  html = html.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>");
+  html = html.replace(/\*(.+?)\*/g, "<em>$1</em>");
+  html = html.replace(/^### (.+)$/gm, '<h3 class="markdown-h3">$1</h3>');
+  html = html.replace(/^## (.+)$/gm, '<h2 class="markdown-h2">$1</h2>');
+  html = html.replace(/^# (.+)$/gm, '<h1 class="markdown-h1">$1</h1>');
+  html = html.replace(
+    /\[([^\]]+)\]\(([^)]+)\)/g,
+    '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'
+  );
+  html = html.split("\n\n").map((para) => {
+    if (para.startsWith("<h") || para.startsWith("<div") || para.startsWith("<pre") || para.trim() === "") {
+      return para;
+    }
+    return `<p class="markdown-p">${para.replace(/\n/g, "<br>")}</p>`;
+  }).join("\n");
+  return html;
+};
+var renderUserEntry = (entry) => {
+  const contentArray = Array.isArray(entry.message.content) ? entry.message.content : [entry.message.content];
+  const contentHtml = contentArray.map((msg) => {
+    if (typeof msg === "string") {
+      return `<div class="markdown-content">${renderMarkdown(msg)}</div>`;
+    }
+    if (msg.type === "text") {
+      return `<div class="markdown-content">${renderMarkdown(msg.text)}</div>`;
+    }
+    if (msg.type === "image") {
+      return `<img src="data:${msg.source.media_type};base64,${msg.source.data}" alt="User uploaded image" class="message-image" />`;
+    }
+    if (msg.type === "document") {
+      return `<div class="document-content"><strong>Document:</strong> ${escapeHtml(msg.source.media_type)}</div>`;
+    }
+    if (msg.type === "tool_result") {
+      return "";
+    }
+    return "";
+  }).join("");
+  if (!contentHtml.trim()) {
+    return "";
+  }
+  return `
+    <div class="conversation-entry user-entry">
+      <div class="entry-header">
+        <span class="entry-role">User</span>
+        <span class="entry-timestamp">${formatTimestamp(entry.timestamp)}</span>
+      </div>
+      <div class="entry-content">
+        ${contentHtml}
+      </div>
+    </div>
+  `;
+};
+var renderAssistantEntry = (entry) => {
+  const contentHtml = entry.message.content.map((msg) => {
+    if (msg.type === "text") {
+      return `<div class="markdown-content">${renderMarkdown(msg.text)}</div>`;
+    }
+    if (msg.type === "thinking") {
+      const charCount = msg.thinking.length;
+      return `
+          <div class="thinking-block collapsible">
+            <div class="thinking-header collapsible-trigger">
+              <svg class="icon-lightbulb" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M12 2v1m0 18v1m9-10h1M2 12H1m17.66-7.66l.71.71M3.63 20.37l.71.71m0-14.14l-.71.71m17.02 12.73l-.71.71M12 7a5 5 0 0 1 5 5 5 5 0 0 1-1.47 3.53c-.6.6-.94 1.42-.94 2.27V18a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1v-.2c0-.85-.34-1.67-.94-2.27A5 5 0 0 1 7 12a5 5 0 0 1 5-5Z"/>
+              </svg>
+              <span class="thinking-title">Thinking</span>
+              <span class="expand-hint">(${charCount} characters \xB7 click to collapse)</span>
+              <svg class="icon-chevron" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <polyline points="6 9 12 15 18 9"></polyline>
+              </svg>
+            </div>
+            <div class="thinking-content collapsible-content">
+              <pre class="thinking-text">${escapeHtml(msg.thinking)}</pre>
+            </div>
+          </div>
+        `;
+    }
+    if (msg.type === "tool_use") {
+      const inputKeys = Object.keys(msg.input).length;
+      return `
+          <div class="tool-use-block collapsible">
+            <div class="tool-use-header collapsible-trigger">
+              <svg class="icon-wrench" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/>
+              </svg>
+              <span class="tool-name">${escapeHtml(msg.name)}</span>
+              <span class="expand-hint">(${inputKeys} parameter${inputKeys !== 1 ? "s" : ""} \xB7 click to collapse)</span>
+              <svg class="icon-chevron" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <polyline points="6 9 12 15 18 9"></polyline>
+              </svg>
+            </div>
+            <div class="tool-use-content collapsible-content">
+              <div class="tool-id"><strong>Tool ID:</strong> <code>${escapeHtml(msg.id)}</code></div>
+              <div class="tool-input">
+                <strong>Input Parameters:</strong>
+                <pre class="json-input">${escapeHtml(formatJsonWithNewlines(msg.input))}</pre>
+              </div>
+            </div>
+          </div>
+        `;
+    }
+    return "";
+  }).join("");
+  return `
+    <div class="conversation-entry assistant-entry">
+      <div class="entry-header">
+        <span class="entry-role">Assistant</span>
+        <span class="entry-timestamp">${formatTimestamp(entry.timestamp)}</span>
+      </div>
+      <div class="entry-content">
+        ${contentHtml}
+      </div>
+    </div>
+  `;
+};
+var renderSystemEntry = (entry) => {
+  return `
+    <div class="conversation-entry system-entry">
+      <div class="entry-header">
+        <span class="entry-role">System</span>
+        <span class="entry-timestamp">${formatTimestamp(entry.timestamp)}</span>
+      </div>
+      <div class="entry-content">
+        <div class="system-message">${escapeHtml(entry.content)}</div>
+      </div>
+    </div>
+  `;
+};
+var groupConsecutiveAssistantMessages = (conversations) => {
+  const grouped = [];
+  let currentGroup = [];
+  for (const conv of conversations) {
+    if (conv.type === "assistant") {
+      currentGroup.push(conv);
+    } else if (conv.type === "user" || conv.type === "system") {
+      if (currentGroup.length > 0) {
+        grouped.push({
+          type: currentGroup.length > 1 ? "grouped" : "single",
+          entries: currentGroup
+        });
+        currentGroup = [];
+      }
+      grouped.push({ type: "single", entries: [conv] });
+    }
+  }
+  if (currentGroup.length > 0) {
+    grouped.push({
+      type: currentGroup.length > 1 ? "grouped" : "single",
+      entries: currentGroup
+    });
+  }
+  return grouped;
+};
+var renderGroupedAssistantEntries = (entries) => {
+  const allContent = entries.flatMap((entry) => entry.message.content);
+  const firstEntry = entries[0];
+  if (!firstEntry) {
+    return "";
+  }
+  const contentHtml = allContent.map((msg) => {
+    if (msg.type === "text") {
+      return `<div class="markdown-content">${renderMarkdown(msg.text)}</div>`;
+    }
+    if (msg.type === "thinking") {
+      const charCount = msg.thinking.length;
+      return `
+          <div class="thinking-block collapsible">
+            <div class="thinking-header collapsible-trigger">
+              <svg class="icon-lightbulb" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M12 2v1m0 18v1m9-10h1M2 12H1m17.66-7.66l.71.71M3.63 20.37l.71.71m0-14.14l-.71.71m17.02 12.73l-.71.71M12 7a5 5 0 0 1 5 5 5 5 0 0 1-1.47 3.53c-.6.6-.94 1.42-.94 2.27V18a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1v-.2c0-.85-.34-1.67-.94-2.27A5 5 0 0 1 7 12a5 5 0 0 1 5-5Z"/>
+              </svg>
+              <span class="thinking-title">Thinking</span>
+              <span class="expand-hint">(${charCount} characters \xB7 click to collapse)</span>
+              <svg class="icon-chevron" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <polyline points="6 9 12 15 18 9"></polyline>
+              </svg>
+            </div>
+            <div class="thinking-content collapsible-content">
+              <pre class="thinking-text">${escapeHtml(msg.thinking)}</pre>
+            </div>
+          </div>
+        `;
+    }
+    if (msg.type === "tool_use") {
+      const inputKeys = Object.keys(msg.input).length;
+      return `
+          <div class="tool-use-block collapsible">
+            <div class="tool-use-header collapsible-trigger">
+              <svg class="icon-wrench" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/>
+              </svg>
+              <span class="tool-name">${escapeHtml(msg.name)}</span>
+              <span class="expand-hint">(${inputKeys} parameter${inputKeys !== 1 ? "s" : ""} \xB7 click to collapse)</span>
+              <svg class="icon-chevron" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <polyline points="6 9 12 15 18 9"></polyline>
+              </svg>
+            </div>
+            <div class="tool-use-content collapsible-content">
+              <div class="tool-id"><strong>Tool ID:</strong> <code>${escapeHtml(msg.id)}</code></div>
+              <div class="tool-input">
+                <strong>Input Parameters:</strong>
+                <pre class="json-input">${escapeHtml(formatJsonWithNewlines(msg.input))}</pre>
+              </div>
+            </div>
+          </div>
+        `;
+    }
+    return "";
+  }).join("");
+  return `
+    <div class="conversation-entry assistant-entry">
+      <div class="entry-header">
+        <span class="entry-role">Assistant</span>
+        <span class="entry-timestamp">${formatTimestamp(firstEntry.timestamp)}</span>
+      </div>
+      <div class="entry-content">
+        ${contentHtml}
+      </div>
+    </div>
+  `;
+};
+var generateSessionHtml = (session, projectId) => Effect34.gen(function* () {
+  const grouped = groupConsecutiveAssistantMessages(session.conversations);
+  const conversationsHtml = grouped.map((group) => {
+    if (group.type === "grouped") {
+      return renderGroupedAssistantEntries(
+        group.entries
+      );
+    }
+    const conv = group.entries[0];
+    if (!conv) {
+      return "";
+    }
+    if (conv.type === "user") {
+      return renderUserEntry(conv);
+    }
+    if (conv.type === "assistant") {
+      return renderAssistantEntry(conv);
+    }
+    if (conv.type === "system") {
+      return renderSystemEntry(conv);
+    }
+    return "";
+  }).filter((html2) => html2 !== "").join("\n");
+  const html = `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Claude Code Session - ${escapeHtml(session.id)}</title>
+  <style>
+    * {
+      margin: 0;
+      padding: 0;
+      box-sizing: border-box;
+    }
+
+    :root {
+      --background: 0 0% 100%;
+      --foreground: 0 0% 3.9%;
+      --muted: 0 0% 96.1%;
+      --muted-foreground: 0 0% 45.1%;
+      --border: 0 0% 89.8%;
+      --primary: 0 0% 9%;
+      --blue-50: 214 100% 97%;
+      --blue-200: 213 97% 87%;
+      --blue-600: 217 91% 60%;
+      --blue-800: 217 91% 35%;
+    }
+
+    body {
+      font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+      line-height: 1.6;
+      color: hsl(var(--foreground));
+      background: hsl(var(--background));
+      padding: 2rem;
+      max-width: 1200px;
+      margin: 0 auto;
+    }
+
+    .header {
+      border-bottom: 1px solid hsl(var(--border));
+      padding-bottom: 2rem;
+      margin-bottom: 2rem;
+    }
+
+    .header h1 {
+      font-size: 2rem;
+      font-weight: 700;
+      margin-bottom: 0.5rem;
+    }
+
+    .header .metadata {
+      color: hsl(var(--muted-foreground));
+      font-size: 0.875rem;
+    }
+
+    .conversation-list {
+      display: flex;
+      flex-direction: column;
+      gap: 1.5rem;
+    }
+
+    .conversation-entry {
+      border-radius: 0.5rem;
+      overflow: hidden;
+    }
+
+    .entry-header {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 0.75rem 1rem;
+      font-size: 0.875rem;
+      font-weight: 500;
+      border-bottom: 1px solid;
+    }
+
+    .entry-timestamp {
+      color: hsl(var(--muted-foreground));
+      font-size: 0.75rem;
+    }
+
+    .entry-content {
+      padding: 1.5rem;
+    }
+
+    /* User entry styles */
+    .user-entry {
+      background: hsl(var(--muted) / 0.3);
+      border: 1px solid hsl(var(--border));
+    }
+
+    .user-entry .entry-header {
+      background: hsl(var(--muted) / 0.5);
+      border-bottom-color: hsl(var(--border));
+    }
+
+    /* Assistant entry styles */
+    .assistant-entry {
+      background: hsl(var(--background));
+      border: 1px solid hsl(var(--border));
+    }
+
+    .assistant-entry .entry-header {
+      background: hsl(var(--muted) / 0.3);
+      border-bottom-color: hsl(var(--border));
+    }
+
+    /* System entry styles */
+    .system-entry {
+      background: hsl(var(--muted) / 0.2);
+      border: 1px dashed hsl(var(--border));
+    }
+
+    .system-entry .entry-header {
+      background: hsl(var(--muted) / 0.4);
+      border-bottom-color: hsl(var(--border));
+    }
+
+    .system-message {
+      font-family: monospace;
+      font-size: 0.875rem;
+      color: hsl(var(--muted-foreground));
+    }
+
+    /* Markdown styles */
+    .markdown-content {
+      width: 100%;
+      margin: 1rem 0.25rem;
+    }
+
+    .markdown-h1 {
+      font-size: 1.875rem;
+      font-weight: 700;
+      margin-bottom: 1.5rem;
+      margin-top: 2rem;
+      padding-bottom: 0.75rem;
+      border-bottom: 1px solid hsl(var(--border));
+    }
+
+    .markdown-h2 {
+      font-size: 1.5rem;
+      font-weight: 600;
+      margin-bottom: 1rem;
+      margin-top: 2rem;
+      padding-bottom: 0.5rem;
+      border-bottom: 1px solid hsl(var(--border) / 0.5);
+    }
+
+    .markdown-h3 {
+      font-size: 1.25rem;
+      font-weight: 600;
+      margin-bottom: 0.75rem;
+      margin-top: 1.5rem;
+    }
+
+    .markdown-p {
+      margin-bottom: 1rem;
+      line-height: 1.75;
+      word-break: break-all;
+    }
+
+    .inline-code {
+      background: hsl(var(--muted) / 0.7);
+      padding: 0.25rem 0.5rem;
+      border-radius: 0.375rem;
+      font-size: 0.875rem;
+      font-family: monospace;
+      border: 1px solid hsl(var(--border));
+    }
+
+    .code-block {
+      position: relative;
+      margin: 1.5rem 0;
+    }
+
+    .code-header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      background: hsl(var(--muted) / 0.3);
+      padding: 0.5rem 1rem;
+      border-bottom: 1px solid hsl(var(--border));
+      border-top-left-radius: 0.5rem;
+      border-top-right-radius: 0.5rem;
+      border: 1px solid hsl(var(--border));
+      border-bottom: none;
+    }
+
+    .code-lang {
+      font-size: 0.75rem;
+      font-weight: 500;
+      color: hsl(var(--muted-foreground));
+      text-transform: uppercase;
+      letter-spacing: 0.05em;
+    }
+
+    .code-block pre {
+      margin: 0;
+      padding: 1rem;
+      background: hsl(var(--muted) / 0.2);
+      border: 1px solid hsl(var(--border));
+      border-top: none;
+      border-bottom-left-radius: 0.5rem;
+      border-bottom-right-radius: 0.5rem;
+      overflow-x: auto;
+    }
+
+    .code-block code {
+      font-family: 'Monaco', 'Courier New', monospace;
+      font-size: 0.875rem;
+      line-height: 1.5;
+    }
+
+    /* Thinking block styles */
+    .thinking-block {
+      background: hsl(var(--muted) / 0.5);
+      border: 2px dashed hsl(var(--border));
+      border-radius: 0.5rem;
+      margin-bottom: 0.5rem;
+      overflow: hidden;
+    }
+
+    .thinking-header {
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+      padding: 0.75rem 1rem;
+      cursor: pointer;
+      background: hsl(var(--muted) / 0.3);
+      transition: background 0.2s;
+    }
+
+    .thinking-header:hover {
+      background: hsl(var(--muted) / 0.5);
+    }
+
+    .icon-lightbulb {
+      color: hsl(var(--muted-foreground));
+      flex-shrink: 0;
+    }
+
+    .thinking-title {
+      font-size: 0.875rem;
+      font-weight: 500;
+    }
+
+    .expand-hint {
+      font-size: 0.75rem;
+      color: hsl(var(--muted-foreground));
+      font-weight: normal;
+      margin-left: 0.5rem;
+    }
+
+    .collapsible:not(.collapsed) .expand-hint {
+      display: none;
+    }
+
+    .icon-chevron {
+      margin-left: auto;
+      color: hsl(var(--muted-foreground));
+      transition: transform 0.2s;
+    }
+
+    .collapsible.collapsed .icon-chevron {
+      transform: rotate(-90deg);
+    }
+
+    .thinking-content {
+      padding: 0.5rem 1rem;
+    }
+
+    .collapsible-content {
+      max-height: 1000px;
+      overflow: hidden;
+      transition: max-height 0.3s ease-out, opacity 0.2s ease-out;
+    }
+
+    .collapsible.collapsed .collapsible-content {
+      max-height: 0;
+      opacity: 0;
+    }
+
+    .thinking-text {
+      font-size: 0.875rem;
+      color: hsl(var(--muted-foreground));
+      font-family: monospace;
+      white-space: pre-wrap;
+      word-break: break-word;
+    }
+
+    /* Tool use block styles */
+    .tool-use-block {
+      border: 1px solid hsl(var(--blue-200));
+      background: hsl(var(--blue-50) / 0.5);
+      border-radius: 0.5rem;
+      margin-bottom: 0.5rem;
+      overflow: hidden;
+    }
+
+    .tool-use-header {
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+      padding: 0.375rem 0.75rem;
+      cursor: pointer;
+      background: hsl(var(--blue-50) / 0.3);
+      transition: background 0.2s;
+    }
+
+    .tool-use-header:hover {
+      background: hsl(var(--blue-50) / 0.6);
+    }
+
+    .icon-wrench {
+      color: hsl(var(--blue-600));
+      flex-shrink: 0;
+    }
+
+    .tool-name {
+      font-size: 0.875rem;
+      font-weight: 500;
+      flex: 1;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .tool-use-content {
+      padding: 0.75rem 1rem;
+      border-top: 1px solid hsl(var(--blue-200));
+      display: flex;
+      flex-direction: column;
+      gap: 0.75rem;
+    }
+
+    .tool-id {
+      font-size: 0.75rem;
+    }
+
+    .tool-id code {
+      background: hsl(var(--background) / 0.5);
+      padding: 0.25rem 0.5rem;
+      border-radius: 0.25rem;
+      border: 1px solid hsl(var(--blue-200));
+      font-family: monospace;
+      font-size: 0.75rem;
+    }
+
+    .tool-input {
+      font-size: 0.75rem;
+    }
+
+    .json-input {
+      background: hsl(var(--background));
+      border: 1px solid hsl(var(--border));
+      border-radius: 0.375rem;
+      padding: 0.75rem;
+      margin-top: 0.5rem;
+      overflow-x: auto;
+      font-family: monospace;
+      font-size: 0.75rem;
+      white-space: pre-wrap;
+      word-break: break-all;
+      overflow-wrap: break-word;
+    }
+
+    .message-image {
+      max-width: 100%;
+      height: auto;
+      border-radius: 0.5rem;
+      margin: 1rem 0;
+    }
+
+    strong {
+      font-weight: 600;
+    }
+
+    em {
+      font-style: italic;
+    }
+
+    a {
+      color: hsl(var(--primary));
+      text-decoration: underline;
+      text-decoration-color: hsl(var(--primary) / 0.3);
+      text-underline-offset: 4px;
+      transition: text-decoration-color 0.2s;
+    }
+
+    a:hover {
+      text-decoration-color: hsl(var(--primary) / 0.6);
+    }
+
+    .header-top {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-bottom: 1rem;
+    }
+
+    .toggle-all-button {
+      padding: 0.5rem 1rem;
+      background: hsl(var(--primary));
+      color: white;
+      border: none;
+      border-radius: 0.375rem;
+      font-size: 0.875rem;
+      font-weight: 500;
+      cursor: pointer;
+      transition: opacity 0.2s;
+    }
+
+    .toggle-all-button:hover {
+      opacity: 0.9;
+    }
+
+    .toggle-all-button:active {
+      opacity: 0.8;
+    }
+
+    .footer {
+      margin-top: 4rem;
+      padding-top: 2rem;
+      border-top: 1px solid hsl(var(--border));
+      text-align: center;
+      color: hsl(var(--muted-foreground));
+      font-size: 0.875rem;
+    }
+  </style>
+</head>
+<body>
+  <div class="header">
+    <div class="header-top">
+      <h1>Claude Code Session Export</h1>
+      <button id="toggle-all-btn" class="toggle-all-button">Collapse All</button>
+    </div>
+    <div class="metadata">
+      <div><strong>Session ID:</strong> ${escapeHtml(session.id)}</div>
+      <div><strong>Project ID:</strong> ${escapeHtml(projectId)}</div>
+      <div><strong>Exported:</strong> ${formatTimestamp(Date.now())}</div>
+      <div><strong>Total Conversations:</strong> ${session.conversations.length}</div>
+    </div>
+  </div>
+
+  <div class="conversation-list">
+    ${conversationsHtml}
+  </div>
+
+  <div class="footer">
+    <p>Exported from Claude Code Viewer</p>
+  </div>
+
+  <script>
+    // Add click handlers for collapsible blocks
+    document.addEventListener('DOMContentLoaded', function() {
+      const triggers = document.querySelectorAll('.collapsible-trigger');
+      const toggleAllBtn = document.getElementById('toggle-all-btn');
+      let allExpanded = true; // Start as expanded since blocks are expanded by default
+
+      // Individual collapsible click handlers
+      triggers.forEach(function(trigger) {
+        trigger.addEventListener('click', function() {
+          const collapsible = this.closest('.collapsible');
+          if (collapsible) {
+            collapsible.classList.toggle('collapsed');
+          }
+        });
+      });
+
+      // Toggle all button
+      if (toggleAllBtn) {
+        toggleAllBtn.addEventListener('click', function() {
+          const collapsibles = document.querySelectorAll('.collapsible');
+
+          if (allExpanded) {
+            // Collapse all
+            collapsibles.forEach(function(collapsible) {
+              collapsible.classList.add('collapsed');
+            });
+            toggleAllBtn.textContent = 'Expand All';
+            allExpanded = false;
+          } else {
+            // Expand all
+            collapsibles.forEach(function(collapsible) {
+              collapsible.classList.remove('collapsed');
+            });
+            toggleAllBtn.textContent = 'Collapse All';
+            allExpanded = true;
+          }
+        });
+      }
+    });
+  </script>
+</body>
+</html>`;
+  return html;
+});
+
+// src/server/core/session/presentation/SessionController.ts
+var LayerImpl23 = Effect35.gen(function* () {
   const sessionRepository = yield* SessionRepository;
-  const getSession = (options) => Effect34.gen(function* () {
+  const getSession = (options) => Effect35.gen(function* () {
     const { projectId, sessionId } = options;
     const { session } = yield* sessionRepository.getSession(
       projectId,
@@ -4754,8 +5785,27 @@ var LayerImpl23 = Effect34.gen(function* () {
       response: { session }
     };
   });
+  const exportSessionHtml = (options) => Effect35.gen(function* () {
+    const { projectId, sessionId } = options;
+    const { session } = yield* sessionRepository.getSession(
+      projectId,
+      sessionId
+    );
+    if (session === null) {
+      return {
+        status: 404,
+        response: { error: "Session not found" }
+      };
+    }
+    const html = yield* generateSessionHtml(session, projectId);
+    return {
+      status: 200,
+      response: { html }
+    };
+  });
   return {
-    getSession
+    getSession,
+    exportSessionHtml
   };
 });
 var SessionController = class extends Context29.Tag("SessionController")() {
@@ -4769,12 +5819,12 @@ import { Hono } from "hono";
 var honoApp = new Hono();
 
 // src/server/hono/initialize.ts
-import { Context as Context30, Effect as Effect35, Layer as Layer31, Ref as Ref11, Schedule as Schedule2 } from "effect";
+import { Context as Context30, Effect as Effect36, Layer as Layer31, Ref as Ref11, Schedule as Schedule2 } from "effect";
 var InitializeService = class extends Context30.Tag("InitializeService")() {
   static {
     this.Live = Layer31.effect(
       this,
-      Effect35.gen(function* () {
+      Effect36.gen(function* () {
         const eventBus = yield* EventBus;
         const fileWatcher = yield* FileWatcherService;
         const projectRepository = yield* ProjectRepository;
@@ -4784,20 +5834,20 @@ var InitializeService = class extends Context30.Tag("InitializeService")() {
         const virtualConversationDatabase = yield* VirtualConversationDatabase;
         const listenersRef = yield* Ref11.make({});
         const startInitialization = () => {
-          return Effect35.gen(function* () {
+          return Effect36.gen(function* () {
             yield* fileWatcher.startWatching();
-            const daemon = Effect35.repeat(
+            const daemon = Effect36.repeat(
               eventBus.emit("heartbeat", {}),
               Schedule2.fixed("10 seconds")
             );
             console.log("start heartbeat");
-            yield* Effect35.forkDaemon(daemon);
+            yield* Effect36.forkDaemon(daemon);
             console.log("after starting heartbeat fork");
             const onSessionChanged = (event) => {
-              Effect35.runFork(
+              Effect36.runFork(
                 projectMetaService.invalidateProject(event.projectId)
               );
-              Effect35.runFork(
+              Effect36.runFork(
                 sessionMetaService.invalidateSession(
                   event.projectId,
                   event.sessionId
@@ -4806,7 +5856,7 @@ var InitializeService = class extends Context30.Tag("InitializeService")() {
             };
             const onSessionProcessChanged = (event) => {
               if ((event.changed.type === "completed" || event.changed.type === "paused") && event.changed.sessionId !== void 0) {
-                Effect35.runFork(
+                Effect36.runFork(
                   virtualConversationDatabase.deleteVirtualConversations(
                     event.changed.sessionId
                   )
@@ -4820,12 +5870,12 @@ var InitializeService = class extends Context30.Tag("InitializeService")() {
             });
             yield* eventBus.on("sessionChanged", onSessionChanged);
             yield* eventBus.on("sessionProcessChanged", onSessionProcessChanged);
-            yield* Effect35.gen(function* () {
+            yield* Effect36.gen(function* () {
               console.log("Initializing projects cache");
               const { projects } = yield* projectRepository.getProjects();
               console.log(`${projects.length} projects cache initialized`);
               console.log("Initializing sessions cache");
-              const results = yield* Effect35.all(
+              const results = yield* Effect36.all(
                 projects.map(
                   (project) => sessionRepository.getSessions(project.id)
                 ),
@@ -4837,12 +5887,12 @@ var InitializeService = class extends Context30.Tag("InitializeService")() {
               );
               console.log(`${totalSessions} sessions cache initialized`);
             }).pipe(
-              Effect35.catchAll(() => Effect35.void),
-              Effect35.withSpan("initialize-cache")
+              Effect36.catchAll(() => Effect36.void),
+              Effect36.withSpan("initialize-cache")
             );
-          }).pipe(Effect35.withSpan("start-initialization"));
+          }).pipe(Effect36.withSpan("start-initialization"));
         };
-        const stopCleanup = () => Effect35.gen(function* () {
+        const stopCleanup = () => Effect36.gen(function* () {
           const listeners = yield* Ref11.get(listenersRef);
           if (listeners.sessionChanged) {
             yield* eventBus.off("sessionChanged", listeners.sessionChanged);
@@ -4867,7 +5917,7 @@ var InitializeService = class extends Context30.Tag("InitializeService")() {
 
 // src/server/hono/route.ts
 import { zValidator } from "@hono/zod-validator";
-import { Effect as Effect37, Runtime as Runtime3 } from "effect";
+import { Effect as Effect38, Runtime as Runtime3 } from "effect";
 import { setCookie as setCookie2 } from "hono/cookie";
 import { streamSSE } from "hono/streaming";
 import prexit from "prexit";
@@ -4876,7 +5926,7 @@ import { z as z28 } from "zod";
 // package.json
 var package_default = {
   name: "@kimuson/claude-code-viewer",
-  version: "0.4.3",
+  version: "0.4.5",
   type: "module",
   license: "MIT",
   repository: {
@@ -4920,8 +5970,8 @@ var package_default = {
     "@anthropic-ai/claude-agent-sdk": "0.1.30",
     "@anthropic-ai/claude-code": "2.0.24",
     "@anthropic-ai/sdk": "0.67.0",
-    "@effect/platform": "0.92.1",
-    "@effect/platform-node": "0.98.4",
+    "@effect/platform": "0.93.2",
+    "@effect/platform-node": "0.100.0",
     "@hono/node-server": "1.19.5",
     "@hono/zod-validator": "0.7.4",
     "@lingui/core": "5.5.1",
@@ -4944,7 +5994,7 @@ var package_default = {
     "class-variance-authority": "0.7.1",
     clsx: "2.1.1",
     "date-fns": "4.1.0",
-    effect: "3.18.4",
+    effect: "3.19.3",
     "es-toolkit": "1.41.0",
     hono: "4.10.3",
     jotai: "2.15.0",
@@ -5138,11 +6188,12 @@ var userConfigSchema = z27.object({
   locale: localeSchema.optional().default("en"),
   theme: z27.enum(["light", "dark", "system"]).optional().default("system")
 });
+var defaultUserConfig = userConfigSchema.parse({});
 
 // src/server/lib/effect/toEffectResponse.ts
-import { Effect as Effect36 } from "effect";
+import { Effect as Effect37 } from "effect";
 var effectToResponse = async (ctx, effect) => {
-  const result = await Effect36.runPromise(effect);
+  const result = await Effect37.runPromise(effect);
   const result2 = ctx.json(result.response, result.status);
   return result2;
 };
@@ -5169,16 +6220,13 @@ var configMiddleware = createMiddleware(
     const cookie = getCookie(c, "ccv-config");
     const parsed = parseUserConfig(cookie);
     if (cookie === void 0) {
+      const preferredLocale = detectLocaleFromAcceptLanguage(c.req.header("accept-language")) ?? DEFAULT_LOCALE;
       setCookie(
         c,
         "ccv-config",
         JSON.stringify({
-          hideNoUserMessageSession: true,
-          unifySameTitleSession: true,
-          enterKeyBehavior: "shift-enter-send",
-          permissionMode: "default",
-          locale: "ja",
-          theme: "system"
+          ...defaultUserConfig,
+          locale: preferredLocale
         })
       );
     }
@@ -5188,7 +6236,7 @@ var configMiddleware = createMiddleware(
 );
 
 // src/server/hono/route.ts
-var routes = (app) => Effect37.gen(function* () {
+var routes = (app) => Effect38.gen(function* () {
   const projectController = yield* ProjectController;
   const sessionController = yield* SessionController;
   const gitController = yield* GitController;
@@ -5203,7 +6251,7 @@ var routes = (app) => Effect37.gen(function* () {
   const userConfigService = yield* UserConfigService;
   const claudeCodeLifeCycleService = yield* ClaudeCodeLifeCycleService;
   const initializeService = yield* InitializeService;
-  const runtime = yield* Effect37.runtime();
+  const runtime = yield* Effect38.runtime();
   if ((yield* envService.getEnv("NEXT_PHASE")) !== "phase-production-build") {
     yield* initializeService.startInitialization();
     prexit(async () => {
@@ -5211,7 +6259,7 @@ var routes = (app) => Effect37.gen(function* () {
     });
   }
   return app.use(configMiddleware).use(async (c, next) => {
-    await Effect37.runPromise(
+    await Effect38.runPromise(
       userConfigService.setUserConfig({
         ...c.get("userConfig")
       })
@@ -5246,7 +6294,7 @@ var routes = (app) => Effect37.gen(function* () {
         projectController.getProject({
           ...c.req.param(),
           ...c.req.valid("query")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5263,7 +6311,7 @@ var routes = (app) => Effect37.gen(function* () {
         c,
         projectController.createProject({
           ...c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5272,21 +6320,30 @@ var routes = (app) => Effect37.gen(function* () {
       c,
       projectController.getProjectLatestSession({
         ...c.req.param()
-      }).pipe(Effect37.provide(runtime))
+      }).pipe(Effect38.provide(runtime))
     );
     return response;
   }).get("/api/projects/:projectId/sessions/:sessionId", async (c) => {
     const response = await effectToResponse(
       c,
-      sessionController.getSession({ ...c.req.param() }).pipe(Effect37.provide(runtime))
+      sessionController.getSession({ ...c.req.param() }).pipe(Effect38.provide(runtime))
     );
     return response;
-  }).get("/api/projects/:projectId/git/current-revisions", async (c) => {
+  }).get(
+    "/api/projects/:projectId/sessions/:sessionId/export",
+    async (c) => {
+      const response = await effectToResponse(
+        c,
+        sessionController.exportSessionHtml({ ...c.req.param() }).pipe(Effect38.provide(runtime))
+      );
+      return response;
+    }
+  ).get("/api/projects/:projectId/git/current-revisions", async (c) => {
     const response = await effectToResponse(
       c,
       gitController.getCurrentRevisions({
         ...c.req.param()
-      }).pipe(Effect37.provide(runtime))
+      }).pipe(Effect38.provide(runtime))
     );
     return response;
   }).post(
@@ -5304,7 +6361,7 @@ var routes = (app) => Effect37.gen(function* () {
         gitController.getGitDiff({
           ...c.req.param(),
           ...c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5317,7 +6374,7 @@ var routes = (app) => Effect37.gen(function* () {
         gitController.commitFiles({
           ...c.req.param(),
           ...c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5330,7 +6387,7 @@ var routes = (app) => Effect37.gen(function* () {
         gitController.pushCommits({
           ...c.req.param(),
           ...c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5343,7 +6400,7 @@ var routes = (app) => Effect37.gen(function* () {
         gitController.commitAndPush({
           ...c.req.param(),
           ...c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5360,19 +6417,19 @@ var routes = (app) => Effect37.gen(function* () {
       c,
       claudeCodeController.getMcpListRoute({
         ...c.req.param()
-      }).pipe(Effect37.provide(runtime))
+      }).pipe(Effect38.provide(runtime))
     );
     return response;
   }).get("/api/cc/meta", async (c) => {
     const response = await effectToResponse(
       c,
-      claudeCodeController.getClaudeCodeMeta().pipe(Effect37.provide(runtime))
+      claudeCodeController.getClaudeCodeMeta().pipe(Effect38.provide(runtime))
     );
     return response;
   }).get("/api/cc/features", async (c) => {
     const response = await effectToResponse(
       c,
-      claudeCodeController.getAvailableFeatures().pipe(Effect37.provide(runtime))
+      claudeCodeController.getAvailableFeatures().pipe(Effect38.provide(runtime))
     );
     return response;
   }).get("/api/cc/session-processes", async (c) => {
@@ -5416,7 +6473,7 @@ var routes = (app) => Effect37.gen(function* () {
         claudeCodeSessionProcessController.continueSessionProcess({
           ...c.req.param(),
           ...c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5425,7 +6482,7 @@ var routes = (app) => Effect37.gen(function* () {
     zValidator("json", z28.object({ projectId: z28.string() })),
     async (c) => {
       const { sessionProcessId } = c.req.param();
-      void Effect37.runFork(
+      void Effect38.runFork(
         claudeCodeLifeCycleService.abortTask(sessionProcessId)
       );
       return c.json({ message: "Task aborted" });
@@ -5453,7 +6510,7 @@ var routes = (app) => Effect37.gen(function* () {
       c,
       async (rawStream) => {
         await Runtime3.runPromise(runtime)(
-          sseController.handleSSE(rawStream).pipe(Effect37.provide(TypeSafeSSE.make(rawStream)))
+          sseController.handleSSE(rawStream).pipe(Effect38.provide(TypeSafeSSE.make(rawStream)))
         );
       },
       async (err) => {
@@ -5463,7 +6520,7 @@ var routes = (app) => Effect37.gen(function* () {
   }).get("/api/scheduler/jobs", async (c) => {
     const response = await effectToResponse(
       c,
-      schedulerController.getJobs().pipe(Effect37.provide(runtime))
+      schedulerController.getJobs().pipe(Effect38.provide(runtime))
     );
     return response;
   }).post(
@@ -5474,7 +6531,7 @@ var routes = (app) => Effect37.gen(function* () {
         c,
         schedulerController.addJob({
           job: c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5487,7 +6544,7 @@ var routes = (app) => Effect37.gen(function* () {
         schedulerController.updateJob({
           id: c.req.param("id"),
           job: c.req.valid("json")
-        }).pipe(Effect37.provide(runtime))
+        }).pipe(Effect38.provide(runtime))
       );
       return response;
     }
@@ -5496,7 +6553,7 @@ var routes = (app) => Effect37.gen(function* () {
       c,
       schedulerController.deleteJob({
         id: c.req.param("id")
-      }).pipe(Effect37.provide(runtime))
+      }).pipe(Effect38.provide(runtime))
     );
     return response;
   }).get(
@@ -5538,7 +6595,7 @@ var routes = (app) => Effect37.gen(function* () {
   ).get("/api/flags", async (c) => {
     const response = await effectToResponse(
       c,
-      featureFlagController.getFlags().pipe(Effect37.provide(runtime))
+      featureFlagController.getFlags().pipe(Effect38.provide(runtime))
     );
     return response;
   });
@@ -5575,42 +6632,42 @@ if (!isDevelopment) {
 }
 var program = routes(honoApp).pipe(
   /** Presentation */
-  Effect38.provide(ProjectController.Live),
-  Effect38.provide(SessionController.Live),
-  Effect38.provide(GitController.Live),
-  Effect38.provide(ClaudeCodeController.Live),
-  Effect38.provide(ClaudeCodeSessionProcessController.Live),
-  Effect38.provide(ClaudeCodePermissionController.Live),
-  Effect38.provide(FileSystemController.Live),
-  Effect38.provide(SSEController.Live),
-  Effect38.provide(SchedulerController.Live),
-  Effect38.provide(FeatureFlagController.Live)
+  Effect39.provide(ProjectController.Live),
+  Effect39.provide(SessionController.Live),
+  Effect39.provide(GitController.Live),
+  Effect39.provide(ClaudeCodeController.Live),
+  Effect39.provide(ClaudeCodeSessionProcessController.Live),
+  Effect39.provide(ClaudeCodePermissionController.Live),
+  Effect39.provide(FileSystemController.Live),
+  Effect39.provide(SSEController.Live),
+  Effect39.provide(SchedulerController.Live),
+  Effect39.provide(FeatureFlagController.Live)
 ).pipe(
   /** Application */
-  Effect38.provide(InitializeService.Live),
-  Effect38.provide(FileWatcherService.Live)
+  Effect39.provide(InitializeService.Live),
+  Effect39.provide(FileWatcherService.Live)
 ).pipe(
   /** Domain */
-  Effect38.provide(ClaudeCodeLifeCycleService.Live),
-  Effect38.provide(ClaudeCodePermissionService.Live),
-  Effect38.provide(ClaudeCodeSessionProcessService.Live),
-  Effect38.provide(ClaudeCodeService.Live),
-  Effect38.provide(GitService.Live),
-  Effect38.provide(SchedulerService.Live),
-  Effect38.provide(SchedulerConfigBaseDir.Live)
+  Effect39.provide(ClaudeCodeLifeCycleService.Live),
+  Effect39.provide(ClaudeCodePermissionService.Live),
+  Effect39.provide(ClaudeCodeSessionProcessService.Live),
+  Effect39.provide(ClaudeCodeService.Live),
+  Effect39.provide(GitService.Live),
+  Effect39.provide(SchedulerService.Live),
+  Effect39.provide(SchedulerConfigBaseDir.Live)
 ).pipe(
   /** Infrastructure */
-  Effect38.provide(ProjectRepository.Live),
-  Effect38.provide(SessionRepository.Live),
-  Effect38.provide(ProjectMetaService.Live),
-  Effect38.provide(SessionMetaService.Live),
-  Effect38.provide(VirtualConversationDatabase.Live)
+  Effect39.provide(ProjectRepository.Live),
+  Effect39.provide(SessionRepository.Live),
+  Effect39.provide(ProjectMetaService.Live),
+  Effect39.provide(SessionMetaService.Live),
+  Effect39.provide(VirtualConversationDatabase.Live)
 ).pipe(
   /** Platform */
-  Effect38.provide(platformLayer),
-  Effect38.provide(NodeContext2.layer)
+  Effect39.provide(platformLayer),
+  Effect39.provide(NodeContext2.layer)
 );
-await Effect38.runPromise(program);
+await Effect39.runPromise(program);
 var port = isDevelopment ? (
   // biome-ignore lint/style/noProcessEnv: allow only here
   process.env.DEV_BE_PORT ?? "3401"