From a5392e0dd6c1129800b6fdc2cf296a7f1c3dc86d Mon Sep 17 00:00:00 2001 From: Fei <50682656+thaafei@users.noreply.github.com> Date: Sun, 3 May 2026 21:07:59 -0400 Subject: [PATCH 01/12] fix overall impression first row not sticky --- src/frontend/src/pages/OverallImpression.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/frontend/src/pages/OverallImpression.tsx b/src/frontend/src/pages/OverallImpression.tsx index 0b2791c1..1863a222 100644 --- a/src/frontend/src/pages/OverallImpression.tsx +++ b/src/frontend/src/pages/OverallImpression.tsx @@ -14,7 +14,6 @@ const OverallImpressionPage: React.FC = () => { const { domainId } = useParams<{ domainId: string }>(); const navigate = useNavigate(); const DOMAIN_ID = domainId; - const { isLoading: authLoading } = useAuthStore(); const [domainName, setDomainName] = useState(""); const [categoryScores, setCategoryScores] = useState({}); @@ -236,6 +235,7 @@ const OverallImpressionPage: React.FC = () => { {categories.map((category) => ( Date: Sun, 3 May 2026 21:19:46 -0400 Subject: [PATCH 02/12] Category Names on top of metrics Co-authored-by: Copilot --- src/backend/api/database/categories.json | 3 +- src/frontend/src/pages/ComparisonTool.tsx | 43 ++++++++++++++++++++ src/frontend/src/pages/OverallImpression.tsx | 1 - 3 files changed, 45 insertions(+), 2 deletions(-) diff --git a/src/backend/api/database/categories.json b/src/backend/api/database/categories.json index b45d2613..0e72b718 100644 --- a/src/backend/api/database/categories.json +++ b/src/backend/api/database/categories.json @@ -14,7 +14,8 @@ "Surface Understandability", "Raw Metrics (Measured via git_stats)", "Raw Metrics (Measured via scc)", - "Repo Metrics (Measured via GitHub)" + "Repo Metrics (Measured via GitHub)", + "Summary" ] } diff --git a/src/frontend/src/pages/ComparisonTool.tsx b/src/frontend/src/pages/ComparisonTool.tsx index c6548db9..d1dc553a 100644 --- a/src/frontend/src/pages/ComparisonTool.tsx +++ b/src/frontend/src/pages/ComparisonTool.tsx @@ -27,6 +27,7 @@ interface Metric { metric_name: string; metric_key?: string | null; description?: string | null; + category?: string | null; } interface LibraryMetricRow { @@ -130,6 +131,16 @@ const ComparisonToolPage: React.FC = () => { const [accessDenied, setAccessDenied] = useState(false); const [error, setError] = useState(null); + const groupedMetrics = React.useMemo(() => { + const groups: { [category: string]: Metric[] } = {}; + metricList.forEach(m => { + const cat = m.category || 'Other'; + if (!groups[cat]) groups[cat] = []; + groups[cat].push(m); + }); + return Object.entries(groups).map(([category, metrics]) => ({ category, metrics })); + }, [metricList]); + useEffect(() => { if (!DOMAIN_ID) return; document.title = "DomainX – Comparison"; @@ -466,6 +477,38 @@ const ComparisonToolPage: React.FC = () => { }} > + + + {/* empty */} + + + {groupedMetrics.map((group) => ( + + {group.category} + + ))} + + Date: Sun, 3 May 2026 21:55:44 -0400 Subject: [PATCH 03/12] Created component for metric modal, and updated to use components Co-authored-by: Copilot --- src/backend/api/database/categories.json | 5 +- .../src/components/AddMetricModal.tsx | 425 +++++++++ .../src/components/ExpandableText.tsx | 87 +- src/frontend/src/pages/ComparisonTool.tsx | 84 +- src/frontend/src/pages/Main.tsx | 12 - src/frontend/src/pages/MetricPageTypes.tsx | 78 ++ src/frontend/src/pages/Metrics.tsx | 849 ++++++------------ 7 files changed, 840 insertions(+), 700 deletions(-) create mode 100644 src/frontend/src/components/AddMetricModal.tsx create mode 100644 src/frontend/src/pages/MetricPageTypes.tsx diff --git a/src/backend/api/database/categories.json b/src/backend/api/database/categories.json index 0e72b718..eac0ffee 100644 --- a/src/backend/api/database/categories.json +++ b/src/backend/api/database/categories.json @@ -1,5 +1,6 @@ { "Categories": [ + "Summary", "Installability", "Popularity", "Activity", @@ -14,8 +15,6 @@ "Surface Understandability", "Raw Metrics (Measured via git_stats)", "Raw Metrics (Measured via scc)", - "Repo Metrics (Measured via GitHub)", - "Summary" + "Repo Metrics (Measured via GitHub)" ] - } diff --git a/src/frontend/src/components/AddMetricModal.tsx b/src/frontend/src/components/AddMetricModal.tsx new file mode 100644 index 00000000..45ff3a20 --- /dev/null +++ b/src/frontend/src/components/AddMetricModal.tsx @@ -0,0 +1,425 @@ +import { AddMetricModalProps } from "../pages/MetricPageTypes"; + +export const AddMetricModal: React.FC = ({ + isOpen, + modalMode, + categories, + formError, + modalSourceType, + modalMetricKey, + modalType, + modalAutoOptions, + modalAvailableCats, + modalOptionCategory, + modalPreview, + newName, + newType, + newSourceType, + newMetricKey, + newCategory, + newDesc, + selectedOptionCategory, + selectedTemplate, + editName, + editType, + editSourceType, + editMetricKey, + editCategory, + editDesc, + editOptionCategory, + editTemplate, + closeModal, + onSubmit, + setFormError, + setNewName, + setEditName, + setNewType, + setEditType, + setNewSourceType, + setEditSourceType, + setNewMetricKey, + setEditMetricKey, + setNewCategory, + setEditCategory, + setNewDesc, + setEditDesc, + setSelectedOptionCategory, + setSelectedTemplate, + setEditOptionCategory, + setEditTemplate, + onEditTypeChange, + isRuleType, +}) => { + if (!isOpen) return null; + + const isCreate = modalMode === "create"; + const title = isCreate ? "Add New Metric" : "Edit Metric"; + const nameValue = isCreate ? newName : editName; + const typeValue = isCreate ? newType : editType; + const sourceTypeValue = isCreate ? newSourceType : editSourceType; + const metricKeyValue = isCreate ? newMetricKey : editMetricKey; + const categoryValue = isCreate ? newCategory : editCategory; + const descValue = isCreate ? newDesc : editDesc; + const optionCategoryValue = isCreate ? selectedOptionCategory : editOptionCategory; + const templateValue = isCreate ? selectedTemplate : editTemplate; + + const changeSourceType = (value: string) => { + setFormError(""); + if (isCreate) { + setNewSourceType(value); + setNewMetricKey(""); + setSelectedOptionCategory(""); + setSelectedTemplate(""); + if (value === "manual") { + setNewType("float"); + setNewDesc(""); + } + } else { + setEditSourceType(value); + setEditMetricKey(""); + setEditOptionCategory(""); + setEditTemplate(""); + if (value === "manual") { + setEditType("float"); + setEditDesc(""); + } + } + }; + + const changeMetricKey = (selectedKey: string) => { + const selectedOption = modalAutoOptions.find((x) => x.key === selectedKey); + setFormError(""); + + if (isCreate) { + setNewMetricKey(selectedKey); + setSelectedOptionCategory(""); + setSelectedTemplate(""); + if (selectedOption) { + setNewType(selectedOption.value_type); + setNewDesc(selectedOption.description || ""); + } + } else { + setEditMetricKey(selectedKey); + setEditOptionCategory(""); + setEditTemplate(""); + if (selectedOption) { + setEditType(selectedOption.value_type); + setEditDesc(selectedOption.description || ""); + } + } + }; + + const handleSubmit = async () => { + const ok = await onSubmit(); + if (ok) closeModal(); + }; + + return ( +
{ + if (e.target === e.currentTarget) closeModal(); + }} + style={{ + display: "flex", + alignItems: "center", + justifyContent: "center", + backgroundColor: "rgba(0, 0, 0, 0.6)", + zIndex: 9999, + }} + > +
e.stopPropagation()} + style={{ + width: "min(900px, 92vw)", + maxHeight: "85vh", + overflow: "auto", + padding: 18, + position: "relative", + background: "rgba(18, 18, 26, 0.98)", + border: "1px solid rgba(255,255,255,0.08)", + borderRadius: 16, + boxShadow: "0px 10px 25px rgba(0, 0, 0, 0.2)", + }} + > +
+
+ {title} +
+ + +
+ + {formError && ( +
+ {formError} +
+ )} + +
+
+ + { + setFormError(""); + isCreate ? setNewName(e.target.value) : setEditName(e.target.value); + }} + maxLength={100} + placeholder="e.g. Commits (Last 5 Years)" + /> +
+ +
+ + +
+ + {modalSourceType !== "manual" && ( +
+ + +
+ )} + +
+ + +
+ +
+ + +
+ +
+ + {modalSourceType === "manual" && isRuleType(modalType) && ( +
+
+ + +
+ +
+ + +
+ + {modalPreview && ( +
+
+ Rule Preview +
+ + {JSON.stringify(modalPreview, null, 2)} + +
+ )} +
+ )} + +
+ +