improve log analysis feedback (#3485)

* feat(feedback): improve log analysis and submission process

* refactor(feedback): replace GitHub submission with API-based feedback

* feat(feedback): enhance feedback submission with validation and logs toggle

Author: ComputelessComputer

apps/api/src/routes/feedback.ts

@@ -66,7 +66,7 @@ async function createGitHubIssue(
   title: string,
   body: string,
   labels: string[],
-): Promise<{ url: string } | { error: string }> {
+): Promise<{ url: string; number: number } | { error: string }> {
   if (!env.YUJONGLEE_GITHUB_TOKEN_REPO) {
     return { error: "GitHub bot token not configured" };
   }
@@ -93,12 +93,37 @@ async function createGitHubIssue(
     return { error: `GitHub API error: ${response.status} - ${errorText}` };
   }
 
-  const data = (await response.json()) as { html_url?: string };
-  if (!data.html_url) {
+  const data = (await response.json()) as {
+    html_url?: string;
+    number?: number;
+  };
+  if (!data.html_url || !data.number) {
     return { error: "GitHub API did not return issue URL" };
   }
 
-  return { url: data.html_url };
+  return { url: data.html_url, number: data.number };
+}
+
+async function addCommentToIssue(
+  issueNumber: number,
+  comment: string,
+): Promise<void> {
+  if (!env.YUJONGLEE_GITHUB_TOKEN_REPO) {
+    return;
+  }
+
+  await fetch(
+    `https://api.github.com/repos/fastrepl/hyprnote/issues/${issueNumber}/comments`,
+    {
+      method: "POST",
+      headers: {
+        Authorization: `Bearer ${env.YUJONGLEE_GITHUB_TOKEN_REPO}`,
+        Accept: "application/vnd.github.v3+json",
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({ body: comment }),
+    },
+  );
 }
 
 export const feedback = new Hono<AppBindings>();
@@ -151,28 +176,14 @@ feedback.post(
       `**Git Hash:** ${deviceInfo.gitHash}`,
     ].join("\n");
 
-    let logSection = "";
-    if (type === "bug" && logs) {
-      const logSummary = await analyzeLogsWithAI(logs);
-      if (logSummary?.trim()) {
-        logSection = `
-
-## Log Summary
-\`\`\`
-${logSummary}
-\`\`\`
-`;
-      }
-    }
-
     const body =
       type === "bug"
         ? `## Description
 ${trimmedDescription}
 
 ## Device Information
 ${deviceInfoSection}
-${logSection}
+
 ---
 *This issue was submitted from the Hyprnote desktop app.*
 `
@@ -197,6 +208,24 @@ ${deviceInfoSection}
       return c.json({ success: false, error: result.error }, 500);
     }
 
+    if (logs) {
+      const logSummary = await analyzeLogsWithAI(logs);
+      const logComment = `## Log Analysis
+
+${logSummary?.trim() ? `### Summary\n\`\`\`\n${logSummary}\n\`\`\`` : "_No errors or warnings found._"}
+
+<details>
+<summary>Raw Logs (last 10KB)</summary>
+
+\`\`\`
+${logs.slice(-10000)}
+\`\`\`
+
+</details>`;
+
+      await addCommentToIssue(result.number, logComment);
+    }
+
     return c.json({ success: true, issueUrl: result.url }, 200);
   },
 );

apps/desktop/src/components/feedback/feedback-modal.tsx

@@ -1,3 +1,4 @@
+import { fetch as tauriFetch } from "@tauri-apps/plugin-http";
 import { arch, version as osVersion, platform } from "@tauri-apps/plugin-os";
 import { Bug, Lightbulb, X } from "lucide-react";
 import { useCallback, useEffect, useState } from "react";
@@ -8,7 +9,6 @@ import { commands as miscCommands } from "@hypr/plugin-misc";
 import { commands as openerCommands } from "@hypr/plugin-opener2";
 import { commands as tracingCommands } from "@hypr/plugin-tracing";
 import { Button } from "@hypr/ui/components/ui/button";
