@impakers/debug 1.0.1 → 1.2.1

package/dist/react.js

@@ -1785,11 +1785,38 @@ async function apiFetch(url, options = {}) {
   }
   return res;
 }
+var cache = /* @__PURE__ */ new Map();
+var CACHE_TTL = 3e4;
+function getCached(key) {
+  const entry = cache.get(key);
+  if (!entry) return null;
+  if (Date.now() - entry.timestamp > CACHE_TTL) {
+    cache.delete(key);
+    return null;
+  }
+  return entry.data;
+}
+function setCache(key, data) {
+  cache.set(key, { data, timestamp: Date.now() });
+}
+function invalidateCache(pattern) {
+  if (!pattern) {
+    cache.clear();
+    return;
+  }
+  for (const key of cache.keys()) {
+    if (key.includes(pattern)) cache.delete(key);
+  }
+}
 async function submitFeedback(endpoint, payload) {
   const res = await apiFetch(endpoint, {
     method: "POST",
     body: JSON.stringify(payload)
   });
+  if (payload.feedbackUrl) {
+    invalidateCache(`feedbacks:${payload.feedbackUrl}`);
+  }
+  invalidateCache("feedbacks:");
   try {
     return await res.json();
   } catch {
@@ -1797,50 +1824,76 @@ async function submitFeedback(endpoint, payload) {
   }
 }
 async function fetchFeedbacks(endpoint, url) {
+  const cacheKey = `feedbacks:${url}`;
+  const cached = getCached(cacheKey);
+  if (cached) return cached;
   const res = await apiFetch(`${endpoint}?url=${encodeURIComponent(url)}`);
   const data = await res.json();
-  return data.tasks || [];
+  const tasks = data.tasks || [];
+  setCache(cacheKey, tasks);
+  return tasks;
 }
 async function fetchComments(endpoint, taskId) {
+  const cacheKey = `comments:${taskId}`;
+  const cached = getCached(cacheKey);
+  if (cached) return cached;
   const res = await apiFetch(`${endpoint}/${taskId}/comments`);
   const data = await res.json();
-  return data.comments || [];
+  const comments = data.comments || [];
+  setCache(cacheKey, comments);
+  return comments;
 }
 async function postComment(endpoint, taskId, content, authorName, authorId) {
+  const tempComment = {
+    id: `temp-${Date.now()}`,
+    content,
+    authorName,
+    authorId,
+    createdAt: (/* @__PURE__ */ new Date()).toISOString()
+  };
+  const cacheKey = `comments:${taskId}`;
+  const existing = getCached(cacheKey) || [];
+  setCache(cacheKey, [...existing, tempComment]);
   const res = await apiFetch(`${endpoint}/${taskId}/comments`, {
     method: "POST",
     body: JSON.stringify({ content, authorName, authorId })
   });
   const data = await res.json();
-  return data.comment;
+  const serverComment = data.comment;
+  const updated = (getCached(cacheKey) || []).map(
+    (c) => c.id === tempComment.id ? serverComment : c
+  );
+  setCache(cacheKey, updated);
+  invalidateCache("feedbacks:");
+  return serverComment;
 }
 
 // src/core/sourcemap-resolver.ts
 var import_trace_mapping = require("@jridgewell/trace-mapping");
-var cache = /* @__PURE__ */ new Map();
+var cache2 = /* @__PURE__ */ new Map();
 var failedUrls = /* @__PURE__ */ new Set();
 function getSourceMapUrl(bundleUrl) {
   if (bundleUrl.endsWith(".map")) return bundleUrl;
   return `${bundleUrl}.map`;
 }
 async function loadSourceMap(bundleUrl) {
-  if (cache.has(bundleUrl)) return cache.get(bundleUrl) ?? null;
+  if (cache2.has(bundleUrl)) return cache2.get(bundleUrl) ?? null;
   if (failedUrls.has(bundleUrl)) return null;
   const mapUrl = getSourceMapUrl(bundleUrl);
   try {
     const res = await fetch(mapUrl, { cache: "force-cache" });
     if (!res.ok) {
       failedUrls.add(bundleUrl);
-      cache.set(bundleUrl, null);
+      cache2.set(bundleUrl, null);
       return null;
     }
     const rawMap = await res.json();
     const traceMap = new import_trace_mapping.TraceMap(rawMap);
-    cache.set(bundleUrl, traceMap);
+    cache2.set(bundleUrl, traceMap);
     return traceMap;
   } catch {
     failedUrls.add(bundleUrl);
-    cache.set(bundleUrl, null);
+    cache2.set(bundleUrl, null);
     return null;
   }
 }
@@ -2340,8 +2393,8 @@ var import_react5 = require("react");
 var import_react_dom = require("react-dom");
 
 // src/components/inbox-panel/styles.module.scss
-var css5 = '@keyframes styles-module__slideIn___0o0s- {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n@keyframes styles-module__slideOut___nKrBX {\n  from {\n    transform: translateX(0);\n  }\n  to {\n    transform: translateX(100%);\n  }\n}\n@keyframes styles-module__fadeIn___j09Ts {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.styles-module__backdrop___zYhcU {\n  position: fixed;\n  inset: 0;\n  z-index: 100003;\n  animation: styles-module__fadeIn___j09Ts 0.15s ease-out;\n}\n\n.styles-module__panel___6YS8k {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: 420px;\n  max-width: 100vw;\n  background: #fafafa;\n  z-index: 100004;\n  display: flex;\n  flex-direction: column;\n  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.08);\n  animation: styles-module__slideIn___0o0s- 0.2s ease-out;\n  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n}\n.styles-module__panel___6YS8k.styles-module__exiting___6A-Ag {\n  animation: styles-module__slideOut___nKrBX 0.15s ease-in forwards;\n}\n\n.styles-module__header___fBbGz {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid #e5e7eb;\n  background: #fff;\n  flex-shrink: 0;\n}\n\n.styles-module__headerLeft___e0YLf {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.styles-module__headerTitle___oEPJa {\n  font-size: 14px;\n  font-weight: 600;\n  color: #18181b;\n}\n\n.styles-module__closeBtn___-H8ra {\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 6px;\n  color: #6b7280;\n  transition: background 0.12s, color 0.12s;\n}\n.styles-module__closeBtn___-H8ra:hover {\n  background: #f3f4f6;\n  color: #18181b;\n}\n.styles-module__closeBtn___-H8ra svg {\n  width: 18px;\n  height: 18px;\n}\n\n.styles-module__tabs___nfuX7 {\n  display: flex;\n  padding: 0 20px;\n  gap: 0;\n  border-bottom: 1px solid #e5e7eb;\n  background: #fff;\n  flex-shrink: 0;\n}\n\n.styles-module__tab___Hc-jn {\n  padding: 10px 16px;\n  font-size: 13px;\n  font-weight: 500;\n  color: #6b7280;\n  border: none;\n  background: none;\n  cursor: pointer;\n  border-bottom: 2px solid transparent;\n  transition: color 0.12s, border-color 0.12s;\n  font-family: inherit;\n}\n.styles-module__tab___Hc-jn:hover {\n  color: #374151;\n}\n.styles-module__tab___Hc-jn.styles-module__active___ZQzA5 {\n  color: #18181b;\n  border-bottom-color: #18181b;\n}\n\n.styles-module__tabBadge___IdFDQ {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 18px;\n  height: 18px;\n  border-radius: 9px;\n  background: #e5e7eb;\n  color: #374151;\n  font-size: 11px;\n  font-weight: 600;\n  padding: 0 5px;\n  margin-left: 6px;\n}\n\n.styles-module__content___L2lRw {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px;\n}\n.styles-module__content___L2lRw::-webkit-scrollbar {\n  width: 4px;\n}\n.styles-module__content___L2lRw::-webkit-scrollbar-thumb {\n  background: #d1d5db;\n  border-radius: 2px;\n}\n\n.styles-module__card___F8qwd {\n  background: #fff;\n  border-radius: 12px;\n  border: 1px solid #e5e7eb;\n  margin-bottom: 12px;\n  overflow: hidden;\n  transition: box-shadow 0.12s;\n  cursor: pointer;\n}\n.styles-module__card___F8qwd:hover {\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);\n}\n\n.styles-module__cardHeader___QOVGR {\n  padding: 14px 16px 8px;\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n}\n\n.styles-module__cardAvatar___FfKmW {\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  background: #16a34a;\n  color: #fff;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  font-weight: 600;\n  flex-shrink: 0;\n}\n\n.styles-module__cardInfo___BmrdF {\n  flex: 1;\n  min-width: 0;\n}\n\n.styles-module__cardMeta___7p9KD {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-bottom: 4px;\n}\n\n.styles-module__cardAuthor___YvnuR {\n  font-size: 13px;\n  font-weight: 600;\n  color: #18181b;\n}\n\n.styles-module__cardTime___N1Png {\n  font-size: 12px;\n  color: #9ca3af;\n}\n\n.styles-module__cardActions___7QF72 {\n  display: flex;\n  gap: 2px;\n  flex-shrink: 0;\n}\n\n.styles-module__cardAction___t4b3V {\n  width: 26px;\n  height: 26px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 5px;\n  color: #9ca3af;\n  transition: background 0.12s, color 0.12s;\n  padding: 0;\n}\n.styles-module__cardAction___t4b3V:hover {\n  background: #f3f4f6;\n  color: #374151;\n}\n.styles-module__cardAction___t4b3V svg {\n  width: 14px;\n  height: 14px;\n}\n\n.styles-module__cardTitle___xJxDN {\n  font-size: 13px;\n  color: #1a1a1a;\n  line-height: 1.5;\n  padding: 0 16px 8px;\n}\n\n.styles-module__cardScreenshot___I5-QL {\n  margin: 0 16px 8px;\n  border-radius: 8px;\n  border: 1px solid #e5e7eb;\n  overflow: hidden;\n  position: relative;\n  max-height: 160px;\n}\n.styles-module__cardScreenshot___I5-QL img {\n  width: 100%;\n  height: auto;\n  display: block;\n  object-fit: cover;\n}\n\n.styles-module__cardRoute___U4gB6 {\n  margin: 0 16px 10px;\n  padding: 8px 12px;\n  background: #f9fafb;\n  border: 1px solid #f3f4f6;\n  border-radius: 8px;\n  font-size: 12px;\n  color: #6b7280;\n  line-height: 1.4;\n}\n\n.styles-module__cardRouteName___BDH75 {\n  font-weight: 500;\n  color: #374151;\n}\n\n.styles-module__cardRoutePath___zP-fh {\n  color: #9ca3af;\n}\n\n.styles-module__cardFooter___wfPa4 {\n  padding: 8px 16px 12px;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.styles-module__cardReplyDot___YnqzI {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: #16a34a;\n  flex-shrink: 0;\n}\n\n.styles-module__cardReplyCount___O1khL {\n  font-size: 12px;\n  font-weight: 500;\n  color: #374151;\n}\n\n.styles-module__statusDot___l4IHG {\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n.styles-module__statusDot___l4IHG.styles-module__todo___894P6 {\n  background: #f59e0b;\n}\n.styles-module__statusDot___l4IHG.styles-module__inProgress___IZ1mJ {\n  background: #3b82f6;\n}\n.styles-module__statusDot___l4IHG.styles-module__done___n4cWP {\n  background: #16a34a;\n}\n\n.styles-module__empty___IADrw {\n  text-align: center;\n  padding: 48px 20px;\n  color: #9ca3af;\n  font-size: 13px;\n  line-height: 1.6;\n}\n\n.styles-module__emptyIcon___1x5wT {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background: #f3f4f6;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0 auto 12px;\n  color: #9ca3af;\n}\n.styles-module__emptyIcon___1x5wT svg {\n  width: 24px;\n  height: 24px;\n}';
-var classNames5 = { "backdrop": "styles-module__backdrop___zYhcU", "fadeIn": "styles-module__fadeIn___j09Ts", "panel": "styles-module__panel___6YS8k", "slideIn": "styles-module__slideIn___0o0s-", "exiting": "styles-module__exiting___6A-Ag", "slideOut": "styles-module__slideOut___nKrBX", "header": "styles-module__header___fBbGz", "headerLeft": "styles-module__headerLeft___e0YLf", "headerTitle": "styles-module__headerTitle___oEPJa", "closeBtn": "styles-module__closeBtn___-H8ra", "tabs": "styles-module__tabs___nfuX7", "tab": "styles-module__tab___Hc-jn", "active": "styles-module__active___ZQzA5", "tabBadge": "styles-module__tabBadge___IdFDQ", "content": "styles-module__content___L2lRw", "card": "styles-module__card___F8qwd", "cardHeader": "styles-module__cardHeader___QOVGR", "cardAvatar": "styles-module__cardAvatar___FfKmW", "cardInfo": "styles-module__cardInfo___BmrdF", "cardMeta": "styles-module__cardMeta___7p9KD", "cardAuthor": "styles-module__cardAuthor___YvnuR", "cardTime": "styles-module__cardTime___N1Png", "cardActions": "styles-module__cardActions___7QF72", "cardAction": "styles-module__cardAction___t4b3V", "cardTitle": "styles-module__cardTitle___xJxDN", "cardScreenshot": "styles-module__cardScreenshot___I5-QL", "cardRoute": "styles-module__cardRoute___U4gB6", "cardRouteName": "styles-module__cardRouteName___BDH75", "cardRoutePath": "styles-module__cardRoutePath___zP-fh", "cardFooter": "styles-module__cardFooter___wfPa4", "cardReplyDot": "styles-module__cardReplyDot___YnqzI", "cardReplyCount": "styles-module__cardReplyCount___O1khL", "statusDot": "styles-module__statusDot___l4IHG", "todo": "styles-module__todo___894P6", "inProgress": "styles-module__inProgress___IZ1mJ", "done": "styles-module__done___n4cWP", "empty": "styles-module__empty___IADrw", "emptyIcon": "styles-module__emptyIcon___1x5wT" };
+var css5 = '@keyframes styles-module__slideIn___0o0s- {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n@keyframes styles-module__slideOut___nKrBX {\n  from {\n    transform: translateX(0);\n  }\n  to {\n    transform: translateX(100%);\n  }\n}\n@keyframes styles-module__fadeIn___j09Ts {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.styles-module__backdrop___zYhcU {\n  position: fixed;\n  inset: 0;\n  z-index: 100003;\n  animation: styles-module__fadeIn___j09Ts 0.15s ease-out;\n}\n\n.styles-module__panel___6YS8k {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: 420px;\n  max-width: 100vw;\n  background: #fafafa;\n  z-index: 100004;\n  display: flex;\n  flex-direction: column;\n  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.08);\n  animation: styles-module__slideIn___0o0s- 0.2s ease-out;\n  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n}\n.styles-module__panel___6YS8k.styles-module__exiting___6A-Ag {\n  animation: styles-module__slideOut___nKrBX 0.15s ease-in forwards;\n}\n\n.styles-module__header___fBbGz {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid #e5e7eb;\n  background: #fff;\n  flex-shrink: 0;\n}\n\n.styles-module__headerLeft___e0YLf {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.styles-module__headerTitle___oEPJa {\n  font-size: 14px;\n  font-weight: 600;\n  color: #18181b;\n}\n\n.styles-module__closeBtn___-H8ra {\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 6px;\n  color: #6b7280;\n  transition: background 0.12s, color 0.12s;\n}\n.styles-module__closeBtn___-H8ra:hover {\n  background: #f3f4f6;\n  color: #18181b;\n}\n.styles-module__closeBtn___-H8ra svg {\n  width: 18px;\n  height: 18px;\n}\n\n.styles-module__tabs___nfuX7 {\n  display: flex;\n  padding: 0 20px;\n  gap: 0;\n  border-bottom: 1px solid #e5e7eb;\n  background: #fff;\n  flex-shrink: 0;\n}\n\n.styles-module__tab___Hc-jn {\n  padding: 10px 16px;\n  font-size: 13px;\n  font-weight: 500;\n  color: #6b7280;\n  border: none;\n  background: none;\n  cursor: pointer;\n  border-bottom: 2px solid transparent;\n  transition: color 0.12s, border-color 0.12s;\n  font-family: inherit;\n}\n.styles-module__tab___Hc-jn:hover {\n  color: #374151;\n}\n.styles-module__tab___Hc-jn.styles-module__active___ZQzA5 {\n  color: #18181b;\n  border-bottom-color: #18181b;\n}\n\n.styles-module__tabBadge___IdFDQ {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 18px;\n  height: 18px;\n  border-radius: 9px;\n  background: #e5e7eb;\n  color: #374151;\n  font-size: 11px;\n  font-weight: 600;\n  padding: 0 5px;\n  margin-left: 6px;\n}\n\n.styles-module__content___L2lRw {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px;\n}\n.styles-module__content___L2lRw::-webkit-scrollbar {\n  width: 4px;\n}\n.styles-module__content___L2lRw::-webkit-scrollbar-thumb {\n  background: #d1d5db;\n  border-radius: 2px;\n}\n\n.styles-module__card___F8qwd {\n  background: #fff;\n  border-radius: 12px;\n  border: 1px solid #e5e7eb;\n  margin-bottom: 12px;\n  overflow: hidden;\n  transition: box-shadow 0.12s;\n  cursor: pointer;\n}\n.styles-module__card___F8qwd:hover {\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);\n}\n\n.styles-module__cardHeader___QOVGR {\n  padding: 14px 16px 8px;\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n}\n\n.styles-module__cardAvatar___FfKmW {\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  background: #16a34a;\n  color: #fff;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  font-weight: 600;\n  flex-shrink: 0;\n}\n\n.styles-module__cardInfo___BmrdF {\n  flex: 1;\n  min-width: 0;\n}\n\n.styles-module__cardMeta___7p9KD {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-bottom: 4px;\n}\n\n.styles-module__cardAuthor___YvnuR {\n  font-size: 13px;\n  font-weight: 600;\n  color: #18181b;\n}\n\n.styles-module__cardTime___N1Png {\n  font-size: 12px;\n  color: #9ca3af;\n}\n\n.styles-module__cardActions___7QF72 {\n  display: flex;\n  gap: 2px;\n  flex-shrink: 0;\n}\n\n.styles-module__cardAction___t4b3V {\n  width: 26px;\n  height: 26px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 5px;\n  color: #9ca3af;\n  transition: background 0.12s, color 0.12s;\n  padding: 0;\n}\n.styles-module__cardAction___t4b3V:hover {\n  background: #f3f4f6;\n  color: #374151;\n}\n.styles-module__cardAction___t4b3V svg {\n  width: 14px;\n  height: 14px;\n}\n\n.styles-module__cardTitle___xJxDN {\n  font-size: 13px;\n  color: #1a1a1a;\n  line-height: 1.5;\n  padding: 0 16px 8px;\n}\n\n.styles-module__cardScreenshot___I5-QL {\n  margin: 0 16px 8px;\n  border-radius: 8px;\n  border: 1px solid #e5e7eb;\n  overflow: hidden;\n  position: relative;\n  max-height: 160px;\n}\n.styles-module__cardScreenshot___I5-QL img {\n  width: 100%;\n  height: auto;\n  display: block;\n  object-fit: cover;\n}\n\n.styles-module__cardRoute___U4gB6 {\n  margin: 0 16px 10px;\n  padding: 8px 12px;\n  background: #f9fafb;\n  border: 1px solid #f3f4f6;\n  border-radius: 8px;\n  font-size: 12px;\n  color: #6b7280;\n  line-height: 1.4;\n}\n\n.styles-module__cardRouteName___BDH75 {\n  font-weight: 500;\n  color: #374151;\n}\n\n.styles-module__cardRoutePath___zP-fh {\n  color: #9ca3af;\n}\n\n.styles-module__cardFooter___wfPa4 {\n  padding: 8px 16px 12px;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.styles-module__cardReplyDot___YnqzI {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: #16a34a;\n  flex-shrink: 0;\n}\n\n.styles-module__cardReplyCount___O1khL {\n  font-size: 12px;\n  font-weight: 500;\n  color: #374151;\n}\n\n.styles-module__statusDot___l4IHG {\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n.styles-module__statusDot___l4IHG.styles-module__todo___894P6 {\n  background: #f59e0b;\n}\n.styles-module__statusDot___l4IHG.styles-module__inProgress___IZ1mJ {\n  background: #3b82f6;\n}\n.styles-module__statusDot___l4IHG.styles-module__done___n4cWP {\n  background: #16a34a;\n}\n\n.styles-module__empty___IADrw {\n  text-align: center;\n  padding: 48px 20px;\n  color: #9ca3af;\n  font-size: 13px;\n  line-height: 1.6;\n}\n\n.styles-module__emptyIcon___1x5wT {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background: #f3f4f6;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0 auto 12px;\n  color: #9ca3af;\n}\n.styles-module__emptyIcon___1x5wT svg {\n  width: 24px;\n  height: 24px;\n}\n\n.styles-module__checkBtn___KjHxm {\n  width: 28px;\n  height: 28px;\n  border: 2px solid #d1d5db;\n  border-radius: 50%;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: transparent;\n  transition: all 0.15s;\n  padding: 0;\n  flex-shrink: 0;\n}\n.styles-module__checkBtn___KjHxm svg {\n  width: 14px;\n  height: 14px;\n}\n.styles-module__checkBtn___KjHxm:hover {\n  border-color: #16a34a;\n  color: #16a34a;\n}\n.styles-module__checkBtn___KjHxm.styles-module__checked___8pype {\n  border-color: #16a34a;\n  background: #16a34a;\n  color: #fff;\n}\n\n.styles-module__cardDone___-m4w- {\n  opacity: 0.6;\n}\n.styles-module__cardDone___-m4w- .styles-module__cardTitle___xJxDN {\n  text-decoration: line-through;\n  color: #9ca3af;\n}\n\n.styles-module__backBtn___PTIAl {\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 6px;\n  color: #6b7280;\n  transition: background 0.12s, color 0.12s;\n  padding: 0;\n  flex-shrink: 0;\n}\n.styles-module__backBtn___PTIAl:hover {\n  background: #f3f4f6;\n  color: #18181b;\n}\n\n.styles-module__detailView___36cvH {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.styles-module__detailHeader___Hepgq {\n  display: flex;\n  gap: 10px;\n  padding: 16px 20px;\n  border-bottom: 1px solid #f3f4f6;\n}\n\n.styles-module__detailTitle___7TvrX {\n  font-size: 13px;\n  color: #1a1a1a;\n  line-height: 1.5;\n  margin-top: 4px;\n}\n\n.styles-module__detailScreenshot___UPF0f {\n  margin: 0 20px 0;\n  border-radius: 8px;\n  border: 1px solid #e5e7eb;\n  overflow: hidden;\n  max-height: 180px;\n}\n.styles-module__detailScreenshot___UPF0f img {\n  width: 100%;\n  height: auto;\n  display: block;\n  object-fit: cover;\n}\n\n.styles-module__commentsList___5Uigg {\n  flex: 1;\n  overflow-y: auto;\n  padding: 8px 0;\n}\n.styles-module__commentsList___5Uigg::-webkit-scrollbar {\n  width: 4px;\n}\n.styles-module__commentsList___5Uigg::-webkit-scrollbar-thumb {\n  background: #d1d5db;\n  border-radius: 2px;\n}\n\n.styles-module__commentItem___5u78u {\n  display: flex;\n  gap: 10px;\n  padding: 10px 20px;\n}\n.styles-module__commentItem___5u78u:hover {\n  background: #f9fafb;\n}\n\n.styles-module__commentAvatar___OatKg {\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  background: #16a34a;\n  color: #fff;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  font-weight: 600;\n  flex-shrink: 0;\n}\n\n.styles-module__commentBody___gmv1J {\n  flex: 1;\n  min-width: 0;\n}\n\n.styles-module__commentMeta___JNJa3 {\n  display: flex;\n  gap: 6px;\n  align-items: center;\n  margin-bottom: 2px;\n}\n\n.styles-module__commentAuthorName___XNVRk {\n  font-size: 13px;\n  font-weight: 600;\n  color: #1a1a1a;\n}\n\n.styles-module__commentTime___CokGf {\n  font-size: 12px;\n  color: #9ca3af;\n}\n\n.styles-module__commentContent___yMiLR {\n  font-size: 13px;\n  color: #374151;\n  line-height: 1.5;\n  white-space: pre-wrap;\n  word-break: break-word;\n}\n\n.styles-module__loadingComments___zpATD, .styles-module__noComments___kvl90 {\n  text-align: center;\n  padding: 24px 20px;\n  color: #9ca3af;\n  font-size: 13px;\n}\n\n.styles-module__replyBox___FO-XS {\n  display: flex;\n  align-items: flex-end;\n  gap: 8px;\n  padding: 12px 20px;\n  border-top: 1px solid #f3f4f6;\n  background: #fff;\n}\n\n.styles-module__replyInput___k8C9e {\n  flex: 1;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  padding: 8px 12px;\n  font-size: 13px;\n  font-family: inherit;\n  color: #1a1a1a;\n  resize: none;\n  outline: none;\n  min-height: 20px;\n  max-height: 80px;\n  line-height: 1.5;\n  transition: border-color 0.12s;\n}\n.styles-module__replyInput___k8C9e:focus {\n  border-color: #18181b;\n}\n.styles-module__replyInput___k8C9e::placeholder {\n  color: #9ca3af;\n}\n\n.styles-module__sendBtn___pBzWa {\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 6px;\n  color: #d1d5db;\n  transition: color 0.12s;\n  padding: 0;\n  flex-shrink: 0;\n}\n.styles-module__sendBtn___pBzWa.styles-module__active___ZQzA5 {\n  color: #3b82f6;\n}\n.styles-module__sendBtn___pBzWa:hover {\n  color: #3b82f6;\n}';
+var classNames5 = { "backdrop": "styles-module__backdrop___zYhcU", "fadeIn": "styles-module__fadeIn___j09Ts", "panel": "styles-module__panel___6YS8k", "slideIn": "styles-module__slideIn___0o0s-", "exiting": "styles-module__exiting___6A-Ag", "slideOut": "styles-module__slideOut___nKrBX", "header": "styles-module__header___fBbGz", "headerLeft": "styles-module__headerLeft___e0YLf", "headerTitle": "styles-module__headerTitle___oEPJa", "closeBtn": "styles-module__closeBtn___-H8ra", "tabs": "styles-module__tabs___nfuX7", "tab": "styles-module__tab___Hc-jn", "active": "styles-module__active___ZQzA5", "tabBadge": "styles-module__tabBadge___IdFDQ", "content": "styles-module__content___L2lRw", "card": "styles-module__card___F8qwd", "cardHeader": "styles-module__cardHeader___QOVGR", "cardAvatar": "styles-module__cardAvatar___FfKmW", "cardInfo": "styles-module__cardInfo___BmrdF", "cardMeta": "styles-module__cardMeta___7p9KD", "cardAuthor": "styles-module__cardAuthor___YvnuR", "cardTime": "styles-module__cardTime___N1Png", "cardActions": "styles-module__cardActions___7QF72", "cardAction": "styles-module__cardAction___t4b3V", "cardTitle": "styles-module__cardTitle___xJxDN", "cardScreenshot": "styles-module__cardScreenshot___I5-QL", "cardRoute": "styles-module__cardRoute___U4gB6", "cardRouteName": "styles-module__cardRouteName___BDH75", "cardRoutePath": "styles-module__cardRoutePath___zP-fh", "cardFooter": "styles-module__cardFooter___wfPa4", "cardReplyDot": "styles-module__cardReplyDot___YnqzI", "cardReplyCount": "styles-module__cardReplyCount___O1khL", "statusDot": "styles-module__statusDot___l4IHG", "todo": "styles-module__todo___894P6", "inProgress": "styles-module__inProgress___IZ1mJ", "done": "styles-module__done___n4cWP", "empty": "styles-module__empty___IADrw", "emptyIcon": "styles-module__emptyIcon___1x5wT", "checkBtn": "styles-module__checkBtn___KjHxm", "checked": "styles-module__checked___8pype", "cardDone": "styles-module__cardDone___-m4w-", "backBtn": "styles-module__backBtn___PTIAl", "detailView": "styles-module__detailView___36cvH", "detailHeader": "styles-module__detailHeader___Hepgq", "detailTitle": "styles-module__detailTitle___7TvrX", "detailScreenshot": "styles-module__detailScreenshot___UPF0f", "commentsList": "styles-module__commentsList___5Uigg", "commentItem": "styles-module__commentItem___5u78u", "commentAvatar": "styles-module__commentAvatar___OatKg", "commentBody": "styles-module__commentBody___gmv1J", "commentMeta": "styles-module__commentMeta___JNJa3", "commentAuthorName": "styles-module__commentAuthorName___XNVRk", "commentTime": "styles-module__commentTime___CokGf", "commentContent": "styles-module__commentContent___yMiLR", "loadingComments": "styles-module__loadingComments___zpATD", "noComments": "styles-module__noComments___kvl90", "replyBox": "styles-module__replyBox___FO-XS", "replyInput": "styles-module__replyInput___k8C9e", "sendBtn": "styles-module__sendBtn___pBzWa" };
 if (typeof document !== "undefined") {
   let style = document.getElementById("impakers-debug-styles-inbox-panel-styles");
   if (!style) {
@@ -2374,15 +2427,85 @@ function InboxPanel({
   allItems,
   currentPath,
   serviceName,
+  endpoint,
+  currentUserName,
+  currentUserId,
   onClose,
-  onItemClick
+  onStatusChange
 }) {
   const [tab, setTab] = (0, import_react5.useState)("page");
   const [exiting, setExiting] = (0, import_react5.useState)(false);
+  const [selectedItem, setSelectedItem] = (0, import_react5.useState)(null);
+  const [comments, setComments] = (0, import_react5.useState)([]);
+  const [loadingComments, setLoadingComments] = (0, import_react5.useState)(false);
+  const [replyText, setReplyText] = (0, import_react5.useState)("");
+  const replyRef = (0, import_react5.useRef)(null);
+  const commentsEndRef = (0, import_react5.useRef)(null);
   const handleClose = (0, import_react5.useCallback)(() => {
+    if (selectedItem) {
+      setSelectedItem(null);
+      setComments([]);
+      setReplyText("");
+      return;
+    }
     setExiting(true);
     setTimeout(() => onClose(), 150);
-  }, [onClose]);
+  }, [onClose, selectedItem]);
+  const handleItemClick = (0, import_react5.useCallback)(async (item) => {
+    if (item.feedbackUrl && item.feedbackUrl !== window.location.pathname) {
+      window.location.href = item.feedbackUrl;
+      return;
+    }
+    setSelectedItem(item);
+    setLoadingComments(true);
+    try {
+      const data = await fetchComments(endpoint, item.id);
+      setComments(data);
+    } catch {
+      setComments([]);
+    } finally {
+      setLoadingComments(false);
+    }
+  }, [endpoint]);
+  (0, import_react5.useEffect)(() => {
+    commentsEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, [comments.length]);
+  (0, import_react5.useEffect)(() => {
+    if (selectedItem) replyRef.current?.focus();
+  }, [selectedItem]);
+  const handleSendReply = (0, import_react5.useCallback)(async () => {
+    if (!replyText.trim() || !selectedItem) return;
+    const content = replyText.trim();
+    setReplyText("");
+    const temp = {
+      id: `temp-${Date.now()}`,
+      content,
+      authorName: currentUserName,
+      authorId: currentUserId,
+      createdAt: (/* @__PURE__ */ new Date()).toISOString()
+    };
+    setComments((prev) => [...prev, temp]);
+    try {
+      const serverComment = await postComment(endpoint, selectedItem.id, content, currentUserName, currentUserId);
+      setComments((prev) => prev.map((c) => c.id === temp.id ? serverComment : c));
+    } catch (err) {
+      console.error("[@impakers/debug] \uCF54\uBA58\uD2B8 \uC804\uC1A1 \uC2E4\uD328:", err);
+    }
+  }, [replyText, selectedItem, endpoint, currentUserName, currentUserId]);
+  const handleReplyKeyDown = (0, import_react5.useCallback)((e) => {
+    e.stopPropagation();
+    if (e.nativeEvent.isComposing) return;
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSendReply();
+    }
+    if (e.key === "Escape") handleClose();
+  }, [handleSendReply, handleClose]);
+  const handleToggleStatus = (0, import_react5.useCallback)((item, e) => {
+    e.stopPropagation();
+    const newStatus = item.status === "done" ? "todo" : "done";
+    onStatusChange?.(item.id, newStatus);
+  }, [onStatusChange]);
   const items = tab === "page" ? pageItems : allItems;
   if (typeof document === "undefined") return null;
   return (0, import_react_dom.createPortal)(
@@ -2390,77 +2513,114 @@ function InboxPanel({
       /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.backdrop, onClick: handleClose }),
       /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: `${styles_module_default5.panel} ${exiting ? styles_module_default5.exiting : ""}`, "data-impakers-debug": "", children: [
         /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.header, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.headerLeft, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.headerTitle, children: serviceName || "Feedback" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { className: styles_module_default5.closeBtn, onClick: handleClose, type: "button", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M18 6L6 18M6 6l12 12" }) }) })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.tabs, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
-            "button",
-            {
-              className: `${styles_module_default5.tab} ${tab === "page" ? styles_module_default5.active : ""}`,
-              onClick: () => setTab("page"),
-              type: "button",
-              children: [
-                "This Page",
-                pageItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.tabBadge, children: pageItems.length })
-              ]
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
-            "button",
-            {
-              className: `${styles_module_default5.tab} ${tab === "all" ? styles_module_default5.active : ""}`,
-              onClick: () => setTab("all"),
-              type: "button",
-              children: [
-                "All",
-                allItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.tabBadge, children: allItems.length })
-              ]
-            }
-          )
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.headerLeft, children: [
+            selectedItem && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { className: styles_module_default5.backBtn, onClick: handleClose, type: "button", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "16", height: "16", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "15 18 9 12 15 6" }) }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.headerTitle, children: selectedItem ? selectedItem.title.replace(/^\[피드백\]\s*/, "") : serviceName || "Feedback" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { className: styles_module_default5.closeBtn, onClick: () => {
+            setExiting(true);
+            setTimeout(() => onClose(), 150);
+          }, type: "button", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M18 6L6 18M6 6l12 12" }) }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.content, children: items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.empty, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.emptyIcon, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z" }) }) }),
-          tab === "page" ? "\uC774 \uD398\uC774\uC9C0\uC5D0 \uD53C\uB4DC\uBC31\uC774 \uC5C6\uC2B5\uB2C8\uB2E4" : "\uD53C\uB4DC\uBC31\uC774 \uC5C6\uC2B5\uB2C8\uB2E4"
-        ] }) : items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
-          "div",
-          {
-            className: styles_module_default5.card,
-            onClick: () => onItemClick?.(item),
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardHeader, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardAvatar, children: getInitials2(item.authorName) }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardInfo, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardMeta, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardAuthor, children: item.authorName }),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardTime, children: timeAgo2(item.createdAt) })
-                ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardActions, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { className: styles_module_default5.cardAction, type: "button", title: "\uC644\uB8CC \uCC98\uB9AC", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "20 6 9 17 4 12" }) }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { className: styles_module_default5.cardAction, type: "button", title: "\uB354\uBCF4\uAE30", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "12", cy: "12", r: "1" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "19", cy: "12", r: "1" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "5", cy: "12", r: "1" })
-                  ] }) })
-                ] })
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardTitle, children: item.title.replace(/^\[피드백\]\s*/, "") }),
-              item.screenshot && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardScreenshot, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("img", { src: item.screenshot, alt: "screenshot" }) }),
-              tab === "all" && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardRoute, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardRouteName, children: serviceName || "Service" }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardRoutePath, children: item.feedbackUrl })
+        selectedItem ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.detailView, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.detailHeader, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardAvatar, children: getInitials2(selectedItem.authorName) }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardMeta, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardAuthor, children: selectedItem.authorName }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardTime, children: timeAgo2(selectedItem.createdAt) })
               ] }),
