Update app

app/detector.py

@@ -638,8 +638,14 @@ class CodeSimilarityAnalyzer:
 
 def generate_agent_report(analysis_results: dict) -> str:
     lines = [
-        "### MODULAR RECONSTRUCTION SPECIFICATION",
-        "Target: create a `modular_*.py` file that maximizes reuse of existing Transformers components.",
+        "### MODULAR RECONSTRUCTION SPECIFICATION (FOR AGENT)",
+        "You are operating inside the Transformers repository. Your task is to produce a `modular_*.py` file that",
+        "maximizes reuse of existing Transformers components.",
+        "Purpose: the `modular_model_converter.py` script reads the modular file, resolves inheritance, and",
+        "generates the final `modeling_*.py` file. The modular file should prefer inheriting from existing",
+        "Transformers classes (e.g., attention, MLP, blocks, model heads) rather than starting fresh from",
+        "`nn.Module`, so the generated model shares as much code as possible and only overrides the minimal deltas.",
+        "Use this report to choose those base classes and to decide where custom logic is actually required.",
         "",
     ]
     overall = analysis_results.get("overall", [])
@@ -677,6 +683,7 @@ def generate_agent_report(analysis_results: dict) -> str:
             lines.append(
                 f"- `{query_name}` is near-identical to `{top['match_name']}` in `{top['relative_path']}`."
             )
+            lines.append("  Read both methods and reuse as much as possible through modular inheritance.")
 
     lines.append("\n#### 3. PROMPT STARTER")
     lines.append("```text")

static/app.js

@@ -88,9 +88,9 @@ function setAst(queryAst, matchAst, querySummary, matchSummary) {
     astMatchSummaryEl.textContent = formatSummary(matchSummary);
   }
   if (flowComparisonEl) {
-    const queryFlow = querySummary?.flow ? `Selected flow: ${querySummary.flow}` : "Selected flow unavailable.";
-    const matchFlow = matchSummary?.flow ? `Match flow: ${matchSummary.flow}` : "Match flow unavailable.";
-    flowComparisonEl.textContent = `${queryFlow} | ${matchFlow}`;
+    const queryFlow = querySummary?.flow ? querySummary.flow : "unavailable";
+    const matchFlow = matchSummary?.flow ? matchSummary.flow : "unavailable";
+    flowComparisonEl.textContent = `Selected flow:\n${queryFlow}\n\nMatch flow:\n${matchFlow}`;
   }
 }
 
@@ -199,7 +199,7 @@ function renderBlueprint(byClass) {
     item.addEventListener("click", () => {
       document.querySelectorAll(".blueprint-item").forEach((el) => el.classList.remove("is-active"));
       item.classList.add("is-active");
-      const matchIdentifier = top.top_contributors?.[0]?.match || top.identifier;
+      const matchIdentifier = top.identifier;
       const activeName = document.getElementById("activeModuleName");
       if (activeName) {
         activeName.textContent = `${qcls} vs ${top.class_name}`;

static/styles.css

@@ -274,6 +274,7 @@ textarea {
   padding: 8px 12px;
   border-radius: 12px;
   max-width: 520px;
+  white-space: pre-wrap;
 }
 
 .code-diff-view {