Made all the required changes

Author: bharatmalik-cs

src/output/html-reporter.ts

@@ -563,16 +563,13 @@ export function renderFindingRow(finding: SerializedFinding, idx: number, skippe
     ? `<span class="fix-hint none" title="Malicious code advisory — remove this package">⚠ Malicious</span>`
     : `<span class="fix-hint none" title="No known fix — consider replacing this package">⚠ No fix</span>`;
 
-const depPathHtml = finding.dependencyPaths.length > 0
-    ? finding.dependencyPaths[0].map((node, i, arr) => {
-        const isLast = i === arr.length - 1;
-        const isFirst = i === 0;
-        const label = isFirst
-          ? escapeHtml(node)
-          : `<a href="https://www.npmjs.com/package/${escapeHtml(node)}" target="_blank" rel="noopener noreferrer">${escapeHtml(node)}</a>`;
-        return `<span class="dep-node${isLast ? " vulnerable" : ""}">${label}</span>${isLast ? "" : '<span class="dep-arrow">→</span>'}`;
-      }).join("")
-    : `<span class="dep-node"><a href="https://www.npmjs.com/package/${escapeHtml(finding.package)}" target="_blank" rel="noopener noreferrer">${escapeHtml(finding.package)}</a></span>`;
+  const depPathHtml = finding.dependencyPaths.length > 0
+    finding.dependencyPaths[0].map((node, i, arr) => {
+  const isLast = i === arr.length - 1;
+  const label = escapeHtml(node);
+
+  return `<a href="https://www.npmjs.com/package/${encodeURIComponent(node)}" target="_blank" rel="noopener noreferrer" class="dep-node${isLast ? " vulnerable" : ""}">${label}</a>${isLast ? "" : '<span class="dep-arrow">→</span>'}`;})
+
   const description = finding.vulnerabilities[0]?.summary ?? "";
   const runnable = finding.runnableFixCommand ?? null;
   const recommendedActionHtml = runnable
@@ -585,12 +582,11 @@ const depPathHtml = finding.dependencyPaths.length > 0
   const contextColHtml = finding.relationship === "transitive"
     ? renderTransitiveContextCol(finding)
     : "";
-
+    
   const rootDepsHtml = finding.rootDependencies.length > 0
     ? finding.rootDependencies.map(name => `<span class="root-dep">${escapeHtml(name)}</span>`).join(", ")
     : `<span class="root-dep-none">-</span>`;
-
-  return `      <tr id="row-${idx}" data-skipped="${isSkipped ? '1' : '0'}" onclick="toggleRow(${idx})">
+  return `<tr id="row-${idx}" data-skipped="${isSkipped ? '1' : '0'}" onclick="toggleRow(${idx})">
         <td><span class="expand-icon" id="icon-${idx}">▶</span></td>
         <td><div class="pkg-name"><a href="https://www.npmjs.com/package/${escapeHtml(finding.package)}" target="_blank" rel="noopener noreferrer">${escapeHtml(finding.package)}</a></div><div class="pkg-version">${escapeHtml(finding.version)}</div></td>        <td>${fixHtml}</td>
         <td><span class="sev-badge ${escapeHtml(finding.severity)}">${escapeHtml(finding.severity)}</span></td>