-              item.commentCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardFooter, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardReplyDot }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: styles_module_default5.cardReplyCount, children: [
-                  item.commentCount,
-                  " ",
-                  item.commentCount === 1 ? "Reply" : "Replies"
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.detailTitle, children: selectedItem.title.replace(/^\[피드백\]\s*/, "") })
+            ] })
+          ] }),
+          selectedItem.screenshot && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.detailScreenshot, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("img", { src: selectedItem.screenshot, alt: "screenshot" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.commentsList, children: [
+            loadingComments && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.loadingComments, children: "\uB313\uAE00 \uB85C\uB529 \uC911..." }),
+            !loadingComments && comments.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.noComments, children: "\uC544\uC9C1 \uB313\uAE00\uC774 \uC5C6\uC2B5\uB2C8\uB2E4" }),
+            comments.map((c) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.commentItem, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.commentAvatar, style: { width: 22, height: 22, fontSize: 10 }, children: getInitials2(c.authorName) }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.commentBody, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.commentMeta, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.commentAuthorName, children: c.authorName }),
+                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.commentTime, children: timeAgo2(c.createdAt) })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.commentContent, children: c.content })
+              ] })
+            ] }, c.id)),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { ref: commentsEndRef })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.replyBox, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              "textarea",
+              {
+                ref: replyRef,
+                className: styles_module_default5.replyInput,
+                placeholder: "Reply...",
+                value: replyText,
+                onChange: (e) => setReplyText(e.target.value),
+                onKeyDown: handleReplyKeyDown,
+                rows: 1
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              "button",
+              {
+                className: `${styles_module_default5.sendBtn} ${replyText.trim() ? styles_module_default5.active : ""}`,
+                onClick: handleSendReply,
+                disabled: !replyText.trim(),
+                type: "button",
+                children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "16", height: "16", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
                 ] })
