From 22212b9fdc5afae3abfa5c7dfbb6a67f60d589f4 Mon Sep 17 00:00:00 2001 From: ashrafchowdury Date: Mon, 26 Aug 2024 16:24:57 +0600 Subject: [PATCH 1/8] fix: long app names in side menu --- agenta-web/src/components/Sidebar/Sidebar.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/agenta-web/src/components/Sidebar/Sidebar.tsx b/agenta-web/src/components/Sidebar/Sidebar.tsx index 9c81788290..12f137da67 100644 --- a/agenta-web/src/components/Sidebar/Sidebar.tsx +++ b/agenta-web/src/components/Sidebar/Sidebar.tsx @@ -113,6 +113,9 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ menuHeader: { padding: `${theme.paddingXS}px ${theme.padding}px`, color: theme.colorTextDescription, + overflow: "hidden", + textOverflow: "ellipsis", + whiteSpace: "nowrap", }, })) From b894edcd0567cb28d16818d9d44636b53493668a Mon Sep 17 00:00:00 2001 From: ashrafchowdury Date: Mon, 26 Aug 2024 16:58:43 +0600 Subject: [PATCH 2/8] fix: A/B testing datapoints font size in app overview --- .../abTestingEvaluation/AbTestingEvalOverview.tsx | 15 +++++++++------ .../SingleModelEvalOverview.tsx | 5 +++-- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx b/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx index efbcdadb58..593d578a2a 100644 --- a/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx +++ b/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx @@ -33,32 +33,35 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, }, statFlag: { + lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: 16, + fontSize: "12px", color: theme.colorError, }, "& .ant-statistic-content-suffix": { - fontSize: 16, + fontSize: "12px", color: theme.colorError, }, }, stat: { + lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: 16, + fontSize: "12px", color: theme.colorPrimary, }, "& .ant-statistic-content-suffix": { - fontSize: 16, + fontSize: "12px", color: theme.colorPrimary, }, }, statGood: { + lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: 16, + fontSize: "12px", color: theme.colorSuccess, }, "& .ant-statistic-content-suffix": { - fontSize: 16, + fontSize: "12px", color: theme.colorSuccess, }, }, diff --git a/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx b/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx index 02d4961289..98560d5264 100644 --- a/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx +++ b/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx @@ -33,12 +33,13 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, }, stat: { + lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: 16, + fontSize: "12px", color: theme.colorPrimary, }, "& .ant-statistic-content-suffix": { - fontSize: 16, + fontSize: "12px", color: theme.colorPrimary, }, }, From 39465f4d620b655da2e8696ff0fc9d979e9be47e Mon Sep 17 00:00:00 2001 From: ashrafchowdury Date: Mon, 26 Aug 2024 17:31:06 +0600 Subject: [PATCH 3/8] fix: padding and gap issue on deployment card --- .../pages/overview/deployments/DeploymentOverview.tsx | 7 +++++-- .../components/pages/overview/variants/VariantPopover.tsx | 5 ++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx b/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx index ea0efad390..8bfd063de6 100644 --- a/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx +++ b/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx @@ -30,7 +30,7 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, cardContainer: { display: "flex", - gap: theme.paddingXS, + gap: "16px", "& .ant-card": { width: "100%", position: "relative", @@ -156,7 +156,10 @@ const DeploymentOverview = ({ env={env} /> ) : ( - e.stopPropagation()}> + e.stopPropagation()} + > No deployment )} diff --git a/agenta-web/src/components/pages/overview/variants/VariantPopover.tsx b/agenta-web/src/components/pages/overview/variants/VariantPopover.tsx index c75237c896..d426a27e5f 100644 --- a/agenta-web/src/components/pages/overview/variants/VariantPopover.tsx +++ b/agenta-web/src/components/pages/overview/variants/VariantPopover.tsx @@ -58,7 +58,10 @@ const VariantPopover = ({env, selectedDeployedVariant, ...props}: VariantPopover } > - e.stopPropagation()}> + e.stopPropagation()} + > Date: Mon, 26 Aug 2024 17:48:52 +0600 Subject: [PATCH 4/8] fix: automatic results popover visible on hover --- .../overview/automaticEvaluation/AutomaticEvalOverview.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/agenta-web/src/components/pages/overview/automaticEvaluation/AutomaticEvalOverview.tsx b/agenta-web/src/components/pages/overview/automaticEvaluation/AutomaticEvalOverview.tsx index 0c52b085d5..2b628ec67e 100644 --- a/agenta-web/src/components/pages/overview/automaticEvaluation/AutomaticEvalOverview.tsx +++ b/agenta-web/src/components/pages/overview/automaticEvaluation/AutomaticEvalOverview.tsx @@ -253,7 +253,7 @@ const AutomaticEvalOverview = () => { @@ -274,7 +274,7 @@ const AutomaticEvalOverview = () => { Date: Tue, 27 Aug 2024 10:53:31 +0600 Subject: [PATCH 5/8] fix: button icon alignment issue in sidebar --- agenta-web/src/components/Sidebar/Sidebar.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/agenta-web/src/components/Sidebar/Sidebar.tsx b/agenta-web/src/components/Sidebar/Sidebar.tsx index 12f137da67..9cc83f30e3 100644 --- a/agenta-web/src/components/Sidebar/Sidebar.tsx +++ b/agenta-web/src/components/Sidebar/Sidebar.tsx @@ -92,6 +92,8 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, menuItem: { textOverflow: "initial !important", + display: "flex !important", + alignItems: "center", }, avatarContainer: { display: "flex", From e40d85383856c3b969a059a04724a47b744a71ff Mon Sep 17 00:00:00 2001 From: ashrafchowdury Date: Tue, 27 Aug 2024 18:25:05 +0600 Subject: [PATCH 6/8] refactor: removed hard coded values --- .../abTestingEvaluation/AbTestingEvalOverview.tsx | 12 ++++++------ .../overview/deployments/DeploymentOverview.tsx | 2 +- .../SingleModelEvalOverview.tsx | 4 ++-- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx b/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx index 593d578a2a..2aec3b5995 100644 --- a/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx +++ b/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx @@ -35,33 +35,33 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ statFlag: { lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorError, }, "& .ant-statistic-content-suffix": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorError, }, }, stat: { lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorPrimary, }, "& .ant-statistic-content-suffix": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorPrimary, }, }, statGood: { lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorSuccess, }, "& .ant-statistic-content-suffix": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorSuccess, }, }, diff --git a/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx b/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx index 8bfd063de6..171d7640c9 100644 --- a/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx +++ b/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx @@ -30,7 +30,7 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, cardContainer: { display: "flex", - gap: "16px", + gap: theme.paddingMD, "& .ant-card": { width: "100%", position: "relative", diff --git a/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx b/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx index 98560d5264..862fa5399c 100644 --- a/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx +++ b/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx @@ -35,11 +35,11 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ stat: { lineHeight: "20px", "& .ant-statistic-content-value": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorPrimary, }, "& .ant-statistic-content-suffix": { - fontSize: "12px", + fontSize: theme.fontSize, color: theme.colorPrimary, }, }, From fd6220e7861d3c2e1647a1b6f5537da6b5715c56 Mon Sep 17 00:00:00 2001 From: ashrafchowdury Date: Tue, 27 Aug 2024 18:50:50 +0600 Subject: [PATCH 7/8] refactor: removed hard coded inline height --- .../overview/abTestingEvaluation/AbTestingEvalOverview.tsx | 6 +++--- .../singleModelEvaluation/SingleModelEvalOverview.tsx | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx b/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx index 2aec3b5995..4ad02bb7ce 100644 --- a/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx +++ b/agenta-web/src/components/pages/overview/abTestingEvaluation/AbTestingEvalOverview.tsx @@ -33,7 +33,7 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, }, statFlag: { - lineHeight: "20px", + lineHeight: theme.lineHeight, "& .ant-statistic-content-value": { fontSize: theme.fontSize, color: theme.colorError, @@ -44,7 +44,7 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, }, stat: { - lineHeight: "20px", + lineHeight: theme.lineHeight, "& .ant-statistic-content-value": { fontSize: theme.fontSize, color: theme.colorPrimary, @@ -55,7 +55,7 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, }, statGood: { - lineHeight: "20px", + lineHeight: theme.lineHeight, "& .ant-statistic-content-value": { fontSize: theme.fontSize, color: theme.colorSuccess, diff --git a/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx b/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx index 862fa5399c..f6ce104795 100644 --- a/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx +++ b/agenta-web/src/components/pages/overview/singleModelEvaluation/SingleModelEvalOverview.tsx @@ -33,7 +33,7 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, }, stat: { - lineHeight: "20px", + lineHeight: theme.lineHeight, "& .ant-statistic-content-value": { fontSize: theme.fontSize, color: theme.colorPrimary, From dafef169f48c0602a4de315ed49f36fa8b0f9a23 Mon Sep 17 00:00:00 2001 From: ashrafchowdury Date: Tue, 27 Aug 2024 19:23:04 +0600 Subject: [PATCH 8/8] fix: large padding issue --- .../pages/overview/deployments/DeploymentOverview.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx b/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx index 171d7640c9..c69e28cbf0 100644 --- a/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx +++ b/agenta-web/src/components/pages/overview/deployments/DeploymentOverview.tsx @@ -30,7 +30,7 @@ const useStyles = createUseStyles((theme: JSSTheme) => ({ }, cardContainer: { display: "flex", - gap: theme.paddingMD, + gap: theme.padding, "& .ant-card": { width: "100%", position: "relative",