@principal-ade/code-quality-panels 0.1.16 → 0.1.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/panels.bundle.js +1017 -10
- package/dist/panels.bundle.js.map +1 -1
- package/dist/src/components/LensDataDebugPanel.d.ts +93 -0
- package/dist/src/components/LensDataDebugPanel.d.ts.map +1 -0
- package/dist/src/components/LensDataDebugPanel.stories.d.ts +31 -0
- package/dist/src/components/LensDataDebugPanel.stories.d.ts.map +1 -0
- package/dist/src/components/QualityEmptyState.d.ts.map +1 -0
- package/dist/src/components/QualityHexagon.d.ts.map +1 -0
- package/dist/src/components/QualityHexagon.stories.d.ts.map +1 -0
- package/dist/src/components/QualityMetricsList.d.ts +21 -0
- package/dist/src/components/QualityMetricsList.d.ts.map +1 -0
- package/dist/src/components/QualityMetricsList.stories.d.ts +33 -0
- package/dist/src/components/QualityMetricsList.stories.d.ts.map +1 -0
- package/dist/src/components/RepositoryQualityGrid.d.ts.map +1 -0
- package/dist/src/components/RepositoryQualityGrid.stories.d.ts.map +1 -0
- package/dist/{components → src/components}/index.d.ts +2 -0
- package/dist/src/components/index.d.ts.map +1 -0
- package/dist/{index.d.ts → src/index.d.ts} +3 -0
- package/dist/src/index.d.ts.map +1 -0
- package/dist/src/lib/utils.d.ts.map +1 -0
- package/dist/src/mocks/panelContext.d.ts.map +1 -0
- package/dist/src/panels/LensDataDebugPanel.d.ts +13 -0
- package/dist/src/panels/LensDataDebugPanel.d.ts.map +1 -0
- package/dist/src/panels/LensDataDebugPanel.stories.d.ts +46 -0
- package/dist/src/panels/LensDataDebugPanel.stories.d.ts.map +1 -0
- package/dist/src/panels/QualityHexagonPanel.d.ts.map +1 -0
- package/dist/src/panels/QualityHexagonPanel.stories.d.ts.map +1 -0
- package/dist/src/panels/RepositoryQualityGridPanel.d.ts.map +1 -0
- package/dist/src/panels/RepositoryQualityGridPanel.stories.d.ts.map +1 -0
- package/dist/src/tools/index.d.ts.map +1 -0
- package/dist/src/types/index.d.ts.map +1 -0
- package/package.json +4 -4
- package/dist/components/QualityEmptyState.d.ts.map +0 -1
- package/dist/components/QualityHexagon.d.ts.map +0 -1
- package/dist/components/QualityHexagon.stories.d.ts.map +0 -1
- package/dist/components/RepositoryQualityGrid.d.ts.map +0 -1
- package/dist/components/RepositoryQualityGrid.stories.d.ts.map +0 -1
- package/dist/components/index.d.ts.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/lib/utils.d.ts.map +0 -1
- package/dist/mocks/panelContext.d.ts.map +0 -1
- package/dist/panels/QualityHexagonPanel.d.ts.map +0 -1
- package/dist/panels/QualityHexagonPanel.stories.d.ts.map +0 -1
- package/dist/panels/RepositoryQualityGridPanel.d.ts.map +0 -1
- package/dist/panels/RepositoryQualityGridPanel.stories.d.ts.map +0 -1
- package/dist/tools/index.d.ts.map +0 -1
- package/dist/types/index.d.ts.map +0 -1
- /package/dist/{components → src/components}/QualityEmptyState.d.ts +0 -0
- /package/dist/{components → src/components}/QualityHexagon.d.ts +0 -0
- /package/dist/{components → src/components}/QualityHexagon.stories.d.ts +0 -0
- /package/dist/{components → src/components}/RepositoryQualityGrid.d.ts +0 -0
- /package/dist/{components → src/components}/RepositoryQualityGrid.stories.d.ts +0 -0
- /package/dist/{lib → src/lib}/utils.d.ts +0 -0
- /package/dist/{mocks → src/mocks}/panelContext.d.ts +0 -0
- /package/dist/{panels → src/panels}/QualityHexagonPanel.d.ts +0 -0
- /package/dist/{panels → src/panels}/QualityHexagonPanel.stories.d.ts +0 -0
- /package/dist/{panels → src/panels}/RepositoryQualityGridPanel.d.ts +0 -0
- /package/dist/{panels → src/panels}/RepositoryQualityGridPanel.stories.d.ts +0 -0
- /package/dist/{tools → src/tools}/index.d.ts +0 -0
- /package/dist/{types → src/types}/index.d.ts +0 -0
package/dist/panels.bundle.js
CHANGED
|
@@ -106,7 +106,7 @@ const createLucideIcon = (iconName, iconNode) => {
|
|
|
106
106
|
* This source code is licensed under the ISC license.
|
|
107
107
|
* See the LICENSE file in the root directory of this source tree.
|
|
108
108
|
*/
|
|
109
|
-
const __iconNode$
|
|
109
|
+
const __iconNode$e = [
|
|
110
110
|
["path", { d: "M12 7v14", key: "1akyts" }],
|
|
111
111
|
[
|
|
112
112
|
"path",
|
|
@@ -116,14 +116,14 @@ const __iconNode$d = [
|
|
|
116
116
|
}
|
|
117
117
|
]
|
|
118
118
|
];
|
|
119
|
-
const BookOpen = createLucideIcon("book-open", __iconNode$
|
|
119
|
+
const BookOpen = createLucideIcon("book-open", __iconNode$e);
|
|
120
120
|
/**
|
|
121
121
|
* @license lucide-react v0.552.0 - ISC
|
|
122
122
|
*
|
|
123
123
|
* This source code is licensed under the ISC license.
|
|
124
124
|
* See the LICENSE file in the root directory of this source tree.
|
|
125
125
|
*/
|
|
126
|
-
const __iconNode$
|
|
126
|
+
const __iconNode$d = [
|
|
127
127
|
[
|
|
128
128
|
"path",
|
|
129
129
|
{ d: "M8 3H7a2 2 0 0 0-2 2v5a2 2 0 0 1-2 2 2 2 0 0 1 2 2v5c0 1.1.9 2 2 2h1", key: "ezmyqa" }
|
|
@@ -136,7 +136,27 @@ const __iconNode$c = [
|
|
|
136
136
|
}
|
|
137
137
|
]
|
|
138
138
|
];
|
|
139
|
-
const Braces = createLucideIcon("braces", __iconNode$
|
|
139
|
+
const Braces = createLucideIcon("braces", __iconNode$d);
|
|
140
|
+
/**
|
|
141
|
+
* @license lucide-react v0.552.0 - ISC
|
|
142
|
+
*
|
|
143
|
+
* This source code is licensed under the ISC license.
|
|
144
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
145
|
+
*/
|
|
146
|
+
const __iconNode$c = [
|
|
147
|
+
["path", { d: "M12 20v-9", key: "1qisl0" }],
|
|
148
|
+
["path", { d: "M14 7a4 4 0 0 1 4 4v3a6 6 0 0 1-12 0v-3a4 4 0 0 1 4-4z", key: "uouzyp" }],
|
|
149
|
+
["path", { d: "M14.12 3.88 16 2", key: "qol33r" }],
|
|
150
|
+
["path", { d: "M21 21a4 4 0 0 0-3.81-4", key: "1b0z45" }],
|
|
151
|
+
["path", { d: "M21 5a4 4 0 0 1-3.55 3.97", key: "5cxbf6" }],
|
|
152
|
+
["path", { d: "M22 13h-4", key: "1jl80f" }],
|
|
153
|
+
["path", { d: "M3 21a4 4 0 0 1 3.81-4", key: "1fjd4g" }],
|
|
154
|
+
["path", { d: "M3 5a4 4 0 0 0 3.55 3.97", key: "1d7oge" }],
|
|
155
|
+
["path", { d: "M6 13H2", key: "82j7cp" }],
|
|
156
|
+
["path", { d: "m8 2 1.88 1.88", key: "fmnt4t" }],
|
|
157
|
+
["path", { d: "M9 7.13V6a3 3 0 1 1 6 0v1.13", key: "1vgav8" }]
|
|
158
|
+
];
|
|
159
|
+
const Bug = createLucideIcon("bug", __iconNode$c);
|
|
140
160
|
/**
|
|
141
161
|
* @license lucide-react v0.552.0 - ISC
|
|
142
162
|
*
|
|
@@ -369,7 +389,7 @@ function getThemeColors(theme) {
|
|
|
369
389
|
}
|
|
370
390
|
};
|
|
371
391
|
}
|
|
372
|
-
function getValueColor$
|
|
392
|
+
function getValueColor$2(value, key) {
|
|
373
393
|
const effectiveValue = key === "deadCode" ? 100 - value : value;
|
|
374
394
|
if (effectiveValue >= 80) return "#2E7D32";
|
|
375
395
|
if (effectiveValue >= 60) return "#E6A700";
|
|
@@ -750,7 +770,7 @@ function QualityHexagonDetailed({
|
|
|
750
770
|
/* @__PURE__ */ jsxs("span", { style: {
|
|
751
771
|
fontSize: 14,
|
|
752
772
|
fontWeight: 500,
|
|
753
|
-
color: getValueColor$
|
|
773
|
+
color: getValueColor$2(value, key)
|
|
754
774
|
}, children: [
|
|
755
775
|
value,
|
|
756
776
|
"%"
|
|
@@ -949,7 +969,7 @@ function QualityHexagonExpandable({
|
|
|
949
969
|
/* @__PURE__ */ jsxs("span", { style: {
|
|
950
970
|
fontSize: 14,
|
|
951
971
|
fontWeight: 500,
|
|
952
|
-
color: getValueColor$
|
|
972
|
+
color: getValueColor$2(value, key)
|
|
953
973
|
}, children: [
|
|
954
974
|
value,
|
|
955
975
|
"%"
|
|
@@ -1682,7 +1702,7 @@ function formatLabel(item, showRepositoryName, isSameAsRepo) {
|
|
|
1682
1702
|
}
|
|
1683
1703
|
return `${item.repositoryName} / ${item.packageName}`;
|
|
1684
1704
|
}
|
|
1685
|
-
function getValueColor(value, key) {
|
|
1705
|
+
function getValueColor$1(value, key) {
|
|
1686
1706
|
const effectiveValue = key === "deadCode" ? 100 - value : value;
|
|
1687
1707
|
if (effectiveValue >= 80) return "#2E7D32";
|
|
1688
1708
|
if (effectiveValue >= 60) return "#E6A700";
|
|
@@ -1715,7 +1735,7 @@ function RepositoryQualityGridItem({
|
|
|
1715
1735
|
return {
|
|
1716
1736
|
label: option.label,
|
|
1717
1737
|
value,
|
|
1718
|
-
valueColor: getValueColor(value, selectedMetric)
|
|
1738
|
+
valueColor: getValueColor$1(value, selectedMetric)
|
|
1719
1739
|
};
|
|
1720
1740
|
}
|
|
1721
1741
|
}
|
|
@@ -1723,7 +1743,7 @@ function RepositoryQualityGridItem({
|
|
|
1723
1743
|
return {
|
|
1724
1744
|
label: hoveredVertex.label,
|
|
1725
1745
|
value: hoveredVertex.value,
|
|
1726
|
-
valueColor: getValueColor(hoveredVertex.value, hoveredVertex.key)
|
|
1746
|
+
valueColor: getValueColor$1(hoveredVertex.value, hoveredVertex.key)
|
|
1727
1747
|
};
|
|
1728
1748
|
}
|
|
1729
1749
|
return null;
|
|
@@ -2165,6 +2185,963 @@ const RepositoryQualityGridPanelContent = ({
|
|
|
2165
2185
|
);
|
|
2166
2186
|
};
|
|
2167
2187
|
const RepositoryQualityGridPanel = RepositoryQualityGridPanelContent;
|
|
2188
|
+
function groupResultsByPackage(results) {
|
|
2189
|
+
const map = /* @__PURE__ */ new Map();
|
|
2190
|
+
for (const result of results) {
|
|
2191
|
+
const key = result.package.name;
|
|
2192
|
+
const existing = map.get(key) || [];
|
|
2193
|
+
existing.push(result);
|
|
2194
|
+
map.set(key, existing);
|
|
2195
|
+
}
|
|
2196
|
+
return map;
|
|
2197
|
+
}
|
|
2198
|
+
function getFilesWithIssues(issues) {
|
|
2199
|
+
const fileMap = /* @__PURE__ */ new Map();
|
|
2200
|
+
for (const issue of issues) {
|
|
2201
|
+
if (!issue.file) continue;
|
|
2202
|
+
const existing = fileMap.get(issue.file) || [];
|
|
2203
|
+
existing.push(issue);
|
|
2204
|
+
fileMap.set(issue.file, existing);
|
|
2205
|
+
}
|
|
2206
|
+
return fileMap;
|
|
2207
|
+
}
|
|
2208
|
+
function getSeverityColor(severity) {
|
|
2209
|
+
switch (severity) {
|
|
2210
|
+
case "error":
|
|
2211
|
+
return "#ef4444";
|
|
2212
|
+
case "warning":
|
|
2213
|
+
return "#f59e0b";
|
|
2214
|
+
case "info":
|
|
2215
|
+
return "#3b82f6";
|
|
2216
|
+
case "hint":
|
|
2217
|
+
return "#6b7280";
|
|
2218
|
+
default:
|
|
2219
|
+
return "#6b7280";
|
|
2220
|
+
}
|
|
2221
|
+
}
|
|
2222
|
+
function getSeverityBg(severity) {
|
|
2223
|
+
switch (severity) {
|
|
2224
|
+
case "error":
|
|
2225
|
+
return "rgba(239, 68, 68, 0.1)";
|
|
2226
|
+
case "warning":
|
|
2227
|
+
return "rgba(245, 158, 11, 0.1)";
|
|
2228
|
+
case "info":
|
|
2229
|
+
return "rgba(59, 130, 246, 0.1)";
|
|
2230
|
+
case "hint":
|
|
2231
|
+
return "rgba(107, 114, 128, 0.1)";
|
|
2232
|
+
default:
|
|
2233
|
+
return "rgba(107, 114, 128, 0.1)";
|
|
2234
|
+
}
|
|
2235
|
+
}
|
|
2236
|
+
function getPackageSummary(results) {
|
|
2237
|
+
let totalErrors = 0;
|
|
2238
|
+
let totalWarnings = 0;
|
|
2239
|
+
let passCount = 0;
|
|
2240
|
+
let failCount = 0;
|
|
2241
|
+
for (const result of results) {
|
|
2242
|
+
totalErrors += result.metrics.issuesBySeverity.error;
|
|
2243
|
+
totalWarnings += result.metrics.issuesBySeverity.warning;
|
|
2244
|
+
if (result.execution.success) {
|
|
2245
|
+
passCount++;
|
|
2246
|
+
} else {
|
|
2247
|
+
failCount++;
|
|
2248
|
+
}
|
|
2249
|
+
}
|
|
2250
|
+
return { totalErrors, totalWarnings, passCount, failCount, lensCount: results.length };
|
|
2251
|
+
}
|
|
2252
|
+
function LensDataDebugPanel$1({
|
|
2253
|
+
data,
|
|
2254
|
+
theme,
|
|
2255
|
+
className,
|
|
2256
|
+
selectedPackage: initialSelectedPackage,
|
|
2257
|
+
onFileClick,
|
|
2258
|
+
onPackageSelect
|
|
2259
|
+
}) {
|
|
2260
|
+
const packageGroups = React2.useMemo(() => groupResultsByPackage(data.results), [data.results]);
|
|
2261
|
+
const packageNames = React2.useMemo(() => Array.from(packageGroups.keys()), [packageGroups]);
|
|
2262
|
+
const [selectedPackage, setSelectedPackage] = React2.useState(
|
|
2263
|
+
initialSelectedPackage || (packageNames.length === 1 ? packageNames[0] : null)
|
|
2264
|
+
);
|
|
2265
|
+
const [expandedLens, setExpandedLens] = React2.useState(null);
|
|
2266
|
+
const [expandedFiles, setExpandedFiles] = React2.useState(/* @__PURE__ */ new Set());
|
|
2267
|
+
const handlePackageSelect = (pkg) => {
|
|
2268
|
+
setSelectedPackage(pkg);
|
|
2269
|
+
setExpandedLens(null);
|
|
2270
|
+
setExpandedFiles(/* @__PURE__ */ new Set());
|
|
2271
|
+
onPackageSelect == null ? void 0 : onPackageSelect(pkg);
|
|
2272
|
+
};
|
|
2273
|
+
const toggleLens = (lensId) => {
|
|
2274
|
+
setExpandedLens(expandedLens === lensId ? null : lensId);
|
|
2275
|
+
setExpandedFiles(/* @__PURE__ */ new Set());
|
|
2276
|
+
};
|
|
2277
|
+
const toggleFile = (file) => {
|
|
2278
|
+
const newSet = new Set(expandedFiles);
|
|
2279
|
+
if (newSet.has(file)) {
|
|
2280
|
+
newSet.delete(file);
|
|
2281
|
+
} else {
|
|
2282
|
+
newSet.add(file);
|
|
2283
|
+
}
|
|
2284
|
+
setExpandedFiles(newSet);
|
|
2285
|
+
};
|
|
2286
|
+
const selectedResults = selectedPackage ? packageGroups.get(selectedPackage) || [] : [];
|
|
2287
|
+
return /* @__PURE__ */ jsxs(
|
|
2288
|
+
"div",
|
|
2289
|
+
{
|
|
2290
|
+
className: cn(className),
|
|
2291
|
+
style: {
|
|
2292
|
+
display: "flex",
|
|
2293
|
+
flexDirection: "column",
|
|
2294
|
+
gap: 8,
|
|
2295
|
+
padding: 16,
|
|
2296
|
+
backgroundColor: theme.colors.background,
|
|
2297
|
+
fontFamily: "monospace",
|
|
2298
|
+
fontSize: 13
|
|
2299
|
+
},
|
|
2300
|
+
children: [
|
|
2301
|
+
packageNames.length > 1 && /* @__PURE__ */ jsx("div", { style: {
|
|
2302
|
+
display: "flex",
|
|
2303
|
+
flexWrap: "wrap",
|
|
2304
|
+
gap: 8,
|
|
2305
|
+
marginBottom: 8
|
|
2306
|
+
}, children: packageNames.map((pkg) => {
|
|
2307
|
+
const summary = getPackageSummary(packageGroups.get(pkg) || []);
|
|
2308
|
+
const isSelected = selectedPackage === pkg;
|
|
2309
|
+
return /* @__PURE__ */ jsxs(
|
|
2310
|
+
"button",
|
|
2311
|
+
{
|
|
2312
|
+
onClick: () => handlePackageSelect(pkg),
|
|
2313
|
+
style: {
|
|
2314
|
+
display: "flex",
|
|
2315
|
+
alignItems: "center",
|
|
2316
|
+
gap: 8,
|
|
2317
|
+
padding: "8px 12px",
|
|
2318
|
+
borderRadius: 6,
|
|
2319
|
+
border: `1px solid ${isSelected ? theme.colors.primary : theme.colors.border}`,
|
|
2320
|
+
backgroundColor: isSelected ? theme.colors.surface : "transparent",
|
|
2321
|
+
color: theme.colors.text,
|
|
2322
|
+
cursor: "pointer",
|
|
2323
|
+
transition: "all 0.15s ease"
|
|
2324
|
+
},
|
|
2325
|
+
children: [
|
|
2326
|
+
/* @__PURE__ */ jsx("span", { style: { fontWeight: 500 }, children: pkg }),
|
|
2327
|
+
/* @__PURE__ */ jsxs("span", { style: {
|
|
2328
|
+
fontSize: 11,
|
|
2329
|
+
padding: "2px 6px",
|
|
2330
|
+
borderRadius: 4,
|
|
2331
|
+
backgroundColor: summary.totalErrors > 0 ? getSeverityBg("error") : summary.totalWarnings > 0 ? getSeverityBg("warning") : "rgba(34, 197, 94, 0.1)",
|
|
2332
|
+
color: summary.totalErrors > 0 ? getSeverityColor("error") : summary.totalWarnings > 0 ? getSeverityColor("warning") : "#22c55e"
|
|
2333
|
+
}, children: [
|
|
2334
|
+
summary.passCount,
|
|
2335
|
+
"/",
|
|
2336
|
+
summary.lensCount,
|
|
2337
|
+
" pass"
|
|
2338
|
+
] })
|
|
2339
|
+
]
|
|
2340
|
+
},
|
|
2341
|
+
pkg
|
|
2342
|
+
);
|
|
2343
|
+
}) }),
|
|
2344
|
+
packageNames.length === 1 && /* @__PURE__ */ jsxs("div", { style: {
|
|
2345
|
+
display: "flex",
|
|
2346
|
+
alignItems: "center",
|
|
2347
|
+
gap: 12,
|
|
2348
|
+
padding: "8px 12px",
|
|
2349
|
+
backgroundColor: theme.colors.surface,
|
|
2350
|
+
borderRadius: 6,
|
|
2351
|
+
marginBottom: 8
|
|
2352
|
+
}, children: [
|
|
2353
|
+
/* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: theme.colors.text }, children: packageNames[0] }),
|
|
2354
|
+
(() => {
|
|
2355
|
+
const summary = getPackageSummary(selectedResults);
|
|
2356
|
+
return /* @__PURE__ */ jsxs("span", { style: {
|
|
2357
|
+
fontSize: 11,
|
|
2358
|
+
padding: "2px 6px",
|
|
2359
|
+
borderRadius: 4,
|
|
2360
|
+
backgroundColor: summary.totalErrors > 0 ? getSeverityBg("error") : summary.totalWarnings > 0 ? getSeverityBg("warning") : "rgba(34, 197, 94, 0.1)",
|
|
2361
|
+
color: summary.totalErrors > 0 ? getSeverityColor("error") : summary.totalWarnings > 0 ? getSeverityColor("warning") : "#22c55e"
|
|
2362
|
+
}, children: [
|
|
2363
|
+
summary.passCount,
|
|
2364
|
+
"/",
|
|
2365
|
+
summary.lensCount,
|
|
2366
|
+
" pass"
|
|
2367
|
+
] });
|
|
2368
|
+
})()
|
|
2369
|
+
] }),
|
|
2370
|
+
!selectedPackage && packageNames.length > 1 && /* @__PURE__ */ jsx("div", { style: {
|
|
2371
|
+
padding: 24,
|
|
2372
|
+
textAlign: "center",
|
|
2373
|
+
color: theme.colors.textMuted,
|
|
2374
|
+
backgroundColor: theme.colors.surface,
|
|
2375
|
+
borderRadius: 6
|
|
2376
|
+
}, children: "Select a package above to view lens results" }),
|
|
2377
|
+
selectedPackage && selectedResults.map((result, idx) => {
|
|
2378
|
+
const lensKey = `${result.lens.id}-${idx}`;
|
|
2379
|
+
const isExpanded = expandedLens === lensKey;
|
|
2380
|
+
const filesWithIssues = getFilesWithIssues(result.issues);
|
|
2381
|
+
const hasIssues = result.issues.length > 0;
|
|
2382
|
+
return /* @__PURE__ */ jsxs(
|
|
2383
|
+
"div",
|
|
2384
|
+
{
|
|
2385
|
+
style: {
|
|
2386
|
+
border: `1px solid ${theme.colors.border}`,
|
|
2387
|
+
borderRadius: 6,
|
|
2388
|
+
overflow: "hidden"
|
|
2389
|
+
},
|
|
2390
|
+
children: [
|
|
2391
|
+
/* @__PURE__ */ jsxs(
|
|
2392
|
+
"div",
|
|
2393
|
+
{
|
|
2394
|
+
onClick: () => toggleLens(lensKey),
|
|
2395
|
+
style: {
|
|
2396
|
+
display: "flex",
|
|
2397
|
+
alignItems: "center",
|
|
2398
|
+
justifyContent: "space-between",
|
|
2399
|
+
padding: "10px 12px",
|
|
2400
|
+
backgroundColor: theme.colors.surface,
|
|
2401
|
+
cursor: "pointer",
|
|
2402
|
+
gap: 12
|
|
2403
|
+
},
|
|
2404
|
+
children: [
|
|
2405
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
2406
|
+
/* @__PURE__ */ jsx(
|
|
2407
|
+
"svg",
|
|
2408
|
+
{
|
|
2409
|
+
width: "14",
|
|
2410
|
+
height: "14",
|
|
2411
|
+
viewBox: "0 0 24 24",
|
|
2412
|
+
fill: "none",
|
|
2413
|
+
stroke: theme.colors.textMuted,
|
|
2414
|
+
strokeWidth: "2",
|
|
2415
|
+
style: {
|
|
2416
|
+
transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)",
|
|
2417
|
+
transition: "transform 0.15s ease"
|
|
2418
|
+
},
|
|
2419
|
+
children: /* @__PURE__ */ jsx("polyline", { points: "9,18 15,12 9,6" })
|
|
2420
|
+
}
|
|
2421
|
+
),
|
|
2422
|
+
/* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: theme.colors.text }, children: result.lens.id }),
|
|
2423
|
+
/* @__PURE__ */ jsxs("span", { style: { color: theme.colors.textMuted }, children: [
|
|
2424
|
+
"(",
|
|
2425
|
+
result.lens.command,
|
|
2426
|
+
")"
|
|
2427
|
+
] })
|
|
2428
|
+
] }),
|
|
2429
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
|
|
2430
|
+
/* @__PURE__ */ jsx("span", { style: {
|
|
2431
|
+
padding: "2px 6px",
|
|
2432
|
+
borderRadius: 4,
|
|
2433
|
+
fontSize: 11,
|
|
2434
|
+
backgroundColor: result.execution.success ? "rgba(34, 197, 94, 0.1)" : "rgba(239, 68, 68, 0.1)",
|
|
2435
|
+
color: result.execution.success ? "#22c55e" : "#ef4444"
|
|
2436
|
+
}, children: result.execution.success ? "pass" : "fail" }),
|
|
2437
|
+
hasIssues && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 6 }, children: [
|
|
2438
|
+
result.metrics.issuesBySeverity.error > 0 && /* @__PURE__ */ jsxs("span", { style: {
|
|
2439
|
+
padding: "2px 6px",
|
|
2440
|
+
borderRadius: 4,
|
|
2441
|
+
fontSize: 11,
|
|
2442
|
+
backgroundColor: getSeverityBg("error"),
|
|
2443
|
+
color: getSeverityColor("error")
|
|
2444
|
+
}, children: [
|
|
2445
|
+
result.metrics.issuesBySeverity.error,
|
|
2446
|
+
" errors"
|
|
2447
|
+
] }),
|
|
2448
|
+
result.metrics.issuesBySeverity.warning > 0 && /* @__PURE__ */ jsxs("span", { style: {
|
|
2449
|
+
padding: "2px 6px",
|
|
2450
|
+
borderRadius: 4,
|
|
2451
|
+
fontSize: 11,
|
|
2452
|
+
backgroundColor: getSeverityBg("warning"),
|
|
2453
|
+
color: getSeverityColor("warning")
|
|
2454
|
+
}, children: [
|
|
2455
|
+
result.metrics.issuesBySeverity.warning,
|
|
2456
|
+
" warnings"
|
|
2457
|
+
] })
|
|
2458
|
+
] }),
|
|
2459
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: theme.colors.textMuted }, children: [
|
|
2460
|
+
result.metrics.filesAnalyzed,
|
|
2461
|
+
" files"
|
|
2462
|
+
] })
|
|
2463
|
+
] })
|
|
2464
|
+
]
|
|
2465
|
+
}
|
|
2466
|
+
),
|
|
2467
|
+
isExpanded && /* @__PURE__ */ jsxs("div", { style: {
|
|
2468
|
+
padding: 12,
|
|
2469
|
+
backgroundColor: theme.colors.backgroundLight,
|
|
2470
|
+
borderTop: `1px solid ${theme.colors.border}`
|
|
2471
|
+
}, children: [
|
|
2472
|
+
/* @__PURE__ */ jsxs("div", { style: {
|
|
2473
|
+
display: "grid",
|
|
2474
|
+
gridTemplateColumns: "repeat(auto-fit, minmax(120px, 1fr))",
|
|
2475
|
+
gap: 8,
|
|
2476
|
+
marginBottom: 16,
|
|
2477
|
+
padding: 12,
|
|
2478
|
+
backgroundColor: theme.colors.surface,
|
|
2479
|
+
borderRadius: 4
|
|
2480
|
+
}, children: [
|
|
2481
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
2482
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Files Analyzed" }),
|
|
2483
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: result.metrics.filesAnalyzed })
|
|
2484
|
+
] }),
|
|
2485
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
2486
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Total Issues" }),
|
|
2487
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: result.metrics.totalIssues })
|
|
2488
|
+
] }),
|
|
2489
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
2490
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Duration" }),
|
|
2491
|
+
/* @__PURE__ */ jsxs("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: [
|
|
2492
|
+
result.execution.duration || 0,
|
|
2493
|
+
"ms"
|
|
2494
|
+
] })
|
|
2495
|
+
] }),
|
|
2496
|
+
result.coverage && /* @__PURE__ */ jsxs("div", { children: [
|
|
2497
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Coverage" }),
|
|
2498
|
+
/* @__PURE__ */ jsxs("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: [
|
|
2499
|
+
result.coverage.line,
|
|
2500
|
+
"%"
|
|
2501
|
+
] })
|
|
2502
|
+
] })
|
|
2503
|
+
] }),
|
|
2504
|
+
filesWithIssues.size > 0 ? /* @__PURE__ */ jsxs("div", { children: [
|
|
2505
|
+
/* @__PURE__ */ jsxs("div", { style: {
|
|
2506
|
+
fontSize: 12,
|
|
2507
|
+
fontWeight: 600,
|
|
2508
|
+
color: theme.colors.textMuted,
|
|
2509
|
+
marginBottom: 8
|
|
2510
|
+
}, children: [
|
|
2511
|
+
"Files with Issues (",
|
|
2512
|
+
filesWithIssues.size,
|
|
2513
|
+
")"
|
|
2514
|
+
] }),
|
|
2515
|
+
/* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: Array.from(filesWithIssues.entries()).map(([file, issues]) => {
|
|
2516
|
+
const isFileExpanded = expandedFiles.has(file);
|
|
2517
|
+
return /* @__PURE__ */ jsxs(
|
|
2518
|
+
"div",
|
|
2519
|
+
{
|
|
2520
|
+
style: {
|
|
2521
|
+
border: `1px solid ${theme.colors.border}`,
|
|
2522
|
+
borderRadius: 4,
|
|
2523
|
+
overflow: "hidden"
|
|
2524
|
+
},
|
|
2525
|
+
children: [
|
|
2526
|
+
/* @__PURE__ */ jsxs(
|
|
2527
|
+
"div",
|
|
2528
|
+
{
|
|
2529
|
+
onClick: () => toggleFile(file),
|
|
2530
|
+
style: {
|
|
2531
|
+
display: "flex",
|
|
2532
|
+
alignItems: "center",
|
|
2533
|
+
justifyContent: "space-between",
|
|
2534
|
+
padding: "8px 10px",
|
|
2535
|
+
backgroundColor: theme.colors.surface,
|
|
2536
|
+
cursor: "pointer"
|
|
2537
|
+
},
|
|
2538
|
+
children: [
|
|
2539
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
|
|
2540
|
+
/* @__PURE__ */ jsx(
|
|
2541
|
+
"svg",
|
|
2542
|
+
{
|
|
2543
|
+
width: "12",
|
|
2544
|
+
height: "12",
|
|
2545
|
+
viewBox: "0 0 24 24",
|
|
2546
|
+
fill: "none",
|
|
2547
|
+
stroke: theme.colors.textMuted,
|
|
2548
|
+
strokeWidth: "2",
|
|
2549
|
+
style: {
|
|
2550
|
+
transform: isFileExpanded ? "rotate(90deg)" : "rotate(0deg)",
|
|
2551
|
+
transition: "transform 0.15s ease"
|
|
2552
|
+
},
|
|
2553
|
+
children: /* @__PURE__ */ jsx("polyline", { points: "9,18 15,12 9,6" })
|
|
2554
|
+
}
|
|
2555
|
+
),
|
|
2556
|
+
/* @__PURE__ */ jsx(
|
|
2557
|
+
"span",
|
|
2558
|
+
{
|
|
2559
|
+
style: {
|
|
2560
|
+
color: theme.colors.text,
|
|
2561
|
+
cursor: onFileClick ? "pointer" : "default"
|
|
2562
|
+
},
|
|
2563
|
+
onClick: (e) => {
|
|
2564
|
+
if (onFileClick) {
|
|
2565
|
+
e.stopPropagation();
|
|
2566
|
+
onFileClick(file);
|
|
2567
|
+
}
|
|
2568
|
+
},
|
|
2569
|
+
children: file
|
|
2570
|
+
}
|
|
2571
|
+
)
|
|
2572
|
+
] }),
|
|
2573
|
+
/* @__PURE__ */ jsxs("span", { style: {
|
|
2574
|
+
fontSize: 11,
|
|
2575
|
+
padding: "2px 6px",
|
|
2576
|
+
borderRadius: 4,
|
|
2577
|
+
backgroundColor: getSeverityBg("error"),
|
|
2578
|
+
color: getSeverityColor("error")
|
|
2579
|
+
}, children: [
|
|
2580
|
+
issues.length,
|
|
2581
|
+
" issues"
|
|
2582
|
+
] })
|
|
2583
|
+
]
|
|
2584
|
+
}
|
|
2585
|
+
),
|
|
2586
|
+
isFileExpanded && /* @__PURE__ */ jsx("div", { style: {
|
|
2587
|
+
padding: 8,
|
|
2588
|
+
backgroundColor: theme.colors.background,
|
|
2589
|
+
borderTop: `1px solid ${theme.colors.border}`,
|
|
2590
|
+
maxHeight: 300,
|
|
2591
|
+
overflow: "auto"
|
|
2592
|
+
}, children: issues.map((issue, issueIdx) => /* @__PURE__ */ jsxs(
|
|
2593
|
+
"div",
|
|
2594
|
+
{
|
|
2595
|
+
onClick: () => onFileClick == null ? void 0 : onFileClick(file, issue.line),
|
|
2596
|
+
style: {
|
|
2597
|
+
display: "flex",
|
|
2598
|
+
gap: 8,
|
|
2599
|
+
padding: "6px 8px",
|
|
2600
|
+
borderRadius: 4,
|
|
2601
|
+
cursor: onFileClick ? "pointer" : "default",
|
|
2602
|
+
transition: "background-color 0.1s ease"
|
|
2603
|
+
},
|
|
2604
|
+
onMouseEnter: (e) => {
|
|
2605
|
+
e.currentTarget.style.backgroundColor = theme.colors.surface;
|
|
2606
|
+
},
|
|
2607
|
+
onMouseLeave: (e) => {
|
|
2608
|
+
e.currentTarget.style.backgroundColor = "transparent";
|
|
2609
|
+
},
|
|
2610
|
+
children: [
|
|
2611
|
+
/* @__PURE__ */ jsxs("span", { style: {
|
|
2612
|
+
fontSize: 11,
|
|
2613
|
+
color: theme.colors.textMuted,
|
|
2614
|
+
minWidth: 45
|
|
2615
|
+
}, children: [
|
|
2616
|
+
"L",
|
|
2617
|
+
issue.line
|
|
2618
|
+
] }),
|
|
2619
|
+
/* @__PURE__ */ jsx("span", { style: {
|
|
2620
|
+
fontSize: 10,
|
|
2621
|
+
padding: "1px 4px",
|
|
2622
|
+
borderRadius: 3,
|
|
2623
|
+
backgroundColor: getSeverityBg(issue.severity),
|
|
2624
|
+
color: getSeverityColor(issue.severity),
|
|
2625
|
+
textTransform: "uppercase"
|
|
2626
|
+
}, children: issue.severity.charAt(0) }),
|
|
2627
|
+
/* @__PURE__ */ jsx("span", { style: {
|
|
2628
|
+
flex: 1,
|
|
2629
|
+
fontSize: 12,
|
|
2630
|
+
color: theme.colors.text
|
|
2631
|
+
}, children: issue.message }),
|
|
2632
|
+
issue.rule && /* @__PURE__ */ jsx("span", { style: {
|
|
2633
|
+
fontSize: 10,
|
|
2634
|
+
color: theme.colors.textMuted,
|
|
2635
|
+
opacity: 0.7
|
|
2636
|
+
}, children: issue.rule })
|
|
2637
|
+
]
|
|
2638
|
+
},
|
|
2639
|
+
issueIdx
|
|
2640
|
+
)) })
|
|
2641
|
+
]
|
|
2642
|
+
},
|
|
2643
|
+
file
|
|
2644
|
+
);
|
|
2645
|
+
}) })
|
|
2646
|
+
] }) : /* @__PURE__ */ jsx("div", { style: {
|
|
2647
|
+
padding: 16,
|
|
2648
|
+
textAlign: "center",
|
|
2649
|
+
color: theme.colors.textMuted,
|
|
2650
|
+
backgroundColor: theme.colors.surface,
|
|
2651
|
+
borderRadius: 4
|
|
2652
|
+
}, children: "No issues found" }),
|
|
2653
|
+
result.fileMetrics && result.fileMetrics.length > 0 && /* @__PURE__ */ jsxs("div", { style: { marginTop: 16 }, children: [
|
|
2654
|
+
/* @__PURE__ */ jsxs("div", { style: {
|
|
2655
|
+
fontSize: 12,
|
|
2656
|
+
fontWeight: 600,
|
|
2657
|
+
color: theme.colors.textMuted,
|
|
2658
|
+
marginBottom: 8
|
|
2659
|
+
}, children: [
|
|
2660
|
+
"File Metrics (",
|
|
2661
|
+
result.fileMetrics.length,
|
|
2662
|
+
")"
|
|
2663
|
+
] }),
|
|
2664
|
+
/* @__PURE__ */ jsx("div", { style: {
|
|
2665
|
+
display: "flex",
|
|
2666
|
+
flexDirection: "column",
|
|
2667
|
+
gap: 2,
|
|
2668
|
+
padding: 8,
|
|
2669
|
+
backgroundColor: theme.colors.surface,
|
|
2670
|
+
borderRadius: 4
|
|
2671
|
+
}, children: result.fileMetrics.map((fm, idx2) => /* @__PURE__ */ jsxs(
|
|
2672
|
+
"div",
|
|
2673
|
+
{
|
|
2674
|
+
style: {
|
|
2675
|
+
display: "flex",
|
|
2676
|
+
alignItems: "center",
|
|
2677
|
+
justifyContent: "space-between",
|
|
2678
|
+
padding: "4px 8px"
|
|
2679
|
+
},
|
|
2680
|
+
children: [
|
|
2681
|
+
/* @__PURE__ */ jsx("span", { style: { color: theme.colors.text, fontSize: 12 }, children: fm.file }),
|
|
2682
|
+
/* @__PURE__ */ jsxs("span", { style: {
|
|
2683
|
+
fontSize: 12,
|
|
2684
|
+
fontWeight: 500,
|
|
2685
|
+
color: fm.score >= 80 ? "#22c55e" : fm.score >= 60 ? "#f59e0b" : "#ef4444"
|
|
2686
|
+
}, children: [
|
|
2687
|
+
fm.score,
|
|
2688
|
+
"%"
|
|
2689
|
+
] })
|
|
2690
|
+
]
|
|
2691
|
+
},
|
|
2692
|
+
idx2
|
|
2693
|
+
)) })
|
|
2694
|
+
] })
|
|
2695
|
+
] })
|
|
2696
|
+
]
|
|
2697
|
+
},
|
|
2698
|
+
lensKey
|
|
2699
|
+
);
|
|
2700
|
+
})
|
|
2701
|
+
]
|
|
2702
|
+
}
|
|
2703
|
+
);
|
|
2704
|
+
}
|
|
2705
|
+
const LensDataDebugPanelContent = ({
|
|
2706
|
+
context,
|
|
2707
|
+
actions
|
|
2708
|
+
}) => {
|
|
2709
|
+
var _a, _b, _c;
|
|
2710
|
+
const { theme } = useTheme();
|
|
2711
|
+
const lensResultsSlice = context.getSlice("lensResults");
|
|
2712
|
+
const hasSlice = context.hasSlice("lensResults");
|
|
2713
|
+
const isLoading = (lensResultsSlice == null ? void 0 : lensResultsSlice.loading) ?? false;
|
|
2714
|
+
const handleFileClick = (file, line) => {
|
|
2715
|
+
var _a2, _b2, _c2;
|
|
2716
|
+
const repoPath = (_a2 = context.currentScope.repository) == null ? void 0 : _a2.path;
|
|
2717
|
+
const fullPath = repoPath ? `${repoPath}/${file}` : file;
|
|
2718
|
+
if (line) {
|
|
2719
|
+
(_b2 = actions.openFile) == null ? void 0 : _b2.call(actions, `${fullPath}:${line}`);
|
|
2720
|
+
} else {
|
|
2721
|
+
(_c2 = actions.openFile) == null ? void 0 : _c2.call(actions, fullPath);
|
|
2722
|
+
}
|
|
2723
|
+
};
|
|
2724
|
+
return /* @__PURE__ */ jsxs(
|
|
2725
|
+
"div",
|
|
2726
|
+
{
|
|
2727
|
+
style: {
|
|
2728
|
+
fontFamily: theme.fonts.body,
|
|
2729
|
+
height: "100%",
|
|
2730
|
+
minHeight: 0,
|
|
2731
|
+
backgroundColor: theme.colors.background,
|
|
2732
|
+
color: theme.colors.text,
|
|
2733
|
+
overflowY: "auto",
|
|
2734
|
+
boxSizing: "border-box",
|
|
2735
|
+
display: "flex",
|
|
2736
|
+
flexDirection: "column"
|
|
2737
|
+
},
|
|
2738
|
+
children: [
|
|
2739
|
+
/* @__PURE__ */ jsxs("div", { style: {
|
|
2740
|
+
display: "flex",
|
|
2741
|
+
alignItems: "center",
|
|
2742
|
+
justifyContent: "space-between",
|
|
2743
|
+
height: 40,
|
|
2744
|
+
flexShrink: 0,
|
|
2745
|
+
padding: "0 16px",
|
|
2746
|
+
borderBottom: `1px solid ${theme.colors.border}`,
|
|
2747
|
+
boxSizing: "border-box"
|
|
2748
|
+
}, children: [
|
|
2749
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
|
|
2750
|
+
/* @__PURE__ */ jsx(Bug, { size: 18, color: theme.colors.primary }),
|
|
2751
|
+
/* @__PURE__ */ jsx(
|
|
2752
|
+
"h2",
|
|
2753
|
+
{
|
|
2754
|
+
style: {
|
|
2755
|
+
margin: 0,
|
|
2756
|
+
fontSize: 14,
|
|
2757
|
+
fontWeight: 600,
|
|
2758
|
+
color: theme.colors.text
|
|
2759
|
+
},
|
|
2760
|
+
children: "Lens Data Debug"
|
|
2761
|
+
}
|
|
2762
|
+
),
|
|
2763
|
+
(lensResultsSlice == null ? void 0 : lensResultsSlice.data) && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
2764
|
+
/* @__PURE__ */ jsx("span", { style: { color: theme.colors.textMuted }, children: "•" }),
|
|
2765
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: theme.colors.textMuted }, children: [
|
|
2766
|
+
((_a = lensResultsSlice.data.metadata.git) == null ? void 0 : _a.repository) || "Unknown",
|
|
2767
|
+
" @ ",
|
|
2768
|
+
((_c = (_b = lensResultsSlice.data.metadata.git) == null ? void 0 : _b.commit) == null ? void 0 : _c.slice(0, 7)) || "?"
|
|
2769
|
+
] })
|
|
2770
|
+
] })
|
|
2771
|
+
] }),
|
|
2772
|
+
(lensResultsSlice == null ? void 0 : lensResultsSlice.data) && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12, fontSize: 11, color: theme.colors.textMuted }, children: [
|
|
2773
|
+
/* @__PURE__ */ jsxs("span", { children: [
|
|
2774
|
+
new Set(lensResultsSlice.data.results.map((r2) => r2.package.name)).size,
|
|
2775
|
+
" packages"
|
|
2776
|
+
] }),
|
|
2777
|
+
/* @__PURE__ */ jsxs("span", { children: [
|
|
2778
|
+
lensResultsSlice.data.results.length,
|
|
2779
|
+
" results"
|
|
2780
|
+
] })
|
|
2781
|
+
] })
|
|
2782
|
+
] }),
|
|
2783
|
+
/* @__PURE__ */ jsx(
|
|
2784
|
+
"div",
|
|
2785
|
+
{
|
|
2786
|
+
style: {
|
|
2787
|
+
flex: 1,
|
|
2788
|
+
minHeight: 0,
|
|
2789
|
+
overflow: "auto"
|
|
2790
|
+
},
|
|
2791
|
+
children: isLoading ? /* @__PURE__ */ jsx("div", { style: {
|
|
2792
|
+
padding: 40,
|
|
2793
|
+
textAlign: "center",
|
|
2794
|
+
color: theme.colors.textMuted
|
|
2795
|
+
}, children: "Loading lens results..." }) : !hasSlice || !(lensResultsSlice == null ? void 0 : lensResultsSlice.data) ? /* @__PURE__ */ jsxs("div", { style: {
|
|
2796
|
+
padding: 40,
|
|
2797
|
+
textAlign: "center",
|
|
2798
|
+
color: theme.colors.textMuted
|
|
2799
|
+
}, children: [
|
|
2800
|
+
/* @__PURE__ */ jsx(Bug, { size: 48, color: theme.colors.border, style: { marginBottom: 16 } }),
|
|
2801
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 14, marginBottom: 8 }, children: "No lens data available" }),
|
|
2802
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 12 }, children: "Run quality-lens-cli or check that the lensResults slice is configured." })
|
|
2803
|
+
] }) : /* @__PURE__ */ jsx(
|
|
2804
|
+
LensDataDebugPanel$1,
|
|
2805
|
+
{
|
|
2806
|
+
data: lensResultsSlice.data,
|
|
2807
|
+
theme,
|
|
2808
|
+
onFileClick: handleFileClick
|
|
2809
|
+
}
|
|
2810
|
+
)
|
|
2811
|
+
}
|
|
2812
|
+
)
|
|
2813
|
+
]
|
|
2814
|
+
}
|
|
2815
|
+
);
|
|
2816
|
+
};
|
|
2817
|
+
const LensDataDebugPanel = LensDataDebugPanelContent;
|
|
2818
|
+
function getValueColor(value, key) {
|
|
2819
|
+
const effectiveValue = key === "deadCode" ? 100 - value : value;
|
|
2820
|
+
if (effectiveValue >= 80) return "#2E7D32";
|
|
2821
|
+
if (effectiveValue >= 60) return "#E6A700";
|
|
2822
|
+
return "#C62828";
|
|
2823
|
+
}
|
|
2824
|
+
function getValueBgColor(value, key) {
|
|
2825
|
+
const effectiveValue = key === "deadCode" ? 100 - value : value;
|
|
2826
|
+
if (effectiveValue >= 80) return "rgba(46, 125, 50, 0.1)";
|
|
2827
|
+
if (effectiveValue >= 60) return "rgba(230, 167, 0, 0.1)";
|
|
2828
|
+
return "rgba(198, 40, 40, 0.1)";
|
|
2829
|
+
}
|
|
2830
|
+
function getMetricIcon(key) {
|
|
2831
|
+
const iconProps = {
|
|
2832
|
+
width: 18,
|
|
2833
|
+
height: 18,
|
|
2834
|
+
viewBox: "0 0 24 24",
|
|
2835
|
+
fill: "none",
|
|
2836
|
+
stroke: "currentColor",
|
|
2837
|
+
strokeWidth: 2,
|
|
2838
|
+
strokeLinecap: "round",
|
|
2839
|
+
strokeLinejoin: "round"
|
|
2840
|
+
};
|
|
2841
|
+
switch (key) {
|
|
2842
|
+
case "types":
|
|
2843
|
+
return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
|
|
2844
|
+
/* @__PURE__ */ jsx("path", { d: "M12 2L2 7l10 5 10-5-10-5z" }),
|
|
2845
|
+
/* @__PURE__ */ jsx("path", { d: "M2 17l10 5 10-5" }),
|
|
2846
|
+
/* @__PURE__ */ jsx("path", { d: "M2 12l10 5 10-5" })
|
|
2847
|
+
] });
|
|
2848
|
+
case "documentation":
|
|
2849
|
+
return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
|
|
2850
|
+
/* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
|
|
2851
|
+
/* @__PURE__ */ jsx("polyline", { points: "14,2 14,8 20,8" }),
|
|
2852
|
+
/* @__PURE__ */ jsx("line", { x1: "16", y1: "13", x2: "8", y2: "13" }),
|
|
2853
|
+
/* @__PURE__ */ jsx("line", { x1: "16", y1: "17", x2: "8", y2: "17" }),
|
|
2854
|
+
/* @__PURE__ */ jsx("line", { x1: "10", y1: "9", x2: "8", y2: "9" })
|
|
2855
|
+
] });
|
|
2856
|
+
case "tests":
|
|
2857
|
+
return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
|
|
2858
|
+
/* @__PURE__ */ jsx("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
|
|
2859
|
+
/* @__PURE__ */ jsx("polyline", { points: "22,4 12,14.01 9,11.01" })
|
|
2860
|
+
] });
|
|
2861
|
+
case "deadCode":
|
|
2862
|
+
return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
|
|
2863
|
+
/* @__PURE__ */ jsx("polyline", { points: "3,6 5,6 21,6" }),
|
|
2864
|
+
/* @__PURE__ */ jsx("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }),
|
|
2865
|
+
/* @__PURE__ */ jsx("line", { x1: "10", y1: "11", x2: "10", y2: "17" }),
|
|
2866
|
+
/* @__PURE__ */ jsx("line", { x1: "14", y1: "11", x2: "14", y2: "17" })
|
|
2867
|
+
] });
|
|
2868
|
+
case "formatting":
|
|
2869
|
+
return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
|
|
2870
|
+
/* @__PURE__ */ jsx("line", { x1: "21", y1: "10", x2: "7", y2: "10" }),
|
|
2871
|
+
/* @__PURE__ */ jsx("line", { x1: "21", y1: "6", x2: "3", y2: "6" }),
|
|
2872
|
+
/* @__PURE__ */ jsx("line", { x1: "21", y1: "14", x2: "3", y2: "14" }),
|
|
2873
|
+
/* @__PURE__ */ jsx("line", { x1: "21", y1: "18", x2: "7", y2: "18" })
|
|
2874
|
+
] });
|
|
2875
|
+
case "linting":
|
|
2876
|
+
return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
|
|
2877
|
+
/* @__PURE__ */ jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }),
|
|
2878
|
+
/* @__PURE__ */ jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
|
|
2879
|
+
/* @__PURE__ */ jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
|
|
2880
|
+
] });
|
|
2881
|
+
default:
|
|
2882
|
+
return null;
|
|
2883
|
+
}
|
|
2884
|
+
}
|
|
2885
|
+
const METRIC_CONFIG = [
|
|
2886
|
+
{ key: "types", label: "Types", description: "Type safety score" },
|
|
2887
|
+
{ key: "documentation", label: "Documentation", description: "Documentation coverage" },
|
|
2888
|
+
{ key: "tests", label: "Tests", description: "Test coverage and passing rate" },
|
|
2889
|
+
{ key: "deadCode", label: "Dead Code", description: "Unused code detected" },
|
|
2890
|
+
{ key: "formatting", label: "Formatting", description: "Code formatting consistency" },
|
|
2891
|
+
{ key: "linting", label: "Linting", description: "Linting compliance" }
|
|
2892
|
+
];
|
|
2893
|
+
function QualityMetricsList({
|
|
2894
|
+
metrics,
|
|
2895
|
+
theme,
|
|
2896
|
+
className,
|
|
2897
|
+
onMetricClick
|
|
2898
|
+
}) {
|
|
2899
|
+
return /* @__PURE__ */ jsx(
|
|
2900
|
+
"div",
|
|
2901
|
+
{
|
|
2902
|
+
className: cn(className),
|
|
2903
|
+
style: {
|
|
2904
|
+
display: "flex",
|
|
2905
|
+
flexDirection: "column",
|
|
2906
|
+
gap: 4
|
|
2907
|
+
},
|
|
2908
|
+
children: METRIC_CONFIG.map(({ key, label, description }) => {
|
|
2909
|
+
const value = metrics[key];
|
|
2910
|
+
const isDeadCode = key === "deadCode";
|
|
2911
|
+
return /* @__PURE__ */ jsxs(
|
|
2912
|
+
"div",
|
|
2913
|
+
{
|
|
2914
|
+
onClick: () => onMetricClick == null ? void 0 : onMetricClick(key),
|
|
2915
|
+
style: {
|
|
2916
|
+
display: "flex",
|
|
2917
|
+
alignItems: "center",
|
|
2918
|
+
gap: 12,
|
|
2919
|
+
padding: "10px 12px",
|
|
2920
|
+
borderRadius: 6,
|
|
2921
|
+
backgroundColor: theme.colors.surface,
|
|
2922
|
+
border: `1px solid ${theme.colors.border}`,
|
|
2923
|
+
cursor: onMetricClick ? "pointer" : "default",
|
|
2924
|
+
transition: "all 0.15s ease"
|
|
2925
|
+
},
|
|
2926
|
+
onMouseEnter: (e) => {
|
|
2927
|
+
if (onMetricClick) {
|
|
2928
|
+
e.currentTarget.style.backgroundColor = theme.colors.backgroundLight;
|
|
2929
|
+
e.currentTarget.style.borderColor = theme.colors.primary;
|
|
2930
|
+
}
|
|
2931
|
+
},
|
|
2932
|
+
onMouseLeave: (e) => {
|
|
2933
|
+
e.currentTarget.style.backgroundColor = theme.colors.surface;
|
|
2934
|
+
e.currentTarget.style.borderColor = theme.colors.border;
|
|
2935
|
+
},
|
|
2936
|
+
children: [
|
|
2937
|
+
/* @__PURE__ */ jsx(
|
|
2938
|
+
"div",
|
|
2939
|
+
{
|
|
2940
|
+
style: {
|
|
2941
|
+
display: "flex",
|
|
2942
|
+
alignItems: "center",
|
|
2943
|
+
justifyContent: "center",
|
|
2944
|
+
width: 32,
|
|
2945
|
+
height: 32,
|
|
2946
|
+
borderRadius: 6,
|
|
2947
|
+
backgroundColor: getValueBgColor(value, key),
|
|
2948
|
+
color: getValueColor(value, key),
|
|
2949
|
+
flexShrink: 0
|
|
2950
|
+
},
|
|
2951
|
+
children: getMetricIcon(key)
|
|
2952
|
+
}
|
|
2953
|
+
),
|
|
2954
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
2955
|
+
/* @__PURE__ */ jsxs(
|
|
2956
|
+
"div",
|
|
2957
|
+
{
|
|
2958
|
+
style: {
|
|
2959
|
+
fontSize: 14,
|
|
2960
|
+
fontWeight: 500,
|
|
2961
|
+
color: theme.colors.text
|
|
2962
|
+
},
|
|
2963
|
+
children: [
|
|
2964
|
+
label,
|
|
2965
|
+
isDeadCode && /* @__PURE__ */ jsx(
|
|
2966
|
+
"span",
|
|
2967
|
+
{
|
|
2968
|
+
style: {
|
|
2969
|
+
fontSize: 11,
|
|
2970
|
+
color: theme.colors.textMuted,
|
|
2971
|
+
marginLeft: 4
|
|
2972
|
+
},
|
|
2973
|
+
children: "(lower is better)"
|
|
2974
|
+
}
|
|
2975
|
+
)
|
|
2976
|
+
]
|
|
2977
|
+
}
|
|
2978
|
+
),
|
|
2979
|
+
/* @__PURE__ */ jsx(
|
|
2980
|
+
"div",
|
|
2981
|
+
{
|
|
2982
|
+
style: {
|
|
2983
|
+
fontSize: 12,
|
|
2984
|
+
color: theme.colors.textMuted,
|
|
2985
|
+
whiteSpace: "nowrap",
|
|
2986
|
+
overflow: "hidden",
|
|
2987
|
+
textOverflow: "ellipsis"
|
|
2988
|
+
},
|
|
2989
|
+
children: description
|
|
2990
|
+
}
|
|
2991
|
+
)
|
|
2992
|
+
] }),
|
|
2993
|
+
/* @__PURE__ */ jsxs(
|
|
2994
|
+
"div",
|
|
2995
|
+
{
|
|
2996
|
+
style: {
|
|
2997
|
+
display: "flex",
|
|
2998
|
+
alignItems: "center",
|
|
2999
|
+
gap: 8,
|
|
3000
|
+
flexShrink: 0
|
|
3001
|
+
},
|
|
3002
|
+
children: [
|
|
3003
|
+
/* @__PURE__ */ jsx(
|
|
3004
|
+
"div",
|
|
3005
|
+
{
|
|
3006
|
+
style: {
|
|
3007
|
+
width: 60,
|
|
3008
|
+
height: 6,
|
|
3009
|
+
borderRadius: 3,
|
|
3010
|
+
backgroundColor: theme.colors.border,
|
|
3011
|
+
overflow: "hidden"
|
|
3012
|
+
},
|
|
3013
|
+
children: /* @__PURE__ */ jsx(
|
|
3014
|
+
"div",
|
|
3015
|
+
{
|
|
3016
|
+
style: {
|
|
3017
|
+
width: `${isDeadCode ? 100 - value : value}%`,
|
|
3018
|
+
height: "100%",
|
|
3019
|
+
backgroundColor: getValueColor(value, key),
|
|
3020
|
+
borderRadius: 3,
|
|
3021
|
+
transition: "width 0.3s ease"
|
|
3022
|
+
}
|
|
3023
|
+
}
|
|
3024
|
+
)
|
|
3025
|
+
}
|
|
3026
|
+
),
|
|
3027
|
+
/* @__PURE__ */ jsxs(
|
|
3028
|
+
"span",
|
|
3029
|
+
{
|
|
3030
|
+
style: {
|
|
3031
|
+
fontSize: 14,
|
|
3032
|
+
fontWeight: 600,
|
|
3033
|
+
color: getValueColor(value, key),
|
|
3034
|
+
minWidth: 45,
|
|
3035
|
+
textAlign: "right"
|
|
3036
|
+
},
|
|
3037
|
+
children: [
|
|
3038
|
+
value.toFixed(1),
|
|
3039
|
+
"%"
|
|
3040
|
+
]
|
|
3041
|
+
}
|
|
3042
|
+
)
|
|
3043
|
+
]
|
|
3044
|
+
}
|
|
3045
|
+
),
|
|
3046
|
+
onMetricClick && /* @__PURE__ */ jsx(
|
|
3047
|
+
"svg",
|
|
3048
|
+
{
|
|
3049
|
+
width: "16",
|
|
3050
|
+
height: "16",
|
|
3051
|
+
viewBox: "0 0 24 24",
|
|
3052
|
+
fill: "none",
|
|
3053
|
+
stroke: theme.colors.textMuted,
|
|
3054
|
+
strokeWidth: "2",
|
|
3055
|
+
strokeLinecap: "round",
|
|
3056
|
+
strokeLinejoin: "round",
|
|
3057
|
+
style: { flexShrink: 0 },
|
|
3058
|
+
children: /* @__PURE__ */ jsx("polyline", { points: "9,18 15,12 9,6" })
|
|
3059
|
+
}
|
|
3060
|
+
)
|
|
3061
|
+
]
|
|
3062
|
+
},
|
|
3063
|
+
key
|
|
3064
|
+
);
|
|
3065
|
+
})
|
|
3066
|
+
}
|
|
3067
|
+
);
|
|
3068
|
+
}
|
|
3069
|
+
function QualityMetricsListCompact({
|
|
3070
|
+
metrics,
|
|
3071
|
+
theme,
|
|
3072
|
+
className,
|
|
3073
|
+
onMetricClick
|
|
3074
|
+
}) {
|
|
3075
|
+
return /* @__PURE__ */ jsx(
|
|
3076
|
+
"div",
|
|
3077
|
+
{
|
|
3078
|
+
className: cn(className),
|
|
3079
|
+
style: {
|
|
3080
|
+
display: "flex",
|
|
3081
|
+
flexDirection: "column",
|
|
3082
|
+
gap: 2
|
|
3083
|
+
},
|
|
3084
|
+
children: METRIC_CONFIG.map(({ key, label }) => {
|
|
3085
|
+
const value = metrics[key];
|
|
3086
|
+
const isDeadCode = key === "deadCode";
|
|
3087
|
+
return /* @__PURE__ */ jsxs(
|
|
3088
|
+
"div",
|
|
3089
|
+
{
|
|
3090
|
+
onClick: () => onMetricClick == null ? void 0 : onMetricClick(key),
|
|
3091
|
+
style: {
|
|
3092
|
+
display: "flex",
|
|
3093
|
+
alignItems: "center",
|
|
3094
|
+
justifyContent: "space-between",
|
|
3095
|
+
gap: 8,
|
|
3096
|
+
padding: "6px 8px",
|
|
3097
|
+
borderRadius: 4,
|
|
3098
|
+
cursor: onMetricClick ? "pointer" : "default",
|
|
3099
|
+
transition: "background-color 0.15s ease"
|
|
3100
|
+
},
|
|
3101
|
+
onMouseEnter: (e) => {
|
|
3102
|
+
if (onMetricClick) {
|
|
3103
|
+
e.currentTarget.style.backgroundColor = theme.colors.surface;
|
|
3104
|
+
}
|
|
3105
|
+
},
|
|
3106
|
+
onMouseLeave: (e) => {
|
|
3107
|
+
e.currentTarget.style.backgroundColor = "transparent";
|
|
3108
|
+
},
|
|
3109
|
+
children: [
|
|
3110
|
+
/* @__PURE__ */ jsxs(
|
|
3111
|
+
"span",
|
|
3112
|
+
{
|
|
3113
|
+
style: {
|
|
3114
|
+
fontSize: 13,
|
|
3115
|
+
color: theme.colors.textMuted
|
|
3116
|
+
},
|
|
3117
|
+
children: [
|
|
3118
|
+
label,
|
|
3119
|
+
isDeadCode && " ↓"
|
|
3120
|
+
]
|
|
3121
|
+
}
|
|
3122
|
+
),
|
|
3123
|
+
/* @__PURE__ */ jsxs(
|
|
3124
|
+
"span",
|
|
3125
|
+
{
|
|
3126
|
+
style: {
|
|
3127
|
+
fontSize: 13,
|
|
3128
|
+
fontWeight: 500,
|
|
3129
|
+
color: getValueColor(value, key)
|
|
3130
|
+
},
|
|
3131
|
+
children: [
|
|
3132
|
+
value.toFixed(1),
|
|
3133
|
+
"%"
|
|
3134
|
+
]
|
|
3135
|
+
}
|
|
3136
|
+
)
|
|
3137
|
+
]
|
|
3138
|
+
},
|
|
3139
|
+
key
|
|
3140
|
+
);
|
|
3141
|
+
})
|
|
3142
|
+
}
|
|
3143
|
+
);
|
|
3144
|
+
}
|
|
2168
3145
|
const panels = [
|
|
2169
3146
|
{
|
|
2170
3147
|
metadata: {
|
|
@@ -2213,6 +3190,32 @@ const panels = [
|
|
|
2213
3190
|
onUnmount: async (_context) => {
|
|
2214
3191
|
console.log("Repository Quality Grid Panel unmounting");
|
|
2215
3192
|
}
|
|
3193
|
+
},
|
|
3194
|
+
{
|
|
3195
|
+
metadata: {
|
|
3196
|
+
id: "principal-ade.lens-data-debug-panel",
|
|
3197
|
+
name: "Lens Data Debug",
|
|
3198
|
+
icon: "🐛",
|
|
3199
|
+
version: "0.1.0",
|
|
3200
|
+
author: "Principal ADE",
|
|
3201
|
+
description: "Debug panel for inspecting raw lens results from quality-lens-cli. Shows package breakdown, lens results with pass/fail status, and files with issues.",
|
|
3202
|
+
slices: ["lensResults"],
|
|
3203
|
+
tools: []
|
|
3204
|
+
},
|
|
3205
|
+
component: LensDataDebugPanel,
|
|
3206
|
+
onMount: async (context) => {
|
|
3207
|
+
var _a;
|
|
3208
|
+
console.log(
|
|
3209
|
+
"Lens Data Debug Panel mounted",
|
|
3210
|
+
(_a = context.currentScope.repository) == null ? void 0 : _a.path
|
|
3211
|
+
);
|
|
3212
|
+
if (context.hasSlice("lensResults") && !context.isSliceLoading("lensResults")) {
|
|
3213
|
+
await context.refresh("repository", "lensResults");
|
|
3214
|
+
}
|
|
3215
|
+
},
|
|
3216
|
+
onUnmount: async (_context) => {
|
|
3217
|
+
console.log("Lens Data Debug Panel unmounting");
|
|
3218
|
+
}
|
|
2216
3219
|
}
|
|
2217
3220
|
];
|
|
2218
3221
|
const onPackageLoad = async () => {
|
|
@@ -2222,11 +3225,15 @@ const onPackageUnload = async () => {
|
|
|
2222
3225
|
console.log("Panel package unloading - Code Quality Panels");
|
|
2223
3226
|
};
|
|
2224
3227
|
export {
|
|
3228
|
+
LensDataDebugPanel$1 as LensDataDebugComponent,
|
|
3229
|
+
LensDataDebugPanel,
|
|
2225
3230
|
QualityHexagon,
|
|
2226
3231
|
QualityHexagonCompact,
|
|
2227
3232
|
QualityHexagonDetailed,
|
|
2228
3233
|
QualityHexagonExpandable,
|
|
2229
3234
|
QualityHexagonPanel,
|
|
3235
|
+
QualityMetricsList,
|
|
3236
|
+
QualityMetricsListCompact,
|
|
2230
3237
|
RepositoryQualityGrid,
|
|
2231
3238
|
RepositoryQualityGridItem,
|
|
2232
3239
|
RepositoryQualityGridPanel,
|