+              }
+            )
+          ] })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.tabs, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("button", { className: `${styles_module_default5.tab} ${tab === "page" ? styles_module_default5.active : ""}`, onClick: () => setTab("page"), type: "button", children: [
+              "This Page",
+              pageItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.tabBadge, children: pageItems.length })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("button", { className: `${styles_module_default5.tab} ${tab === "all" ? styles_module_default5.active : ""}`, onClick: () => setTab("all"), type: "button", children: [
+              "All",
+              allItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.tabBadge, children: allItems.length })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.content, children: items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.empty, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.emptyIcon, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z" }) }) }),
+            tab === "page" ? "\uC774 \uD398\uC774\uC9C0\uC5D0 \uD53C\uB4DC\uBC31\uC774 \uC5C6\uC2B5\uB2C8\uB2E4" : "\uD53C\uB4DC\uBC31\uC774 \uC5C6\uC2B5\uB2C8\uB2E4"
+          ] }) : items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: `${styles_module_default5.card} ${item.status === "done" ? styles_module_default5.cardDone : ""}`, onClick: () => handleItemClick(item), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardHeader, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardAvatar, children: getInitials2(item.authorName) }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardInfo, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardMeta, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardAuthor, children: item.authorName }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardTime, children: timeAgo2(item.createdAt) })
+              ] }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "button",
+                {
+                  className: `${styles_module_default5.checkBtn} ${item.status === "done" ? styles_module_default5.checked : ""}`,
+                  onClick: (e) => handleToggleStatus(item, e),
+                  type: "button",
+                  title: item.status === "done" ? "\uBBF8\uC644\uB8CC\uB85C \uBCC0\uACBD" : "\uC644\uB8CC \uCC98\uB9AC",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "20 6 9 17 4 12" }) })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardTitle, children: item.title.replace(/^\[피드백\]\s*/, "") }),
+            item.screenshot && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardScreenshot, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("img", { src: item.screenshot, alt: "screenshot" }) }),
+            tab === "all" && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: styles_module_default5.cardRoute, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardRoutePath, children: item.feedbackUrl }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: styles_module_default5.cardFooter, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: styles_module_default5.cardReplyDot }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: styles_module_default5.cardReplyCount, children: [
+                item.commentCount,
+                " ",
+                item.commentCount === 1 ? "Reply" : "Replies"
               ] })