-import { Checkbox } from "@hypr/ui/components/ui/checkbox";
 import { cn } from "@hypr/utils";
 
 import { env } from "../../env";
@@ -29,22 +29,14 @@ export const useFeedbackModal = create<FeedbackModalStore>((set) => ({
   close: () => set({ isOpen: false }),
 }));
 
-async function openLogsDir(): Promise<boolean> {
-  const result = await tracingCommands.logsDir();
-  if (result.status === "ok") {
-    const revealResult = await openerCommands.revealItemInDir(result.data);
-    return revealResult.status === "ok";
-  }
-  return false;
-}
-
 export function FeedbackModal() {
   const { isOpen, initialType, close } = useFeedbackModal();
   const [type, setType] = useState<FeedbackType>(initialType);
   const [description, setDescription] = useState("");
+  const [attachLogs, setAttachLogs] = useState(true);
   const [isSubmitting, setIsSubmitting] = useState(false);
-  const [gitHash, setGitHash] = useState<string>("");
-  const [attachLogs, setAttachLogs] = useState(false);
+  const [submitStatus, setSubmitStatus] = useState<string>("");
+  const [errorMessage, setErrorMessage] = useState<string>("");
 
   useEffect(() => {
     const handleEscape = (e: KeyboardEvent) => {
@@ -65,98 +57,85 @@ export function FeedbackModal() {
   useEffect(() => {
     if (isOpen) {
       setType(initialType);
-      miscCommands.getGitHash().then((result) => {
-        setGitHash(result.status === "ok" ? result.data : "unknown");
-      });
     } else {
       setDescription("");
-      setGitHash("");
-      setAttachLogs(false);
+      setAttachLogs(true);
+      setSubmitStatus("");
+      setErrorMessage("");
     }
   }, [isOpen, initialType]);
 
   const handleSubmit = useCallback(async () => {
-    if (!description.trim()) {
+    const trimmed = description.trim();
+    if (!trimmed) {
       return;
     }
 
+    if (trimmed.length < 10) {
+      setErrorMessage("Description must be at least 10 characters");
+      return;
+    }
+
+    setErrorMessage("");
     setIsSubmitting(true);
+    setSubmitStatus("Submitting...");
 
     try {
       const gitHashResult = await miscCommands.getGitHash();
       const gitHash =
         gitHashResult.status === "ok" ? gitHashResult.data : "unknown";
 
-      const deviceInfo = [
-        `**Platform:** ${platform()}`,
-        `**Architecture:** ${arch()}`,
-        `**OS Version:** ${osVersion()}`,
-        `**App Version:** ${env.VITE_APP_VERSION ?? "unknown"}`,
-        `**Git Hash:** ${gitHash}`,
-      ].join("\n");
-
-      const trimmedDescription = description.trim();
-      const firstLine = trimmedDescription.split("\n")[0].slice(0, 100).trim();
-      const title =
-        firstLine || (type === "bug" ? "Bug Report" : "Feature Request");
-
-      let logSection = "";
-      if (attachLogs) {
-        const logsOpened = await openLogsDir();
-        if (logsOpened) {
-          logSection = `
-
-## Application Logs
-Logs will be opened in a separate window. Please attach the log file to this issue.
-`;
+      let logs: string | undefined;
+      if (type === "bug" && attachLogs) {
+        setSubmitStatus("Collecting logs...");
+        const logsResult = await tracingCommands.logContent();
+        if (logsResult.status === "ok" && logsResult.data) {
+          logs = logsResult.data.slice(-10000);
         }
       }
 
-      if (type === "bug") {
-        const body = `## Description
-${trimmedDescription}
-
-## Device Information
-${deviceInfo}
-${logSection}
----
-*This issue was submitted from the Hyprnote desktop app.*
-`;
+      setSubmitStatus("Submitting...");
+
+      const response = await tauriFetch(`${env.VITE_API_URL}/feedback/submit`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          type,
+          description: trimmed,
+          logs,
+          deviceInfo: {
+            platform: platform(),
+            arch: arch(),
+            osVersion: osVersion(),
+            appVersion: env.VITE_APP_VERSION ?? "unknown",
+            gitHash,
+          },
+        }),
+      });
 
-        const url = new URL("https://github.com/fastrepl/hyprnote/issues/new");
-        url.searchParams.set("title", title);
-        url.searchParams.set("body", body);
-        url.searchParams.set("labels", "bug,user-reported");
+      const data = (await response.json()) as {
+        success: boolean;
+        issueUrl?: string;
+        error?: string;
+      };
 
-        await openerCommands.openUrl(url.toString(), null);
+      if (data.success && data.issueUrl) {
+        await openerCommands.openUrl(data.issueUrl, null);
+        close();
       } else {
-        const body = `## Feature Request
-${trimmedDescription}
-
-## Submitted From
-${deviceInfo}
-${logSection}
----
-*This feature request was submitted from the Hyprnote desktop app.*
-`;
-
-        const url = new URL(
-          "https://github.com/fastrepl/hyprnote/discussions/new",
-        );
-        url.searchParams.set("category", "ideas");
-        url.searchParams.set("title", title);
-        url.searchParams.set("body", body);
-
-        await openerCommands.openUrl(url.toString(), null);
+        setErrorMessage(data.error ?? "Failed to submit feedback");
       }
-
-      close();
     } catch (error) {
-      console.error("Failed to submit feedback:", error);
+      console.error(
+        "Failed to submit feedback:",
+        error instanceof Error ? error.message : String(error),
+      );
+      setErrorMessage("Failed to submit feedback. Please try again.");
     } finally {
       setIsSubmitting(false);
+      setSubmitStatus("");
     }
-  }, [description, type, close, attachLogs]);
+  }, [description, type, attachLogs, close]);
 
   if (!isOpen) {
     return null;
@@ -234,7 +213,10 @@ ${logSection}
                 <textarea
                   id="feedback-description"
                   value={description}
-                  onChange={(e) => setDescription(e.target.value)}
+                  onChange={(e) => {
+                    setDescription(e.target.value);
+                    if (errorMessage) setErrorMessage("");
+                  }}
                   placeholder={
                     isBug
                       ? "What happened? What did you expect to happen? Steps to reproduce..."
@@ -243,32 +225,30 @@ ${logSection}
                   rows={6}
                   className={cn([
                     "w-full px-2.5 py-1.5 rounded-md",
-                    "border border-neutral-200",
+                    "border",
+                    errorMessage ? "border-red-500" : "border-neutral-200",
                     "text-sm resize-none",
                     "focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-1",
                   ])}
                   maxLength={5000}
                 />
+                {errorMessage && (
+                  <p className="text-xs text-red-500 mt-1">{errorMessage}</p>
+                )}
               </div>
 
-              <div className="flex items-center gap-2">
-                <Checkbox
-                  id="attach-logs"
-                  checked={attachLogs}
-                  onCheckedChange={(checked) => setAttachLogs(checked === true)}
-                />
-                <label
-                  htmlFor="attach-logs"
-                  className="text-sm text-neutral-600 cursor-pointer"
-                >
-                  Open log directory (for manual attachment)
+              {isBug && (
+                <label className="flex items-center gap-2 cursor-pointer">
+                  <input
+                    type="checkbox"
+                    checked={attachLogs}
+                    onChange={(e) => setAttachLogs(e.target.checked)}
+                    className="rounded border-neutral-300"
+                  />
+                  <span className="text-sm text-neutral-600">
+                    Attach app logs to help diagnose the issue
+                  </span>
                 </label>
-              </div>
-
-              {gitHash && (
-                <div className="mt-4 text-[10px] text-neutral-100 font-mono">
-                  {gitHash}
-                </div>
               )}
             </div>
 
@@ -279,7 +259,7 @@ ${logSection}
                 className="h-8 text-sm"
               >
                 {isSubmitting
-                  ? "Opening..."
+                  ? submitStatus || "Opening..."
                   : isBug
                     ? "Report Bug"
                     : "Suggest Feature"}