-            ]
-          },
-          item.id
-        )) })
+            ] })
+          ] }, item.id)) })
+        ] })
       ] })
     ] }),
     document.body
@@ -2735,13 +2895,8 @@ function DebugWidget({ endpoint, getUser, onHide }) {
         isFixed: t.feedbackMarker.isFixed,
         boundingBox: t.feedbackMarker.boundingBox
       }));
-      if (serverAnnotations.length > 0) {
-        setAnnotations((prev) => {
-          const existingIds = new Set(prev.map((a) => a.id));
-          const newOnes = serverAnnotations.filter((a) => !existingIds.has(a.id));
-          return [...prev, ...newOnes];
-        });
-      }
+      setAnnotations(serverAnnotations);
+      saveRouteAnnotations(serverAnnotations);
     }).catch(() => {
     });
   }, [endpoint]);
@@ -3061,6 +3216,10 @@ ${elementInfo.join("\n")}`);
       }));
     } catch (err) {
       console.error("[@impakers/debug] \uCF54\uBA58\uD2B8 \uC804\uC1A1 \uC2E4\uD328:", err);
+      setThreadComments((prev) => ({
+        ...prev,
+        [taskId]: (prev[taskId] || []).filter((c) => c.id !== tempComment.id)
+      }));
     }
   }, [getUser, endpoint]);
   const handleThreadClose = (0, import_react7.useCallback)(() => {
@@ -3182,7 +3341,15 @@ ${elementInfo.join("\n")}`);
           allItems: allRouteItems,
           currentPath,
           serviceName: getServiceName() || void 0,
-          onClose: () => setShowInbox(false)
+          endpoint,
+          currentUserName: getUser?.()?.name ? String(getUser().name) : "\uC775\uBA85",
+          currentUserId: getUser?.()?.id ? String(getUser().id) : void 0,
+          onClose: () => setShowInbox(false),
+          onStatusChange: (taskId, status) => {
+            setAnnotations(
+              (prev) => prev.map((a) => a.id === taskId ? { ...a, status } : a)
+            );
+          }
         }
       ),
       showSettings && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(